/* =========================================
   PATIČKA A BANNERY (PDZ1_footer_V9.css)
   Upgradováno pro plnou responzivitu (Global V73)

   V9b: Mikro-rozestupy bannerů i credits řádku převedeny na sdílenou
        clamp() škálu --pdz-fb-sp-* (:root). Desktop beze změny (clamp MAX
        = původní px), mobil kompaktnější. Ladí se z jednoho místa.

   V9: VNITŘNÍ OBSAH BANNERŮ (.pdz-fb*) PŘESUNUT SEM Z ADMINU.
       Dříve měl každý ze 4 bannerů v administraci vlastní inline
       <style> blok (sloupce 2–4 skoro identické = trojí údržba).
       Vše je nově v sekci 6 tohoto souboru (footer CSS je připojené
       <link>em na všech stránkách). Bannery v adminu drží JEN HTML.
       Sloučeny shodné selektory (fb2/fb3/fb4) a vynechán mrtvý kód
       text-decoration:none (globál ho už vynucuje na
       .footer-banners a:not(.btn)...). Vzhled 1:1, jen jedno místo.

   V8: OPRAVA ROZDÍLNÉ ŠÍŘKY BANNERŮ TITULKA vs. PODSTRÁNKY.
       Příčina (ne CSS, ale DOM): na titulce Shoptet renderuje blok
       .footer-banners.banner-wrapper UVNITŘ #content-wrapper
       (max-width 1600 + padding clamp 20–160) -> banner byl stažený na
       šířku obsahu. Na podstránkách ho JS vkládá jako sourozence #footer,
       tedy MIMO #content-wrapper -> banner se roztáhl přes celou patičku.
       Stejné pravidlo, jiný rodič = jiná šířka.

       Řešení: banner-wrapper je nově NEZÁVISLÝ NA RODIČI. Místo
       max-width + margin:auto jede full-bleed přes 100vw s breakout
       margin (calc(50% - 50vw)) a obsah (sloupce) drží na stropu 1300
       přes boční padding max(pad, (100vw - 1300)/2). Výsledek je na
       titulce i podstránce PIXEL-IDENTICKÝ a lícuje s headerem i spodní
       lištou patičky. Spodní lišta (#footer .footer-bottom) zůstává na
       max-width 1300 + margin:auto (je uvnitř #footer, celošířkového).

   V7: Šířka patičky i patičkových bannerů sjednocena 1:1 s HEADEREM
       (#header .container, max-width 1300px). Místo širokých globálních
       tokenů (--content-max-width 1600 / --content-padding-x clamp 20–160)
       jedou nově patičkové tokeny --pdz-footer-max-width a
       --pdz-footer-pad-x, které kopírují --pdz-header-pad-x z headeru.
       Dorovnán i breakpoint 991–1250px (header tam jede 100 % + 20px).
       Vše plynulé přes clamp() => nezávislé na hustotě pixelů.
========================================= */

/* =========================================
   0. TOKENY ŠÍŘKY PATIČKY (SHODA S HEADEREM)
========================================= */
:root {
    /* Strop šířky obsahu = stejný jako #header .container */
    --pdz-footer-max-width: 1300px;
    /* Boční odsazení = přebíráme přímo z headeru (fallback = stejná hodnota) */
    --pdz-footer-pad-x: var(--pdz-header-pad-x, clamp(16px, 3.5vw, 50px));

    /* === MIKRO-ROZESTUPY (bannery + spodní lišta) ===
       Plynulé přes clamp(), laditelné z jednoho místa.
       clamp MAX = původní px (desktop beze změny), MIN = kompaktnější mobil. */
    --pdz-fb-sp-6:  clamp(5px,  0.6vw, 6px);   /* odskok mezi odkazy */
    --pdz-fb-sp-8:  clamp(6px,  0.8vw, 8px);   /* subtitle, drobné gapy */
    --pdz-fb-sp-10: clamp(8px,  0.9vw, 10px);  /* label-bottom, podpis gap */
    --pdz-fb-sp-12: clamp(9px,  1.1vw, 12px);  /* kontaktní řádek, ikona */
    --pdz-fb-sp-18: clamp(12px, 1.6vw, 18px);  /* gap v credits řádku */
    --pdz-fb-sp-20: clamp(14px, 1.7vw, 20px);  /* margin nadpisů, padding wrapů */
    --pdz-fb-sp-30: clamp(20px, 2.4vw, 30px);  /* horní odskok label, padding wrapů */
}

