/* =========================================
   1. ZÁKLADNÍ ROZVRŽENÍ A TYPOGRAFIE
   ========================================= */
.top-products-wrapper {
    display: none !important;
}

.welcome-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}

body, h1, h2, h3, h4, h5, h6, p, a, span, div, button, input, textarea, select {
    font-family: 'Sora', sans-serif !important;
}

/* Obarvení defaultních tlačítek */
.btn.btn-default, a.btn.btn-default {
    background-color: #c90c0f !important;
    border-color: #c90c0f !important;
    color: #fff !important;
}

/* =========================================
   2. HLAVNÍ BANNER (Nahoře) - Perfektní lícování
   ========================================= */
@media (min-width: 992px) {
    .row.banners-row {
        max-width: 1410px !important; 
        /* Přidáno 40px shora (první hodnota), aby banner dýchal */
        margin: 40px auto 30px auto !important; 
        padding: 0 15px !important; 
    }
    .row.banners-row .wide-carousel,
    .row.banners-row .carousel-inner,
    .row.banners-row .carousel-inner .item,
    .row.banners-row .carousel-inner .item img,
    .row.banners-row .carousel-control {
        border-radius: 30px !important; 
        width: 100% !important;
    }
}

/* =========================================
   3. ÚPRAVA SPODNÍHO BANNERU (Finální fix)
   ========================================= */

@media (min-width: 992px) {
    /* Zacílíme na ten hlavní div, co banner obaluje */
    .footer-banners.banner-wrapper {
        margin: 40px auto !important;
        border-radius: 30px !important;
        overflow: hidden !important;
        /* Vynucení šířky podle šablony (1410px odpovídá hornímu banneru) */
        max-width: 1410px !important;
        width: 100% !important;
        padding: 0 !important;
    }
    
    /* Vynutíme roztažení obrázku na 100% šířky toho nově zaobleného boxu */
    .footer-banners .footer-banner,
    .footer-banners .footer-banner a,
    .footer-banners .footer-banner img {
        width: 100% !important;
        display: block !important;
        border-radius: 30px !important;
    }
}

/* =========================================
   4. HLAVIČKA A HLAVNÍ MENU (PC)
   ========================================= */
@media (min-width: 992px) {
    /* Smrsknutí obsahu hlavičky (loga a ikon) na stejnou šířku jako má banner */
    #header .navigation-wrapper {
        max-width: 1410px !important;
        margin: 0 auto !important;
        padding: 0 15px !important;
    }

    #header,
    .navigation-in ul.menu-level-1 > li,
    .navigation-in ul.menu-level-1 > li > a,
    .navigation-buttons,
    .navigation-buttons > a,
    .navigation-buttons > button,
    .navigation-buttons > div {
        border: none !important;
        box-shadow: none !important;
    }

    .navigation-in ul.menu-level-1 > li > a {
        padding: 0 20px !important;
        line-height: 80px !important;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    .fitted .navigation-in ul {
        justify-content: center;
    }
    .navigation-in ul.menu-level-2 li a {
        line-height: 1.4 !important;
    }
}

/* =========================================
   5. BENEFITY / USP BANNER (Dokonalé zarovnání)
   ========================================= */
@media (min-width: 992px) {
    .container.container--bannersBenefit {
        max-width: 1410px !important;
        margin: 0 auto !important;
        padding: 0 15px !important;
    }
    .benefitBanner {
        display: flex !important;
        justify-content: center !important; 
        width: 100% !important;
        margin: 0 auto !important; /* Vynulování případného posunu celého řádku */
        padding: 0 !important;
        gap: 50px !important; 
    }
    
    .benefitBanner::before,
    .benefitBanner::after {
        display: none !important;
    }
    
    .benefitBanner__item {
        flex: 0 1 auto !important; 
        max-width: 400px !important;
        margin: 0 !important; /* TOTO JE TEN VINÍK! Zabijeme staré Shoptet odsazení */
    }
}

