@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&family=Montserrat:wght@400;500;600;700&display=swap');

:root {

    --template-headings-font: 'Montserrat', sans-serif;
    --template-font: 'Be Vietnam Pro', system-ui, -apple-system, 'Segoe UI', sans-serif;

    /* === GLOBÁLNÍ ŠÍŘKA OBSAHU === */
    --content-max-width: 1600px; /* širší kontejner — řeší úzký pruh na 3K monitoru */

    /* === DYNAMICKÉ ROZESTUPY (clamp = jeden řádek pro mobil i 3K) ===
       Boční odsazení obsahu: min 20px (mobil) → plynule (4vw) → max 120px.
       Reaguje na šířku OKNA, ne na velikost písma → bezpečné při zoomu textu. */
    --content-padding-x: clamp(20px, 10vw, 160px);

;

    /* Vertikální odsazení sekcí: min 40px (mobil) → plynule (5vw) → max 120px (3K).
       Web se na velkých displejích „provzdušní", na mobilu zůstane kompaktní.
       Žádné samostatné mobilní proměnné ani media queries už nejsou potřeba. */
	--section-padding-y: clamp(40px, 5vw, 120px);

    /* === GLOBÁLNÍ ZAOBLENÍ (Border Radius) ===
       Pozn.: rem zde NEroste s šířkou okna (to dělá jen vw) — roste se základní
       velikostí písma. Pro zaoblení je to ale přesně to, co chceme: jedna
       konzistentní škála 8/16/24px napříč webem. */
    --radius-sm: 0.5rem;   /* ~8px: malé prvky, štítky, formulářová pole */
    --radius-md: 1rem;     /* ~16px: dlaždice, produktové karty, běžné obrázky */
    --radius-lg: 1.5rem;   /* ~24px: velké bloky, Hero obrázky, modály */
}

/* =========================================
   2. SCROLL TO TOP TLAČÍTKO (UNIVERZÁLNÍ DESIGN)
========================================= */
.pdz-scroll-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 50px;
    height: 50px;
    background-color: #ffffff !important; /* Bílý kruh */
    color: #1A6B9B !important;            /* Modrá šipka */
    border: 2px solid #1A6B9B !important; /* Modrý border */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 9999; 
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    box-shadow: 0 4px 15px rgba(26, 107, 155, 0.2);
}

/* Třída pro zobrazení tlačítka */
.pdz-scroll-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Efekt při najetí myší (Inverze do firemní modré) */
.pdz-scroll-top:hover {
    background-color: #1A6B9B !important; 
    color: #ffffff !important;
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(26, 107, 155, 0.4);
}

/* Zmenšení na mobilech */
@media (max-width: 768px) {
    .pdz-scroll-top {
        bottom: 20px;
        right: 20px;
        width: 44px;
        height: 44px;
    }
}

/* =========================================
   3. GLOBÁLNÍ POZADÍ A HLAVNÍ OBÁLKY
========================================= */

/* Globální modrý gradient přes celý displej */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -999;
    pointer-events: none;
    background: radial-gradient(ellipse at center, #3098C2 0%, #1A6B9B 100%) !important;
}

/* Reset pozadí a stínů u nadřazených prvků šablony, aby prosvítal náš gradient */
html,
body,
.overall-wrapper,
#content-wrapper,
.content-wrapper-in,
#content {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

#content-wrapper {
    max-width: var(--content-max-width) !important; 
    margin-left: auto !important; 
    margin-right: auto !important;
    float: none !important;
    padding-left: var(--content-padding-x) !important;
    padding-right: var(--content-padding-x) !important;
}

/* Boční odsazení #content-wrapper řeší clamp() v --content-padding-x,
   samostatná mobilní media query proto není potřeba. */

/* Reset vnitřních okrajů pro úvodní stránku */
.index-content-wrapper,
.homepage-texts-wrapper {
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* =========================================
   4. OBSAHOVÁ TLAČÍTKA A BLOKY (Detail produktu)
========================================= */

/* Stylování tlačítka "Poptat" vedle tlačítka do košíku */
.poptat-projekt-btn {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
    font-weight: bold;
    transition: all 0.2s;
    }

.poptat-projekt-btn:hover {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Zajištění, aby tlačítka "Do košíku" a "Poptat" stála úhledně vedle sebe */
.add-to-cart, .p-tools form {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

/* =========================================
   5. SKRYTÍ ZÁLOŽEK "AKČNÍ ZBOŽÍ" A "NOVINKY" NA HOMEPAGE
========================================= */
.homepage-tabs-wrapper {
    display: none !important;
}

/* Skrytí drobečkové navigace globálně na blogovém rozcestníku i ve všech podrubrikách článků */
.in-clanky-a-novinky #content-wrapper .breadcrumbs,
.type-posts-listing #content-wrapper .breadcrumbs {
    display: none !important;
}

/* Skrytí vlastních drobečků v celém Klientském centru (/klient/ i podstránky) */
body:has(.client-center-box) .pdz-breadcrumbs {
    display: none !important;
}

/* ============================================================================
   VLASTNÍ DROBEČKY (.pdz-breadcrumbs) — JEDINÝ ZDROJ PRAVDY
   ----------------------------------------------------------------------------
   Nativní drobečky Shoptetu zůstávají v DOM kvůli schema.org, ale jsou sr-only
   (.pdz-bc-native-hidden). Vlastní staví PDZ1_global JS.
 
   DVĚ VARIANTY:
   A) TMAVÉ POZADÍ (výchozí) — bílý text + bílé ikony. Kategorie, e-shop, LP…
   B) BÍLÁ KARTA — .pdz-breadcrumbs--karta (přidává JS) NEBO body.type-post
      / body.type-product. Tmavý text + tmavé ikony.
 
   IKONY: maska + background-color. NEPOUŽÍVAT currentColor — globální
   a{color:#fff!important} a span{color:...!important} ho přebíjejí nahodile.
   Barva ikony se proto nastavuje explicitně a s !important.
   ============================================================================ */
 
/* Nativní necháme v DOM (SEO/schema.org), vizuálně sr-only */
.breadcrumbs.pdz-bc-native-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
 
/* Skrytí vlastních drobečků v Klientském centru */
body:has(.client-center-box) .pdz-breadcrumbs { display: none !important; }
 
/* --- KONTEJNER (varianta A: na tmavém/modrém pozadí) --- */
.pdz-breadcrumbs {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    gap: clamp(6px, 0.5vw, 10px);
    max-width: var(--content-max-width, 1600px);
    margin: clamp(16px, 2.5vw, 32px) auto clamp(10px, 1.2vw, 16px);
    font-size: clamp(1.1rem, 1.5vw, 1.25rem);
    line-height: 1.2;
    color: #ffffff;
}
 
/* Texty — zopakovaný :not() řetězec z globálu kvůli specificitě (0,3,1) */
.pdz-breadcrumbs a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top),
.pdz-breadcrumbs .pdz-bc-current {
    color: #ffffff !important;
    text-decoration: none !important;
}
.pdz-breadcrumbs .pdz-bc-link:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top) {
    text-decoration: underline !important;
    text-underline-offset: 3px;
}
.pdz-breadcrumbs .pdz-bc-link:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover {
    color: rgba(255, 255, 255, 0.8) !important;
}
.pdz-breadcrumbs .pdz-bc-current { font-weight: 600 !important; }
 
/* --- IKONY (společná geometrie) --------------------------------------------
   Ikony jsou zapečené jako data URI (percent-encoded). Původní SVG na FTP
   nemá width/height (jen viewBox) → jako mask-image s mask-size: contain
   vycházela maska prázdná a element se nevykreslil vůbec. Tvary jsou 1:1
   tvoje (Homesmall_icon.svg / Arrowsmall_icon.svg), doplněné o rozměr a fill.
   --------------------------------------------------------------------------- */
.pdz-breadcrumbs .pdz-bc-home,
.pdz-breadcrumbs .pdz-bc-sep {
    display: inline-block !important;
    flex: 0 0 auto !important;
    line-height: 0 !important;
    background: none !important;
    background-color: #ffffff !important;     /* = BARVA IKONY (na modrém pozadí) */
    -webkit-mask-repeat: no-repeat !important;
            mask-repeat: no-repeat !important;
    -webkit-mask-position: center !important;
            mask-position: center !important;
    -webkit-mask-size: contain !important;
            mask-size: contain !important;
    transition: background-color 0.2s ease;
}
 
.pdz-breadcrumbs .pdz-bc-home {
    width: clamp(18px, 1.4vw, 20px) !important;
    height: clamp(18px, 1.4vw, 20px) !important;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='450'%20height='450'%20viewBox='0%200%20450%20450'%3E%3Cpath%20fill='black'%20d='M420.35,136.31L249.37,8.08c-14.35-10.77-34.4-10.76-48.75,0L29.65,136.31c-14.15,10.61-22.6,27.5-22.6,45.19v227.88c0,22.39,18.22,40.62,40.63,40.62h88.16c22.4,0,40.63-18.22,40.63-40.62v-93.2c0-3.84,3.13-6.97,6.97-6.97h83.14c3.84,0,6.97,3.13,6.97,6.97v93.2c0,22.39,18.22,40.62,40.62,40.62h16.68c15.1,0,29.29-5.88,39.96-16.56l55.61-55.64c10.66-10.67,16.53-24.85,16.53-39.93v-156.36c0-17.69-8.45-34.58-22.6-45.19ZM330.84,416.36h-16.68c-3.84,0-6.97-3.13-6.97-6.97v-93.2c0-22.39-18.22-40.62-40.62-40.62h-83.14c-22.4,0-40.63,18.22-40.63,40.62v93.2c0,3.84-3.13,6.97-6.97,6.97H47.68c-3.84,0-6.97-3.13-6.97-6.97v-227.88c0-7.16,3.41-13.98,9.14-18.28L220.82,34.99c2.46-1.84,5.9-1.84,8.37,0l170.97,128.22c5.73,4.29,9.15,11.12,9.15,18.28v156.36c0,6.09-2.38,11.83-6.69,16.15l-55.6,55.64c-4.32,4.32-10.05,6.7-16.17,6.7Z'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='450'%20height='450'%20viewBox='0%200%20450%20450'%3E%3Cpath%20fill='black'%20d='M420.35,136.31L249.37,8.08c-14.35-10.77-34.4-10.76-48.75,0L29.65,136.31c-14.15,10.61-22.6,27.5-22.6,45.19v227.88c0,22.39,18.22,40.62,40.63,40.62h88.16c22.4,0,40.63-18.22,40.63-40.62v-93.2c0-3.84,3.13-6.97,6.97-6.97h83.14c3.84,0,6.97,3.13,6.97,6.97v93.2c0,22.39,18.22,40.62,40.62,40.62h16.68c15.1,0,29.29-5.88,39.96-16.56l55.61-55.64c10.66-10.67,16.53-24.85,16.53-39.93v-156.36c0-17.69-8.45-34.58-22.6-45.19ZM330.84,416.36h-16.68c-3.84,0-6.97-3.13-6.97-6.97v-93.2c0-22.39-18.22-40.62-40.62-40.62h-83.14c-22.4,0-40.63,18.22-40.63,40.62v93.2c0,3.84-3.13,6.97-6.97,6.97H47.68c-3.84,0-6.97-3.13-6.97-6.97v-227.88c0-7.16,3.41-13.98,9.14-18.28L220.82,34.99c2.46-1.84,5.9-1.84,8.37,0l170.97,128.22c5.73,4.29,9.15,11.12,9.15,18.28v156.36c0,6.09-2.38,11.83-6.69,16.15l-55.6,55.64c-4.32,4.32-10.05,6.7-16.17,6.7Z'/%3E%3C/svg%3E") !important;
}
 
.pdz-breadcrumbs .pdz-bc-sep {
    width: clamp(9px, 0.8vw, 11px) !important;
    height: clamp(9px, 0.8vw, 11px) !important;
    opacity: 0.75;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='450'%20height='450'%20viewBox='0%200%20450%20450'%3E%3Cpath%20fill='black'%20d='M327.69,236.04l-179.56,207.62-.11.13c-.24.3-.49.58-.75.86-3.05,3.29-7.22,5.19-11.71,5.34-4.49.15-8.76-1.45-12.04-4.5-6.79-6.32-7.16-16.98-.84-23.76l170.09-196.73L122.82,28.42l-.14-.15c-.26-.28-.5-.56-.75-.86-5.84-7.2-4.75-17.81,2.45-23.65C127.48,1.23,131.23,0,134.95,0c4.9,0,9.75,2.12,13.07,6.2l179.69,207.76c1.18,1.35,2.11,2.86,2.8,4.47.69,1.61,1.12,3.33,1.27,5.13.38,4.51-1.1,9.05-4.09,12.48Z'/%3E%3C/svg%3E") !important;
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='450'%20height='450'%20viewBox='0%200%20450%20450'%3E%3Cpath%20fill='black'%20d='M327.69,236.04l-179.56,207.62-.11.13c-.24.3-.49.58-.75.86-3.05,3.29-7.22,5.19-11.71,5.34-4.49.15-8.76-1.45-12.04-4.5-6.79-6.32-7.16-16.98-.84-23.76l170.09-196.73L122.82,28.42l-.14-.15c-.26-.28-.5-.56-.75-.86-5.84-7.2-4.75-17.81,2.45-23.65C127.48,1.23,131.23,0,134.95,0c4.9,0,9.75,2.12,13.07,6.2l179.69,207.76c1.18,1.35,2.11,2.86,2.8,4.47.69,1.61,1.12,3.33,1.27,5.13.38,4.51-1.1,9.05-4.09,12.48Z'/%3E%3C/svg%3E") !important;
}
 
