/* ------------------------------------
 * Typecho Default Theme - Diary Style
 *
 * @author  Typecho Team
 * @modified  Diary Blue Style
 * @link  http: //typecho.org/
 * --------------------------------- */

/* ------------------
 * Global style
 * --------------- */
body {
  background-color: #E8F4F8;
  background-image: linear-gradient(180deg, #E8F4F8 0%, #F0F8FB 100%);
  color: #3A4A5A;
  font-family: "LXGW WenKai", "ZCOOL KuaiLe", "PingFang SC", "Hiragino Sans GB", "Source Han Sans CN", "Microsoft Yahei", sans-serif;
  font-size: 87.5%;
  line-height: 1.6;
}

a {
  color: #5B9BD5;
  text-decoration: none;
  transition: color 0.2s ease;
}
a:hover, a:active {
  color: #3A7CA5;
}
pre, code { 
  background: #E8F4F8;
  font-family: Menlo, Monaco, Consolas, "Lucida Console", "Courier New", monospace;
  font-size: .92857em;
  border: 1px solid #D0E8F0;
}
code { padding: 2px 4px; color: #3A7CA5; }
pre {
  padding: 12px;
  overflow: auto;
  max-height: 400px;
  border-radius: 0;
}
pre code {
  display: block;
  padding: 3px;
  color: #3A4A5A;
  background: transparent;
  border: none;
}

blockquote {
  margin: 1em 0;
  padding-left: 1.5em;
  border-left: 4px solid #5B9BD5;
  color: #5A6A7A;
  background: #F0F8FB;
  padding: 10px 15px;
}

table {
  border: 1px solid #C8D8E0;
  width: 100%;
  border-collapse: collapse;
}
table th,
table td {
  padding: 8px 12px;
  border: 1px solid #D8E8F0;
}
table th {
  background: #E8F4F8;
  color: #3A4A5A;
  font-weight: 600;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "ZCOOL KuaiLe", "LXGW WenKai", "PingFang SC", "Hiragino Sans GB", "Source Han Sans CN", "Microsoft Yahei", sans-serif;
  color: #2C3E50;
  font-weight: 600;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
textarea {
  padding: 8px 12px;
  border: 1px solid #C8D8E0;
  width: 100%;
  border-radius: 0;
  background: #FFF;
  color: #3A4A5A;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  transition: border-color 0.2s ease;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus {
  outline: none;
  border-color: #5B9BD5;
}
textarea {
  resize: vertical;
}

button, input[type="submit"] {
  background: #5B9BD5;
  color: #FFF;
  border: none;
  padding: 8px 16px;
  cursor: pointer;
  transition: background 0.2s ease;
}
button:hover, input[type="submit"]:hover {
  background: #3A7CA5;
}


/* Special link style */
.post-meta a,
.post-content a,
.widget a,
.comment-content a {
  border-bottom: 1px solid #D0E8F0;
}

.post-meta a:hover,
.post-content a:hover,
.widget a:hover,
.comment-content a:hover {
  border-bottom-color: transparent;
}

/* ------------------
 * Header
 * --------------- */

#header {
  padding-top: 30px;
  padding-bottom: 20px;
  border-bottom: 2px solid #C8D8E0;
  background: #FFF;
}

#logo {
  color: #2C3E50;
  font-size: 2.5em;
  font-weight: 600;
  letter-spacing: 1px;
}
#logo img {
  max-height: 64px;
}

.description {
  margin: .5em 0 0;
  color: #7A8A9A;
  font-style: italic;
  font-size: 0.9em;
}

/* Navigation menu */
#nav-menu {
  margin: 20px 0 0;
  padding: 0;
}
#nav-menu a {
  display: inline-block;
  margin-right: 5px;
  padding: 8px 16px;
  border: 1px solid #D0E8F0;
  height: auto;
  line-height: 1.4;
  color: #5A6A7A;
  float: none;
  transition: all 0.2s ease;
}
#nav-menu a:hover,
#nav-menu .current {
  background: #E8F4F8;
  border-color: #5B9BD5;
  color: #5B9BD5;
}

/* Search */
#search {
  position: relative;
  margin-top: 15px;
}
#search input {
  padding-right: 30px;
}
#search button {
  position: absolute;
  right: 4px;
  top: 2px;
  border: none;
  padding: 0;
  width: 24px;
  height: 24px;
  background: transparent url(img/icon-search.png) no-repeat center center;
  direction: ltr;
  text-indent: -9999em;
}