/* Společné úpravy textů uvnitř benefitů */
.benefitBanner__title {
    display: block !important;
    margin-bottom: 5px !important;
}
.benefitBanner__data {
    margin-top: 0 !important;
    line-height: 1.4 !important;
}

/* =========================================
   6. PRODUKTOVÉ KARTY
   ========================================= */
.product .p {
    border: 2px solid #eaeaea !important;
    border-radius: 12px !important;
    background: #ffffff;
    overflow: hidden;
    transition: all 0.3s ease !important;
}
.product:hover .p,
.product .p:hover {
    border-color: transparent !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.15) !important;
    transform: translateY(-4px) !important;
}
.product .p-in {
    padding: 20px 15px 25px 15px !important;
}
.product .name {
    margin-bottom: 12px !important;
    font-weight: 600 !important;
}
.product .btn-cart {
    background-color: #1aa044 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px;
    transition: transform 0.2s ease, background-color 0.2s !important;
}
.product .btn-cart:hover {
    background-color: #148035 !important;
    transform: scale(1.03);
    color: #ffffff !important;
}
.products-block>div .p .p-code,
.products-block>div .p .p-bottom .p-desc {
    display: none !important;
}

/* =========================================
   7. ZÁLOŽKY PRODUKTŮ (Doporučujeme / Akce)
   ========================================= */
.shp-tabs-wrapper .shp-tabs {
    border: none !important;
    border-bottom: 2px solid #eaeaea !important;
    display: flex;
    justify-content: center;
    gap: 40px;
    margin-bottom: 30px !important;
}
.shp-tabs li {
    background: transparent !important;
    border: none !important;
}
.shp-tabs li a {
    background: transparent !important;
    border: none !important;
    color: #888 !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    padding: 10px 0 !important;
    margin: 0 !important;
    transition: color 0.3s;
}
.shp-tabs li.active {
    border: none !important;
}
.shp-tabs li.active a, 
.shp-tabs li a:hover {
    color: #000 !important;
    box-shadow: none !important;
    border-bottom: 3px solid #000 !important;
}

/* =========================================
   8. STRÁNKA KATEGORIE (Řazení a filtry)
   ========================================= */
#category-header,
.listSorting,
.filters-unveil-button-wrapper {
    border: none !important;
    background: transparent !important;
}
#category-header {
    margin-bottom: 30px !important;
    padding-bottom: 0 !important;
}
.listSorting__controls,
.listSorting_controls {
    display: flex;
    flex-wrap: wrap;
    justify-content: center !important;
    gap: 10px;
    margin: 0 auto 20px auto !important;
    padding: 0 !important;
    border: none !important;
}
.listSorting__controls li,
.listSorting_controls li {
    border: none !important;
}
.listSorting__control,
.listSorting_control {
    background-color: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 20px !important;
    padding: 8px 18px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #555 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: none !important;
    height: auto !important;
    line-height: normal !important;
}
.listSorting__control:hover,
.listSorting_control:hover {
    border-color: #000 !important;
    color: #000 !important;
    background-color: #fafafa !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05) !important;
}
.listSorting__control.listSorting__control--current {
    background-color: #ffffff !important;
    color: #000000 !important;
    border-color: #000000 !important;
    border-width: 2px;
    font-weight: bold;
}
.listSorting__control.listSorting__control--current:hover {
    color: #000000 !important;
    border-color: #000000 !important;
}

