/* ============================================================
   SBZ Brand color file — JEDINÝ zdroj barev pro celý web
   Aktualizováno 2026-05-22 — Roman finál: #5ab130
   Historie palet + pravidla: .claude/knowledge/sbz-brand-palety.md
   ============================================================ */

[data-bs-theme=light] {
  /* === SBZ Brand zelené — FINÁL #5ab130 === */
  /* Roman 2026-05-22: #5ab130 je FINÁLNÍ brand barva. Hero, tlačítka, akcenty — vše stejné. */
  --sbz-green:        #5ab130;                       /* primární brand — akcenty, badges, btn-success */
  --sbz-green-dark:   #477026;                       /* tmavší — bg-success pro CTA s bílým textem, text na bílém */
  --sbz-green-darker: #345519;                       /* nejtmavší — hover stavy */
  --sbz-green-light:  rgba(90, 177, 48, 0.12);       /* světlé pozadí (badges, alerts) */
  --sbz-green-rgb:    90, 177, 48;
  /* Nejsvětlejší odstín TÉŽE zelené, co snese BÍLÝ text dle WCAG AA (kontrast 4,54 ≥ 4,5).
     Použít VŠUDE, kde je bílý text na zelené ploše: hero, tlačítka, odznaky, hlavičky.
     Svěží --sbz-green (#5ab130) zůstává jen pro akcenty BEZ bílého textu (ikony, rámečky, světlá pozadí). */
  --sbz-green-cta:     #448524;
  --sbz-green-cta-rgb: 68, 133, 36;

  /* === SBZ červená CTA — z loga ("Bolesti" box) ===
     Primární akce "Objednat" — červená vynikne na zelené stránce (Stratég 2026-06-08).
     #D81E05 = sytá logo červená, kontrast s bílým textem 5,1 (WCAG AA). */
  --sbz-red-cta:       #D81E05;
  --sbz-red-cta-rgb:   216, 30, 5;
  --sbz-red-cta-dark:  #B71C1C;

  /* === Mizzle/Bootstrap primary → SBZ ===
     Roman 2026-05-30: brand zelená pro Bootstrap (text-primary, taby, accordion, pozadí s textem)
     = --sbz-green-cta #448524 (kontrast ≥ WCAG AA 4,5). Svěží #5ab130 (--sbz-green) zůstává
     pro dekorativní ikony a světlá pozadí (bez textu / s tmavým textem). */
  --bs-primary:                #448524 !important;
  --bs-primary-rgb:            68, 133, 36 !important;
  --bs-link-color:             #477026 !important;
  --bs-link-color-rgb:         71, 114, 38 !important;
  --bs-link-hover-color:       #345519 !important;
  --bs-link-hover-color-rgb:   52, 85, 25;
  --bs-nav-pills-link-active-bg: #448524 !important;

  /* === Mizzle/Bootstrap success → SBZ ===
     --bs-success = --sbz-green-cta #448524 (snese bílý text i zelený text na bílém). */
  --bs-success:                var(--sbz-green-cta);
  --bs-success-rgb:            var(--sbz-green-cta-rgb);
  --bs-success-bg-subtle:      var(--sbz-green-light);
  --bs-success-text-emphasis:  var(--sbz-green-dark);
  --bs-success-border-subtle:  rgba(90, 177, 48, 0.5);

  /* === Body text — tmavší šedá (dyslektik + 40+ cílovka) === */
  --bs-body-color:             #4a4d50;
  --bs-body-color-rgb:         74, 77, 80;
  --bs-secondary-color:        rgba(74, 77, 80, 0.85);
  --bs-heading-color:          #202124;

  /* === v37 jemnější pozadí (místo Bootstrap #f8f9fa) === */
  --bs-light:                  #f8f8f8;
  --bs-light-rgb:              248, 248, 248;
  --bs-tertiary-bg:            #f8f8f8;
  --bs-border-color:           #dce0e5;
}

[data-bs-theme=dark] {
  /* Dark mode = stejná brand zelená */
  --bs-primary:                  #5ab130 !important;
  --bs-primary-rgb:              90, 177, 48 !important;
  --bs-link-color:               #5ab130 !important;
  --bs-link-color-rgb:           90, 177, 48 !important;
  --bs-link-hover-color:         #76b72f !important;
  --bs-link-hover-color-rgb:     118, 183, 47;
  --bs-nav-pills-link-active-bg: #5ab130 !important;
}