/* =========================================
   1. ZÁKLADNÍ NASTAVENÍ PATIČKY
========================================= */
#footer {
    background: linear-gradient(to right, #3098C2, #1D6289) !important;
    border: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

#footer .footer-bottom {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Skrytí natvrdo zadrátovaného newsletteru v patičce */
.footer-newsletter,
#footer .footer-newsletter,
.container.footer-newsletter,
#footer > .container.footer-newsletter {
    display: none !important;
}

/* =========================================
   2. PATIČKOVÉ BANNERY — STRUKTURÁLNÍ LAYOUT
   ---------------------------------------------------------------
   NEZÁVISLOST NA RODIČI: na titulce je blok uvnitř #content-wrapper
   (max-width 1600 + padding clamp 20–160), na podstránkách je mimo něj.
   Aby vykreslil VŠUDE STEJNĚ a na šířku headeru, jdeme full-bleed:
   - šířka = 100vw, breakout přes margin calc(50% - 50vw) ruší vliv
     rodičovského paddingu i max-width (funguje v obou kontextech),
   - obsah (sloupce) lícuje s obsahem headeru: header má padding UVNITŘ
     stropu 1300, takže jeho obsah je 1300 − 2×padding. Stejně tu boční
     padding = pad_headeru + max(0, (100vw − 1300)/2) → sloupce sednou
     přesně na logo/menu headeru i na střed obsahu na 4K.
========================================= */
.footer-banners.banner-wrapper {
    width: 100vw !important;
    max-width: 100vw !important;
    /* Breakout na střed viewportu nezávisle na rodiči */
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    /* Obsah lícuje s obsahem headeru (1300 − 2×padding, na střed) */
    padding-left:  calc(var(--pdz-footer-pad-x) + max(0px, (100vw - var(--pdz-footer-max-width)) / 2)) !important;
    padding-right: calc(var(--pdz-footer-pad-x) + max(0px, (100vw - var(--pdz-footer-max-width)) / 2)) !important;
    box-sizing: border-box !important;
}

/* DESKTOP > 1250px: 4 sloupce */
@media (min-width: 1251px) {
    .footer-banners.banner-wrapper > .footer-banner {
        flex: 0 0 25% !important;
        max-width: 25% !important;
        width: 25% !important;
    }
}

/* TABLET 991-1250px: 2×2 grid */
@media (min-width: 991px) and (max-width: 1250px) {
    .footer-banners.banner-wrapper > .footer-banner {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        width: 50% !important;
    }
}