.pdz-breadcrumbs .pdz-bc-home:hover {
    background-color: rgba(255, 255, 255, 0.8) !important;
}
 
 
/* ============================================================================
   VARIANTA B — BÍLÁ KARTA (detail článku, detail produktu)
   Přidej třídu .pdz-breadcrumbs--karta, nebo se aplikuje dle body třídy.
   ============================================================================ */
body.type-post .pdz-breadcrumbs,
body.type-product .pdz-breadcrumbs,
.pdz-breadcrumbs.pdz-breadcrumbs--karta {
    padding: 13px clamp(18px, 1.8vw, 26px);
    background: #ffffff;
    border-radius: var(--radius-md, 1rem);
    box-shadow: 0 10px 30px rgba(17, 75, 110, 0.10);
    box-sizing: border-box;
}
body.type-post .pdz-breadcrumbs a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top),
body.type-post .pdz-breadcrumbs .pdz-bc-current,
body.type-product .pdz-breadcrumbs a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top),
body.type-product .pdz-breadcrumbs .pdz-bc-current,
.pdz-breadcrumbs.pdz-breadcrumbs--karta a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top),
.pdz-breadcrumbs.pdz-breadcrumbs--karta .pdz-bc-current {
    color: #1A1A1A !important;
}
body.type-post .pdz-breadcrumbs .pdz-bc-link:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover,
body.type-product .pdz-breadcrumbs .pdz-bc-link:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover,
.pdz-breadcrumbs.pdz-breadcrumbs--karta .pdz-bc-link:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover {
    color: #1A6B9B !important;
}
/* Ikony na bílé kartě = tmavé */
body.type-post .pdz-breadcrumbs .pdz-bc-home,
body.type-post .pdz-breadcrumbs .pdz-bc-sep,
body.type-product .pdz-breadcrumbs .pdz-bc-home,
body.type-product .pdz-breadcrumbs .pdz-bc-sep,
.pdz-breadcrumbs.pdz-breadcrumbs--karta .pdz-bc-home,
.pdz-breadcrumbs.pdz-breadcrumbs--karta .pdz-bc-sep {
    background-color: #1A1A1A !important;
}
body.type-post .pdz-breadcrumbs .pdz-bc-home:hover,
body.type-product .pdz-breadcrumbs .pdz-bc-home:hover,
.pdz-breadcrumbs.pdz-breadcrumbs--karta .pdz-bc-home:hover {
    background-color: #1A6B9B !important;
}

/* =========================================
   6. GLOBÁLNÍ TYPOGRAFIE (Zvětšené hodnoty)
========================================= */

h1 {
    font-size: clamp(2.5rem, 6vw, 3.5rem) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-bottom: 0.8em !important;
}

h2 {
    font-size: clamp(2.1rem, 5vw, 2.8rem) !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 0.7em !important;
}

h3 {
    font-size: clamp(1.6rem, 4vw, 2.1rem) !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 0.6em !important;
}

h4 {
    font-size: clamp(1.3rem, 3vw, 1.6rem) !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 0.5em !important;
}

h5 {
    font-size: clamp(1.25rem, 2vw, 1.35rem) !important; /* Upraveno z 1.1rem */;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    margin-bottom: 0.5em !important;
}

/* Z původního "p {" udělej toto: */
#content p, p {
    font-size: 1.375rem !important; /* ~22px – o něco větší tělo textu */
    line-height: 1.65 !important;   /* o chlup vyšší řádkování k větší velikosti */
    font-weight: 400 !important;    /* nižší váha jen pro odstavce */
    margin-bottom: 1em !important;
    color: rgba(255, 255, 255, 0.9);
}
/* Seznamy: stejná velikost jako odstavce (globál je dřív opomněl) */
#content li {
    font-size: 1.375rem !important;
	line-height: 1.6 !important;
}
/* p má vlastní váhu 400 výše; seznamy a spany držíme na 500 kvůli
   inline font-weight:400, který vkládá Shoptet editor */
#content li,
#content span {
    font-weight: 500 !important;
}
/* Tučné popisky a zvýraznění zůstávají nejvýraznější */
#content b,
#content strong {
    font-weight: 700 !important;
}

/* =========================================
   7. GLOBÁLNÍ TLAČÍTKA A TYPOGRAFIE (Dle barevného schématu)
========================================= */

/* 1. Sjednocení fontu, velikosti a tvaru pro VŠECHNA tlačítka */
.btn, 
.pdz-hero-btn, 
.poptat-projekt-btn,
.pdz-shoptet-form-wrapper button,
#header .navigation-buttons button {
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    font-size: clamp(1.1rem, 1.02rem + 0.35vw, 1.35rem) !important;
    letter-spacing: 0.5px !important;
    border-radius: 999px !important;
    padding: clamp(10px, 0.5rem + 0.35vw, 13px) clamp(18px, 0.9rem + 1vw, 28px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    text-decoration: none !important;
}

/* 2. BAREVNÉ VARIANTY Z NÁVRHU */

/* A) Základní - Vyplněné (Tmavě modré) */
.btn-blue-filled {
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    border: 2px solid #1A6B9B !important;
    transition: all 0.3s ease !important;
}
.btn-blue-filled:hover {
    background-color: #14567d !important; /* Tmavší modrá při najetí */
    border-color: #14567d !important;
    transform: translateY(-2px);
    color: #FFFFFF !important;
}

/* B) Základní - Obrysové (Tmavě modré) */
.btn-blue-outline {
    background-color: transparent !important;
    color: #1A6B9B !important;
    border: 2px solid #1A6B9B !important;
    transition: all 0.3s ease !important;
}
.btn-blue-outline:hover {
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    transform: translateY(-2px);
}

/* C) Konverzní - Vyplněné (Zelené) */
.btn-green-filled {
    background-color: #007A25 !important;
    color: #FFFFFF !important;
    border: 2px solid #007A25 !important;
    transition: all 0.3s ease !important;
}
.btn-green-filled:hover {
    background-color: #005f1d !important; /* Tmavší zelená při najetí */
    border-color: #005f1d !important;
    transform: translateY(-2px);
    color: #FFFFFF !important;
}

/* D) Konverzní - Obrysové (Zelené) */
.btn-green-outline {
    background-color: transparent !important;
    color: #007A25 !important;
    border: 2px solid #007A25 !important;
    transition: all 0.3s ease !important;
}
.btn-green-outline:hover {
    background-color: #007A25 !important;
    color: #FFFFFF !important;
    transform: translateY(-2px);
}

/* E) Specifické tlačítko POPTAT v detailu produktu (přebarvení na zelené konverzní) */
.poptat-projekt-btn {
    background-color: #007A25 !important;
    color: #FFFFFF !important;
    border: 2px solid #007A25 !important;
    transition: all 0.3s ease !important;
}
.poptat-projekt-btn:hover {
    background-color: #005f1d !important; /* Tmavší zelená při najetí */
    border-color: #005f1d !important;
    transform: translateY(-2px);
    color: #FFFFFF !important;
}

/* F) Pro tmavé podklady - Vyplněné (Bílé) */
.btn-white-filled {
    background-color: #FFFFFF !important;
    color: #1A1A1A !important; /* Tmavý text pro perfektní čitelnost na bílém podkladu */
    border: 2px solid #FFFFFF !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important; /* Jemný stín pro oddělení od tmavého pozadí */
    transition: all 0.3s ease !important;
}
.btn-white-filled:hover {
    background-color: #f0f0f0 !important; /* Lehce zešedne při najetí */
    border-color: #f0f0f0 !important;
    color: #1A6B9B !important; /* Text se efektně zbarví do vaší firemní tmavší modré */
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2) !important;
}

/* G) Pro tmavé podklady - Obrysové (Bílé) */
.btn-white-outline {
    background-color: transparent !important;
    color: #FFFFFF !important;
    border: 2px solid #FFFFFF !important;
    transition: all 0.3s ease !important;
}
.btn-white-outline:hover {
    background-color: #FFFFFF !important;
    color: #1A6B9B !important; /* Text zmodrá, aby po vyplnění pozadí nezmizel */
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
}

/* =========================================
   8. GLOBÁLNÍ ANIMACE: FADE IN UP
========================================= */

/* Výchozí stav - skryto a posunuto dolů */
.pdz-animate-up {
    opacity: 0;
    transform: translateY(60px);
    transition: opacity 0.8s cubic-bezier(0.25, 1, 0.5, 1), transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);
    /* Přidáme i will-change pro plynulejší renderování v prohlížeči */
    will-change: opacity, transform; 
}

/* Aktivní stav po odscrollování */
.pdz-animate-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Volitelné zpoždění pro kaskádový efekt (např. pro více prvků vedle sebe) */
.pdz-delay-1 { transition-delay: 0.15s; }
.pdz-delay-2 { transition-delay: 0.30s; }
.pdz-delay-3 { transition-delay: 0.45s; }
.pdz-delay-4 { transition-delay: 0.60s; }

/* Reset zpoždění při hoveru, aby interaktivní prvky reagovaly okamžitě */
.pdz-animate-up.is-visible:hover {
    transition-delay: 0s;
}

/* =========================================
   9. GLOBÁLNÍ TYPOGRAFIE (Pro výchozí tmavý podklad)
========================================= */

/* Základní barva textu pro celý web */
body {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Nadpisy čistě bílé pro maximální kontrast + jisté ukotvení na Montserrat.
   (Tělo webu je nově Inter, takže font nadpisů vynucujeme explicitně, aby se
   nikde nepřeklopil na Inter podle motivu.) */
h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important;
    font-family: var(--template-headings-font) !important;
}

/* Odrážky a obálky sladěné s běžným textem */
ul, ol, li, span {
    color: rgba(255, 255, 255, 0.9) !important;
}

/* Textové odkazy (vyloučena tlačítka) */
a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top) {
    color: #ffffff !important;
    text-decoration: underline !important;
}

a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover {
    color: #f0f7fa !important;
}

/* === Vyloučení prvků v hlavičce a patičce z globálního podtrhávání === */

/* Pozor: hlavní pravidlo výše (a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top))
   má specificitu (0,3,1) s !important. Proto v override duplikujeme stejný řetězec :not(),
   abychom se dostali na specificitu (0,4,1) a pravidlo opravdu vyhrálo. */
.navigation-wrapper a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top), 
#navigation a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top), 
.navigation-buttons a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top),
.footer-banners a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top),
.footer-banner a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top) {
    text-decoration: none !important;
}

/* Pojistka i pro :hover stav (stejný princip se specificitou) */
.navigation-wrapper a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover,
.footer-banners a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover,
.footer-banner a:not(.btn):not(.poptat-projekt-btn):not(.pdz-scroll-top):hover {
    text-decoration: none !important;
}

/* =========================================
   10. TYPOGRAFIE PRO SVĚTLÁ POZADÍ (.theme-light)
========================================= */

/* Přidáním třídy "theme-light" k obálce/sekci se vše uvnitř přebarví pro světlý podklad */

.theme-light {
    color: #1A1A1A !important; /* Tmavý základ pro výbornou čitelnost */
}

/* Nadpisy v tmavší firemní modré */
.theme-light h1, .theme-light h2, .theme-light h3, 
.theme-light h4, .theme-light h5, .theme-light h6 {
    color: #1A6B9B !important;
}

/* Odstavce a seznamy v jemnější tmavě šedé, ať nekřičí do očí */
.theme-light p, .theme-light ul, .theme-light ol, 
.theme-light li, .theme-light span {
    color: #333333 !important;
}

/* Odkazy v textu na světlém pozadí */
.theme-light a:not(.btn):not(.poptat-projekt-btn) {
    color: #1A6B9B !important;
    text-decoration: underline !important;
}

.theme-light a:not(.btn):not(.poptat-projekt-btn):hover {
    color: #3098C2 !important; /* Světlejší modrá při najetí */
}


/* =========================================
   11. SPECIÁLNÍ NADPISY S FIREMNÍM GRADIENTEM (.text-gradient)
========================================= */

/* Přidáním třídy "text-gradient" přímo k nadpisu se text vybarví firemním přechodem */