@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) {
  #search button {
    background-image: url(img/icon-search@2x.png);
    -webkit-background-size: 24px 24px;
    -moz-background-size: 24px 24px;
    -o-background-size: 24px 24px;
    background-size: 24px 24px;
  }
}


/* ------------------
 * Main Content Area
 * --------------- */

.container {
  background: transparent;
}

#main {
  /* Main content column */
}

.post {
  padding: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  background: #FFF;
  border: 1px solid #D0E8F0;
  box-shadow: 0 2px 4px rgba(91, 155, 213, 0.1);
}
.post-wrapper {
  display: flex;
  gap: 20px;
}
.post-single-image .post-thumb-single {
  flex: 0 0 200px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}
.post-single-image .post-thumb-single img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
  transition: transform 0.3s ease;
}
.post-single-image .post-thumb-single:hover img {
  transform: scale(1.05);
}
.post-single-image .post-text-content {
  flex: 1;
  min-width: 0;
}
.post-thumbs {
  display: flex;
  gap: 10px;
  overflow: hidden;
  margin-bottom: 15px;
}
.post-thumb-item {
  flex: 1;
  min-width: 0;
  display: block;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  transition: all 0.2s ease;
}
.post-thumb-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}
.post-thumb-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(91, 155, 213, 0.2);
}
.post-thumb-item:hover img {
  transform: scale(1.05);
}
.post-excerpt {
  line-height: 1.8;
  color: #3A4A5A;
}
.post-title {
  margin: 0 0 10px;
  font-size: 1.5em;
  color: #2C3E50;
}
.post-title a {
  color: #2C3E50;
}
.post-title a:hover {
  color: #5B9BD5;
}
.post-meta {
  margin-top: 0;
  padding: 0;
  color: #7A8A9A;
  font-size: .857em;
  margin-bottom: 15px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #D0E8F0;
}
.post-meta li {
  display: inline-block;
  margin: 0 10px 0 0;
  padding-left: 12px;
  border-left: 1px solid #D0E8F0;
}
.post-meta li:first-child {
  margin-left: 0;
  padding-left: 0;
  border: none;
}
.post-content {
  line-height: 1.8;
  color: #3A4A5A;
}
.post-content p {
  margin-bottom: 1em;
}
.post .tags {
  clear: both;
  margin-top: 15px;
  padding-top: 10px;
  border-top: 1px dashed #D0E8F0;
  color: #7A8A9A;
  font-size: 0.9em;
}

.post-near {
  list-style: none;
  margin: 30px 0;
  padding: 0;
  color: #7A8A9A;
}
.post-near li {
  margin: 10px 0;
}

.archive-title {
  margin: 1em 0 -1em;
  padding-top: 20px;
  color: #5A6A7A;
  font-size: 1.1em;
  background: #FFF;
  padding: 15px 20px;
  border: 1px solid #D0E8F0;
  border-bottom: none;
}
.more {
  text-align: center;
  margin-top: 15px;
}
.more a {
  display: inline-block;
  padding: 8px 20px;
  border: 1px solid #5B9BD5;
  color: #5B9BD5;
  transition: all 0.2s ease;
}
.more a:hover {
  background: #5B9BD5;
  color: #FFF;
}
.protected .text {
  width: 50%;
}

/* Page nav */

.page-navigator {
  list-style: none;
  margin: 25px 0;
  padding: 0;
  text-align: center;
}
.page-navigator li {
  display: inline-block;
  margin: 0 4px;
}
.page-navigator a {
  display: inline-block;
  padding: 8px 14px;
  border: 1px solid #D0E8F0;
  color: #5A6A7A;
  min-width: 30px;
}
.page-navigator a:hover {
  background: #E8F4F8;
  border-color: #5B9BD5;
  color: #5B9BD5;
  text-decoration: none;
}

.page-navigator .current a {
  color: #FFF;
  background: #5B9BD5;
  border-color: #5B9BD5;
}

/* ------------------
 * Comment list
 * --------------- */
#comments {
  padding-top: 20px;
}
.comment-list, .comment-list ol {
  list-style: none;
  margin: 0;
  padding: 0;
}
.comment-children {
  margin-top: 15px;
  margin-left: 30px;
  padding-left: 0;
}
.comment-children .comment {
  border-color: #E4E8EC;
}

