/* ==========================================================================
   fitness-forum-chrome — assets/chrome.css
   Self-contained header strip for foorum.fitness.ee. Every selector is
   .ffc-* prefixed; no dependency on any theme/UIkit styles, no JS.

   Color tokens are copied by value from the fitness-2026 theme
   (themes/fitness-2026/assets/css/main.css :root):
     blue #005DB9 · blue-deep #174b80 · red #E02020 · gold #f0b32e
     ink #131a22 · mist #f2f5f9 · line #dfe5ec · navy #0c1f3a
   Pill styles mirror main.css .hdr-nav .nav-turg / .nav-ai (~lines 154-168).
   No native CSS nesting, no @import.
   ========================================================================== */

.ffc-strip {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  background: #ffffff;
  border-bottom: 1px solid #dfe5ec;
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  line-height: 1.2;
  text-align: left;
}
.ffc-strip *,
.ffc-strip *::before,
.ffc-strip *::after { box-sizing: inherit; }

/* Brand accent bar — mirrors the main site's header stripe (main.css .hdr::before). */
.ffc-strip::before {
  content: "";
  display: block;
  height: 3px;
  background: linear-gradient(90deg, #005DB9 0 70%, #E02020 70% 85%, #f0b32e 85% 100%);
}

.ffc-inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 52px; /* + 3px accent bar ≈ 55px total strip */
}

.ffc-logo {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  min-height: 44px;
  color: #131a22;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.01em;
  text-decoration: none;
}
.ffc-logo:hover { color: #131a22; text-decoration: none; }
.ffc-logo-tld { color: #E02020; }

/* Single-row nav. Never wraps; overflows into momentum horizontal scroll
   (the whole mobile story — no burger, no drawer, no JS). */
.ffc-nav {
  display: flex;
  align-items: center;
  gap: 2px;
  flex: 1 1 auto;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.ffc-nav::-webkit-scrollbar { display: none; }

.ffc-item {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  min-height: 44px; /* tap target */
  padding: 0 11px;
  color: #131a22;
  font-size: 13.5px;
  font-weight: 700;
  border-radius: 8px;
  white-space: nowrap;
  text-decoration: none;
}
.ffc-item:hover { background: #f2f5f9; color: #131a22; text-decoration: none; }

/* Active item (Foorum — we are on the forum). Mirrors main.css .is-current. */
.ffc-item.ffc-is-active {
  color: #005DB9;
  box-shadow: inset 0 -3px 0 #005DB9;
  border-radius: 8px 8px 0 0;
}

/* Blue "Turg" pill — mirrors main.css .hdr-nav .nav-turg. */
.ffc-item.ffc-nav-turg { color: #ffffff; background: #005DB9; margin-left: 6px; }
.ffc-item.ffc-nav-turg:hover { background: #174b80; color: #ffffff; }

/* Gold "AI-treener" pill — mirrors main.css .hdr-nav .nav-ai (+ ✦ prefix,
   which is presentation and therefore lives here, not in the menu data). */
.ffc-item.ffc-nav-ai {
  color: #0c1f3a;
  background: linear-gradient(100deg, #fdf6e3, #faeccb);
  border: 1px solid #f1dda5;
}
.ffc-item.ffc-nav-ai:hover { color: #0c1f3a; }
.ffc-item.ffc-nav-ai::before { content: "✦ "; }

.ffc-strip a:focus-visible { outline: 3px solid #005DB9; outline-offset: 2px; }

@media (max-width: 760px) {
  .ffc-inner { gap: 10px; padding: 0 12px; }
  .ffc-logo { font-size: 16px; }
  /* Let the scrolling row bleed to the viewport edge so the cut-off item
     hints that the nav scrolls. */
  .ffc-nav { margin-right: -12px; padding-right: 12px; }
}