/* MOBIL < 991px: 1 sloupec */
@media (max-width: 990px) {
    .footer-banners.banner-wrapper > .footer-banner {
        flex: 0 0 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
}

/* =========================================
   3. SPOJENÍ PATIČKOVÝCH BANNERŮ S PATIČKOU (MODRÉ POZADÍ)
========================================= */
.index-content-wrapper {
    background: transparent !important; 
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.footer-banners.banner-wrapper {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
}

.homepage-texts-wrapper + .footer-banners.banner-wrapper,
.footer-banners.banner-wrapper {
    position: relative;
}

.footer-banners.banner-wrapper::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 100%;
    background: linear-gradient(to right, #3098C2, #1D6289) !important;
    z-index: -1; 
}

/* =========================================
   4. SPOJENÍ A ZAROVNÁNÍ BANNERŮ S PATIČKOU
========================================= */
#footer,
#footer .footer-bottom,
.footer-banners.banner-wrapper {
    border: none !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* Spodní lišta patičky zůstává klasicky vycentrovaná na 1300 (= header).
   Je uvnitř #footer (celošířkový), takže max-width + margin:auto stačí —
   full-bleed jako u bannerů tu není potřeba. */
#footer .footer-bottom {
    max-width: var(--pdz-footer-max-width) !important; /* Shoda s šířkou headeru (1300px) */
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: var(--pdz-footer-pad-x) !important;  /* Fluidní odsazení převzaté z headeru */
    padding-right: var(--pdz-footer-pad-x) !important;
    box-sizing: border-box !important;
}

.footer-banners.banner-wrapper {
    /* Horní odsazení reaguje na globální vzdušnost webu (polovina section paddingu) */
    padding-top: calc(var(--section-padding-y) / 2) !important; 
    padding-bottom: 0 !important; 
}

/* DOROVNÁNÍ S HEADEREM V PÁSMU 991–1250px:
   Header v tomto rozsahu opouští strop 1300px a jede přes celou šířku
   s pevným odsazením 20px (viz #header div.container.navigation-wrapper).
   - Bannery: ponecháváme full-bleed (100vw) z výchozího pravidla a jen
     přepíšeme boční padding na 20px (sloupce pak lícují s logem/ikonami).
   - Spodní lišta: max-width 100 % + padding 20px. */
@media (min-width: 991px) and (max-width: 1250px) {
    .footer-banners.banner-wrapper {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    #footer .footer-bottom {
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* Použití fluidního odsazení výše umožnilo kompletně smazat staré @media (min-width: 1251px) a @media (max-width: 1250px), které pouze měnily paddingy ze 50px na 20px. */

/* =========================================
   5. SPODNÍ LIŠTA PATIČKY (COPYRIGHT A SHOPTET)
========================================= */
#footer .footer-bottom {
    border-top: none !important; 
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: var(--template-font) !important;
    font-size: 0.85em !important;
    display: flex !important;
    flex-direction: column !important; 
    gap: 0 !important; 
}

/* --- HORNÍ ŘÁDEK: Právní odkazy (Vycentrováno) --- */
.pdz-footer-legal-row {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    /* Plynulá mezera mezi odkazy: mobil 18px -> desktop 40px */
    gap: clamp(18px, 3vw, 40px) !important; 
    width: 100% !important;
    /* Plynulé vertikální odsazení linek */
    padding-top: clamp(24px, 2.5vw, 32px) !important; 
    padding-bottom: clamp(24px, 2.5vw, 32px) !important; 
    border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important; 
}

/* Odkazy a cookies nastavení */
#footer .pdz-footer-legal-row a,
#footer .pdz-footer-legal-row .cookies-settings {
    color: rgba(255, 255, 255, 0.85) !important;
    text-decoration: none !important; 
    font-weight: 400 !important; 
    font-size: 1.12em !important; 
    transition: color 0.2s ease, transform 0.2s ease !important;
}

#footer .pdz-footer-legal-row a:hover,
#footer .pdz-footer-legal-row .cookies-settings:hover {
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateY(-2px); 
}

/* --- SPODNÍ ŘÁDEK: Podpis a Copyright --- */
.pdz-footer-credits-row {
    display: flex !important;
    justify-content: space-between !important; 
    align-items: center !important;
    flex-wrap: wrap !important;
    width: 100% !important;
    /* Plynulé vertikální odsazení spodku */
    padding-top: clamp(20px, 2vw, 25px) !important;
    padding-bottom: clamp(24px, 2.5vw, 30px) !important;
    gap: var(--pdz-fb-sp-18) !important;
}

.pdz-footer-credits-row .copyright {
    display: flex !important;
    align-items: center !important;
    gap: var(--pdz-fb-sp-8) !important;
    color: rgba(255, 255, 255, 0.7) !important;
}

.pdz-footer-credits-row .copyright strong {
    color: #ffffff !important;
    font-weight: 600 !important;
}

/* Podpis Start Eshopu */
.pdz-footer-credits-row #signature {
    display: flex !important;
    align-items: center !important;
    gap: var(--pdz-fb-sp-10) !important;
    margin: 0 !important;
    padding: 0 !important;
}

.pdz-footer-credits-row #signature .title {
    color: rgba(255, 255, 255, 0.7) !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

.pdz-footer-credits-row #signature:hover .title {
    color: #ffffff !important;
}

#footer .footer-bottom #signature img {
    width: 90px !important; 
    height: auto !important; 
    filter: brightness(0) invert(1) opacity(0.7) !important;
    transition: all 0.2s ease !important;
}

#footer .footer-bottom #signature:hover img {
    filter: brightness(0) invert(1) opacity(1) !important;
}