#category-header .btn,
.filter-toggle,
.filters-unveil-button-wrapper .btn,
.unveil-button {
    background-color: #000 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px;
    padding: 12px 24px !important;
    transition: all 0.2s ease !important;
    display: inline-block;
}
.filters-unveil-button-wrapper {
    text-align: center;
    margin-top: 15px;
    margin-bottom: 25px;
}
#category-header .btn:hover,
.filter-toggle:hover,
.filters-unveil-button-wrapper .btn:hover,
.unveil-button:hover {
    background-color: #333 !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}
#content .category-top .products-top-wrapper,
div.category-top > div.products-top-wrapper.has-inactive {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* =========================================
   9. PATIČKA
   ========================================= */
html body #footer.footer,
#footer {
    background-color: #111111 !important;
    color: #ffffff !important;
    border-top: none !important;
}
html body #footer.footer h1, 
html body #footer.footer h2, 
html body #footer.footer h3, 
html body #footer.footer h4, 
html body #footer.footer p, 
html body #footer.footer div,
html body #footer.footer span {
    color: #ffffff !important;
}
html body #footer.footer a, 
html body #footer.footer .footer-link a, 
html body #footer.footer .footer-bottom a {
    color: #ffffff !important;
    text-decoration: none !important;
}
html body #footer.footer a:hover, 
html body #footer.footer .footer-link a:hover {
    color: rgba(255, 255, 255, 0.8) !important;
    text-decoration: underline !important;
}
html body #footer.footer .footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.2) !important;
    background: transparent !important;
}
html body #footer.footer ul.footer-links {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 30px !important;
    padding: 0 !important;
}
html body #footer.footer li.footer-link {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
html body #footer.footer li.footer-link::after,
html body #footer.footer li.footer-link::before {
    display: none !important;
}

/* =========================================
   10. MOBILNÍ CHOVÁNÍ A ZRUŠENÍ OSTRÝCH ROHŮ BANNERU
   ========================================= */
@media (max-width: 991px) {
    .navigation-wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        min-height: 70px !important;
        padding: 0 15px !important;
    }
    .site-name {
        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
    }
    .navigation-buttons {
        position: static !important;
        display: flex !important;
        align-items: center !important;
        gap: 18px !important;
        padding: 0 !important;
        margin: 0 !important;
        transform: none !important;
    }
    .navigation-buttons > a,
    .navigation-buttons > button {
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
        height: auto !important;
        width: auto !important;
        border-radius: 0 !important;
    }
    .navigation-in ul.menu-level-1 > li > a,
    .navigation-in ul.menu-level-1 > li > span {
        padding: 18px 25px !important;
        border-bottom: 1px solid #f5f5f5 !important;
        font-weight: 600 !important;
    }
    .navigation-in ul.menu-level-2 > li > a {
        padding: 15px 25px 15px 35px !important;
        border-bottom: 1px solid #fafafa !important;
    }
    #navigation .navigation-in::before {
        content: "";
        display: block;
        width: 80%;
        height: 60px;
        margin: 20px auto 20px 20px;
        background-image: url('https://shop.profizastavarna.cz/user/documents/upload/logo-velke.png');
        background-repeat: no-repeat;
        background-position: left center;
        background-size: contain;
    }
    #navigation .menu-level-1 {
        margin-top: 10px !important;
    }
    .type-index #content-wrapper,
    .type-index .content-wrapper-in,
    .type-index .homepage-texts-wrapper {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
    .type-index .breadcrumbs {
        display: none !important;
    }
    
    /* Na mobilech zrušíme zaoblení u bannerů a roztáhneme do krajů */
    .row.banners-row .wide-carousel,
    .footer-banners.banner-wrapper,
    .row.banners-row .carousel-inner,
    .row.banners-row .carousel-inner .item,
    .row.banners-row .carousel-inner .item img,
    .footer-banners .footer-banner,
    .footer-banners .footer-banner img {
        border-radius: 0 !important;
        margin-top: 0 !important;
    }
}

@media (max-width: 768px) {
    .benefitBanner {
        display: flex;
        flex-direction: column;
        gap: 15px !important;
        padding: 15px 0 !important;
    }
    .benefitBanner__item {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        background-color: #f9f9f9 !important;
        border-radius: 12px !important;
        padding: 15px 20px !important;
        max-width: 100% !important;
        text-align: left !important;
        border: 1px solid #f0f0f0 !important;
    }
    .benefitBanner__picture {
        flex: 0 0 50px !important;
        margin-right: 15px !important;
        margin-bottom: 0 !important;
    }
    .benefitBanner__title {
        font-size: 15px !important;
        margin-bottom: 3px !important;
    }
    .benefitBanner__data {
        font-size: 13px !important;
        color: #666 !important;
        line-height: 1.3 !important;
    }
    .navigation-buttons {
        border: none !important;
    }
    #category-header {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }
    #category-header .btn,
    .filter-toggle,
    .filters-unveil-button-wrapper .btn,
    .unveil-button {
        width: 100% !important;
        text-align: center;
        max-width: none !important;
    }
}