.text-gradient {
    background: linear-gradient(135deg, #3098C2 0%, #1A6B9B 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important; 
    display: inline-block !important; 
}

/* =========================================
   12. GLOBÁLNÍ ODSAZENÍ SEKCÍ (PADDING)
========================================= */

/* Univerzální odsazení nahoře i dole (nejčastější použití) */
.pdz-section-padding {
    padding-top: var(--section-padding-y) !important;
    padding-bottom: var(--section-padding-y) !important;
}

/* Odsazení pouze nahoře */
.pdz-padding-top {
    padding-top: var(--section-padding-y) !important;
}

/* Odsazení pouze dole */
.pdz-padding-bottom {
    padding-bottom: var(--section-padding-y) !important;
}

/* Mobilní hodnoty řeší clamp() přímo v --section-padding-y
   (40px na mobilu → plynule → 120px na 3K), proto tu žádná media query není. */

/* =========================================
   PDZ - TOAST NOTIFIKACE (KOŠÍK)
========================================= */
#pdz-toast-container {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 999999;
    display: flex;
    flex-direction: column;
    gap: 12px;
    pointer-events: none; /* Aby neblokoval klikání na webu pod ním */
}

.pdz-toast {
    background: #ffffff;
    border-left: 4px solid #007A25; /* Vaše globální zelená */
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    padding: 16px 20px;
    display: flex;
    align-items: center;
    gap: 16px;
    pointer-events: auto; /* Samotný toast je klikatelný */
    transform: translateX(120%);
    opacity: 0;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), opacity 0.4s ease;
    width: 340px;
    box-sizing: border-box;
}

.pdz-toast.is-visible {
    transform: translateX(0);
    opacity: 1;
}

.pdz-toast-icon {
    width: 26px;
    height: 26px;
    background-color: #007A25;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E") no-repeat center / contain;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E") no-repeat center / contain;
    flex-shrink: 0;
}

.pdz-toast-content {
    flex: 1;
}

.pdz-toast-title {
    font-weight: 700;
    color: #1a1a1a !important;
    font-size: 1.25rem; /* Zvětšeno z 0.95rem */
    margin: 0 0 4px 0;
    font-family: var(--template-font);
}

.pdz-toast-desc {
    font-size: 1.25rem; /* Zvětšeno z 0.85rem */
    color: #5a6b7c !important;
    margin: 0;
    font-family: var(--template-font);
    line-height: 1.3;
}

.pdz-toast-action {
    font-size: 1.25rem; /* Zvětšeno z 0.9rem */
    font-weight: 700;
    color: #1A6B9B !important;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s;
    text-transform: uppercase;
}

.pdz-toast-action:hover {
    color: #14567d;
}

@media (max-width: 600px) {
    #pdz-toast-container {
        bottom: 20px;
        right: 20px;
        left: 20px;
    }
    .pdz-toast {
        width: 100%;
    }
}

/* === VARIACÍ TOASTU PRO POPTÁVKU (Zelená) === */
.pdz-toast-poptavka .pdz-toast-icon {
    /* Ikona Poptávky (změněno z ikony odškrtnutí) */
    -webkit-mask: url('https://790188.myshoptet.com/user/documents/upload/Ikony/Quote_icon2.svg') no-repeat center / contain !important;
    mask: url('https://790188.myshoptet.com/user/documents/upload/Ikony/Quote_icon2.svg') no-repeat center / contain !important;
    background-color: #007A25 !important; 
}

.pdz-toast-poptavka .pdz-toast-action {
    color: #007A25 !important; /* Zelený odkaz místo modrého */
}

.pdz-toast-poptavka .pdz-toast-action:hover {
    color: #005f1d !important;
}

/* === VARIACÍ TOASTU PRO CHYBY (Červená) === */
.pdz-toast-error {
    border-left-color: #dc2626 !important; 
}

.pdz-toast-error .pdz-toast-icon {
    background-color: #dc2626 !important;
    /* Ikona vykřičníku */
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='8' x2='12' y2='12'/%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'/%3E%3C/svg%3E") no-repeat center / contain !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='8' x2='12' y2='12'/%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'/%3E%3C/svg%3E") no-repeat center / contain !important;
}

.pdz-toast-error .pdz-toast-action {
    display: none !important; /* U chybových hlášek odkaz nepotřebujeme */
}

/* =========================================
   POPUP PROJEKTOVÉ POPTÁVKY — přesunuto
   Styly poptávkového košíku jsou nově v samostatném souboru
   PDZ1_poptavka_V1.css (načítat AŽ ZA tímto globálním CSS).
   Až bude design hotový, obsah lze vrátit sem.
========================================= */

/* =========================================
   UNIVERZÁLNÍ ŠTÍTEK NAD NADPISEM (GDPR styl)
========================================= */
.pdz-eyebrow {
    display: inline-block !important;
    width: fit-content !important;
    align-self: flex-start !important;
    font-family: var(--template-headings-font, 'Montserrat', sans-serif) !important;
    
    /* Proporce z GDPR sekce */
    font-size: 1.1rem !important; /* Zvětšeno z 0.78rem */
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    padding: 6px 14px !important;
    border-radius: 50px !important;
    margin-bottom: 22px !important;
    line-height: 1.2 !important;

    /* Výchozí barvy pro světlé pozadí webu (firemní modrá) */
    color: #1A6B9B !important; 
    background: rgba(26, 107, 155, 0.08) !important; 
    border: 1px solid rgba(26, 107, 155, 0.2) !important;
}

/* Modifikátor pro tmavá pozadí (přesná kopie barev z GDPR) */
.pdz-eyebrow.pdz-eyebrow--white {
    color: rgba(255, 255, 255, 0.85) !important;
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
}

/* ============================================================
   UNIVERZÁLNÍ TŘÍDA PRO POZADÍ NA CELOU ŠÍŘKU (OPRAVENO)
   ============================================================ */
.pdz-section-fullwidth {
    position: relative !important;
    width: 100vw !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    box-sizing: border-box !important;
    
    /* Důležité: Nuluje ten předchozí rozbitý pokus */
    transform: none !important; 
    
    /* Výchozí šedé pozadí pro úseky (lze lokálně u sekce přepsat) */
    background: #e8edf1; 
}

/* =========================================
   SKRYTÍ NATIVNÍCH PRVKŮ (BREADCRUMBS & H1)
========================================= */

/* 1. Skrytí drobečkové navigace (pouze na textových stránkách, aby zůstala v e-shopu) */
.type-page .breadcrumbs {
    display: none !important;
}

/* 2. SEO-friendly skrytí nativního nadpisu H1 */
.type-page .pageArticleDetail header h1 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Volitelně: zrušení mezer po skrytém H1 — JEN nativní header s H1, ne vlastní sekce */
.type-page .pageArticleDetail header:has(h1) {
  margin: 0 !important;
  padding: 0 !important;
}
/* =========================================
   13. GLOBÁLNÍ PRELOADER (Plynulé přechody)
========================================= */

/* Hladké prolínání nativního obsahu */
.overall-wrapper {
    transition: opacity 0.4s ease;
}

/* Skrytí obsahu dokud JS nedokončí úpravy DOMu */
html:not(.pdz-loaded) .overall-wrapper {
    opacity: 0 !important;
    pointer-events: none;
}

/* Zamknutí scrollu během načítání, aby uživatel neujel */
html:not(.pdz-loaded) body {
    overflow: hidden !important;
}

/* Definice vrstev pro Logo a Spinner */
html::before, html::after {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
    pointer-events: none;
    z-index: 9999999;
}

/* Zobrazení při načítání */
html:not(.pdz-loaded)::before, 
html:not(.pdz-loaded)::after {
    opacity: 1;
    visibility: visible;
}

/* 1) Logo PDZ (vycentrováno nad střed) */
html::before {
    content: "";
    position: fixed;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 180px;
    height: 70px;
    background: url('https://cdn.myshoptet.com/usr/790188.myshoptet.com/user/logos/pdz1_logo_bile.svg') no-repeat center center;
    background-size: contain;
}

/* 2) Točící se Spinner (umístěný pod logem) */
html::after {
    content: "";
    position: fixed;
    top: calc(45% + 70px);
    left: 50%;
    width: 40px;
    height: 40px;
    margin-left: -20px;
    border: 4px solid rgba(255, 255, 255, 0.2);
    border-top: 4px solid #ffffff;
    border-radius: 50%;
    animation: pdzSpin 0.8s linear infinite;
}

@keyframes pdzSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* ============================================================================
   PDZ1 — COOKIES BANNER & NASTAVENÍ (OPRAVA GEOMETRIE, ŠÍŘKY A CENTROVÁNÍ)
   ============================================================================ */

/* ----------------------------------------------------------------------------
   1) COOKIE LIŠTA (Dokonalé lícování s vnitřní mřížkou webu)
   ---------------------------------------------------------------------------- */