/* --- MOBILNÍ ZOBRAZENÍ --- */
@media (max-width: 990px) {
    .pdz-footer-legal-row {
        flex-direction: column !important;
        /* Hodnoty gap a padding odstraněny, plynule je řídí clamp() výše */
    }
    .pdz-footer-credits-row {
        flex-direction: column-reverse !important; 
        justify-content: center !important;
        text-align: center !important;
        /* Hodnoty paddingu odstraněny, plynule je řídí clamp() výše */
    }
}

/* =========================================
   6. FOOTER BANNERY — VNITŘNÍ OBSAH (.pdz-fb*)
   ---------------------------------------------------------------
   Přesunuto z inline <style> bloků v administraci (V9). Bannery
   v adminu teď drží JEN HTML. Velikosti písma jedou z tokenů
   --pdz-fb-fs-* níže. text-decoration:none se tu NEŘEŠÍ — globální
   CSS ho už vynucuje na .footer-banners a:not(.btn):... (vyšší
   specificita + !important).
========================================= */

/* Velikosti písma footeru – jedno místo k ladění */
.footer-banners {
    --pdz-fb-fs-head:  1.375rem;   /* nadpisy sloupců        = jako tělo webu */
    --pdz-fb-fs-link:  1.375rem;   /* odkazy + kontakt       = jako tělo webu */
    --pdz-fb-fs-addr:  1.375rem;   /* adresa                 = jako tělo webu */
    --pdz-fb-fs-small: 1.1rem;     /* podtitul/badge/label   = jemnější doplněk */
}

/* --- SLOUPEC 1: LOGO + CLAIM --- */
.pdz-fb1-wrap {
    background-color: transparent !important;
    padding: 0 0 var(--pdz-fb-sp-30) 0 !important;
    max-width: 400px;
    text-align: left;
    font-family: var(--template-headings-font, 'Montserrat', sans-serif);
}

.pdz-fb1-logo-wrap {
    margin-bottom: clamp(18px, 2vw, 25px);
}

.pdz-fb1-logo-link {
    display: inline-block;
    border: none !important;
    outline: none !important;
}

.pdz-fb1-logo {
    display: block;
    width: clamp(150px, 12vw, 185px);
    aspect-ratio: 180 / 55;   /* drží poměr loga, výšku dopočítá */
    height: auto;
    background-color: #ffffff;
    -webkit-mask-image: url('../../Grafika/PDZ1_logo_bile.svg');
    mask-image: url('../../Grafika/PDZ1_logo_bile.svg');
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: left center;
    mask-position: left center;
    -webkit-mask-size: contain;
    mask-size: contain;
    transition: opacity 0.2s ease;
}

.pdz-fb1-logo:hover {
    opacity: 0.85;
}

.pdz-fb1-subtitle {
    font-size: var(--pdz-fb-fs-small) !important;
    color: rgba(255, 255, 255, 0.7) !important;
    margin: var(--pdz-fb-sp-8) 0 0 0 !important;
    font-weight: 500 !important;
}

.pdz-fb1-divider {
    width: 100%;
    max-width: clamp(150px, 12vw, 185px); /* šířka linky = šířka loga */
    height: 1px;
    background-color: rgba(255,255,255,0.25);
    margin-bottom: clamp(22px, 2.4vw, 30px);
}

.pdz-fb1-badge {
    font-size: var(--pdz-fb-fs-small) !important;
    color: rgba(255,255,255,0.8) !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 !important;
}

/* --- SLOUPCE 2–4: SPOLEČNÝ ZÁKLAD (wrap / nadpis / odkazy) --- */
.pdz-fb2-wrap,
.pdz-fb3-wrap,
.pdz-fb4-wrap {
    background-color: transparent !important;
    font-family: var(--template-headings-font, 'Montserrat', sans-serif);
    padding: var(--pdz-fb-sp-20) 0 !important;
    margin-left: 0 !important;
    text-align: center !important;
}

.pdz-fb2-heading,
.pdz-fb3-heading,
.pdz-fb4-heading {
    color: #ffffff !important;
    font-size: var(--pdz-fb-fs-head) !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 1 !important;
    margin: 0 0 var(--pdz-fb-sp-20) 0 !important;
    text-align: center;
}