.comment-list li {
  padding: 15px;
  margin-top: 15px;
  border: 1px solid #D0E8F0;
  background: #FFF;
}
.comment-list li.comment-level-odd {
  background: #F8FCFD;
}
.comment-list li.comment-level-even {
  background: #FFF;
}
.comment-list li.comment-by-author {
  background: #F0F8FB;
  border-left: 3px solid #5B9BD5;
}
.comment-list li .comment-reply {
  text-align: right;
  font-size: .857em;
}
.comment-meta a {
  color: #7A8A9A;
  font-size: .857em;
}
.comment-author {
  display: block;
  margin-bottom: 8px;
  color: #2C3E50;
  font-weight: 600;
}
.comment-author .avatar {
  float: left;
  margin-right: 12px;
  border: 2px solid #D0E8F0;
}
.comment-author cite {
  font-weight: bold;
  font-style: normal;
}
.comment-date {
  font-size: 0.85em;
  color: #7A8A9A;
  margin-left: 10px;
  font-weight: normal;
}
.comment-content {
  clear: both;
  margin-top: 10px;
  line-height: 1.6;
}

/* Comment reply */
.comment-list .respond {
  margin-top: 15px;
  border-top: 1px solid #D0E8F0;
  padding-top: 15px;
}
.respond .cancel-comment-reply {
  float: right;
  margin-top: 15px;
  font-size: .857em;
  color: #7A8A9A;
}
#comment-form label {
  display: block;
  margin-bottom: 0.3em;
  font-weight: 600;
  color: #5A6A7A;
  font-size: 0.9em;
}
#comment-form .required:after {
  content: " *";
  color: #E74C3C;
}
#comment-form input[type="submit"] {
  margin-top: 10px;
}

/* Compact comment inputs */
.comment-inputs {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
}
.comment-inputs p {
  flex: 1;
  min-width: 200px;
  margin: 0;
}
.comment-inputs input {
  padding: 6px 10px;
  font-size: 0.9em;
}
#comment-form textarea {
  rows: 5;
  padding: 8px 12px;
  font-size: 0.95em;
}

/* ------------------
 * Sidebar
 * --------------- */
#secondary {
  padding-top: 0;
  word-wrap: break-word;
}
.widget {
  margin-top: 20px;
  margin-bottom: 25px;
  background: #FFF;
  padding: 20px;
  border: 1px solid #D0E8F0;
  box-shadow: 0 2px 4px rgba(91, 155, 213, 0.08);
}
.widget-title {
  margin: 0 0 15px;
  padding-bottom: 10px;
  border-bottom: 2px solid #E8F4F8;
  color: #2C3E50;
  font-size: 1.1em;
}
.widget-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.widget-list li {
  margin: 8px 0;
  line-height: 1.6;
  padding-left: 12px;
  border-left: 2px solid #E8F4F8;
  transition: all 0.2s ease;
}
.widget-list li:hover {
  border-left-color: #5B9BD5;
  padding-left: 15px;
}

.widget-list li ul {
  margin-left: 15px;
  margin-top: 8px;
}

/* ------------------
 * Footer 
 * --------------- */
#footer {
  padding: 2em 0;
  line-height: 1.5;
  text-align: center;
  color: #7A8A9A;
  border-top: 2px solid #C8D8E0;
  background: #FFF;
  margin-top: 30px;
}
#footer a {
  color: #5B9BD5;
}


/* -----------------
 * Error page
 * -------------- */
.error-page {
  margin-top: 100px;
  margin-bottom: 100px;
  background: #FFF;
  padding: 40px;
  border: 1px solid #D0E8F0;
  text-align: center;
}


/* -----------------
 * Content format
 *--------------- */
.post-content, .comment-content {
  line-height: 1.8;
  word-wrap: break-word;
}
.post-content h2, .comment-content h2 {
  font-size: 1.28571em;
  margin-top: 1.5em;
  margin-bottom: 0.8em;
}
.post-content img, .comment-content img,
.post-content video, .comment-content video {
  max-width: 100%;
  border: 1px solid #D0E8F0;
  background: #FFF;
}
.post-content a img,
.comment-content a img {
  background: #FFF;
  position: relative;
  bottom: 0;
  left: 9px;
}
.post-content hr, .comment-content hr {
  margin: 2em auto;
  width: 100px;
  border: none;
  border-top: 2px solid #E8F4F8;
}


/* -----------------
 * Misc
 *--------------- */
.aligncenter, div.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.alignleft {
  float: left;
}
.alignright {
  float: right;
}
img.alignleft {
  margin: 0 15px 0 0;
}
img.alignright {
  margin: 0 0 0 15px;
}


