/* ─────────────────────────────────────────────
   immi.wiki — Shared Chrome (header + ticker)
   Single source of truth. Linked by every page
   (Astro pages via BaseLayout, article pages via
   the CF Pages Function). Plain static CSS so it
   applies identically regardless of how the page
   is rendered. Relies on CSS vars from global.css.
───────────────────────────────────────────── */

/* ── Header ── */
.site-header {
  background: var(--color-surface);
  border-bottom: 1px solid var(--color-border);
  padding: 0.75rem 1rem;
  position: sticky;
  top: 0;
  z-index: 100;
}
.site-header-inner {
  max-width: var(--max-content-width, 1200px);
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.site-logo-link {
  display: flex;
  align-items: center;
  text-decoration: none;
}
.site-logo-link:hover,
.site-logo-link:visited {
  text-decoration: none;
}
.site-logo-img {
  height: 1.5rem;
  width: auto;
  display: block;
}
.site-tagline {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text-muted);
  margin: 0;
}
.tagline-un {
  font-weight: inherit;
}
.site-nav {
  display: flex;
  gap: 1.25rem;
}
.site-nav a {
  font-size: 0.875rem;
  color: var(--color-text-muted);
  text-decoration: none;
}
.site-nav a:hover {
  color: var(--color-link);
}

/* ── Search trigger ── */
.search-trigger {
  background: none;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  padding: 0.3rem 0.55rem;
  cursor: pointer;
  color: var(--color-text-muted);
  display: flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8rem;
  white-space: nowrap;
}
.search-trigger:hover {
  color: var(--color-link);
  border-color: var(--color-link);
}

@media (max-width: 600px) {
  .site-nav {
    display: none;
  }
  .search-trigger {
    padding: 0.3rem;
  }
}

/* ── News ticker (Direction A — Wikipedia-toned) ── */
.wiki-ticker {
  position: sticky;
  top: var(--header-height, 3.75rem);
  z-index: 99;
  height: 34px;
  background: var(--color-surface);
  border-top: 1px solid var(--color-border-light);
  border-bottom: 1px solid var(--color-border);
  display: flex;
  align-items: center;
  overflow: hidden;
  font-family: var(--font-sans);
}
.wiki-ticker-label {
  flex-shrink: 0;
  height: 100%;
  display: flex;
  align-items: center;
  padding: 0 14px;
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--color-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.07em;
  background: var(--color-surface);
  border-right: 1px solid var(--color-border);
  white-space: nowrap;
  position: relative;
  z-index: 2;
}
.wiki-ticker-track {
  display: flex;
  align-items: center;
  white-space: nowrap;
  padding-left: 20px;
  animation: wiki-ticker-scroll 60s linear infinite;
  will-change: transform;
}
.wiki-ticker-track:hover {
  animation-play-state: paused;
}
@keyframes wiki-ticker-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}
.wiki-ticker-item {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}
.wiki-ticker-flag {
  font-size: 0.875rem;
  line-height: 1;
  margin-right: 8px;
  flex-shrink: 0;
}
.wiki-ticker-date {
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--color-text-muted);
  background: var(--color-bg);
  border: 1px solid var(--color-border-light);
  padding: 1px 7px;
  border-radius: 3px;
  margin-right: 12px;
  white-space: nowrap;
  flex-shrink: 0;
}
.wiki-ticker-breaking {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #fff;
  background: #c0392b;
  padding: 2px 6px;
  border-radius: 3px;
  margin-right: 8px;
  white-space: nowrap;
  flex-shrink: 0;
}
.wiki-ticker-link {
  font-size: 0.8125rem;
  color: var(--color-text);
  text-decoration: none;
}
.wiki-ticker-link:hover {
  color: var(--color-link);
  text-decoration: underline;
}
.wiki-ticker-sep {
  color: var(--color-border);
  margin: 0 22px;
  flex-shrink: 0;
  user-select: none;
}
.wiki-ticker-text {
  font-size: 0.8125rem;
  color: var(--color-text-muted);
}