body .siteCookies.js-siteCookies,
body .siteCookies--dark.js-siteCookies {
    position: fixed !important;
    background: #ffffff !important;
    box-shadow: 0 20px 50px rgba(13, 52, 76, 0.25) !important;
    border: 1px solid var(--pdz-line, #e6edf3) !important;
    border-radius: var(--radius-lg, 1.5rem) !important;
    padding: clamp(20px, 2.5vw, 32px) !important;
    
    /* LÍCOVÁNÍ S GLOBÁLNÍ ŠÍŘKOU OBSAHU:
       Šířka i max-width přesně kopírují okraje tvých hlavních kontejnerů */
    max-width: calc(var(--content-max-width, 1600px) - (2 * var(--content-padding-x, clamp(20px, 10vw, 160px)))) !important;
    width: calc(100% - (2 * var(--content-padding-x, 20px))) !important;
    
    /* Absolutní vycentrování na spodek */
    left: 50% !important;
    right: auto !important; 
    margin: 0 !important;
    bottom: clamp(16px, 2.5vw, 32px) !important;
    transform: translateX(-50%) !important;
    height: auto !important;
    box-sizing: border-box !important;
    color: #1a1a1a !important;
    z-index: 999999 !important;
}

/* Vyčištění nativních Shoptet stylů */
body .siteCookies__form,
body .siteCookies__content,
body .siteCookies__text,
body .siteCookies__links {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}

/* Flexbox layout: Text dostane maximum místa vlevo, tlačítka se odtlačí doprava */
.siteCookies__form {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: clamp(32px, 4vw, 64px) !important;
    width: 100% !important;
}

.siteCookies__content {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    flex: 1 !important; /* Maximální protažení textové části */
    min-width: 0 !important;
}

/* Dynamický nadpis */
body .siteCookies__content::before {
    content: "Nastavení ochrany soukromí";
    display: block !important;
    font-family: var(--template-headings-font, sans-serif) !important;
    font-size: clamp(1.3rem, 1.5vw, 1.6rem) !important;
    font-weight: 700 !important;
    color: var(--pdz-blue, #1A6B9B) !important;
}

.siteCookies__text {
    font-family: var(--template-font, sans-serif) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.3rem) !important;
    line-height: 1.55 !important;
    color: #1a1a1a !important;
}

.siteCookies__text a {
    color: var(--pdz-blue, #1A6B9B) !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
}

.siteCookies__link.js-cookies-settings {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: var(--pdz-muted, #5b6b7a) !important;
    font-family: var(--template-font, sans-serif) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.25rem) !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    cursor: pointer !important;
    display: inline-block !important;
}
.siteCookies__link.js-cookies-settings:hover {
    color: var(--pdz-blue, #1A6B9B) !important;
}

/* Pravá strana: Tlačítka čistě vedle sebe */
.siteCookies__buttonWrap {
    display: flex !important;
    flex-direction: row !important;
    gap: 14px !important;
    flex-shrink: 0 !important; /* Zákaz deformace tlačítek textem */
    background: transparent !important;
    padding: 0 !important;
}

body .siteCookies__button {
    font-family: var(--template-headings-font, sans-serif) !important;
    font-weight: 600 !important;
    font-size: clamp(1.15rem, 1.20vw, 1.3rem) !important;
    padding: 11px clamp(24px, 2.5vw, 36px) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: clamp(44px, 4.5vw, 50px) !important;
    letter-spacing: 0.5px !important;
    box-shadow: none !important;
}

/* Souhlasím (Zelené) */
body .siteCookies__button[data-testid="buttonCookiesAccept"] {
    background-color: var(--pdz-green, #007A25) !important;
    color: #FFFFFF !important;
    border: 2px solid var(--pdz-green, #007A25) !important;
}
body .siteCookies__button[data-testid="buttonCookiesAccept"]:hover {
    background-color: #005f1d !important;
    border-color: #005f1d !important;
    transform: translateY(-2px) !important;
}

/* Odmítnout (Modrý obrys) */
body .siteCookies__button[data-testid="buttonCookiesReject"] {
    background-color: transparent !important;
    color: var(--pdz-blue, #1A6B9B) !important;
    border: 2px solid var(--pdz-blue, #1A6B9B) !important;
}
body .siteCookies__button[data-testid="buttonCookiesReject"]:hover {
    background-color: var(--pdz-blue, #1A6B9B) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
}

/* ============================================================================
   PDZ1 — COOKIES BANNER & NASTAVENÍ (OPRAVA ŠÍŘKY, LÍCOVÁNÍ A STABILITY)
   ============================================================================ */

/* ----------------------------------------------------------------------------
   1) COOKIE LIŠTA (Přesné lícování na vnitřní grid obsahu)
   ---------------------------------------------------------------------------- */
body .siteCookies.js-siteCookies,
body .siteCookies--dark.js-siteCookies {
    position: fixed !important;
    background: #ffffff !important;
    box-shadow: 0 20px 50px rgba(13, 52, 76, 0.25) !important;
    border: 1px solid var(--pdz-line, #e6edf3) !important;
    border-radius: var(--radius-lg, 1.5rem) !important;
    padding: clamp(20px, 2.5vw, 32px) !important;
    
    /* STRIKTNÍ LÍCOVÁNÍ: Šířka přesně odpovídá vnitřnímu obsahu e-shopu */
    max-width: calc(var(--content-max-width, 1600px) - (2 * var(--content-padding-x, clamp(20px, 10vw, 160px)))) !important;
    width: calc(100% - (2 * var(--content-padding-x, 20px))) !important;
    
    /* Dokonalé vycentrování nad spodním okrajem */
    left: 50% !important;
    right: auto !important; 
    margin: 0 !important;
    bottom: clamp(16px, 2.5vw, 32px) !important;
    transform: translateX(-50%) !important;
    height: auto !important;
    box-sizing: border-box !important;
    color: #1a1a1a !important;
    z-index: 999999 !important;
}

/* Vyčištění nativních Shoptet podkladů */
body .siteCookies__form,
body .siteCookies__content,
body .siteCookies__text,
body .siteCookies__links {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Flexbox layout: Vynucení 100% šířky a přebití Shoptet limitu */
body .siteCookies__form {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: clamp(32px, 4vw, 64px) !important;
    width: 100% !important;
    max-width: 100% !important; /* KLÍČOVÝ FIX: Odtlačí tlačítka na absolutní pravý kraj */
}

.siteCookies__content {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    flex: 1 !important; /* Levá strana dostane maximum volného prostoru */
    min-width: 0 !important;
}

/* Dynamický nadpis banneru */
body .siteCookies__content::before {
    content: "Nastavení ochrany soukromí";
    display: block !important;
    font-family: var(--template-headings-font, sans-serif) !important;
    font-size: clamp(1.3rem, 1.5vw, 1.6rem) !important;
    font-weight: 700 !important;
    color: var(--pdz-blue, #1A6B9B) !important;
}

.siteCookies__text {
    font-family: var(--template-font, sans-serif) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.3rem) !important;
    line-height: 1.55 !important;
    color: #1a1a1a !important;
}

.siteCookies__text a {
    color: var(--pdz-blue, #1A6B9B) !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
}

.siteCookies__link.js-cookies-settings {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: var(--pdz-muted, #5b6b7a) !important;
    font-family: var(--template-font, sans-serif) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.25rem) !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    cursor: pointer !important;
    display: inline-block !important;
}
.siteCookies__link.js-cookies-settings:hover {
    color: var(--pdz-blue, #1A6B9B) !important;
}

/* Pravá strana: Tlačítka zafixovaná vedle sebe */
.siteCookies__buttonWrap {
    display: flex !important;
    flex-direction: row !important;
    gap: 14px !important;
    flex-shrink: 0 !important; /* Zákaz deformace tlačítek textem */
    background: transparent !important;
    padding: 0 !important;
}

body .siteCookies__button {
    font-family: var(--template-headings-font, sans-serif) !important;
    font-weight: 600 !important;
    font-size: clamp(1.15rem, 1.20vw, 1.3rem) !important;
    padding: 11px clamp(24px, 2.5vw, 36px) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: clamp(44px, 4.5vw, 50px) !important;
    letter-spacing: 0.5px !important;
    box-shadow: none !important;
}

/* Souhlasím (Zelené) */
body .siteCookies__button[data-testid="buttonCookiesAccept"] {
    background-color: var(--pdz-green, #007A25) !important;
    color: #FFFFFF !important;
    border: 2px solid var(--pdz-green, #007A25) !important;
}
body .siteCookies__button[data-testid="buttonCookiesAccept"]:hover {
    background-color: #005f1d !important;
    border-color: #005f1d !important;
    transform: translateY(-2px) !important;
}

/* Odmítnout (Modrý obrys) */
body .siteCookies__button[data-testid="buttonCookiesReject"] {
    background-color: transparent !important;
    color: var(--pdz-blue, #1A6B9B) !important;
    border: 2px solid var(--pdz-blue, #1A6B9B) !important;
}
body .siteCookies__button[data-testid="buttonCookiesReject"]:hover {
    background-color: var(--pdz-blue, #1A6B9B) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
}

/* ============================================================================
   PDZ1 — COOKIES BANNER & NASTAVENÍ (ODLADĚNÁ GEOMETRIE BEZ SCROLLU)
   ============================================================================ */

/* ----------------------------------------------------------------------------
   1) COOKIE LIŠTA (Dokonalé lícování s vnitřní mřížkou obsahu)
   ---------------------------------------------------------------------------- */
body .siteCookies.js-siteCookies,
body .siteCookies--dark.js-siteCookies {
    position: fixed !important;
    background: #ffffff !important;
    box-shadow: 0 20px 50px rgba(13, 52, 76, 0.25) !important;
    border: 1px solid var(--pdz-line, #e6edf3) !important;
    border-radius: var(--radius-lg, 1.5rem) !important;
    padding: clamp(20px, 2.5vw, 32px) !important;
    
    /* LÍCOVÁNÍ S GLOBÁLNÍ ŠÍŘKOU OBSAHU:
       Šířka i max-width přesně kopírují okraje tvých hlavních kontejnerů */
    max-width: calc(var(--content-max-width, 1600px) - (2 * var(--content-padding-x, clamp(20px, 10vw, 160px)))) !important;
    width: calc(100% - (2 * var(--content-padding-x, 20px))) !important;
    
    /* Absolutní vycentrování na spodek */
    left: 50% !important;
    right: auto !important; 
    margin: 0 !important;
    bottom: clamp(16px, 2.5vw, 32px) !important;
    transform: translateX(-50%) !important;
    height: auto !important;
    box-sizing: border-box !important;
    color: #1a1a1a !important;
    z-index: 999999 !important;
}

/* Vyčištění nativních Shoptet stylů */
body .siteCookies__form,
body .siteCookies__content,
body .siteCookies__text,
body .siteCookies__links {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    max-width: none !important;
}

/* Flexbox layout: Vynucení plné šířky, tlačítka skočí na pravý kraj */
body .siteCookies__form {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: clamp(32px, 4vw, 64px) !important;
    width: 100% !important;
    max-width: 100% !important;
}

.siteCookies__content {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

/* Dynamický nadpis */
body .siteCookies__content::before {
    content: "Nastavení ochrany soukromí";
    display: block !important;
    font-family: var(--template-headings-font, sans-serif) !important;
    font-size: clamp(1.3rem, 1.5vw, 1.6rem) !important;
    font-weight: 700 !important;
    color: var(--pdz-blue, #1A6B9B) !important;
}

.siteCookies__text {
    font-family: var(--template-font, sans-serif) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.3rem) !important;
    line-height: 1.55 !important;
    color: #1a1a1a !important;
}

.siteCookies__text a {
    color: var(--pdz-blue, #1A6B9B) !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
}

.siteCookies__link.js-cookies-settings {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: var(--pdz-muted, #5b6b7a) !important;
    font-family: var(--template-font, sans-serif) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.25rem) !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    cursor: pointer !important;
    display: inline-block !important;
}
.siteCookies__link.js-cookies-settings:hover {
    color: var(--pdz-blue, #1A6B9B) !important;
}

/* Pravá strana: Tlačítka vedle sebe */
.siteCookies__buttonWrap {
    display: flex !important;
    flex-direction: row !important;
    gap: 14px !important;
    flex-shrink: 0 !important;
    background: transparent !important;
    padding: 0 !important;
}

body .siteCookies__button {
    font-family: var(--template-headings-font, sans-serif) !important;
    font-weight: 600 !important;
    font-size: clamp(1.15rem, 1.20vw, 1.3rem) !important;
    padding: 11px clamp(24px, 2.5vw, 36px) !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: clamp(44px, 4.5vw, 50px) !important;
    letter-spacing: 0.5px !important;
    box-shadow: none !important;
}

/* Souhlasím (Zelené) */
body .siteCookies__button[data-testid="buttonCookiesAccept"] {
    background-color: var(--pdz-green, #007A25) !important;
    color: #FFFFFF !important;
    border: 2px solid var(--pdz-green, #007A25) !important;
}
body .siteCookies__button[data-testid="buttonCookiesAccept"]:hover {
    background-color: #005f1d !important;
    border-color: #005f1d !important;
    transform: translateY(-2px) !important;
}

/* Odmítnout (Modrý obrys) */
body .siteCookies__button[data-testid="buttonCookiesReject"] {
    background-color: transparent !important;
    color: var(--pdz-blue, #1A6B9B) !important;
    border: 2px solid var(--pdz-blue, #1A6B9B) !important;
}
body .siteCookies__button[data-testid="buttonCookiesReject"]:hover {
    background-color: var(--pdz-blue, #1A6B9B) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
}

/* ============================================================================
   PDZ1 — COOKE DIALOG / NASTAVENÍ (STRIKTNÍ SYMETRIE & OUTLINE DESIGN)
   ============================================================================ */

/* 1) Bezpečné vycentrování okna na ose X bez narušení vertikální polohy z JS */
body #colorbox:has(.cookiesDialog) {
    left: 50% !important;
    transform: translateX(-50%) !important;
    overflow: visible !important;
}

/* Sjednocení šířky všech kontejnerů na stabilní Shoptet rozměr */
body #colorbox:has(.cookiesDialog),
body #colorbox:has(.cookiesDialog) #cboxWrapper,
body #cboxContent.cookiesDialog {
    width: min(760px, 100vw - 32px) !important;
}

/* KLÍČOVÉ: Vnitřní kontejnery dostávají z JS inline width (698px/700px), která je
   širší než karta → obsah přetékal vpravo za padding. Přinutíme je respektovat
   šířku rodičovské karty, aby byl padding symetrický na obou stranách. */
body #colorbox:has(.cookiesDialog) #cboxLoadedContent,
body #colorbox:has(.cookiesDialog) .colorbox-html-content {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* NEKOMPROMISNÍ RESET VÝŠEK: Kompletní neutralizace inline výšek z JS (458px).
   Tímto krokem přinutíme modál, aby se přizpůsobil obsahu a zachoval paddingy. */
body #cboxContent.cookiesDialog,
body #colorbox:has(.cookiesDialog) #cboxWrapper,
body #colorbox:has(.cookiesDialog) #cboxLoadedContent,
body #colorbox:has(.cookiesDialog) .colorbox-html-content {
    height: auto !important;
    overflow: visible !important;
}

/* Hlavní bílá karta s naprosto identickým 32px paddingem na všech stranách */
body #cboxContent.cookiesDialog {
    background: #ffffff !important;
    border-radius: var(--radius-lg, 1.5rem) !important;
    box-shadow: 0 25px 60px rgba(13, 52, 76, 0.3) !important;
    padding: 32px !important; /* Striktní čtvercová symetrie okolo celého obsahu */
    box-sizing: border-box !important;
    position: relative !important;
}

/* Odstranění nativních Shoptet okrajů a vynulování vnitřních paddingů */
body #colorbox:has(.cookiesDialog) #cboxLoadedContent {
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* Vyvážená vnitřní struktura formuláře nastavení */
.cookiesSetting__form {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    font-family: var(--template-font, sans-serif) !important;
    width: 100% !important;
}

.cookiesSetting__title {
    font-family: var(--template-headings-font, sans-serif) !important;
    color: var(--pdz-blue, #1A6B9B) !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    margin: 0 !important;
    line-height: 1.2 !important;
}

.cookiesSetting__perex {
    color: #333333 !important;
    font-size: 1.1rem !important;
    line-height: 1.5 !important;
    margin: 0 !important;
}

.cookiesSetting__data {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

/* Řádky jednotlivých typů cookies */
.cookiesSetting__item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 24px !important;
    background: #f6f7f8 !important;
    border: none !important;
    border-radius: var(--radius-md, 1rem) !important;
    padding: 14px 20px !important;
    box-sizing: border-box !important;
}

.cookiesSetting__item__col1 {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    flex: 1 !important;
}

.cookiesSetting__item__name {
    font-size: 1.2rem !important;
    color: #1a1a1a !important;
    font-weight: 600 !important;
}
.cookiesSetting__item__name strong {
    font-weight: 700 !important;
}

.cookiesSetting__item__text {
    font-size: 1.05rem !important;
    color: var(--pdz-muted, #5b6b7a) !important;
    line-height: 1.45 !important;
}

/* ----------------------------------------------------------------------------
   2) INTERAKTIVNÍ PŘEPÍNAČE (Toggle Switches)
   ---------------------------------------------------------------------------- */
.cookiesSetting__item__status {
    display: inline-flex !important;
    align-items: center !important;
    position: relative !important;
    cursor: pointer !important;
}

/* Nativní checkbox schováváme neprůstřelným "visually hidden" vzorem (clip 0×0).
   Samotné appearance:none/opacity:0 nestačilo — Shoptet/prohlížeč pod ním kreslil
   zbytkový čtvereček. Clip element fyzicky ořízne na nulu, takže nevykreslí nic;
   :checked + .state (přepínání kolečka) i klik přes <label for> dál fungují. */
input.cookiesSetting__item__checkbox {
    -webkit-appearance: none !important;
    appearance: none !important;
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    border: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

.cookiesSetting__item__state {
    position: relative !important;
    display: inline-block !important;
    width: 46px !important;
    height: 24px !important;
    background-color: #cbd5e1 !important;
    border-radius: 999px !important;
    margin: 0 !important;
    font-size: 0 !important;
    color: transparent !important;
    text-indent: -9999px !important;
}

/* SKUTEČNÝ VINÍK ČTVEREČKU: Shoptet na state label kreslí vlastní ::before
   (14×14, bílé pozadí, šedý border) jako nativní checkbox-box. Kompletně ho
   neutralizujeme, aby v pilulce zůstalo jen naše kolečko z ::after. */
.cookiesSetting__item__state::before {
    content: none !important;
    display: none !important;
}

.cookiesSetting__item__state::after {
    content: "" !important;
    position: absolute !important;
    top: 3px !important;
    left: 3px !important;
    width: 18px !important;
    height: 18px !important;
    background-color: #ffffff !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 5px rgba(13, 52, 76, 0.15) !important;
    transition: transform 0.25s cubic-bezier(0.25, 1, 0.5, 1) !important;
    transform: translateX(0) !important;
}

input.cookiesSetting__item__checkbox:checked + .cookiesSetting__item__state {
    background-color: var(--pdz-green, #007A25) !important;
}

input.cookiesSetting__item__checkbox:checked + .cookiesSetting__item__state::after {
    transform: translateX(22px) !important;
}

/* ----------------------------------------------------------------------------
   3) SPODNÍ ŘADA TLAČÍTEK (Kompletní přechod na OUTLINE styl)
   ---------------------------------------------------------------------------- */
.cookiesSetting__bottom {
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: center !important;
    gap: 16px !important;
    margin-top: 8px !important;
}

.cookiesSetting__uncheck {
    flex: 1 !important;
}

.cookiesSetting__uncheckLink {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    color: var(--pdz-muted, #5b6b7a) !important;
    font-family: var(--template-font, sans-serif) !important;
    font-size: 1.15rem !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    cursor: pointer !important;
    white-space: nowrap !important;
    display: inline-block !important;
}
.cookiesSetting__uncheckLink:hover {
    color: var(--pdz-blue, #1A6B9B) !important;
}

.cookiesSetting__button {
    font-family: var(--template-headings-font, sans-serif) !important;
    font-weight: 600 !important;
    font-size: 1.15rem !important;
    padding: 11px 26px !important;
    border-radius: 999px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    min-height: 46px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    letter-spacing: 0.5px !important;
    flex: 0 0 auto !important;
}

/* Potvrdit moje volby — Čistý MODRÝ OUTLINE styl */
body .cookiesSetting__button[data-testid="cookiesConfirmSelection"] {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--pdz-blue, #1A6B9B) !important;
    border: 2px solid var(--pdz-blue, #1A6B9B) !important;
}
body .cookiesSetting__button[data-testid="cookiesConfirmSelection"]:hover {
    background-color: var(--pdz-blue, #1A6B9B) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
}

/* Povolit vše — Čistý ZELENÝ OUTLINE styl */
body .cookiesSetting__button.cookiesSetting__button--green {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--pdz-green, #007A25) !important;
    border: 2px solid var(--pdz-green, #007A25) !important;
}
body .cookiesSetting__button.cookiesSetting__button--green:hover {
    background-color: var(--pdz-green, #007A25) !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
}

/* Nativní zavírací křížek Colorboxu lícovaný na 32px padding v rohu */
body #colorbox:has(.cookiesDialog) #cboxClose {
    font-family: var(--template-font, sans-serif) !important;
    color: var(--pdz-muted, #5b6b7a) !important;
    font-weight: 600 !important;
    font-size: 1.2rem !important;
    position: absolute !important;
    top: 32px !important; /* Perfektní zarovnání s horní hranou paddingu */
    right: 32px !important; /* Perfektní zarovnání s pravou hranou paddingu */
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    cursor: pointer;
    display: block !important;
}
body #colorbox:has(.cookiesDialog) #cboxClose:hover {
    color: var(--pdz-blue, #1A6B9B) !important;
}

/* ----------------------------------------------------------------------------
   4) MOBILE RESPONSIVITY
   ---------------------------------------------------------------------------- */
@media (max-width: 640px) {
    body #colorbox:has(.cookiesDialog),
    body #colorbox:has(.cookiesDialog) #cboxWrapper,
    body #cboxContent.cookiesDialog {
        width: calc(100% - 20px) !important;
    }
    body #cboxContent.cookiesDialog {
        padding: 24px !important; /* Na mobilech padding pro lepší ergonomii mírně zmenšíme */
    }
    body #colorbox:has(.cookiesDialog) #cboxClose {
        top: 24px !important;
        right: 24px !important;
    }
    .cookiesSetting__bottom {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    .cookiesSetting__uncheck {
        text-align: center !important;
        order: 3 !important; 
        margin-top: 4px !important;
    }
    body .cookiesSetting__button {
        width: 100% !important;
    }
}

/* ============================================================================
   PDZ1 — KOMPLETNÍ CHECKOUT PROCES (PŘIHLÁŠENÍ & REGISTRACE)
   ============================================================================ */

/* ----------------------------------------------------------------------------
   A) PŘIHLÁŠENÍ (.in-login) — Úzká White Card s ikonou zámku
   ---------------------------------------------------------------------------- */

body.in-login #content .content-inner {
    background: #ffffff !important;
    max-width: 460px !important;
    width: 100% !important;
    margin-top: var(--section-padding-y) !important;
    margin-bottom: var(--section-padding-y) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    /* Plynulé vnitřní odsazení: 24px na mobilu -> 40px na desktopu */
    padding: clamp(24px, 4vw, 40px) !important; 
    border-radius: var(--radius-lg) !important;
    box-shadow: 0 25px 60px rgba(13, 52, 76, 0.25) !important;
    box-sizing: border-box !important;
}

body.in-login #content .content-inner h1 {
    color: #1A1A1A !important;
    font-family: var(--template-headings-font) !important;
    font-size: clamp(1.6rem, 4vw, 2.1rem) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-bottom: clamp(20px, 3vw, 32px) !important;
    text-align: center !important;
}

body.in-login #content .formLogin {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

body.in-login #content .form-group {
    margin: 0 !important;
    padding: 0 !important;
}

body.in-login #content .form-control {
    width: 100% !important;
    height: 54px !important;
    background-color: #f6f7f8 !important; 
    border: 1px solid #1A6B9B !important; 
    border-radius: var(--radius-sm) !important;
    padding: 12px 20px !important;
    font-family: var(--template-font) !important;
    font-size: 1.375rem !important;
    font-weight: 400 !important;
    color: #1a1a1a !important;
    box-sizing: border-box !important;
    transition: all 0.25s ease-in-out !important;
}

body.in-login #content .form-control:focus {
    background-color: #ffffff !important;
    border-color: #1A6B9B !important; 
    box-shadow: 0 0 0 3px rgba(26, 107, 155, 0.15) !important;
    outline: none !important;
}

body.in-login #content .form-control::placeholder {
    color: #5b6b7a !important; 
    opacity: 1 !important;
}

body.in-login #content .btn-login {
    width: 100% !important;
    min-height: 50px !important;
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    border: 2px solid #1A6B9B !important;
    border-radius: 999px !important;
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    font-size: 1.25rem !important;         
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    margin-top: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
}

body.in-login #content .btn-login:hover {
    background-color: #14567d !important; 
    border-color: #14567d !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(26, 107, 155, 0.4) !important;
}

body.in-login #content .btn-login::before {
    content: "" !important;
    font-family: inherit !important;
    display: inline-block !important;
    width: 24px !important;
    height: 24px !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E") no-repeat center / contain !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E") no-repeat center / contain !important;
}

body.in-login #content .password-helper {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-top: 14px !important;
    gap: 16px !important;
}

body.in-login #content .password-helper a {
    color: #1A6B9B !important; 
    font-family: var(--template-font) !important;
    font-size: 1.15rem !important; 
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: color 0.2s ease, text-decoration 0.2s ease !important;
}

body.in-login #content .password-helper a:hover {
    color: #14567d !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* Globální pojistka pro hlášky chyb i v login sekci */
body.in-login #content .js-validator-msg,
body.in-login #content .validator-msg {
    color: #dc2626 !important; 
    font-family: var(--template-font), sans-serif !important;
    font-size: 1.125rem !important; /* Zmenšeno pro jemnější vzhled */
    font-weight: 500 !important;
    margin-top: 6px !important;
}

@media (max-width: 640px) {
    body.in-login #content .content-inner {
        width: calc(100% - 32px) !important; /* Bezpečné boční okraje na mobilu */
        margin-left: 16px !important;
        margin-right: 16px !important;
    }
    body.in-login #content .password-helper {
        flex-direction: column !important;
        gap: 12px !important;
        text-align: center !important;
    }
}

/* ----------------------------------------------------------------------------
   B) REGISTRACE (.in-registrace) — Široká White Card, fluidní grid
      • pole sjednocená se stylem login modalu
      • vše v clamp() / fluidních hodnotách (bez pevných px tam, kde to jde)
      • sekce „Potvrzení" + souhlas vyladěné
   ---------------------------------------------------------------------------- */

body.in-registrace #content .content-inner {
    background: #ffffff !important;
    max-width: 1000px !important;
    width: 100% !important;
    margin-top: var(--section-padding-y) !important;
    margin-bottom: var(--section-padding-y) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: clamp(24px, 4vw, 48px) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: 0 25px 60px rgba(13, 52, 76, 0.25) !important;
    box-sizing: border-box !important;
}

/* Hlavní nadpis stránky */
body.in-registrace #content .content-inner h1 {
    color: #1A1A1A !important;
    font-family: var(--template-headings-font) !important;
    font-size: clamp(1.6rem, 4vw, 2.1rem) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-top: 0 !important;
    margin-bottom: clamp(24px, 3.5vw, 40px) !important;
    text-align: center !important;
}

/* --- Resety Shoptet boxů, aby prosvítala bílá karta --- */
body.in-registrace #content .box,
body.in-registrace #content .box-sm,
body.in-registrace #content .box-bg-default,
body.in-registrace #content .co-box {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}
body.in-registrace #content .co-box:empty {
    display: none !important;
}
/* Honeypot a technické prvky vždy skryté */
body.in-registrace #content .no-display,
body.in-registrace #content input[name="surname"],
body.in-registrace #content input[name="billFullName"] {
    display: none !important;
}

/* --- Fluidní grid polí (bez media queries: auto-fit + minmax) --- */
body.in-registrace #content fieldset.box-bg-default {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
    gap: clamp(16px, 2.5vw, 26px) !important;
    align-items: start !important;
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* --- Nadpisy sekcí (Osobní údaje i Potvrzení) — jednotný styl s linkou --- */
body.in-registrace #content .formRegistration h4 {
    color: #1A6B9B !important;
    font-family: var(--template-headings-font) !important;
    font-size: clamp(1.2rem, 2vw, 1.45rem) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-top: 0 !important;
    margin-bottom: clamp(6px, 1.2vw, 10px) !important;
    padding-bottom: clamp(6px, 1.2vw, 10px) !important;
    border-bottom: 1px solid #e6edf3 !important;
}
/* Nadpis uvnitř gridu přes celou šířku */
body.in-registrace #content fieldset.box-bg-default h4 {
    grid-column: 1 / -1 !important;
}

/* --- Form-group + popisky --- */
body.in-registrace #content .form-group {
    display: flex !important;
    flex-direction: column !important;
    gap: clamp(4px, 1vw, 7px) !important;
    margin: 0 !important;
    float: none !important;
    clear: none !important;
    width: 100% !important;
    position: relative !important;
}

html body.in-registrace #content .form-group label,
html body.in-registrace #content .form-group label span {
    color: #1A6B9B !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1.05rem, 1.6vw, 1.2rem) !important;
    font-weight: 600 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    position: relative !important;
}
body.in-registrace #content .required-asterisk::after {
    display: none !important;
}

/* --- Vstupní pole — 1:1 s login modalem --- */
body.in-registrace #content .form-control {
    width: 100% !important;
    height: clamp(48px, 6vw, 54px) !important;
    background-color: #f6f7f8 !important;
    border: 1px solid #1A6B9B !important;
    border-radius: var(--radius-sm) !important;
    padding: clamp(10px, 1.8vw, 12px) clamp(16px, 2.5vw, 20px) !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1.05rem, 2vw, 1.375rem) !important;
    font-weight: 400 !important;
    color: #1a1a1a !important;
    box-sizing: border-box !important;
    transition: all 0.25s ease-in-out !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
body.in-registrace #content .form-control:focus {
    background-color: #ffffff !important;
    border-color: #1A6B9B !important;
    box-shadow: 0 0 0 3px rgba(26, 107, 155, 0.15) !important;
    outline: none !important;
}
body.in-registrace #content .form-control::placeholder {
    color: #5b6b7a !important;
    opacity: 1 !important;
}

/* --- Validace na bílé kartě --- */
body.in-registrace #content .form-group.has-error,
body.in-registrace #content .has-error,
body.in-registrace #content .error,
body.in-registrace #content .js-validated-element-wrapper.has-error {
    border: none !important;
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}
body.in-registrace #content .has-error input,
body.in-registrace #content input.error {
    border: 1px solid #dc2626 !important;
}
body.in-registrace #content .js-validator-msg,
body.in-registrace #content .validator-msg {
    color: #dc2626 !important;
    font-family: var(--template-font), sans-serif !important;
    font-size: clamp(1rem, 1.8vw, 1.125rem) !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: clamp(4px, 1vw, 6px) auto 0 0 !important;
    text-align: left !important;
    display: block !important;
    position: relative !important;
    white-space: normal !important;
    width: 100% !important;
    overflow: visible !important;
    float: none !important;
}
body.in-registrace #content .form-group:has(#email) .js-validator-msg,
body.in-registrace #content .form-group:has(#email) .validator-msg {
    max-width: 280px !important;
}