/* -----------------
 * Responsive
 *--------------- */
@media (max-width: 767px) {
  body {
    font-size: 81.25%;
  }
  #nav-menu a {
    float: none;
    display: inline-block;
    margin: 5px 3px;
  }
  .post-wrapper {
    flex-direction: row;
    gap: 15px;
  }
  .post-single-image .post-thumb-single {
    flex: 0 0 120px;
    aspect-ratio: 1 / 1;
    margin: 0;
  }
  .page-navigator {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    justify-content: center;
    gap: 5px;
    padding: 5px 0;
  }
  .page-navigator li {
    flex-shrink: 0;
    margin: 0;
  }
  .page-navigator a {
    padding: 6px 10px;
    font-size: 0.9em;
    white-space: nowrap;
    min-width: 40px;
    text-align: center;
  }
}

@media (max-width: 768px) {
  #header {
    text-align: center;
  }
  .post-title,
  .post-meta {
    text-align: left;
  }
  .post-meta li {
    display: inline-block;
    margin: 5px 8px 5px 0;
    padding-left: 10px;
    border-left: 1px solid #D0E8F0;
  }
  .post-meta li:first-child {
    padding-left: 0;
    border: none;
  }
}

@media (min-width: 992px) {

}

@media (min-width: 1200px) {
  .container {
    max-width: 952px;
  }
}


/*
* Hide from both screenreaders and browsers: h5bp.com/u
*/
.hidden {
  display: none !important;
  visibility: hidden; }

/*
* Hide only visually, but have it available for screenreaders: h5bp.com/v
*/
.sr-only {
  border: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px; }

/*
* Extends the .sr-only class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p
*/
.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto; }

/*
* Hide visually and from screenreaders, but maintain layout
*/
.invisible {
  visibility: hidden; }

/* -----------------
 * Float Tools (右下角悬浮球)
 *--------------- */
.float-tools {
  position: fixed;
  right: 20px;
  bottom: 40px;
  z-index: 999;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.float-btn {
  width: 45px;
  height: 45px;
  background: #FFF;
  border: 1px solid #D0E8F0;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(91, 155, 213, 0.15);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3em;
  transition: all 0.3s ease;
  user-select: none;
}
.float-btn:hover {
  background: #5B9BD5;
  color: #FFF;
  border-color: #5B9BD5;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(91, 155, 213, 0.3);
}
.float-btn .icon-sun,
.float-btn .icon-moon {
  display: none;
}
#dark-mode-toggle .icon-moon {
  display: inline;
}
#dark-mode-toggle .icon-sun {
  display: none;
}
body.night-mode #dark-mode-toggle .icon-moon {
  display: none;
}
body.night-mode #dark-mode-toggle .icon-sun {
  display: inline;
}
#back-to-top {
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
}
#back-to-top.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Night Mode Styles */
body.night-mode {
  background-color: #1a1a2e !important;
  background-image: linear-gradient(180deg, #1a1a2e 0%, #16213e 100%) !important;
  color: #b8b8b8 !important;
}
body.night-mode #header {
  background: #16213e !important;
  border-bottom-color: #2d2d44 !important;
}
body.night-mode #logo,
body.night-mode .post-title a,
body.night-mode h1, body.night-mode h2, body.night-mode h3,
body.night-mode h4, body.night-mode h5, body.night-mode h6 {
  color: #e0e0e0 !important;
}
body.night-mode .description,
body.night-mode .post-meta,
body.night-mode .comment-date {
  color: #888 !important;
}
body.night-mode #footer {
  background: #16213e !important;
  color: #888 !important;
  border-top-color: #2d2d44 !important;
}
body.night-mode #footer a {
  color: #64b5f6 !important;
}
body.night-mode .post,
body.night-mode .widget,
body.night-mode .comment-list li,
body.night-mode #comments .respond {
  background: #16213e !important;
  border-color: #2d2d44 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}
body.night-mode a,
body.night-mode .post-title a:hover,
body.night-mode .float-btn:hover {
  color: #64b5f6 !important;
}
body.night-mode .post-meta li,
body.night-mode .comment-list li .comment-reply {
  border-left-color: #2d2d44 !important;
}
body.night-mode input[type="text"],
body.night-mode input[type="email"],
body.night-mode input[type="url"],
body.night-mode input[type="password"],
body.night-mode textarea {
  background: #1a1a2e !important;
  border-color: #2d2d44 !important;
  color: #e0e0e0 !important;
}
body.night-mode input:focus,
body.night-mode textarea:focus {
  border-color: #64b5f6 !important;
}
body.night-mode blockquote {
  background: #1a1a2e !important;
  border-left-color: #64b5f6 !important;
  color: #888 !important;
}

