/* =========================================================
   STICKY MENU
   ========================================================= */



/* =========================================================
   ZÁKLADNÍ OBAL
   ========================================================= */

.sticky-header-wrapper {
    position: relative;
    z-index: 900;
}

/* Oprava overflow:hidden v šabloně */
.overall-wrapper.sticky-overflow-fix {
    overflow: visible !important;
}



/* =========================================================
   STICKY STAV :: TOP NAVIGATION BAR
   ========================================================= */

.sticky-header-wrapper.is-sticky .top-navigation-bar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 1001 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
    animation: stickySlideDown .3s ease forwards;
}



/* =========================================================
   STICKY STAV :: HEADER
   ========================================================= */

/* "top" se nastavuje přes JS inline, proto sem nepatří */
.sticky-header-wrapper.is-sticky #header {
    position: fixed !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 1000 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .12);
    animation: stickySlideDown .3s ease .04s forwards;
}



/* =========================================================
   ANIMACE
   ========================================================= */

@keyframes stickySlideDown {
    from {
        transform: translateY(-100%);
        opacity: .5;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}



/* =========================================================
   ÚPRAVY PŘI STICKY STAVU
   ========================================================= */

@media (min-width: 1000px) {

    .sticky-header-wrapper.is-sticky #header img[alt="Vyspimese.CZ"] {
        height: 51px;
        width: auto;
        transition: height .3s;
    }

    .sticky-header-wrapper.is-sticky #header .header-main {
        padding-top: 6px;
        padding-bottom: 6px;
    }

    .sticky-header-wrapper.is-sticky #header .header-top {
        height: auto;
        margin: 0;
        padding: 1rem 0;
        align-items: center;
    }

    /* Logo — shrinkne na obsah, uvolní místo */
    .sticky-header-wrapper.is-sticky #header .header-top > div:nth-of-type(1) {
        flex: 0 0 auto;
        width: auto;
    }

    /* Search — 30px od loga, zachová svou šířku */
    .sticky-header-wrapper.is-sticky #header .header-top > div:nth-of-type(2) {
        flex: 0 0 490px;
        margin-left: 30px;
    }

    /* NavDiv — margin-left: auto ho posune úplně doprava */
    .sticky-header-wrapper.is-sticky #header .header-top > div:nth-of-type(3) {
        flex: 0 0 560px;
        margin-left: auto;
    }

    .sticky-header-wrapper.is-sticky #header .compact-form .form-control {
        padding: 20px !important;
    }

    .sticky-header-wrapper.is-sticky #header .compact-form .btn {
        height: 47.5px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .sticky-header-wrapper.is-sticky #header nav.navigation {
        padding-top: 4px;
        padding-bottom: 4px;
    }

    .sticky-header-wrapper.is-sticky .desktop-anime-1::before {
        display: none;
    }

    /* Registrace + Přihlášení — skrýt při sticky */
    .sticky-header-wrapper.is-sticky .link-reg,
    .sticky-header-wrapper.is-sticky [data-testid="signin"] {
        display: none !important;
    }

    .sticky-header-wrapper.is-sticky .navigation-in {
        line-height: 15px;
    }

    /* Heureka — zmenšit mezeru mezi hvězdičkami a textem recenzí */
    .sticky-header-wrapper.is-sticky .review-summary__count {
        margin-top: -4px;
    }

    .sticky-header-wrapper.is-sticky #navigation {
        height: auto;
        margin-bottom: 5px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    .sticky-header-wrapper.is-sticky .navigation-in {
        background-color: #239ceb;
        border-radius: 4px;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        -ms-border-radius: 4px;
        -o-border-radius: 4px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
}



/* =========================================================
   STICKY MENU :: KONEC
   ========================================================= */



/* =========================================================
   ÚPRAVY ZÁHLAVÍ
   ========================================================= */