/* --- Sekce „Potvrzení": souhlas + odeslání --- */
body.in-registrace #content .formRegistration fieldset:not(.box-bg-default) {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin: clamp(24px, 3.5vw, 36px) 0 0 0 !important;
    box-shadow: none !important;
}

/* Řádek souhlasu — text jako jemná poznámka, odkazy ve firemní modré */
body.in-registrace #content .consents {
    display: block !important;
    margin-top: clamp(12px, 2vw, 18px) !important;
}
body.in-registrace #content .consents-first input[type="checkbox"] {
    margin-right: clamp(8px, 1.5vw, 12px) !important;
    transform: translateY(2px) !important;
    flex-shrink: 0 !important;
}
body.in-registrace #content label.whole-width,
html body.in-registrace #content .consents label.whole-width,
html body.in-registrace #content .consents label[for^="consents"],
html body.in-registrace #content .consents label.whole-width span {
    display: block !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1rem, 1.8vw, 1.15rem) !important;
    line-height: 1.55 !important;
    font-weight: 500 !important;
    color: #333333 !important;
}
html body.in-registrace #content .consents label.whole-width a,
html body.in-registrace #content .consents label[for^="consents"] a,
html body.in-registrace #content .consents label.whole-width a span {
    color: #1A6B9B !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: color 0.2s ease, text-decoration 0.2s ease !important;
}
html body.in-registrace #content .consents label.whole-width a:hover,
html body.in-registrace #content .consents label[for^="consents"] a:hover,
html body.in-registrace #content .consents label.whole-width a:hover span {
    color: #14567d !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}
