/* ==========================================================================
   GAMIN2 — Audit Fix #1 + #3: Sticky navigace + chevron barvy
   Soubor: css/audit-sticky-nav.css
   
   Tento soubor je oddělen od audit-fixes.css protože vyžaduje JS 
   (třída .scrolled) a mění chování celého #masthead.
   ========================================================================== */

/* #1 — Sticky/Fixed navigace
   Figma: navigace fixed na vrchu, po scrollu bílá varianta s backdrop-blur
   Dev: position relative — navigace zmizí při scrollu
   Závažnost: Vysoká */

#masthead {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
    /*transition: background-color 0.4s ease, box-shadow 0.4s ease, backdrop-filter 0.4s ease;*/
}

/* Admin bar: WordPress přidává <html> margin-top: 32px (resp. 46px ≤782px),
   ale fixní elementy ho ignorují — masthead by se schoval pod #wpadminbar.
   Posuneme ho dolů, aby seděl přesně pod admin barem. */
body.admin-bar #masthead {
    top: 32px;
}

@media screen and (max-width: 782px) {
    body.admin-bar #masthead {
        top: 46px;
    }
}

/* Kompenzace výšky fixed headeru — aby obsah neskákal.
   Skutečnou výšku nastavuje JS (navigation.js) přes --gamin-header-height,
   protože reálná výška kolísá podle viditelnosti above-header-baru,
   admin baru, breakpointu, načtených fontů atd.

   POZN 1: pro admin-bar NEPŘIČÍTÁME +32px — WordPress to už řeší přes
   html { margin-top: 32px }. Kdybychom přičítali, započítal by se admin bar
   2× a breadcrumb by skončil 32px pod tím, kde má být.

   POZN 2: !important je nutný — WP core generuje inline
   <style id="global-styles-inline-css"> z theme.json s body { padding-top: 0 },
   který se vykresluje až za naším enqueue CSS, takže by jinak vyhrál v cascadě. */
body {
    padding-top: 0 !important;
}

/* Podstránky (desktop): hlavička je position:fixed a body má padding-top:0
   (kvůli homepage hero pod transparentní hlavičkou), takže na NE-home stránkách
   se breadcrumb (první prvek ve flow, document y=0) i obsah schovají POD fixní
   hlavičku a nejsou vidět. Vrátíme padding = výška hlavičky (101px), ať breadcrumb
   + obsah začínají pod ní. Jen desktop — na mobilu je hlavička position:relative
   (v flow), offset není potřeba. body:not(.home) (0,1,1) přebije body (0,0,1). */
@media (min-width: 922px) {
    body:not(.home) {
        padding-top: 101px !important;
    }
}

/* Mezera breadcrumb → H1 a snížení breadcrumbu pod hlavičku.
   Dev: H1.top === breadcrumb.bottom (gap 0px). Figma: výrazně větší mezera.
   Použij 32px do potvrzení přesné hodnoty z Figmy. */
.ast-header-breadcrumb {
    margin-bottom: 32px;
}

/* Scrolled stav — bílé pozadí s blur */
#masthead.scrolled {
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* Scrolled: skrýt above-header-bar pro úsporu místa (volitelné) */
/*
#masthead.scrolled .ast-above-header-bar {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.3s ease, opacity 0.2s ease;
}
*/

/* Scrolled: barvy odkazů na tmavé */
#masthead.scrolled .main-header-menu > .menu-item > a,
#masthead.scrolled .main-header-menu > .menu-item > .menu-link {
    color: var(--text-positive-primary, #022930) !important;
}

/* Scrolled: logo na modré verzi
   POZOR: `.ast-logo-title-inline` je třída na SAMOTNÉM #masthead, ne na
   potomkovi. Selektor `#masthead.scrolled .ast-logo-title-inline …` proto
   nikdy nesedl a logo zůstávalo bílé na bílém pozadí (nález A3).
   Ponecháno kvůli zpětné kompatibilitě, funkční variantu viz níže. */
#masthead.scrolled.ast-logo-title-inline .ast-site-identity a,
#masthead.scrolled .ast-logo-title-inline .ast-site-identity a {
    background-image: url(../img/logo-gamin-modre.svg);
}

/* ---------------------------------------------------------------------------
   A3 (2026-07-25) — Solid stav hlavičky dle Figmy 208:6378 (Type=Solid)
   Logo #008C9D, ikony #022930, vyhledávací pole na Background/Secondary.
   Selektory míří přímo na .custom-logo-link, který pozadí skutečně nese.
   --------------------------------------------------------------------------- */
#masthead.scrolled .site-logo-img .custom-logo-link,
#masthead.scrolled .ast-site-identity .custom-logo-link,
body.home #masthead.scrolled .site-logo-img .custom-logo-link,
body.home #masthead.scrolled .ast-site-identity .custom-logo-link {
    background-image: url(../img/logo-gamin-modre.svg) !important;
}

