/* ---------- Header ---------- */
.ichingo-navbar {
  position: sticky; top: 0; z-index: 40;
  background: color-mix(in srgb, var(--ichingo-bg-surface) 95%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--ichingo-border-subtle);
}
.ichingo-navbar__row {
  display: flex; align-items: center; justify-content: space-between; height: 4rem; gap: 1rem;
  padding-inline: clamp(1rem, 4vw, 2.5rem);
}
.ichingo-navbar__brand { display: flex; align-items: center; gap: .55rem; text-decoration: none; color: inherit; flex-shrink: 0; }

.ichingo-navbar__mark {
  display: block; width: 2.75rem; height: 2.75rem; flex-shrink: 0;
  border-radius: var(--ichingo-radius-lg); object-fit: cover;
  border: 2px solid color-mix(in srgb, var(--ichingo-color-accent-gold) 55%, transparent);
  box-shadow: var(--ichingo-shadow-sm);
}
.ichingo-navbar__brandtext { display: flex; flex-direction: column; gap: .15rem; }
.ichingo-navbar__wordmark { display: flex; align-items: center; gap: .4rem; }
.ichingo-navbar__brand strong { font-family: var(--ichingo-font-display); font-size: 1.15rem; color: var(--ichingo-text-ink); line-height: 1; }
.ichingo-navbar__badge {
  background: color-mix(in srgb, var(--ichingo-color-accent-gold) 20%, transparent);
  border: 1px solid color-mix(in srgb, var(--ichingo-color-accent-gold) 55%, transparent);
  color: var(--ichingo-color-accent-gold-dark, #b45309);
  font-size: .6rem; font-weight: 800; letter-spacing: .03em;
  padding: .1em .55em; border-radius: var(--ichingo-radius-pill); line-height: 1.4;
}
.ichingo-navbar__tagline {
  display: flex; align-items: center; gap: .35em; flex-wrap: wrap;
  font-size: .68rem; color: var(--ichingo-text-muted); font-weight: 600; white-space: nowrap;
}
.ichingo-navbar__dot {
  width: .4rem; height: .4rem; border-radius: 50%; background: var(--ichingo-color-jade); flex-shrink: 0;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ichingo-color-jade) 25%, transparent);
}
.ichingo-navbar__tagline-sep { opacity: .5; }
@media (max-width: 700px) { .ichingo-navbar__tagline { display: none; } }

