/* global */

body {
  font-family: "Arvo", "Helvetica Neue", Helvetica, "Nimbus Sans L", Arial, "Liberation Sans", "PingFang SC", "Hiragino Sans GB", "Noto Sans CJK SC", "Source Han Sans SC", "Source Han Sans CN", "Microsoft YaHei", "Wenquanyi Micro Hei", "WenQuanYi Zen Hei", "ST Heiti", SimHei, "WenQuanYi Zen Hei Sharp", sans-serif;
  margin: 0 20px;
}

a {
  color: #000;
  text-decoration: none;
}

a:hover {
  font-weight: 600;
  text-decoration: underline;
}

.post-ads {
  margin: 50px 0;
}

/* overwrite github-markdown */

.markdown-body {
  font-size: 18px;
}

/* i18n */

.Chinese .markdown-body {
  line-height: 200%;
}

/* header */

.site-title {
  font-size: 3rem;
  margin-top: 32px;
}

.site-date-catalog {
  font-size: 2rem;
}

.signatures {
  font-family: "Permanent Marker", Impact, Charcoal, sans-serif;
}

.signatures a {
  text-decoration: none;
}

.header-line {
  width: 100%;
  border-width: 3px;
  border-color: #000;
  border-style: solid none none none;
  margin: 18px 0;
}

.lang-switch {
  font-weight: 600;
}

/* posts */

#posts-list {
  min-height: 70%;
}

.posts-date, .posts-title {
  font-size: 1.2rem;
}

.post-line {
  margin: 12px 0;
}

.site-footer {
  margin-top: 20px;
  margin-bottom: 80px;
  display: flex;
  justify-content: flex-end;
  padding: 12px 0;
}

/* Year pagination */
#year-pagination {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 30px;
  padding-top: 16px;
  border-top: 2px solid #000;
}

.year-btn {
  background: none;
  border: 1px solid #ccc;
  padding: 4px 14px;
  font-family: "Arvo", serif;
  font-size: 1rem;
  cursor: pointer;
  border-radius: 3px;
  transition: all 0.2s ease;
}

.year-btn:hover {
  border-color: #000;
  background: #f5f5f5;
}

.year-btn.active {
  background: #000;
  color: #fff;
  border-color: #000;
  font-weight: 600;
}

.site-footer-item {
  margin-right: 12px;
}

/* post */

@media screen and (max-width: 600px) {
  .site-header {
    display: none;
  }
  .post-content {
    padding: 0 12px;
  }
  .post-content p {
    letter-spacing: 0.05em;
  }
}

.post img {
  max-width: 100%;
  display: block;
  margin-top: 12px;
  cursor: pointer;
}

.post-date {
  font-weight: 800;
  font-style: italic;
}

.post-author {
  font-weight: 600;
}

.post-header {
  margin-bottom: 50px;
}

.post-title {
  font-size: 2.5rem;
  font-weight: 600;
}

.post-content {
  margin-bottom: 50px;
}

.post-content p {
  hyphens: auto;
  line-height: 1.6;
  text-align: justify;
  text-justify: ideographic;
  word-break: break-all;
  margin-bottom: 1em;
}

.releated-content {
  border-width: 3px;
  border-style: solid;
  border-color: #000;
  padding: 0 10px;
  margin-bottom: 50px;
  margin-top: 100px;
}

.releated-content li {
  margin: 5px 0;
}

/* gallery */

.gallery-img {
  text-align: center;
}

.gallery-img span {
  text-align: center;
}
.gallery-img-desc {
  font-size: 0.8em;
  font-weight: 800;
}

/* disqus */

#disqus_thread {
  position: relative;
}

#disqus_thread:after {
  content: "";
  display: block;
  height: 55px;
  width: 100%;
  position: absolute;
  bottom: 0;
  background: white;
}

/* Lightbox overlay for full-size image preview */
.lightbox-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.85);
  z-index: 9999;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.lightbox-overlay.active {
  display: flex;
}

.lightbox-overlay img {
  max-width: 95%;
  max-height: 95%;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.5);
}