/* Search pole: 12% bílá na bílém pozadí byla prakticky neviditelná.
   Po scrollu je hlavička plná (Figma 1576:29724 Type=Solid) → pole světle šedé
   a ikona lupy TMAVÁ. Na homepage má pole ve výchozím (transparent) stavu bílou
   lupu (ikona-lupa-bila) kvůli tmavému heru, proto ji tady musíme explicitně
   přepsat na tmavou — jinak zůstane bílá lupa na světlém poli (neviditelná). */
#masthead.scrolled .gamin-search-input,
body.home #masthead.scrolled .gamin-search-input {
    background-color: var(--background-secondary, #EEEEEF) !important;
    background-image: url(../img/ikona-lupa-modra.svg) !important;
    color: var(--text-positive-secondary, #52525B) !important;
}

#masthead.scrolled .gamin-search-input::placeholder,
body.home #masthead.scrolled .gamin-search-input::placeholder {
    color: var(--text-negative-dummy, #A1A1AA) !important;
}

/* Ikona lupy a tlačítko „Zrušit" musí být také tmavé. */
#masthead.scrolled .gamin-search-cancel,
#masthead.scrolled .menu-toggle,
body.home #masthead.scrolled .gamin-search-cancel,
body.home #masthead.scrolled .menu-toggle {
    color: var(--icon-positive, #022930) !important;
}

/* Homepage: transparent header stav (výchozí) */
body.home #masthead:not(.scrolled) {
    background: transparent;
}

/* Subpages: vždy bílé pozadí headeru (nav není transparent jako na homepage)
   Bez tohoto by nav byl průhledný před prvním scrollem — při scrollu by obsah
   prosvítal přes průhlednou lištu a logo by nemuselo být čitelné. */
body:not(.home) #masthead:not(.scrolled) {
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

/* Homepage scrolled — stejné chování */
body.home #masthead.scrolled .main-header-menu > .menu-item > a,
body.home #masthead.scrolled .main-header-menu > .menu-item > .menu-link {
    color: var(--text-positive-primary, #022930) !important;
}

/* Homepage scrolled: hover barva */
body.home #masthead.scrolled .main-header-menu > .menu-item:hover > a {
    color: var(--button-primary-primary-hover, #57FFF8) !important;
}


/* #3 — Navigace: neviditelné chevrony na bílé variantě
   Figma: tmavé chevrony (#022930) | Dev: hardcode bílé border-color
   Závažnost: Střední
   
   Na podstránkách (ne homepage) a po scrollu (bílé pozadí)
   musí být chevrony tmavé. */

/* Podstránky — vždy tmavé chevrony */
body:not(.home) .main-header-menu .menu-item-has-children > .menu-link .ast-header-navigation-arrow .icon-arrow::after,
body:not(.home) .main-header-menu .menu-item-has-children > .menu-link::after {
    border-top-color: var(--text-positive-primary, #022930) !important;
}

/* Po scrollu — tmavé chevrony */
#masthead.scrolled .main-header-menu .menu-item-has-children > .menu-link .ast-header-navigation-arrow .icon-arrow::after,
#masthead.scrolled .main-header-menu .menu-item-has-children > .menu-link::after {
    border-top-color: var(--text-positive-primary, #022930) !important;
}

/* Chevron svg ikona (pokud se používá background-image) */
body:not(.home) .ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item.megamenu-parent {
    background-image: url("data:image/svg+xml,<svg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M6.6665 8.33341L9.99984 11.6667L13.3332 8.33341' stroke='%23022930' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

#masthead.scrolled .ast-desktop .ast-primary-header-bar .main-header-menu > .menu-item.megamenu-parent {
    background-image: url("data:image/svg+xml,<svg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M6.6665 8.33341L9.99984 11.6667L13.3332 8.33341' stroke='%23022930' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

/* Dropdown toggle span (mobilní chevrony na desktopu) */
body:not(.home) li.menu-item span.dropdown-menu-toggle {
    background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M8 10L12 14L16 10' stroke='%23022930' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}

#masthead.scrolled li.menu-item span.dropdown-menu-toggle {
    background-image: url("data:image/svg+xml,<svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M8 10L12 14L16 10' stroke='%23022930' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}


/* Mobile: reset fixed pozice */
@media (max-width: 921px) {
    #masthead {
        position: relative;
    }

    body,
    body.admin-bar {
        padding-top: 0;
    }
}

/* Pojistka pro subpage hero / breadcrumb sekce: pokud má negativní margin-top
   (kvůli homepage transparent overlap stylu), na podstránkách ho resetuj —
   jinak se zasouvá pod fixed nav. */
body:not(.home) .ast-page-header,
body:not(.home) .ast-archive-description,
body:not(.home) main#main > article:first-child,
body:not(.home) main#main > .entry-content:first-child {
    margin-top: 0;
}