.ichingo-navbar__links {
  display: none; align-items: center; justify-content: center; gap: .2rem; min-width: 0; flex: 1 1 auto;
  overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;
}
.ichingo-navbar__links::-webkit-scrollbar { display: none; }
@media (min-width: 900px) { .ichingo-navbar__links { display: flex; } }
.ichingo-navbar__links a {
  display: flex; align-items: center; gap: .4rem; text-decoration: none;
  color: var(--ichingo-text-muted); font-weight: 600; font-size: .82rem;
  padding: .5rem .7rem; border-radius: var(--ichingo-radius-sm);
  border: 1px solid transparent; white-space: nowrap; flex-shrink: 0;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.ichingo-navbar__links a:hover { background: var(--ichingo-bg-surface-alt); color: var(--ichingo-color-primary); }
.ichingo-navbar__links a.is-active {
  background: var(--ichingo-color-primary-tint); color: var(--ichingo-color-primary-dark);
  border-color: color-mix(in srgb, var(--ichingo-color-primary) 35%, transparent);
}
.ichingo-navbar__icon { width: 1rem; height: 1rem; flex-shrink: 0; color: var(--ichingo-text-muted); }
.ichingo-navbar__links a:hover .ichingo-navbar__icon,
.ichingo-navbar__links a.is-active .ichingo-navbar__icon { color: var(--ichingo-color-primary); }
.ichingo-navbar__actions { display: flex; align-items: center; gap: .4rem; flex-shrink: 0; }

/**
 * Per-section identity colors — matches the reference prototype, where
 * each primary nav destination gets its own accent instead of every
 * active tab looking identical. Falls back to the flat primary-tint
 * rule above for any item without a recognized data-nav-color.
 */
.ichingo-navbar__links a[data-nav-color="violet"].is-active,
.ichingo-tabbar a[data-nav-color="violet"].is-active {
  background: color-mix(in srgb, var(--ichingo-color-violet) 12%, transparent);
  color: var(--ichingo-color-violet);
  border-color: color-mix(in srgb, var(--ichingo-color-violet) 35%, transparent);
}
.ichingo-navbar__links a[data-nav-color="jade"].is-active,
.ichingo-tabbar a[data-nav-color="jade"].is-active {
  background: color-mix(in srgb, var(--ichingo-color-jade) 12%, transparent);
  color: var(--ichingo-color-jade);
  border-color: color-mix(in srgb, var(--ichingo-color-jade) 35%, transparent);
}
.ichingo-navbar__links a[data-nav-color="rose"].is-active,
.ichingo-tabbar a[data-nav-color="rose"].is-active {
  background: color-mix(in srgb, #e11d48 12%, transparent);
  color: #e11d48;
  border-color: color-mix(in srgb, #e11d48 35%, transparent);
}
.ichingo-navbar__links a[data-nav-color="slate"].is-active,
.ichingo-tabbar a[data-nav-color="slate"].is-active {
  background: var(--ichingo-text-ink);
  color: #fff;
  border-color: var(--ichingo-text-ink);
}
.ichingo-navbar__links a[data-nav-color="danger"].is-active,
.ichingo-tabbar a[data-nav-color="danger"].is-active {
  background: color-mix(in srgb, var(--ichingo-color-danger) 12%, transparent);
  color: var(--ichingo-color-danger);
  border-color: color-mix(in srgb, var(--ichingo-color-danger) 35%, transparent);
}
.ichingo-navbar__links a[data-nav-color="amber"].is-active,
.ichingo-tabbar a[data-nav-color="amber"].is-active {
  background: color-mix(in srgb, var(--ichingo-color-accent-gold) 15%, transparent);
  color: var(--ichingo-color-accent-gold-dark, #b45309);
  border-color: color-mix(in srgb, var(--ichingo-color-accent-gold) 40%, transparent);
}
.ichingo-navbar__links a[data-nav-color].is-active .ichingo-navbar__icon,
.ichingo-tabbar a[data-nav-color].is-active .ichingo-navbar__icon { color: currentColor; }
/* SOS tab always stays visually urgent on mobile even when not the active tab */
.ichingo-tabbar a[data-nav-color="danger"] { color: var(--ichingo-color-danger); }
.ichingo-tabbar a[data-nav-color="danger"] .ichingo-navbar__icon { color: var(--ichingo-color-danger); }

/* ---------- Language switcher ---------- */
.ichingo-lang-switcher { display: flex; align-items: center; background: var(--ichingo-bg-surface-alt); border-radius: var(--ichingo-radius-sm); padding: .3rem .4rem; }
.ichingo-lang-switcher select { background: none; border: none; font-weight: 700; font-size: .78rem; color: var(--ichingo-text-ink); cursor: pointer; }

/* ---------- Mobile bottom tab bar (matches the prototype's sticky mobile nav) ---------- */
.ichingo-tabbar {
  position: fixed; inset-inline: 0; bottom: 0; z-index: 50;
  display: flex; justify-content: space-around; align-items: center;
  background: color-mix(in srgb, var(--ichingo-bg-surface) 95%, transparent);
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--ichingo-border-subtle);
  padding: .4rem .25rem;
}
@media (min-width: 900px) { .ichingo-tabbar { display: none; } }
.ichingo-tabbar a { display: flex; flex-direction: column; align-items: center; gap: .15rem; text-decoration: none; color: var(--ichingo-text-muted); padding: .25rem .4rem; border-radius: var(--ichingo-radius-sm); }
.ichingo-tabbar a small { font-size: .62rem; font-weight: 700; }
.ichingo-tabbar a .ichingo-navbar__icon { width: 1.15rem; height: 1.15rem; color: var(--ichingo-text-muted); }
.ichingo-tabbar a.is-active { color: var(--ichingo-color-primary); }
.ichingo-tabbar a.is-active .ichingo-navbar__icon { color: var(--ichingo-color-primary); }

/* NOTE: footer styling lives entirely in footer.css (registered as its
   own 'ichingo-footer' stylesheet handle) — a duplicate, out-of-date
   .ichingo-footer block used to live here too, targeting a completely
   different (and incomplete) set of class names than what
   class-ichingo-footer.php actually renders. Two stylesheets silently
   fighting over the same selector, loaded in whatever order WordPress
   happened to enqueue them, is exactly the kind of thing that made the
   site's appearance feel inconsistent — removed. */

/* Reserve space so the mobile tab bar never overlaps page content */
body { padding-bottom: 0; }
@media (max-width: 899px) { .ichingo-footer { padding-bottom: 4.5rem; } }

/* 2026 refined navigation shell */
.ichingo-navbar{z-index:100;background:rgba(255,255,255,.86);border-bottom:1px solid rgba(23,51,45,.1);box-shadow:0 6px 24px rgba(20,55,47,.055);backdrop-filter:blur(18px) saturate(1.25)}
.ichingo-navbar__row{width:min(1500px,100%);height:4.4rem;margin-inline:auto;padding-inline:clamp(.85rem,3vw,2.2rem);gap:clamp(.65rem,1.4vw,1.1rem)}
.ichingo-navbar__brand{gap:.7rem}.ichingo-navbar__mark{width:2.85rem;height:2.85rem;border-radius:14px;border:1px solid rgba(218,167,43,.55);box-shadow:0 7px 20px rgba(22,55,47,.12)}.ichingo-navbar__brand strong{font-size:1.08rem;letter-spacing:-.025em}.ichingo-navbar__badge{border:0;background:#fff3ce;color:#8b6300}.ichingo-navbar__tagline{font-size:.62rem;color:#718079}.ichingo-navbar__links{gap:.12rem}.ichingo-navbar__links a{position:relative;gap:.38rem;padding:.58rem .62rem;border-radius:10px;font-size:.73rem;font-weight:750}.ichingo-navbar__links a:after{content:"";position:absolute;inset:auto .7rem -.2rem;height:2px;border-radius:2px;background:currentColor;opacity:0;transform:scaleX(.35);transition:.2s}.ichingo-navbar__links a.is-active:after{opacity:1;transform:scaleX(1)}.ichingo-navbar__links a:hover{background:#f1f7f4;color:#0c6753}.ichingo-navbar__links a.is-active{box-shadow:inset 0 0 0 1px currentColor}.ichingo-navbar__actions{gap:.55rem}.ichingo-lang-switcher{min-height:2.25rem;padding:.25rem .45rem;border:1px solid #dde7e2;border-radius:10px;background:#f6f9f8}.ichingo-lang-switcher select{font-size:.7rem}
@media(max-width:1180px) and (min-width:900px){.ichingo-navbar__tagline{display:none}.ichingo-navbar__links a{padding:.55rem .48rem}.ichingo-navbar__links a span{font-size:.68rem}}
@media(max-width:1420px) and (min-width:900px){.ichingo-navbar__tagline{display:none}.ichingo-navbar__row{padding-inline:.75rem;gap:.45rem}.ichingo-navbar__links a{padding:.5rem .42rem;gap:.28rem;font-size:.66rem}.ichingo-navbar__actions{gap:.3rem}.ichingo-auth__hello{display:none}.ichingo-auth__logout{padding:.32rem .48rem;font-size:.66rem}}
.ichingo-navbar[data-lang="fr"] .ichingo-navbar__links a,.ichingo-navbar[data-lang="es"] .ichingo-navbar__links a{padding-inline:.42rem;font-size:.67rem}
@media(max-width:899px){.ichingo-navbar__row{height:4rem}.ichingo-navbar__mark{width:2.55rem;height:2.55rem}.ichingo-navbar__brand strong{font-size:1rem}.ichingo-tabbar{inset-inline:.65rem;bottom:.6rem;border:1px solid rgba(25,60,51,.12);border-radius:18px;padding:.45rem;box-shadow:0 14px 40px rgba(14,44,36,.17);background:rgba(255,255,255,.94)}.ichingo-tabbar a{min-width:3.4rem;padding:.35rem .45rem;border-radius:11px}.ichingo-tabbar a.is-active{background:#eaf6f1}}