/* ============================================================
   MIZZLE COMPONENT OVERRIDES (via Bootstrap CSS variables)
   = jen lokální --bs-* override, žádné !important na background-color
   ============================================================ */

/* Navbar */
.navbar {
  --bs-navbar-hover-color: var(--bs-primary);
  --bs-navbar-active-color: var(--bs-primary);
}
.navbar-dark {
  --bs-navbar-hover-color: var(--bs-primary) !important;
  --bs-navbar-active-color: var(--bs-primary) !important;
}
.nav {
  --bs-nav-link-hover-color: var(--bs-primary);
}
.dropdown-menu {
  --bs-dropdown-link-hover-color: var(--bs-primary) !important;
  --bs-dropdown-link-active-color: var(--bs-primary) !important;
}

/* btn-primary = brand zelená */
.btn-primary {
  --bs-btn-bg: var(--sbz-green-cta);                  /* bílý text na tlačítku → tmavší zelená (WCAG 4,54) */
  --bs-btn-border-color: var(--sbz-green-cta);
  --bs-btn-hover-bg: var(--bs-link-hover-color);
  --bs-btn-hover-border-color: var(--bs-link-hover-color);
  --bs-btn-active-bg: var(--bs-link-hover-color);
  --bs-btn-active-border-color: var(--bs-link-hover-color);
  --bs-btn-disabled-bg: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

/* btn-success = sytá brand zelená (světlejší než bg-success pozadí) */
.btn-success {
  --bs-btn-bg: var(--sbz-green-cta);
  --bs-btn-border-color: var(--sbz-green-cta);
  --bs-btn-hover-bg: var(--sbz-green-dark);
  --bs-btn-hover-border-color: var(--sbz-green-dark);
  --bs-btn-active-bg: var(--sbz-green-dark);
  --bs-btn-active-border-color: var(--sbz-green-dark);
  --bs-btn-disabled-bg: var(--sbz-green);
  --bs-btn-disabled-border-color: var(--sbz-green);
}

.btn-outline-success {
  --bs-btn-color: var(--sbz-green-cta);          /* zelený text na bílé → tmavší (WCAG 4,54) */
  --bs-btn-border-color: var(--sbz-green-cta);
  --bs-btn-hover-bg: var(--sbz-green-cta);
  --bs-btn-hover-border-color: var(--sbz-green-cta);
  --bs-btn-active-bg: var(--sbz-green-cta);
  --bs-btn-active-border-color: var(--sbz-green-cta);
  --bs-btn-disabled-color: var(--sbz-green-cta);
  --bs-btn-disabled-border-color: var(--sbz-green-cta);
}

.btn-link {
  --bs-btn-color: var(--bs-primary);
  --bs-link-color: var(--bs-primary);
  --bs-btn-hover-color: var(--bs-link-hover-color);
  --bs-btn-active-color: var(--bs-link-hover-color);
}

.btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-disabled-color: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-primary-soft {
  color: var(--bs-primary);
  background-color: rgba(var(--bs-primary-rgb), 0.1);
}
.btn-primary-soft.active,
.btn-primary-soft:focus,
.btn-primary-soft:hover {
  color: var(--bs-white);
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.btn-primary-shadow {
  background-color: var(--bs-primary);
  box-shadow: 0 0 0 10px rgba(var(--bs-primary-rgb), .4);
}
.btn-primary-shadow:hover,
.btn-primary-shadow:focus,
.btn-primary-shadow.active {
  background-color: var(--bs-link-color);
  box-shadow: 0 0 0 10px rgba(var(--bs-primary-rgb), .4);
}

.fill-primary {
  fill: var(--bs-primary) !important;
}
.nav-pills {
  --bs-nav-pills-link-active-bg: var(--bs-primary);
}
.text-bg-primary {
  background-color: rgba(var(--bs-primary-rgb), 1) !important;
}
.page-item.active .page-link,
.page-link:hover,
.form-check-input:checked {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}

/* ============================================================
   Hero (section.bg-primary) = brand zelená pod bílým textem.
   Roman 2026-05-30: ztmaveno na --sbz-green-cta #448524 (kontrast s bílým textem 4,54 ≥ WCAG AA 4,5),
   pořád stejný odstín zelené, jen tmavší → přístupnost 100. Svěží #5ab130 zůstává pro akcenty.

   CTA sekce (section.bg-success) = ještě tmavší zelená #477026 (odlišení od hero).
   ============================================================ */
section.bg-primary {
  background-color: var(--sbz-green-cta) !important;   /* #448524 — kontrast s bílým textem 4,54 (WCAG AA) */
}
section.bg-success {
  background-color: var(--sbz-green-dark) !important;  /* #477026 tmavší pro CTA */
}

/* Odznaky s bílým textem (badge „AKCE" / „Nadcházející") → tmavší zelená pro kontrast (WCAG 4,54) */
.badge.bg-success,
.badge.bg-primary {
  background-color: var(--sbz-green-cta) !important;
}

/* Plné .bg-primary bloky (hlavičky formulářů sbz6Form, progress bary) nesou bílý text → tmavší zelená.
   section.bg-success (#477026) zůstává beze změny díky vyšší specificitě. */
.bg-primary {
  background-color: var(--sbz-green-cta) !important;
}

/* Obsahové záložky (taby/pills) — zelený TEXT na šedém pozadí #f8f8f8.
   #448524 na šedé = 4,25 < 4,5 → neaktivní záložky potřebují tmavší #477026 (kontrast 5,5).
   Cíleno jen na data-bs-toggle (NE navbar menu). Aktivní záložka má bílý text na zeleném (OK). */
.nav-link[data-bs-toggle="tab"]:not(.active),
.nav-link[data-bs-toggle="pill"]:not(.active) {
  color: var(--sbz-green-dark) !important;
}

/* === V hero (bg-primary) všechen text BÍLÝ === */
/* Mizzle .heading-color třída + h1-h6 z custom3.css mají hnědou — přepsat na bílou */
section.bg-primary,
section.bg-primary h1, section.bg-primary h2, section.bg-primary h3,
section.bg-primary h4, section.bg-primary h5, section.bg-primary h6,
section.bg-primary p,
section.bg-primary li,
section.bg-primary .heading-color,
section.bg-primary .text-body,
section.bg-primary .breadcrumb-item,
section.bg-primary .breadcrumb-item a {
  color: #fff !important;
}

/* Breadcrumb oddělovač (›) v hero — bílý (default je z Homepage/default.latte zelený) */
section.bg-primary .breadcrumb-item + .breadcrumb-item::before {
  color: #fff !important;
}

/* text-white-50 (50% opacity) je na zelené pozadí málo kontrastní
   → v hero/CTA sekci zvýšit na 85% opacity */
section.bg-primary .text-white-50,
section.bg-success .text-white-50,
.bg-success .text-white-50 {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* ============================================================
   SBZ-SPECIFIC OVERRIDES (přebíjí Mizzle hardcoded #0cbc87)
   ============================================================ */

/* Eshop košík header — sytá brand (ne tmavší --bs-success) */
.card-header.bg-success {
  background-color: var(--sbz-green) !important;
}

/* "Back to top" floating button */
html body .back-top,
html body div.back-top,
.back-top.back-top-show {
  background: var(--sbz-green) !important;
  background-color: var(--sbz-green) !important;
}
html body .back-top:hover,
html body div.back-top:hover {
  background: var(--sbz-green-dark) !important;
  background-color: var(--sbz-green-dark) !important;
}

/* Footer / bg-dark — link colors zelené */
footer.bg-dark,
.bg-dark,
[data-bs-theme=dark] {
  --bs-link-color: var(--sbz-green) !important;
  --bs-link-color-rgb: var(--sbz-green-rgb) !important;
  --bs-link-hover-color: var(--sbz-green-dark) !important;
  --bs-link-hover-color-rgb: 71, 114, 38 !important;
}

/* ============================================================
   SVG inline color overrides (accordion arrow, form switch)
   "%23" je URL-encoding pro '#' — barva za %23.
   ============================================================ */
.accordion-button:not(.collapsed)::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%235ab130'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.form-switch .form-check-input:focus {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%235ab130'/%3e%3c/svg%3e");
}
.form-switch .form-check-input:checked {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
}

/* ============================================================
   Červené CTA tlačítko — primární akce "Objednat" (barva z loga)
   Použití: <a class="btn btn-sbz-cta btn-lg">Objednat</a>
   ============================================================ */
.btn-sbz-cta {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--sbz-red-cta);
  --bs-btn-border-color: var(--sbz-red-cta);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--sbz-red-cta-dark);
  --bs-btn-hover-border-color: var(--sbz-red-cta-dark);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--sbz-red-cta-dark);
  --bs-btn-active-border-color: var(--sbz-red-cta-dark);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--sbz-red-cta);
  --bs-btn-disabled-border-color: var(--sbz-red-cta);
}