@media (max-width: 479px) {
    .overall-wrapper {
        padding-top: 60px;
    }
}

/* =========================================
   11. NEWSLETTER A PATIČKA (Finální verze pro obě zařízení)
   ========================================= */
/* Zmenšené odsazení shora přesně na 30px */
html body #footer.footer,
#footer {
    padding-top: 30px !important; 
}

/* Zrušení flexboxu, aby text GDPR spadl zpět dolů na PC */
#footer .subscribe-form fieldset {
    display: block !important; 
}
#footer .subscribe-form .validator-msg-holder {
    max-width: none !important; 
}

/* OPRAVA DESKTOPU: Pole musí být kulaté ze všech stran, protože sedí POD tlačítkem */
#footer .subscribe-form .form-control {
    border-radius: 30px !important; /* Tady byla ta zrada s růžky */
    padding-left: 20px !important;
    height: 48px !important; 
    border: none !important;
}

/* Zaoblení červeného tlačítka zprava (překryje pravou stranu pole) */
#footer .subscribe-form .btn {
    border-radius: 0 30px 30px 0 !important;
    height: 48px !important; 
    line-height: 46px !important; 
    margin: 0 !important;
    padding: 0 25px !important;
}

/* Lehký vzduch pod políčkem pro GDPR text */
#footer .subscribe-form .consents {
    margin-top: 12px !important;
}

/* --- OPRAVA PRO MOBILY A TABLETY (Skládání pod sebe) --- */
@media (max-width: 768px) {
    #footer .subscribe-form fieldset {
        position: static !important; 
    }
    #footer .subscribe-form .form-control {
        border-radius: 30px !important; 
        width: 100% !important;
    }
    #footer .subscribe-form .btn {
        position: static !important; 
        border-radius: 30px !important; /* Na mobilu se kulatí i zleva */
        width: 100% !important;
        margin-top: 15px !important; 
        display: block !important;
        text-align: center !important;
    }
}

/* =========================================
   12. COOKIES LIŠTA (Kompaktní box, žádné hovery)
   ========================================= */

/* Zprůhlednění obřího vnějšího obalu, ať to nedělá tu roztáhlou nudli */
.siteCookies.siteCookies--dark {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Tmavší šedé pozadí a stín POUZE pro ten vnitřní kompaktní box */
.siteCookies .siteCookies__form {
    background-color: #e5e5e5 !important; 
    border: 1px solid #d0d0d0 !important;
    border-radius: 20px !important; 
    overflow: hidden !important; 
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
    max-width: 600px !important; /* Zabrání jakémukoliv nechtěnému roztahování */
    margin: 0 auto !important; /* Vycentruje box krásně doprostřed */
}

/* Tmavý text pro čitelnost na šedém pozadí */
.siteCookies .siteCookies__content, 
.siteCookies .siteCookies__title,
.siteCookies .siteCookies__content a {
    color: #333333 !important; 
}

/* HLAVNÍ TLAČÍTKA (Odmítnout / Souhlasím) - Červená, BEZ HOVERU */
.siteCookies .siteCookies__buttonWrap button,
.siteCookies .siteCookies__buttonWrap .btn {
    background-color: #c90c0f !important;
    border-color: #c90c0f !important;
    color: #ffffff !important;
    border-radius: 30px !important;
    text-shadow: none !important;
    transition: none !important; /* Natvrdo vypnuté všechny animace */
}

/* TLAČÍTKO NASTAVENÍ (Bílé, BEZ HOVERU) */
button.siteCookies__link.js-cookies-settings {
    display: none !important;
    background-color: #ffffff !important; 
    border: 1px solid #cccccc !important;
    color: #333333 !important; 
    border-radius: 30px !important;
    padding: 8px 20px !important;
    text-shadow: none !important;
    transition: none !important; /* Natvrdo vypnuté všechny animace */
    font-weight: 600 !important;
    text-decoration: none !important;
}


/* =========================================
   13. KLIENTSKÉ CENTRUM A OPRAVA PATIČKY
   ========================================= */

/* --- OPRAVA KRÁTKÉ STRÁNKY (Patička vždy dole) --- */
/* Nastavíme hlavní obal tak, aby se choval jako guma a roztáhl se na celou výšku okna */
.overall-wrapper {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
}
/* Obsahová část se natáhne a zatlačí patičku úplně na dno prohlížeče */
#content-wrapper {
    flex-grow: 1 !important;
}