body.in-registrace #content .consents .js-validator-msg,
body.in-registrace #content .consents .validator-msg {
    margin-left: 0 !important;
    display: block !important;
}

/* --- Odesílací tlačítko (pill, sjednocené s loginem) --- */
body.in-registrace #content .submit-wrapper {
    margin-top: clamp(24px, 3vw, 32px) !important;
    margin-bottom: 0 !important;
}
body.in-registrace #content .submit-wrapper p {
    margin: 0 !important;
    padding: 0 !important;
}
body.in-registrace #content input[type="submit"].btn-login {
    width: 100% !important;
    max-width: clamp(280px, 50%, 360px) !important;
    min-height: clamp(48px, 6vw, 54px) !important;
    margin: 0 auto !important;
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    border: 2px solid #1A6B9B !important;
    border-radius: 999px !important;
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    font-size: clamp(1.1rem, 2vw, 1.25rem) !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    display: block !important;
    text-align: center !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
body.in-registrace #content input[type="submit"].btn-login:hover {
    background-color: #14567d !important;
    border-color: #14567d !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(26, 107, 155, 0.4) !important;
}

/* --- Mobil: užší boční okraje karty (grid řeší auto-fit sám) --- */
@media (max-width: 768px) {
    body.in-registrace #content .content-inner {
        width: calc(100% - 32px) !important;
        margin-left: 16px !important;
        margin-right: 16px !important;
    }
}

/* ============================================================================
   ZAPOMENUTÉ HESLO — Čisté CSS s využitím globálních tokenů a clamp()
   ============================================================================ */

/* 1. Skrytí nativních prvků (drobečky a sidebar) na této specifické stránce */
#content-wrapper:has(#formForgottenPassword) .breadcrumbs,
#content-wrapper:has(#formForgottenPassword) .sidebar-left {
    display: none !important;
}

/* 2. Roztažení hlavního kontejneru na plnou šířku před vycentrováním karty */
#content-wrapper:has(#formForgottenPassword) #content.content {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
}

/* 3. Transformace stávajícího .content-inner na vaši ikonickou White Card */
#content:has(#formForgottenPassword) .content-inner {
    background: #ffffff !important;
    /* Šířka boxu řízená responzivním clampem s maximální stopkou na 460px */
    width: 100% !important;
    max-width: clamp(280px, 90vw, 460px) !important;
    
    /* Vertikální odsazení sekce přebírá globální token: clamp(40px, 5vw, 120px) */
    margin-top: var(--section-padding-y) !important;
    margin-bottom: var(--section-padding-y) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    
    /* Vnitřní polstrování karty plynule reaguje na velikost displeje */
    padding: clamp(1.5rem, 5vw, 2.5rem) !important; 
    
    /* Globální zaoblení pro velké bloky z vašeho tokenu: 1.5rem (~24px) */
    border-radius: var(--radius-lg) !important;
    box-shadow: 0 25px 60px rgba(13, 52, 76, 0.25) !important;
    box-sizing: border-box !important;
}

/* 4. Nadpis H1 — Navázání na styl vašeho přihlašovacího boxu */
#content:has(#formForgottenPassword) .content-inner h1 {
    color: #1A1A1A !important;
    font-family: var(--template-headings-font) !important;
    font-size: clamp(1.6rem, 4vw, 2.1rem) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-top: 0 !important;
    margin-bottom: clamp(1rem, 3vw, 1.5rem) !important;
    text-align: center !important;
}

/* 5. Vyčištění Shoptet fieldsetu a duplicitního nadpisu H2 */
#formForgottenPassword fieldset {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    /* Dynamická mezera mezi prvky formuláře */
    gap: clamp(0.75rem, 2vw, 1.15rem) !important;
}
#formForgottenPassword h2 {
    display: none !important;
}

/* 6. Průvodní text instrukcí (Přebírá maximální velikost těla textu z vašeho tokenu 1.375rem) */
#formForgottenPassword p {
    font-family: var(--template-font) !important;
    font-size: clamp(1.1rem, 2.5vw, 1.375rem) !important;
    line-height: 1.5 !important;
    font-weight: 400 !important;
    /* Kontrastní tmavá šedá pro světlé téma dle sekce 10 globálního CSS */
    color: #333333 !important; 
    margin-top: 0 !important;
    margin-bottom: clamp(1rem, 2.5vw, 1.5rem) !important;
    text-align: center !important;
}

/* 1. Nastavení flexboxu pro skupinu prvků, aby se vše řadilo na střed */
#formForgottenPassword .form-group.js-validated-element-wrapper {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; /* Vycentruje input a label jako bloky */
    text-align: center !important;   /* Vycentruje text uvnitř */
	font-family: var(--template-font) !important;
    font-size: clamp(1.15rem, 2vw, 1.35rem) !important;
    font-weight: 600 !important;
    color: #1A1A1A !important;
    width: 100% !important;
}

/* 2. Zarovnání textu samotného popisku na střed */
#formForgottenPassword .form-group label {
    display: block !important;
    text-align: center !important;
    width: 100% !important;
    margin-bottom: clamp(0.4rem, 1vw, 0.6rem) !important;
}

/* 3. Centrování textu (placeholderu i zadaného e-mailu) uvnitř vstupního pole */
#formForgottenPassword .form-control {
    text-align: center !important; /* Zajistí, že blikající kurzor a text budou uprostřed */
    width: 100% !important;
    
    /* Pojistka pro správné vycentrování bloku, pokud by Shoptet omezil šířku */
    margin-left: auto !important;
    margin-right: auto !important;
}

#formForgottenPassword .form-control:focus {
    background-color: #ffffff !important;
    border-color: #1A6B9B !important; 
    box-shadow: 0 0 0 3px rgba(26, 107, 155, 0.15) !important;
    outline: none !important;
}

#formForgottenPassword .form-control::placeholder {
    color: #5b6b7a !important; 
    opacity: 1 !important;
}

/* 9. Hlavní odesílací tlačítko (Úprava nativního Shoptet input submitu) */
#formForgottenPassword .login-wrapper {
    margin-top: clamp(0.5rem, 2vw, 1rem) !important;
    padding: 0 !important;
}

#formForgottenPassword .login-wrapper input[type="submit"].btn {
    width: 100% !important;
    height: clamp(48px, 6vw, 54px) !important;
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    border: 2px solid #1A6B9B !important;
    /* Pill-shape (plné zaoblení) zavedené v sekci 7 vašeho CSS */
    border-radius: 999px !important; 
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    /* Velikost fontu tlačítka z vašeho globálního manuálu: 1.25rem */
    font-size: clamp(1.1rem, 2vw, 1.25rem) !important;         
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    margin: 0 !important;
    -webkit-appearance: none !important;
}

#formForgottenPassword .login-wrapper input[type="submit"].btn:hover {
    background-color: #14567d !important; 
    border-color: #14567d !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(26, 107, 155, 0.4) !important;
}

/* Ochranné skrytí technických elementů a honeypotu */
#formForgottenPassword .no-display {
    display: none !important;
}

/* 10. Chybové hlášky validátoru (Pokud Shoptet pod polem vypsal chybu) */
#content:has(#formForgottenPassword) .js-validator-msg,
#content:has(#formForgottenPassword) .validator-msg {
    color: #dc2626 !important; 
    font-family: var(--template-font) !important;
    font-size: clamp(1.0rem, 2vw, 1.125rem) !important;
    font-weight: 500 !important;
    margin-top: clamp(4px, 1vw, 8px) !important;
}

/* ============================================================================
   NASTAVENÍ MÉHO ÚČTU (body:has(.client-center-box)) — B2B/B2G Zákaznická zóna
   ----------------------------------------------------------------------------
   Celá stránka v brand stylu: světlé pozadí, bílé karty (fieldsety), sidebar
   jako navigační panel, sladěné formulářové prvky a pill tlačítka. Jen globální
   tokeny + clamp(). Vše scopováno pod body:has(.client-center-box).
   ============================================================================ */

/* 1) Světlé plátno stránky (přebije tmavé téma webu jen zde) */
body:has(.client-center-box) #content-wrapper {
    background: transparent !important;
}
body:has(.client-center-box) .content-wrapper-in {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: clamp(1rem, 2.5vw, 2rem) !important;
    padding-top: var(--section-padding-y) !important;
    padding-bottom: var(--section-padding-y) !important;
}

/* 2) Nadpis stránky H1 */
body:has(.client-center-box) #content h1 {
    color: #FFFFFF !important;
    font-family: var(--template-headings-font) !important;
    font-size: clamp(1.7rem, 4vw, 2.4rem) !important;
    font-weight: 700 !important;
    margin: 0 0 clamp(1rem, 3vw, 1.75rem) 0 !important;
}

/* 3) Levý sidebar — Zákaznická zóna jako navigační panel (bílá karta) */
body:has(.client-center-box) .sidebar-left {
    flex: 0 0 clamp(220px, 24vw, 280px) !important;
    max-width: 280px !important;
}
body:has(.client-center-box) .client-center-box {
    background: #FFFFFF !important;
    border-radius: var(--radius-lg) !important;
    padding: clamp(1rem, 2vw, 1.5rem) !important;
    box-shadow: 0 15px 40px rgba(13, 52, 76, 0.18) !important;
    box-sizing: border-box !important;
}
body:has(.client-center-box) .client-center-box ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: clamp(0.15rem, 0.6vw, 0.35rem) !important;
}
body:has(.client-center-box) .client-center-box li { margin: 0 !important; }

