/* The nav lives inside <body>, which already applies the Tufte inset
   (width 87.5% + padding-left 12.5%), so it only needs top spacing here.
   Re-adding width/side padding double-insets and overflows the viewport. */
.sitenav {
  padding-top: 1.5rem;
  font-family: et-book, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
}

.sitenav a {
  margin-right: 1.5rem;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}

.post-meta {
  font-style: italic;
  color: #555;
}

.lang-switch {
  font-style: italic;
  color: #555;
  margin-top: -0.75rem;
}

.lang-switch .lang-current {
  font-weight: bold;
}

.lang-switch .lang-sep {
  margin: 0 0.4em;
}

/* Inline EN toggle on homepage titles: hover the tag to preview the English
   title, click it to open the English page. The swap is driven by a small
   script (see base.njk); without JS the Turkish title shows and the tag still
   links through to the English page. The tag sits at the start of the title so
   its position stays fixed when the title text swaps length. */
.post-title .title-alt {
  display: none;
}

.lang-tag {
  font-size: 0.6rem;
  font-style: normal;
  letter-spacing: 0.05em;
  vertical-align: super;
  margin-right: 0.4em;
  padding: 0.05em 0.35em;
  border: 1px solid #ccc;
  border-radius: 3px;
  color: #777;
  text-decoration: none;
  cursor: pointer;
}

.lang-tag:hover {
  color: #111;
  border-color: #111;
}

.post-list {
  list-style: none;
  padding-left: 0;
}

.post-list li {
  margin-bottom: 2.5rem;
}

.post-list-date {
  font-style: italic;
  color: #555;
  margin-left: 0.5em;
}

@media (prefers-color-scheme: dark) {
  .post-meta,
  .post-list-date,
  .lang-switch {
    color: #aaa;
  }
  .lang-tag {
    border-color: #444;
    color: #999;
  }
  .lang-tag:hover {
    color: #eee;
    border-color: #eee;
  }
}