/* --- OPRAVA MENU KLIENTSKÉHO CENTRA --- */
/* Zrušení ošklivých odrážek a vytvoření hezkého boxu pro menu */
.client-center-box ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    background-color: #ffffff !important;
}

/* Linky oddělující jednotlivé položky */
.client-center-box li {
    border-bottom: 1px solid #f0f0f0 !important;
}
.client-center-box li:last-child {
    border-bottom: none !important;
}

/* Vzhled samotných odkazů v menu */
.client-center-box li a {
    display: block !important;
    padding: 14px 20px !important;
    color: #333333 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
}

/* Efekt po najetí myší a zvýraznění aktivní stránky (červený text + lehce šedé pozadí) */
.client-center-box li:hover a,
.client-center-box li.active a {
    background-color: #f8f8f8 !important;
    color: #c90c0f !important; 
    padding-left: 25px !important; /* Drobný efekt posunutí doprava při najetí */
}

/* --- TLAČÍTKO ODHLÁSIT SE --- */
/* Shoptet ho hází rovnou do seznamu, tak z něj uděláme tvé profi brandové tlačítko */
.client-center-box li.logout {
    padding: 15px !important;
    background-color: transparent !important;
    border-bottom: none !important;
}
.client-center-box li.logout form,
.client-center-box li.logout button,
.client-center-box li.logout .btn {
    width: 100% !important;
    display: block !important;
    text-align: center !important;
    background-color: #c90c0f !important;
    color: #ffffff !important;
    border: none !important;
    padding: 12px 20px !important;
    border-radius: 30px !important; /* Stejné jako na cookies liště a newsletteru */
    font-weight: 600 !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}
.client-center-box li.logout button:hover,
.client-center-box li.logout .btn:hover {
    background-color: #a30a0c !important;
}

/* =========================================
   14. MODÁLNÍ OKNO - TLAČÍTKO PŘIHLÁŠENÍ
   ========================================= */

/* Tvrdé přepsání sekundárního tlačítka na primární brandové */
.login-wrapper button.btn-login {
    background-color: #c90c0f !important;
    border-color: #c90c0f !important;
    color: #ffffff !important;
    border-radius: 30px !important; /* Stejné zaoblení jako u cookies a newsletteru */
    padding: 12px 20px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 4px 10px rgba(201, 12, 15, 0.25) !important; /* Jemný červený stín pro lepší vyniknutí */
}

/* Hover efekt - ztmavení při najetí myší */
.login-wrapper button.btn-login:hover {
    background-color: #a30a0c !important;
    border-color: #a30a0c !important;
    color: #ffffff !important;
    box-shadow: 0 6px 15px rgba(163, 10, 12, 0.3) !important; /* Stín se při najetí mírně zvětší */
}

/* Zajištění, aby i ikonka zámečku (pokud tam je jako SVG nebo font) byla čistě bílá */
.login-wrapper button.btn-login svg,
.login-wrapper button.btn-login path,
.login-wrapper button.btn-login i {
    fill: #ffffff !important;
    color: #ffffff !important;
}