/* Odkazy v menu — pill hover, brand modrá */
body:has(.client-center-box) .client-center-box li a:not(.btn) {
    display: block !important;
    padding: clamp(0.5rem, 1.2vw, 0.7rem) clamp(0.75rem, 1.5vw, 1rem) !important;
    border-radius: 999px !important;
    color: #1A1A1A !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.3rem) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}
body:has(.client-center-box) .client-center-box li a:not(.btn):hover {
    background-color: rgba(26, 107, 155, 0.10) !important;
    color: #1A6B9B !important;
}
/* Aktivní položka */
body:has(.client-center-box) .client-center-box li.active a:not(.btn) {
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
}
/* Odhlašovací tlačítko v sidebaru */
body:has(.client-center-box) .client-center-box li.logout a.btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    margin: clamp(0.4rem, 1vw, 0.6rem) 0 !important;
    padding: clamp(0.5rem, 1.2vw, 0.65rem) 1rem !important;
    background-color: transparent !important;
    color: #1A6B9B !important;
    border: 2px solid #1A6B9B !important;
    border-radius: 999px !important;
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.25s ease !important;
}
body:has(.client-center-box) .client-center-box li.logout a.btn:hover {
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
}

/* SKRYTÍ "Moje diskuze u produktů" (B2B/B2G irelevantní) */
body:has(.client-center-box) .client-center-box a[href*="/klient/klient-diskuze/"] {
    display: none !important;
}
body:has(.client-center-box) .client-center-box li:has(> a[href*="/klient/klient-diskuze/"]) {
    display: none !important;
}

/* 4) Hlavní obsah zabere zbytek řádku */
body:has(.client-center-box) #content.content {
    flex: 1 1 clamp(320px, 60vw, 760px) !important;
    width: auto !important;
    max-width: 760px !important;
    float: none !important;
}

/* 5) JEDNA velká bílá karta = celý formulář; vnitřní fieldsety zploštělé */
body:has(.client-center-box) #content form#register-form,
body:has(.client-center-box) #content .content-inner > form {
    background: #FFFFFF !important;
    border: none !important;
    border-radius: var(--radius-lg) !important;
    padding: clamp(1.5rem, 4vw, 2.5rem) !important;
    box-shadow: 0 15px 40px rgba(13, 52, 76, 0.18) !important;
    box-sizing: border-box !important;
}

/* Vnitřní fieldsety/boxy: bez vlastní karty (žádné pozadí/stín/rádius),
   oddělené jen jemnou linkou shora s odstupem. */
body:has(.client-center-box) #content form fieldset,
body:has(.client-center-box) #content form .co-box .box {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}
/* Obal .co-box bez vlastního rámu */
body:has(.client-center-box) #content form .co-box {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Oddělovač mezi sekcemi: každá sekce kromě první dostane horní linku + mezeru.
   Sekce jsou: fieldset (Osobní údaje je uvnitř .co-registration), fieldset
   (Fakturační), .co-box (Lokalita). Řešíme přes odstup a border-top na H4 bloku. */
body:has(.client-center-box) #content form > fieldset,
body:has(.client-center-box) #content form > .co-box,
body:has(.client-center-box) #content form > .co-registration,
body:has(.client-center-box) #content form > .submit-wrapper {
    margin-top: clamp(1.5rem, 4vw, 2.25rem) !important;
    padding-top: clamp(1.5rem, 4vw, 2.25rem) !important;
    border-top: 2px solid #eef2f5 !important;
}
/* První sekce (Osobní údaje) bez horní linky/mezery */
body:has(.client-center-box) #content form > .co-registration:first-of-type,
body:has(.client-center-box) #content form > fieldset:first-of-type {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
}

/* Prázdný co-registration blok (Shoptet ho renderuje bez obsahu) — pryč,
   ať netvoří prázdné místo ani linku. */
body:has(.client-center-box) #content form > .co-registration:empty {
    display: none !important;
}

/* Nadpisy sekcí uvnitř karty */
body:has(.client-center-box) #content fieldset h4,
body:has(.client-center-box) #content .co-box h4 {
    color: #1A1A1A !important;
    font-family: var(--template-headings-font) !important;
    font-size: clamp(1.25rem, 2.5vw, 1.6rem) !important;
    font-weight: 700 !important;
    margin: 0 0 clamp(0.85rem, 2vw, 1.25rem) 0 !important;
    padding: 0 !important;
    border-bottom: none !important;
}

/* 6) Formulářové skupiny */
body:has(.client-center-box) #content .form-group {
    display: flex !important;
    flex-direction: column !important;
    gap: clamp(0.3rem, 1vw, 0.5rem) !important;
    margin-bottom: clamp(0.85rem, 2vw, 1.15rem) !important;
}
body:has(.client-center-box) #content .form-group label {
    display: block !important;
    position: static !important;   /* zruší smart-label plovoucí placeholder */
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
    color: #333333 !important;
    font-family: var(--template-font) !important;
    /* Sladěno se základním textem "p" na webu */
    font-size: clamp(1.1rem, 1.15vw, 1.3rem) !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;   /* KLÍČ: smart-label dával velkou line-height → obří mezera při zalomení */
    white-space: normal !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* Text uvnitř labelu (Shoptet balí popisek do <span>, který dědil bílou
   z tmavého tématu webu → na bílé kartě neviditelný). Vynutíme tmavou + line-height. */
body:has(.client-center-box) #content .form-group label span,
body:has(.client-center-box) #content .form-group label .required-asterisk {
    color: #333333 !important;
    font-size: inherit !important;
    line-height: inherit !important;
}
/* Povinná pole — hvězdička za textem */
body:has(.client-center-box) #content .required-asterisk::after {
    content: " *" !important;
    color: #dc2626 !important;
    font-weight: 700 !important;
}

/* 7) Inputy a selecty — pill/bevel v brand stylu */
body:has(.client-center-box) #content .form-control {
    width: 100% !important;
    padding: clamp(0.6rem, 1.5vw, 0.8rem) clamp(1.1rem, 2.5vw, 1.4rem) !important;
    background-color: #FFFFFF !important;
    color: #1A1A1A !important;
    border: 2px solid #1A6B9B !important;   /* brand modrý border */
    border-radius: 999px !important;        /* pill tvar */
    font-family: var(--template-font) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.3rem) !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}
body:has(.client-center-box) #content .form-control:focus {
    background-color: #FFFFFF !important;
    border-color: #1A6B9B !important;
    box-shadow: 0 0 0 3px rgba(26, 107, 155, 0.18) !important;
    outline: none !important;
}
body:has(.client-center-box) #content .form-control::placeholder {
    color: #90a0ad !important;
    opacity: 1 !important;
}
body:has(.client-center-box) #content select.form-control {
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A6B9B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right clamp(1.1rem, 2.5vw, 1.4rem) center !important;
    background-size: 1.1em !important;
    padding-right: clamp(2.75rem, 5.5vw, 3.25rem) !important;
}

/* Telefon s předvolbou — sladění comboboxu */
body:has(.client-center-box) #content .phone-combined-input {
    display: flex !important;
    align-items: stretch !important;
    gap: clamp(0.4rem, 1vw, 0.6rem) !important;
}
/* Předvolba telefonu — název státu (.shp-flag-name) dědil bílou z tmavého tématu → na bílé kartě neviditelný */
body:has(.client-center-box) #content .shp-flag-name {
    color: #1A1A1A !important;
}
/* Pole s tooltipem (DIČ) — label a "?" na jednom řádku, input pod nimi.
   Shoptet renderuje "?" jako position:absolute → bez ukotvení odlétal daleko
   vpravo. Přepneme skupinu na řádkový flex a "?" dáme static hned za label. */
body:has(.client-center-box) #content .form-group-hasTooltip {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    column-gap: 0.5rem !important;
    row-gap: clamp(0.3rem, 1vw, 0.5rem) !important;
    position: relative !important;
}
/* Label jen na šířku textu (ne 100%), ať "?" sedí těsně za ním */
body:has(.client-center-box) #content .form-group-hasTooltip > label {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    order: 1 !important;
    margin: 0 !important;
}
body:has(.client-center-box) #content .form-group-hasTooltip .form-group-tooltip {
    flex: 0 0 auto !important;
    order: 2 !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    margin: 0 !important;
}
body:has(.client-center-box) #content .form-group-hasTooltip::after {
    content: "" !important;
    flex: 1 0 100% !important;
    width: 100% !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    order: 3 !important;
}
/* Input a validační hláška zaberou celý řádek pod popiskem */
body:has(.client-center-box) #content .form-group-hasTooltip .form-control {
    order: 4 !important;
}
body:has(.client-center-box) #content .form-group-hasTooltip .js-validator-msg,
body:has(.client-center-box) #content .form-group-hasTooltip .validator-msg,
body:has(.client-center-box) #content .form-group-hasTooltip .sr-only {
    order: 4 !important;
    flex: 0 0 100% !important;
}

body:has(.client-center-box) #content .form-group-tooltip {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: 1.4em !important;
    height: 1.4em !important;
    background: #1A6B9B !important;
    color: #FFFFFF !important;
    border-radius: 50% !important;
    font-size: 0.85em !important;
    font-weight: 700 !important;
    cursor: help !important;
}

/* 8) "Doručovací adresy" → prázdný stav */
body:has(.client-center-box) #content .co-registration p {
    color: #5b6b7a !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1.1rem, 1.15vw, 1.3rem) !important;
    margin: 0 0 clamp(0.75rem, 2vw, 1rem) 0 !important;
}

/* 9) Sekundární tlačítko "Přidat nové místo instalace" */
body:has(.client-center-box) #content .co-registration a.btn-secondary {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: clamp(0.65rem, 1.6vw, 0.85rem) clamp(1.25rem, 3vw, 1.75rem) !important;
    background-color: transparent !important;
    color: #1A6B9B !important;
    border: 2px solid #1A6B9B !important;
    border-radius: 999px !important;
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    font-size: clamp(1rem, 1.8vw, 1.1rem) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    text-decoration: none !important;
    transition: all 0.25s cubic-bezier(0.25, 1, 0.5, 1) !important;
}
body:has(.client-center-box) #content .co-registration a.btn-secondary:hover {
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(26, 107, 155, 0.4) !important;
}

/* 10) Hlavní "Uložit" — primární pill tlačítko */
body:has(.client-center-box) #content .submit-wrapper p { margin: 0 !important; }
body:has(.client-center-box) #content .submit-wrapper input[type="submit"].btn {
    width: 100% !important;
    max-width: 320px !important;
    height: clamp(48px, 6vw, 54px) !important;
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    border: 2px solid #1A6B9B !important;
    border-radius: 999px !important;
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    font-size: clamp(1.1rem, 2vw, 1.25rem) !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    -webkit-appearance: none !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
}
body:has(.client-center-box) #content .submit-wrapper input[type="submit"].btn:hover {
    background-color: #14567d !important;
    border-color: #14567d !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(26, 107, 155, 0.4) !important;
}

/* 11) Skrytí honeypotu / technických polí */
body:has(.client-center-box) #content .no-display { display: none !important; }

/* 12) Responzivita: pod 860px sidebar nad obsah, plná šířka */
@media (max-width: 860px) {
    body:has(.client-center-box) .content-wrapper-in { flex-direction: column !important; }
    body:has(.client-center-box) .sidebar-left {
        flex: 1 1 100% !important;
        max-width: 100% !important;
        width: 100% !important;
    }
    body:has(.client-center-box) #content.content {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}
/* ============================================================================
   KLIENTSKÉ CENTRUM — obsah podstránek BEZ formuláře jako bílá karta
   (nastavení má kartou samotný #register-form; ostatní stránky nemají formulář,
   proto kartujeme .content-inner). Scope shodný se zbytkem: body:has(.client-center-box).
   ============================================================================ */
body:has(.client-center-box) #content .content-inner:not(:has(form)) {
    background: #FFFFFF !important;
    border-radius: var(--radius-lg) !important;
    padding: clamp(1.5rem, 4vw, 2.5rem) !important;
    box-shadow: 0 15px 40px rgba(13, 52, 76, 0.18) !important;
    box-sizing: border-box !important;
    color: #1A1A1A !important;
}

/* H1 jako tmavý nadpis karty — přebíjí bílý H1 z nastavení, (1,2,3) > (1,1,2) */
body:has(.client-center-box) #content .content-inner:not(:has(form)) h1 {
    color: #1A1A1A !important;
    margin-top: 0 !important;
}

/* Čitelný text/nadpisy v kartě */
body:has(.client-center-box) #content .content-inner:not(:has(form)) h2,
body:has(.client-center-box) #content .content-inner:not(:has(form)) h3,
body:has(.client-center-box) #content .content-inner:not(:has(form)) h4,
body:has(.client-center-box) #content .content-inner:not(:has(form)) p,
body:has(.client-center-box) #content .content-inner:not(:has(form)) li,
body:has(.client-center-box) #content .content-inner:not(:has(form)) td,
body:has(.client-center-box) #content .content-inner:not(:has(form)) th {
    color: #1A1A1A !important;
    font-family: var(--template-font) !important;
}

/* Odkazy v kartě v brand modré (přebije globální a:not(.btn){color:#fff}) */
body:has(.client-center-box) #content .content-inner:not(:has(form)) a:not(.btn) {
    color: #1A6B9B !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* Tabulky dokladů/faktur do brand stylu */
