/* 099: canlı sayt — yeni dizayn struktur override-ları. tokens-v2.css
   dəyişən-əsaslı reskin edə bilmədiyi hissələr (header fonu, hamburger
   menyu, kart vurğu xətti, hero tam-enli zolaq) üçün. app/static/css/
   style.css-ə TOXUNULMUR, bu fayl ONUN ÜSTÜNDƏN yüklənir (eyni selektor,
   sonrakı mənbə qalib gəlir - CSS kaskadı, !important yalnız mövcud
   tema-şərtli (`[data-theme="dark"] .logo-dark` kimi daha yüksək
   spesifikliyi olan) qaydaları keçmək lazım olanda istifadə olunub). */

/* ---------- Header: HƏR İKİ temada mavi fon ---------- */
.site-header { background: var(--header-bg-v2); border-bottom: none; }
.nav-links a { color: #fff; opacity: .82; }
.nav-links a:hover { color: #fff; opacity: 1; }
.site-header .logo-dark { display: none !important; }
.site-header .logo-light { display: block !important; }
.header-actions .avatar-btn { border-color: rgba(255, 255, 255, .55); }
.header-actions a.btn-secondary, .header-actions a.btn-primary { border-radius: var(--radius-sm); }
.header-actions a.btn-secondary {
  background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55);
}
.header-actions a.btn-secondary:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.header-actions a.btn-primary { background: #fff; color: var(--blue-700); }
.header-actions a.btn-primary:hover { background: var(--blue-50); color: var(--blue-700); }

/* ---------- Hamburger menyu (099: real sayta YENİ, prototipdən) ----------
   Markup base.html-ə {% if design_v2(request) %} daxilində əlavə olunub -
   v1 cavablarında bu elementlər HEÇ render olunmur (sıfır görünüş təsiri). */
.hamburger-v2-btn {
  display: none; width: 40px; height: 40px; border: 1px solid rgba(255, 255, 255, .5);
  border-radius: var(--radius-sm); background: transparent; cursor: pointer;
  align-items: center; justify-content: center; flex-direction: column; gap: 4px; flex-shrink: 0;
}
.hamburger-v2-btn span { display: block; width: 18px; height: 2px; background: #fff; }
.mobile-nav-v2 { display: none; flex-direction: column; border-top: 1px solid rgba(255, 255, 255, .15); background: var(--header-bg-v2); }
.mobile-nav-v2 a { padding: var(--space-3) var(--gutter); color: #fff; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .12); }
.mobile-nav-v2.open { display: flex; }

@media (max-width: 860px) {
  .site-header .nav-links { display: none; }
  .site-header .header-inner { flex-wrap: nowrap; }
  .hamburger-v2-btn { display: inline-flex; }
}

/* ---------- Hero (ana səhifə): tam-enli mavi zolaq, CSS-only full-bleed
   ("100vw" trick) - home.html-in markup-una TOXUNULMUR. ---------- */
.hero {
  background: linear-gradient(135deg, var(--blue-700) 0%, var(--blue-800) 100%);
  color: #fff;
  width: 100vw; position: relative; left: 50%; right: 50%;
  margin-left: -50vw; margin-right: -50vw;
  padding: var(--space-8) var(--gutter) var(--space-7);
  text-align: center; box-sizing: border-box;
}
.hero .t-display { color: #fff; }
.hero .lead { color: var(--blue-200); }
.hero-stats { color: var(--blue-200); }
.hero-actions .btn-primary { background: #fff; color: var(--blue-700); }
.hero-actions .btn-primary:hover { background: var(--blue-50); }
.hero-actions .btn-secondary { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .55); }
.hero-actions .btn-secondary:hover { background: rgba(255, 255, 255, .12); color: #fff; }
/* .how-it-works bilavasitə hero-dan sonra gəlir - mavi zolağın ARDINCA
   bir az əlavə boşluq, kəskin kəsik olmasın deyə */
.how-it-works { margin-top: var(--space-8); }

/* ---------- Kartlar: yuxarıda mavi vurğu xətti ---------- */
.card { border-top: 3px solid var(--card-accent-v2); transition: box-shadow .2s, border-color .2s; }
/* 101 BUG DÜZƏLİŞİ: fon `--blue-500` (hər iki temada SABİT #004AAD) idi,
   amma mətn rəngi v1-in `color: var(--on-accent)`-dən gəlirdi - bu, TEMA-
   HƏSSASDIR (tünd temada tünd-naviya, `--accent`-in tünd-temalı AÇIQ mavi
   fonu üçün nəzərdə tutulmuşdu). Nəticə: tünd temada tünd mətn SABİT tünd
   fonda - 2.03:1 (avtomatik kontrast skripti tapdı). Fon sabit olduğu üçün
   mətn də sabit olmalıdır. */
.how-step .how-step-num { background: var(--blue-500); color: #fff; }

/* ---------- Status/progress - mövcud .status-badge/.progress-bar-fill
   artıq --accent/--success/--danger token-lərini istifadə edir, əlavə
   qayda lazım deyil. Yalnız topic-accordion ox işarəsi rəngini
   vurğulayırıq (əvvəl boz idi). ---------- */
.topic-accordion summary::after, .category-accordion summary::after { color: var(--blue-400); }

/* ---------- Admin filtr paneli ----------
   101 BUG DÜZƏLİŞİ: `var(--blue-50)` xam rəng idi, tünd temada YENİDƏN
   TƏYİN OLUNMUR (tokens-v2.css-də yalnız :root{}-da var) - ona görə tünd
   temada panel AÇIQ qalırdı, üstündəki `.btn-secondary` mətni isə
   `var(--ink)` (tünd temada AÇIQ rəng) olduğu üçün açıq fonda görünmürdü.
   Həll: tema-həssas semantik token (`--surface`, hər iki temada düzgün
   təyin olunub) istifadə olunur - xam `--blue-*` miqyas tokenləri BİR
   DƏHA səthi/fon kimi işlədilmir, yalnız vurğu/mətn rəngi kimi. */
.filter-panel { background: var(--surface); border-color: var(--border); }