.pdz-fb2-link,
.pdz-fb3-link {
    display: block !important;
    font-size: var(--pdz-fb-fs-link) !important;
    line-height: 1.8 !important;
    margin-bottom: var(--pdz-fb-sp-6) !important;
    color: rgba(255,255,255,0.85) !important;
    transition: color 0.2s, transform 0.2s;
    text-align: center;
}

.pdz-fb2-link:hover,
.pdz-fb3-link:hover {
    color: #ffffff !important;
    transform: translateX(3px);
}

/* --- SLOUPEC 4: KONTAKTNÍ ŘÁDKY + ADRESA --- */
.pdz-fb4-row {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: var(--pdz-fb-sp-12) !important;
}

.pdz-fb4-row svg {
    margin-right: var(--pdz-fb-sp-12) !important;
    flex-shrink: 0;
    stroke: #ffffff;
    stroke-width: 1.5px !important;
}

.pdz-fb4-text {
    display: block !important;
    color: #ffffff !important;
    font-size: var(--pdz-fb-fs-link) !important;
    font-weight: 400 !important;
    text-align: left;
    transition: opacity 0.2s;
}

.pdz-fb4-row:hover .pdz-fb4-text {
    opacity: 0.85;
}

.pdz-fb4-label {
    color: rgba(255,255,255,0.7) !important;
    font-size: var(--pdz-fb-fs-small) !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    display: block;
    margin: var(--pdz-fb-sp-30) 0 var(--pdz-fb-sp-10) 0 !important;
    font-weight: 400 !important;
    text-align: center;
}

.pdz-fb4-address {
    font-size: var(--pdz-fb-fs-addr) !important;
    color: rgba(255,255,255,0.9) !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
    text-align: center;
}

/* --- RESPONZIVITA SLOUPCŮ --- */

/* TABLET 991–1250px: sloupec 1 do levého zarovnání (2×2 grid) */
@media (min-width: 991px) and (max-width: 1250px) {
    .pdz-fb1-wrap {
        padding: var(--pdz-fb-sp-10) var(--pdz-fb-sp-20) var(--pdz-fb-sp-20) var(--pdz-fb-sp-20) !important;
        text-align: left !important;
        margin-left: 0 !important;
        max-width: 100% !important;
    }
    .pdz-fb1-logo {
        margin: 0 !important;
        -webkit-mask-position: left center !important;
        mask-position: left center !important;
    }
    .pdz-fb1-subtitle,
    .pdz-fb1-badge {
        text-align: left !important;
    }
}

/* OD 991px: levé zarovnání sloupců 2–4 */
@media (min-width: 991px) {
    .pdz-fb2-wrap,
    .pdz-fb3-wrap,
    .pdz-fb4-wrap {
        text-align: left !important;
        padding: var(--pdz-fb-sp-30) 0 var(--pdz-fb-sp-30) 0 !important;
    }
    .pdz-fb2-heading,
    .pdz-fb3-heading,
    .pdz-fb4-heading {
        text-align: left;
    }
    .pdz-fb2-link,
    .pdz-fb3-link {
        text-align: left;
    }
    .pdz-fb4-row {
        justify-content: flex-start !important;
    }
    .pdz-fb4-label,
    .pdz-fb4-address {
        text-align: left;
    }
}

/* NAD 1250px: odsazení sloupců 2–4 od loga */
@media (min-width: 1251px) {
    .pdz-fb2-wrap,
    .pdz-fb3-wrap,
    .pdz-fb4-wrap {
        margin-left: clamp(30px, 4vw, 60px) !important;
        padding: 0 0 var(--pdz-fb-sp-30) 0 !important;
    }
}

/* MOBIL ≤990px: sloupec 1 na střed */
@media (max-width: 990px) {
    .pdz-fb1-wrap {
        max-width: 100% !important;
        text-align: center !important;
        margin: 0 auto !important;
        padding: var(--pdz-fb-sp-20) 0 !important;
    }
    .pdz-fb1-logo {
        margin: 0 auto !important;
        -webkit-mask-position: center !important;
        mask-position: center !important;
    }
    .pdz-fb1-subtitle,
    .pdz-fb1-badge {
        text-align: center !important;
    }
    .pdz-fb1-divider {
        margin: 0 auto clamp(22px, 2.4vw, 30px) auto !important;
    }
}