body:has(.client-center-box) #content .content-inner:not(:has(form)) table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-top: clamp(0.75rem, 2vw, 1.25rem) !important;
}
body:has(.client-center-box) #content .content-inner:not(:has(form)) th,
body:has(.client-center-box) #content .content-inner:not(:has(form)) td {
    padding: clamp(0.5rem, 1.2vw, 0.75rem) clamp(0.6rem, 1.5vw, 1rem) !important;
    border-bottom: 1px solid #eef2f5 !important;
    text-align: left !important;
    vertical-align: middle !important;
}
body:has(.client-center-box) #content .content-inner:not(:has(form)) thead th {
    font-family: var(--template-headings-font) !important;
    font-weight: 700 !important;
    border-bottom: 2px solid #1A6B9B !important;
}
/* ============================================================================
   PŘIHLAŠOVACÍ MODAL (#login) — White Card v brand stylu
   Plně responzivní, jen globální tokeny + clamp(). Sladěno s body.in-login.
   Vše scopováno pod #login, aby to nezasahovalo do zbytku webu.
   ============================================================================ */

/* 1) Overlay celé obrazovky — tmavý scrim + centrování obsahu flexem.
      Horní padding drží obsah pod headerem i na nízkých displejích.
      DŮLEŽITÉ: display:flex jen pro OTEVŘENÝ stav ([open]/.is-visible), jinak by
      !important držel dialog zobrazený i po zavření (× by „nic nedělalo"). */
dialog#login.dialog--modal[open],
dialog#login.dialog--modal.is-visible {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    border: none !important;
    padding: clamp(90px, 12vh, 130px) clamp(16px, 5vw, 40px) clamp(24px, 6vh, 56px) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(13, 52, 76, 0.55) !important;   /* brand navy scrim */
    -webkit-backdrop-filter: blur(6px) !important;
    backdrop-filter: blur(6px) !important;
    box-sizing: border-box !important;
    overflow-y: auto !important;
    /* Pod headerem (ten má max z-index), ale nad zbytkem webu */
    z-index: 2147483646 !important;
}

/* Zavřený stav: žádné vynucené zobrazení — ať ho Shoptet/UA může schovat */
dialog#login.dialog--modal:not([open]):not(.is-visible) {
    display: none !important;
}

/* Nativní ::backdrop necháme průhledný — scrim řešíme přímo na dialogu */
#login.dialog--modal::backdrop {
    background: transparent !important;
}

/* 2) Zavírací „×" — řádek o šířce karty, tlačítko zarovnané vpravo a záporným
      margin-bottem stažené tak, aby překrylo pravý horní roh karty.
      Nezávislé na výšce karty → karta může zůstat na středu. */
#login .dialog__close--arrow {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    justify-content: flex-end !important;
    width: min(92vw, 460px) !important;
    max-width: 460px !important;
    /* stáhne kartu nahoru pod tlačítko (≈ výška tlačítka + odstup) */
    margin: 0 0 calc(-1 * (clamp(34px, 5vw, 42px) + clamp(12px, 1.8vw, 18px))) !important;
    padding: clamp(12px, 1.8vw, 18px) clamp(12px, 1.8vw, 18px) 0 0 !important;
    background: transparent !important;
    z-index: 3 !important;            /* nad kartou */
    pointer-events: none !important;  /* klikací je jen samotné tlačítko */
}

#login .dialog__close--arrow .toggle-window-arr {
    pointer-events: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: clamp(34px, 5vw, 42px) !important;
    height: clamp(34px, 5vw, 42px) !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    /* skryje text "Zpět do obchodu" i případnou ikonu šipky ze Shoptetu */
    font-size: 0 !important;
    line-height: 0 !important;
    text-indent: 0 !important;
    overflow: hidden !important;
    color: #1A1A1A !important;
    background: #f6f7f8 !important;
    border: 1px solid #d8dee3 !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

/* Vykreslení samotného „×" přes masku (currentColor → dědí barvu tlačítka) */
#login .dialog__close--arrow .toggle-window-arr::before {
    content: "" !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: 44% !important;
    height: 44% !important;
    margin: 0 !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3C/svg%3E") no-repeat center / contain !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3C/svg%3E") no-repeat center / contain !important;
}
/* Skrytí případného textového <span> ("do obchodu") */
#login .dialog__close--arrow .toggle-window-arr span {
    display: none !important;
}

#login .dialog__close--arrow .toggle-window-arr:hover {
    background: #1A6B9B !important;
    color: #ffffff !important;
    border-color: #1A6B9B !important;
}

/* 3) Obal — vyřazen z layoutu (display:contents), aby karta byla přímo flex-item
      dialogu a centrovala se spolu s „×" řádkem. */
#login .dialog__wrapper {
    display: contents !important;
}

/* 4) Samotná White Card — normální flex-item, na středu (řeší flex dialogu) */
#login .dialog__content--form {
    position: relative !important;
    inset: auto !important;
    transform: none !important;
    background: #ffffff !important;
    width: min(92vw, 460px) !important;
    max-width: 460px !important;
    margin: 0 !important;
    padding: clamp(24px, 5vw, 40px) !important;
    border-radius: var(--radius-lg) !important;        /* 24px */
    box-shadow: 0 25px 60px rgba(13, 52, 76, 0.35) !important;
    box-sizing: border-box !important;
    z-index: 2 !important;
}

#login .dialog__header {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* 5) Nadpis — stejný řez jako h1 na in-login stránce */
#login .dialog__heading--login {
    color: #1A1A1A !important;
    font-family: var(--template-headings-font) !important;
    font-size: clamp(1.6rem, 4vw, 2.1rem) !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin: 0 0 clamp(20px, 3vw, 32px) !important;
    padding: 0 clamp(28px, 7vw, 44px) !important;   /* prostor, aby text nelezl pod „×" */
    text-align: center !important;
}

/* 6) Tělo dialogu + formulář jako svislý stack */
#login .dialog__body {
    padding: 0 !important;
}

#login .formLogin {
    display: flex !important;
    flex-direction: column !important;
    gap: clamp(12px, 2vw, 16px) !important;
    margin: 0 !important;
}

#login .formLogin .form-group {
    margin: 0 !important;
    padding: 0 !important;
}

#login .input-wrapper {
    width: 100% !important;
    margin: 0 !important;
}

/* 7) Vstupní pole — shodná s in-login (bg, border, radius-sm), vše v clamp() */
#login .form-control {
    width: 100% !important;
    height: clamp(48px, 6vw, 54px) !important;
    background-color: #f6f7f8 !important;
    border: 1px solid #1A6B9B !important;
    border-radius: var(--radius-sm) !important;        /* 8px */
    padding: clamp(10px, 1.8vw, 12px) clamp(16px, 2.5vw, 20px) !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1.05rem, 2vw, 1.375rem) !important;
    font-weight: 400 !important;
    color: #1a1a1a !important;
    box-sizing: border-box !important;
    transition: all 0.25s ease-in-out !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

#login .form-control:focus {
    background-color: #ffffff !important;
    border-color: #1A6B9B !important;
    box-shadow: 0 0 0 3px rgba(26, 107, 155, 0.15) !important;
    outline: none !important;
}

#login .form-control::placeholder {
    color: #5b6b7a !important;
    opacity: 1 !important;
}

/* 8) Wrapper s tlačítkem a pomocnými odkazy */
#login .login-wrapper {
    display: flex !important;
    flex-direction: column !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 9) Hlavní tlačítko — pill + ikona zámku (stejná maska jako in-login) */
#login .btn-login {
    width: 100% !important;
    min-height: clamp(48px, 6vw, 54px) !important;
    background-color: #1A6B9B !important;
    color: #FFFFFF !important;
    border: 2px solid #1A6B9B !important;
    border-radius: 999px !important;
    font-family: var(--template-headings-font) !important;
    font-weight: 600 !important;
    font-size: clamp(1.1rem, 2vw, 1.25rem) !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1) !important;
    margin-top: clamp(4px, 1.5vw, 8px) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}

#login .btn-login:hover {
    background-color: #14567d !important;
    border-color: #14567d !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(26, 107, 155, 0.4) !important;
}

#login .btn-login::before {
    content: "" !important;
    display: inline-block !important;
    width: clamp(20px, 3vw, 24px) !important;
    height: clamp(20px, 3vw, 24px) !important;
    margin-right: clamp(8px, 1.5vw, 12px) !important;
    flex-shrink: 0 !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E") no-repeat center / contain !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E") no-repeat center / contain !important;
}

/* 10) Pomocné odkazy (Nová registrace / Zapomenuté heslo) */
#login .password-helper {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: clamp(12px, 2vw, 16px) !important;
    margin-top: clamp(12px, 2vw, 14px) !important;
}

#login .password-helper a {
    color: #1A6B9B !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1rem, 2vw, 1.15rem) !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: color 0.2s ease, text-decoration 0.2s ease !important;
}

#login .password-helper a:hover {
    color: #14567d !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
}

/* 11. Serverová flash hláška přesunutá JS-em pod input pole (.pdz-forgotten-alert)
   ----------------------------------------------------------------------------
   JS (PDZ1_global_V51+) přenese Shoptet zprávu (např. "E-mail se nenachází
   v databázi") sem pod input a přidá třídu .pdz-forgotten-alert. Stylizujeme ji
   jako trvalý, dobře viditelný alert v brand duchu — světle červená karta
   s levým pruhem a výstražnou ikonou. */
#formForgottenPassword .pdz-forgotten-alert {
    display: flex !important;
    align-items: flex-start !important;
    gap: clamp(0.5rem, 1.5vw, 0.75rem) !important;
    width: 100% !important;
    margin: clamp(0.4rem, 1.5vw, 0.75rem) 0 0 0 !important;
    padding: clamp(0.75rem, 2vw, 1rem) clamp(0.85rem, 2.5vw, 1.15rem) !important;
    background-color: #fef2f2 !important;      /* světle červené pozadí */
    border: 1px solid #fecaca !important;
    border-left: 4px solid #dc2626 !important; /* výrazný levý pruh */
    border-radius: var(--radius-sm) !important;
    box-sizing: border-box !important;

    /* Text hlášky */
    color: #b91c1c !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1.0rem, 2vw, 1.125rem) !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    text-align: left !important;

    /* Jemné zjevení, ať alert "naskočí" a upoutá pozornost */
    animation: pdzForgottenAlertIn 0.35s cubic-bezier(0.25, 1, 0.5, 1) both !important;
}

/* Výstražná ikona (⚠) před textem přes ::before */
#formForgottenPassword .pdz-forgotten-alert::before {
    content: "" !important;
    flex: 0 0 auto !important;
    width: clamp(18px, 4vw, 22px) !important;
    height: clamp(18px, 4vw, 22px) !important;
    margin-top: 1px !important;
    background-color: #dc2626 !important;
    /* Vykreslení ikony přes mask, ať dědí barvu (technika ze sekce ikon) */
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E") !important;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E") !important;
    -webkit-mask-repeat: no-repeat !important;
    mask-repeat: no-repeat !important;
    -webkit-mask-size: contain !important;
    mask-size: contain !important;
    -webkit-mask-position: center !important;
    mask-position: center !important;
}

/* Uvnitř přesunuté hlášky Shoptet občas nechá <ul>/<li> odrážky — zneškodníme */
#formForgottenPassword .pdz-forgotten-alert ul,
#formForgottenPassword .pdz-forgotten-alert li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Pokud Shoptet do hlášky vloží zavírací křížek, na trvalém alertu ho skryjeme */
#formForgottenPassword .pdz-forgotten-alert .messages-close,
#formForgottenPassword .pdz-forgotten-alert .message__close,
#formForgottenPassword .pdz-forgotten-alert .close {
    display: none !important;
}

@keyframes pdzForgottenAlertIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* 11) Honeypot a technické prvky vždy skryté */
#login .no-display,
#login input[name="surname"] {
    display: none !important;
}

/* 12) Chybové hlášky validátoru */
#login .js-validator-msg,
#login .validator-msg {
    color: #dc2626 !important;
    font-family: var(--template-font) !important;
    font-size: clamp(1rem, 2vw, 1.125rem) !important;
    font-weight: 500 !important;
    margin-top: clamp(4px, 1vw, 6px) !important;
    text-align: left !important;
}



/* 13) Mobil — odkazy pod sebe, jistá boční vůle */
@media (max-width: 640px) {
    #login .password-helper {
        flex-direction: column !important;
        gap: 12px !important;
        text-align: center !important;
    }
}

.pdz-cena-individualne {
    font-family: var(--template-headings-font, 'Montserrat', sans-serif);
    font-weight: 700;
    color: #1A1A1A !important;
    font-size: clamp(1rem, 1rem + 0.4vw, 1.2rem);
    line-height: 1.2;
    white-space: nowrap;
}

/* Cena individuálně — skrytí ovládání množství (košík, rekapitulace, detail) */
.pdz-ind-hidden {
    display: none !important;
}