/* -----------------
 * Readers Wall
 *--------------- */
.friends-list-wrap {
  margin-bottom: 20px;
}
.friends-list-wrap h3 {
  margin-bottom: 10px;
  font-size: 1.15em;
  color: #2C3E50;
}
.friends-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 15px;
}
.friend-item {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #D0E8F0;
  padding: 0;
  border-radius: 8px;
  background: #FFFFFF;
  transition: box-shadow 0.2s ease;
}
.friend-item:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.friend-avatar-link {
  display: block;
  width: 60px;
  height: 60px;
  border-radius: 4px;
  overflow: hidden;
  flex-shrink: 0;
}
.friend-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.friend-avatar-text {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #5B9BD5, #3A7CA5);
  color: #FFF;
  font-weight: bold;
  font-size: 1.2em;
}
.friend-info {
  flex: 1;
}
.friend-name {
  color: #2C3E50;
  font-weight: 600;
  text-decoration: none;
}
.friend-name:hover {
  color: #5B9BD5;
}
.friend-desc {
  margin: 4px 0 0;
  color: #7A8A9A;
  font-size: .9em;
  line-height: 1.4;
}

.readers-list {
  list-style: none;
  padding: 0;
  margin: 20px 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 15px;
}

.readers-list li {
  padding: 0;
  margin: 0;
  background: none;
  border: none;
}

.reader-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 8px;
  height: 130px;
  background: linear-gradient(135deg, #F5F8FC, #EAF2F7);
  border: 1px solid #C8D8E0;
  border-radius: 12px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  box-sizing: border-box;
}

.reader-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 18px rgba(0, 0, 0, 0.15);
  border-color: #5B9BD5;
}

.reader-rank {
  position: absolute;
  top: 8px;
  left: 8px;
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 0.7em;
  color: #fff;
  text-align: center;
  border-radius: 50%;
  background: #5B9BD5;
  z-index: 10;
}

.reader-rank.rank-1 { background: #f5a623; }
.reader-rank.rank-2 { background: #9a9a9a; }
.reader-rank.rank-3 { background: #cd7f32; }

.reader-avatar-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 0;
  overflow: hidden;
  background: #E8F4F8;
  flex-shrink: 0;
}

.reader-avatar {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.reader-avatar-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #5B9BD5, #3A7CA5);
  color: #FFF;
  font-weight: bold;
  font-size: 1.3em;
  border-radius: 0;
}

.reader-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.reader-name {
  font-weight: 600;
  color: #2C3E50;
  font-size: 0.85em;
  text-decoration: none;
  max-width: 90px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.reader-name:hover {
  color: #5B9BD5;
}

.reader-count {
  color: #7A8A9A;
  font-size: 0.75em;
}

@media (max-width: 767px) {
  .readers-list {
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    gap: 10px;
  }
  .reader-item {
    height: 115px;
    padding: 10px 6px;
  }
  .reader-avatar-link {
    width: 48px;
    height: 48px;
  }
  .reader-name {
    max-width: 75px;
    font-size: 0.8em;
  }
}
body.night-mode pre,
body.night-mode code {
  background: #1a1a2e !important;
  border-color: #2d2d44 !important;
  color: #e0e0e0 !important;
}
body.night-mode table {
  border-color: #2d2d44 !important;
}
body.night-mode table th,
body.night-mode table td {
  border-color: #2d2d44 !important;
}
body.night-mode table th {
  background: #1a1a2e !important;
  color: #e0e0e0 !important;
}
body.night-mode .page-navigator a:hover,
body.night-mode .more a:hover {
  background: #64b5f6 !important;
  color: #fff !important;
}
body.night-mode .comment-list li.comment-level-odd {
  background: #1a1a2e !important;
}
body.night-mode .comment-list li.comment-by-author {
  background: #1f2a40 !important;
  border-left-color: #64b5f6 !important;
}
body.night-mode .widget-list li {
  border-left-color: #2d2d44 !important;
}
body.night-mode .widget-list li:hover {
  border-left-color: #64b5f6 !important;
}

@media (max-width: 768px) {
  .float-tools {
    right: 15px;
    bottom: 30px;
  }
  .float-btn {
    width: 40px;
    height: 40px;
    font-size: 1.1em;
  }
}