@media (min-width: 768px) {

    /* Reset výšek — zrušení hardkodovaných výšek z customNav.css (li i div) */
    .navigation-in .menu-level-2 li.has-third-level {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
    }

    .navigation-in .menu-level-2 li.has-third-level > div {
        height: auto !important;
        min-height: unset !important;
    }

    .navigation-in .menu-level-2 li.has-third-level > a.menu-image {
        min-height: unset !important;
    }

    .navigation-in .menu-level-2 li.has-third-level > div a {
        min-height: unset !important;
    }

    /* Flex layout pro ul uvnitř navigace */
    .navigation-in ul {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
        row-gap: 12px;
    }

    /* Spodní odsazení popup menu — poslední řádek boxů nebude nalepený na okraj */
    .navigation-in ul.menu-level-2 {
        padding-bottom: 12px !important;
    }

    /* Zarovnání položek ext doleva nahoře */
    .navigation-in > ul > li.ext > ul > li {
        align-items: flex-start;
    }

    /* a.menu-image — reset padding-top i padding-bottom (Shoptet: 20px oběma směry) */
    /* Pokrývá i položky bez třídy has-third-level (např. Pro hotely, Péče o dítě) */
    .navigation-in .menu-level-2 li > a.menu-image {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    .navigation-in .menu-level-2 li.has-third-level:not(.boxContent) > a.menu-image {
        position: relative !important;
        padding: 0 10px !important;
    }

    /* Reset padding-left na div vedle obrázku */
    .navigation-in .menu-level-2 li.has-third-level:not(.boxContent) > div {
        padding-left: 0 !important;
    }

    /* Reset padding na odkazech uvnitř div (přebíjí allstyles.css nth-last-of-type pravidla) */
    .navigation-in .menu-level-2 li.has-third-level:not(.boxContent) > div a {
        padding-left: 0 !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-683 (Matrace) — CSS Grid
       ------------------------------------------------- */

    /* Grid 4 sloupce — display:grid jen při :hover, aby nepřebíjelo Shoptet display:none */
    .menu-item-683.ext:hover > ul.menu-level-2 {
        display: grid !important;
    }
    .menu-item-683 .menu-level-2 {
        grid-template-columns: repeat(4, 1fr) !important;
    }

    /* Reset flex šířek — grid je řídí sám */
    .menu-item-683 .menu-level-2 > li.has-third-level {
        flex: unset !important;
        width: unset !important;
        max-width: unset !important;
    }

    /* #14 Zdravotní matrace (pozice 9) přes 2 řádky */
    .menu-item-683 .menu-level-2 > li.has-third-level:nth-child(9) {
        grid-row: span 2;
    }

    /*
     * 2026-04-16 — Reset výšek pro menu-item-683 s vyšší specificitou
     *
     * allstyles.css (Shoptet) obsahuje pravidla jako:
     *   li.menu-item-6738:nth-last-of-type(5..8) { max-height: 50px !important; min-height: 50px !important; }
     *   li.menu-item-6738:first-of-type..nth-of-type(3) { min-height: 230px; }
     *   ...a další nth-child výšky z customNav.css
     *
     * Tato pravidla mají specificitu 0,4,1 — obecný reset výše (.navigation-in .menu-level-2 li...)
     * má jen 0,3,1 a prohrává. Po přeuspořádání položek menu (jiné pořadí než originál)
     * se tato hardkodovaná pravidla aplikují na špatné položky (např. #8 dostalo max-height:50px).
     *
     * Řešení: stejný reset se specificitu 0,4,1 → při stejné specificitě vítězí pozdější pravidlo
     * (náš CSS soubor se načítá za allstyles.css).
     */
    .navigation-in .menu-item-683 .menu-level-2 li.has-third-level {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
        padding-bottom: 0 !important;  /* allstyle: li.menu-item-6738:nth-last-of-type(1-4) { padding-bottom: 2rem } */
    }

    .navigation-in .menu-item-683 .menu-level-2 li.has-third-level > div {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
    }

    .navigation-in .menu-item-683 .menu-level-2 li.has-third-level > a.menu-image {
        min-height: unset !important;
        max-height: none !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-699 (Polštáře) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — Override Shoptet layout pro Polštáře
     *
     * allstyles.css definuje pro menu-item-699 (stejný vzor jako 717):
     *   .menu-item-699 .menu-level-2 { padding-left: 20rem; position: relative; min-height: 275px; }
     *   .menu-item-699 .menu-level-2 li.has-third-level:first-of-type { position: absolute !important; top: 20px; left: 0; }
     *   .navigation-in li.menu-item-699 .menu-level-2 > li:not(:first-of-type) { flex-basis: 33% !important; width: 33% !important; }
     *
     * First-of-type absolutně pozicovaný + 320px padding-left + forced 33% šířky
     * způsobuje překrývání boxů s naším flex layoutem.
     */
    .menu-item-699 .menu-level-2 {
        padding-left: 0 !important;
        min-height: unset !important;
    }

    .menu-item-699 .menu-level-2 li.has-third-level:first-of-type {
        position: relative !important;
        top: auto !important;
        left: auto !important;
    }

    .menu-item-699 .menu-level-2 > li.has-third-level {
        flex-basis: 25% !important;
        max-width: 25% !important;
        box-sizing: border-box !important;
    }

    .navigation-in .menu-item-699 .menu-level-2 li.has-third-level {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
    }

    .navigation-in .menu-item-699 .menu-level-2 li.has-third-level > div {
        height: auto !important;
        min-height: unset !important;
        margin-top: 0 !important;  /* allstyle: .navigation-in > ul > li.menu-item-699.ext > ul > li > div { margin-top: 1rem } */
    }

    /* -------------------------------------------------
       POUZE menu-item-700 (Postele) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — Override Shoptet layout pro Postele
     *
     * allstyles.css definuje pro menu-item-700:
     *   .menu-level-2 { min-height: 440px; position: relative; }
     *   li:nth-child(-n+3), div { height: 280px !important }          — první 3 položky fixní výška
     *   li:nth-child(n+5):nth-child(-n+7), last-child { min-height: 280px !important }
     *   li:nth-of-type(4) { min-height: 280px; position: relative }   — item 4 (boxContent)
     *   li:nth-of-type(4) div { position: absolute; top: 0 }
     *   .boxContent { min-height: 300px !important; position: relative !important }
     *   .posteleNamiru { position: absolute !important; left: 50%; top: 0; transform: translate(-50%) }
     *   a.menu-image (prvních 7) { position: absolute; top: 0 }
     *   > li { flex-basis: 25%; width: 25% }                          — 4 sloupce (to nám vyhovuje)
     */
    .menu-item-700 .menu-level-2 {
        min-height: unset !important;
    }

    /*
     * specificita (0,5,3) — přebíjí allstyle pravidla:
     *   .menu-item-700 ul.menu-level-2 li.has-third-level:nth-child(-n+3) { height:280px !important }     → (0,4,2)
     *   .menu-item-700 ul.menu-level-2 li.has-third-level:nth-child(n+5):nth-child(-n+7) { min-height:280px !important } → (0,5,2)
     *   .menu-item-700 .menu-level-2 li.has-third-level:last-child { min-height:280px !important }        → (0,4,1)
     * li.menu-item-700 má třídu .ext → selector (0,5,3) > (0,5,2)
     */
    .navigation-in li.menu-item-700.ext ul.menu-level-2 li.has-third-level {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
    }

    .navigation-in li.menu-item-700.ext ul.menu-level-2 li.has-third-level > div {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
        position: static !important;
    }

    .navigation-in li.menu-item-700.ext ul.menu-level-2 li.has-third-level > a.menu-image {
        position: relative !important;
        top: auto !important;
    }

    /* boxContent (Postele na míru) — reset absolutního centrování .posteleNamiru */
    .menu-item-700 .boxContent {
        min-height: unset !important;
        position: static !important;
    }

    .menu-item-700 .posteleNamiru {
        position: static !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-704 (Rošty do postele) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — allstyle.css pro menu-item-704:
     *   li.has-third-level:nth-of-type(4) { min-height: 220px; position: relative }
     *   li.has-third-level:nth-of-type(4) div { position: absolute; top: 0 }
     *   li:nth-child(-n+8):not(.boxContent) > a.menu-image { position: absolute; top: 0 } → spec (0,5,2) — řeší obecný reset !important
     *   li:nth-child(-n+8):not(.boxContent) > div { padding-left: 8rem }               → řeší obecný reset !important
     *   .menu-item-683 .matraceNamiru, .menu-item-704 .matraceNamiru { position: absolute !important; left: 50%; top: 0; transform: translate(-50%) }
     *     → boxContent (Postelové rošty na míru) se smrsknout na li_h: 2px
     */
    .navigation-in li.menu-item-704.ext ul.menu-level-2 li.has-third-level {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
    }

    .navigation-in li.menu-item-704.ext ul.menu-level-2 li.has-third-level > div {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
        position: static !important;
    }

    /*
     * allstyle.css nastavuje pro posledních ~4 položky (nth-last-child):
     *   div { display: flex; flex-direction: column; align-items: center; justify-content: center }
     * Anchor (nadpis) uvnitř divu tak dostane jen šířku textu a je centrován
     * horizontálně → vizuálně se posune ~65px doprava od levého okraje.
     * Fix: resetovat na flex-start pro celý menu-item-704.
     */
    .navigation-in li.menu-item-704.ext ul.menu-level-2 li.has-third-level > div {
        align-items: flex-start !important;
        justify-content: flex-start !important;
    }

    /* boxContent (Postelové rošty na míru) — reset absolutního centrování .matraceNamiru */
    .menu-item-704 .boxContent {
        min-height: unset !important;
        position: static !important;
    }

    .menu-item-704 .matraceNamiru {
        position: static !important;
        left: auto !important;
        top: auto !important;
        transform: none !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-717 (Přikrývky) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — Override Shoptet layout pro Přikrývky
     *
     * allstyles.css (@media min-width:1200px) definuje pro menu-item-717:
     *   .menu-item-717 .menu-level-2 { padding-left: 20rem; position: relative; }
     *   .menu-item-717 .menu-level-2 li.has-third-level:first-of-type { position: absolute !important; top: 20px; left: 0; }
     *
     * Původní design předpokládal velký featured blok vlevo (first-of-type absolutně pozicovaný
     * s 320px rezervovaným místem v kontejneru). S naším flex layoutem a custom HTML
     * způsobuje toto absolutní pozicování překrývání všech boxů.
     *
     * Řešení: reset padding-left kontejneru a position první položky zpět na relative.
     * Navíc reset height:140px !important který Shoptet aplikuje na položky 2–4.
     */
    .menu-item-717 .menu-level-2 {
        padding-left: 0 !important;
    }

    .menu-item-717 .menu-level-2 li.has-third-level:first-of-type {
        position: relative !important;
        top: auto !important;
        left: auto !important;
    }

    .menu-item-717 .menu-level-2 > li.has-third-level {
        flex-basis: 25% !important;
        max-width: 25% !important;
        box-sizing: border-box !important;
    }

    .navigation-in .menu-item-717 .menu-level-2 li.has-third-level {
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
    }

    .navigation-in .menu-item-717 .menu-level-2 li.has-third-level > div {
        height: auto !important;
        min-height: unset !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-11052 (Pro hotely, penziony) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — Shoptet cross-origin CSS nastavuje pro tyto položky:
     *   a.menu-image { padding-top: 20px; padding-bottom: 20px }  — extra mezera kolem obrázku
     *   li { min-height: 75px }             — zbytečná pevná výška
     * Položky NEMAJÍ třídu has-third-level → obecné resety výše je míjely.
     */
    .navigation-in .menu-item-11052 .menu-level-2 li {
        min-height: unset !important;
        height: auto !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-6311 (Péče o dítě) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — allstyle.css:
     *   .menu-item-6311 ul.menu-level-2 li.has-third-level { height: 150px !important }  → specificita (0,3,2)
     *   cross-origin CSS: li { min-height: 75px } pro položky bez has-third-level
     */
    /* Reset height: 150px — specificita (0,4,2) přebíjí allstyle (0,3,2) */
    .navigation-in .menu-item-6311 ul.menu-level-2 li.has-third-level {
        height: auto !important;
        min-height: unset !important;
    }

    /* Reset pro položky bez has-third-level */
    .navigation-in .menu-item-6311 .menu-level-2 li {
        min-height: unset !important;
        height: auto !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-6314 (Domácnost) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — allstyle.css:
     *   .navigation-in > ul > li.menu-item-6314.ext > ul > li > div { margin-top: 1rem; min-height: 80px }
     *   cross-origin CSS: li (bez has-third-level) { min-height: 75px }
     */
    .navigation-in .menu-item-6314 .menu-level-2 li {
        min-height: unset !important;
        height: auto !important;
    }

    .navigation-in .menu-item-6314 .menu-level-2 li > div {
        margin-top: 0 !important;
        min-height: unset !important;
    }

    /* -------------------------------------------------
       POUZE menu-item-6317 (Lůžkoviny) — layout fix
       ------------------------------------------------- */

    /*
     * 2026-04-16 — allstyle.css:
     *   .menu-item-6317 .menu-level-3 { min-height: 300px }
     * ul.menu-level-3 (seznam odkazů uvnitř boxu) roztahuje box na ~331px.
     */
    .menu-item-6317 .menu-level-3 {
        min-height: unset !important;
    }

}

/* =========================================================
   ÚPRAVY ZÁHLAVÍ :: KONEC
   ========================================================= */

@media only screen and (min-width: 768px) {
    .menu-item-683 .matraceNamiru, .menu-item-700 .posteleNamiru, .menu-item-704 .matraceNamiru {
        padding: 1rem;
    }
    .boxContent a { max-width: 95%; width: 100%; }
}









/* =========================================================
   TESTOVÁNÍ MENU
   ========================================================= */

._navigation-in ul.menu-level-2 > li { border: 1px solid red; }
._navigation-in>ul>li.ext>ul>li>a img { border: 1px solid blue !important; }



/* =========================================================
   HEUREKA GRID V KATEGORII
   ========================================================= */

/* ===== LAYOUT ===== */

div#grid_heureka_wrapper { padding: 0px !important }
._products.products-block .product { border-radius: 5px; padding: 2rem; }

div.product div#grid_heureka { min-height: 100%; height: 100%; display: flex; flex-direction: column; box-sizing: border-box; padding: 28px 24px 0 24px; text-align: center; }
div.product div#grid_heureka .grid_heureka_top { display: flex; flex-direction: column; align-items: center; }
div.product div#grid_heureka .grid_heureka_badge { padding-bottom: 26px; }
div.product div#grid_heureka .grid_heureka_badge img { display: block; width: 108px; height: auto; margin: 0 auto; }
div.product div#grid_heureka .grid_heureka_text { padding-bottom: 26px; }
div.product div#grid_heureka .grid_heureka_text h2 { margin: 0; padding-bottom: 22px; line-height: 1.15; }
div.product div#grid_heureka .grid_heureka_text p { margin: 0; line-height: 1.35; }
div.product div#grid_heureka .grid_heureka_rating { display: inline-flex; align-items: center; justify-content: center; gap: 18px; width: 100%; max-width: 320px; margin: 0 auto; padding: 18px 24px; border-radius: 999px; box-sizing: border-box; }
div.product div#grid_heureka .grid_heureka_score { flex: 0 0 auto; line-height: 1; }
div.product div#grid_heureka .grid_heureka_rating_right { display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 6px; }
div.product div#grid_heureka .grid_heureka_stars { line-height: 1; }
div.product div#grid_heureka .grid_heureka_stars svg { display: block; width: 128px; max-width: 100%; height: auto; }
div.product div#grid_heureka .grid_heureka_reviews a { display: inline-block; }
div.product div#grid_heureka .grid_heureka_spacer { flex: 1 1 auto; min-height: 24px; }
div.product div#grid_heureka .grid_heureka_bottom { display: flex; align-items: flex-end; justify-content: center; }
div.product div#grid_heureka .grid_heureka_bottom img { display: block; max-width: 100%; width: 220px; height: auto; }

/* ===== COLORS ===== */

div.product div#grid_heureka { background: #DEF4FF; }
div.product div#grid_heureka .grid_heureka_text h2 { color: #1F5F89; }
div.product div#grid_heureka .grid_heureka_text p { color: #475D6B; }
div.product div#grid_heureka .grid_heureka_rating { background: #FFFFFF; }
div.product div#grid_heureka .grid_heureka_score { color: #37A90A; }
div.product div#grid_heureka .grid_heureka_reviews a { color: #239CEB; }
div.product div#grid_heureka .grid_heureka_reviews a:hover { color: #30A9D4; }

/* ===== OPTIONAL TYPO SIZES ===== */

div.product div#grid_heureka .grid_heureka_text h2 { font-size: 28px; font-weight: 700; }
div.product div#grid_heureka .grid_heureka_text p { font-size: 17px; font-weight: 400; }
div.product div#grid_heureka .grid_heureka_score { font-size: 48px; font-weight: 700; }
div.product div#grid_heureka .grid_heureka_reviews a { font-size: 16px; font-weight: 400; }

/* ===== RESPONSIVE ===== */

@media (max-width: 480px) {
    div.product div#grid_heureka { padding: 22px 16px 0 16px; }
    div.product div#grid_heureka .grid_heureka_badge { padding-bottom: 20px; }
    div.product div#grid_heureka .grid_heureka_text { padding-bottom: 20px; }
    div.product div#grid_heureka .grid_heureka_text h2 { font-size: 24px; padding-bottom: 16px; }
    div.product div#grid_heureka .grid_heureka_text p { font-size: 16px; }
    div.product div#grid_heureka .grid_heureka_rating { gap: 14px; padding: 16px 18px; }
    div.product div#grid_heureka .grid_heureka_score { font-size: 40px; }
    div.product div#grid_heureka .grid_heureka_bottom img { width: 190px; }
}