/*
 Theme Name: Hello Elementor Child
 Template:   hello-elementor
 Version:    1.0.0
*/

/*
 * TABLE OF CONTENTS
 *
 * 1. Brand Accordion       — homepage expand/carousel  [data-id="1249281"]
 * 2. Desktop Navigation    — Brendovi mega menu dropdown
 * 3. Mobile Navigation     — Hamburger drawer (≤1024px)
 * 4. Header                — Mobile search widget
 * 5. WooCommerce           — Product cards & typography
 * 6. WooCommerce           — Add to cart button
 * 7. WooCommerce           — Shop controls (sorting, filter button, controls row)
 * 8. WooCommerce           — Brand hero na taxonomy archive stranicama
 * 9. Homepage              — Naši brendovi logo grid
 * 10. Blog                 — Post thumbnails
 * 11. Footer
 * 12. Elementor            — Button widget overrides
 */



/* ================================================================
   1. BRAND ACCORDION — homepage expand (desktop) + carousel (mobile)
   Container: [data-id="1249281"], children: direct .e-con strips
   ================================================================ */

[data-id="1249281"] {
    overflow: hidden;
    max-width: 1920px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

[data-id="1249281"] > .e-con {
    flex: 1 1 0 !important;
    min-width: 60px !important;
    max-width: 100% !important;
    transition: flex 0.55s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    overflow: hidden;
    position: relative;
    background-size: cover !important;
    background-position: center center !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    padding-right: 20px !important;
    padding-bottom: 20px !important;
}

[data-id="1249281"] > .e-con:hover {
    flex: var(--hover-flex, 8) 1 0 !important;
    background-size: auto 100% !important;
    background-repeat: no-repeat !important;
}

/* Tamni overlay na svim stripovima; hover ga posvijetli */
[data-id="1249281"] > .e-con::before {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    transition: background 0.4s ease;
    pointer-events: none;
    z-index: 1;
}

[data-id="1249281"] > .e-con:hover::before {
    background: rgba(0, 0, 0, 0.1);
}

/* Akcije i Namještaj — gradijent odozdo umjesto solid overlay (tekst mora biti čitljiv) */
[data-id="8f788ac"]::before,
[data-id="7678aa6"]::before {
    background-color: transparent !important;
    background-image: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.3) 50%, transparent 100%) !important;
}

/* Brand logo — prikazan pri hoveru, u drugom planu od overlaya */
[data-id="1249281"] .elementor-widget-image {
    position: relative;
    z-index: 2;
}

[data-id="1249281"] .elementor-widget-image img {
    max-height: 28px;
    max-width: 90px;
    width: auto !important;
    height: auto !important;
    filter: brightness(0) invert(1);
    opacity: 0;
    transition: opacity 0.3s ease 0.15s, transform 0.3s ease;
    display: block;
    margin: 0;
}

[data-id="1249281"] > .e-con:hover .elementor-widget-image img {
    opacity: 1;
    transform: scale(1.05);
}

/* --- Mobile: horizontalni scroll carousel, bez hover animacije --- */
@media (max-width: 768px) {
    [data-id="1249281"] {
        overflow-x: scroll !important;
        overflow-y: hidden !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        height: auto !important;
        min-height: unset !important;
        max-height: none !important;
        --container-widget-height: auto !important;
        margin-bottom: 40px !important;
    }

    [data-id="1249281"]::-webkit-scrollbar {
        display: none;
    }

    [data-id="1249281"] > .e-con {
        flex: 0 0 100vw !important;
        min-width: 100vw !important;
        max-width: 100vw !important;
        height: auto !important;
        aspect-ratio: 3 / 4 !important;
        scroll-snap-align: start;
        transition: none !important;
    }

    /* Na mobilnom hover je disabled — strip ostaje iste veličine */
    [data-id="1249281"] > .e-con:hover {
        flex: 0 0 100vw !important;
    }

    /* Logoi uvijek vidljivi (nema hover triggera na touchu) */
    [data-id="1249281"] .elementor-widget-image img {
        opacity: 1 !important;
        transition: none !important;
        transform: none !important;
    }

    [data-id="1249281"] > .e-con::before {
        background: rgba(0, 0, 0, 0.25) !important;
        transition: none !important;
    }

    /* Brand strips — logo dno desno */
    [data-id="06c4e72"],
    [data-id="75b187d"],
    [data-id="6dbc70e"],
    [data-id="d7d40a7"],
    [data-id="8943371"],
    [data-id="e73c8e9"],
    [data-id="a9525bc"],
    [data-id="97d1c22"] {
        padding-bottom: 16px !important;
        padding-right: 16px !important;
        align-items: flex-end !important;
    }

    [data-id="06c4e72"] .elementor-widget-image img,
    [data-id="75b187d"] .elementor-widget-image img,
    [data-id="6dbc70e"] .elementor-widget-image img,
    [data-id="d7d40a7"] .elementor-widget-image img,
    [data-id="8943371"] .elementor-widget-image img,
    [data-id="e73c8e9"] .elementor-widget-image img,
    [data-id="a9525bc"] .elementor-widget-image img,
    [data-id="97d1c22"] .elementor-widget-image img {
        max-height: 30px !important;
        max-width: 90px !important;
    }

    /* JRL — logo gore desno, manji format */
    [data-id="6dbc70e"] {
        justify-content: flex-start !important;
        padding-top: 16px !important;
    }

    [data-id="6dbc70e"] .elementor-widget-image img {
        max-height: 20px !important;
        max-width: 60px !important;
    }

    [data-id="c3c941d"] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}


/* ================================================================
   2. DESKTOP NAVIGATION — widget 1ebe483 (horizontalni nav)
   Brendovi mega menu (ID 4546) + standardni dropdowns (Oprema, Uređaji)
   ================================================================ */

/* Nav items poravnati lijevo uz logo.
   Elementor klasa elementor-nav-menu__align-center postavlja justify-content:center + auto margine
   direktno na UL — override mora biti na UL razini. */
.elementor-element-1ebe483 .elementor-nav-menu {
    justify-content: flex-start !important;
    margin-inline-start: 0 !important;
    margin-inline-end: auto !important;
    width: auto !important;
}

/* Glavni nav: font + stisnuti horizontalni padding */
.elementor-element-1ebe483 .elementor-nav-menu--main .elementor-nav-menu > li > a.elementor-item {
    font-size: 15px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}

/* Svi desktop dropdown paneli: obrub + sjena + zaobljeni kutovi */
.elementor-element-1ebe483 .elementor-nav-menu--main li > ul.sub-menu {
    border: 1px solid #e8ddd0 !important;
    border-radius: 10px !important;
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.11) !important;
    overflow: hidden !important;
    background: #fff !important;
}

/* Sub-item linkovi: makni Elementorov 8px transparent border-left, normalni hover */
.elementor-element-1ebe483 .elementor-nav-menu--main ul.sub-menu a.elementor-sub-item {
    border-inline-start: none !important;
    padding: 9px 16px !important;
    font-size: 13px !important;
    color: #333 !important;
    transition: background 0.15s, color 0.15s;
}

.elementor-element-1ebe483 .elementor-nav-menu--main ul.sub-menu a.elementor-sub-item:hover,
.elementor-element-1ebe483 .elementor-nav-menu--main ul.sub-menu a.elementor-sub-item:focus {
    background: #faf3e6 !important;
    color: #C8952C !important;
}

/* Brendovi mega menu: 3-kolona grid */
.menu-item-4546 > .sub-menu {
    grid-template-columns: repeat(3, 1fr) !important;
    min-width: 500px !important;
    padding: 12px 16px !important;
    gap: 0 8px !important;
}

.menu-item-4546:hover > .sub-menu,
.menu-item-4546:focus-within > .sub-menu {
    display: grid !important;
}

/* Sekcijski headeri (Alati za šišanje, Njega kose...) — span sve kolone */
.menu-item-4547,
.menu-item-4562,
.menu-item-4569 {
    grid-column: 1 / -1;
}

.menu-item-4547 a,
.menu-item-4562 a,
.menu-item-4569 a {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    opacity: 0.5;
    pointer-events: none;
    cursor: default;
    padding-top: 16px !important;
    padding-bottom: 4px !important;
}

/* Prvi header nema gornji padding */
.menu-item-4547 a {
    padding-top: 4px !important;
}


/* ================================================================
   3. MOBILE NAVIGATION — Hamburger drawer (≤1024px)
   Drawer klizi s desne strane. SmartMenus kontrolira display;
   mi kontroliramo right i top inline stilovima iz JS-a (onOpen).
   Sub-meniji su collapsed, SmartMenus ih expandira on-click.
   ================================================================ */

@media (max-width: 1024px) {

    /* Overlay — tamni backdrop iza drawera */
    .nav-drawer-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.45);
        z-index: 9997;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }
    .nav-drawer-overlay.active {
        opacity: 1;
        visibility: visible;
    }

    /* Elementor generira margin-top: 15px !important sa specifičnošću (0,5,0).
       Dodajemo html tag selektor → specifičnost (0,5,1) → pobjeđujemo bez obzira na redosljed učitavanja */
    html .elementor-21 .elementor-element.elementor-element-424f130 .elementor-nav-menu__container.elementor-nav-menu--dropdown {
        top: 0 !important;
        margin-top: 0 !important;
    }

    /* Drawer panel — samo na root nav koji ima klasu __container
       (sub-meniji ne, pa nema false-positive)
       display: block !important sprječava SmartMenus da postavi display:none
       i time prekine CSS right tranziciju */
    .elementor-element-424f130 .elementor-nav-menu__container.elementor-nav-menu--dropdown {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        left: auto !important;
        bottom: 0 !important;
        width: 72vw !important;
        max-width: 320px !important;
        height: 100vh !important;
        background-color: #f4f4f4 !important;
        transform: translateX(100%) !important;
        transition: transform 0.3s ease !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        z-index: 9999 !important;
        padding: 0 !important;
        margin: 0 !important;
        border: none !important;
    }

    /* Drawer header — logo lijevo, X desno */
    .drawer-close-btn {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 14px 18px;
        background: #f4f4f4;
        border-bottom: 1px solid #e0e0e0;
        position: sticky;
        top: 0;
        z-index: 1;
    }
    .drawer-logo {
        height: 30px !important;
        width: auto !important;
        max-width: 110px !important;
        object-fit: contain !important;
        display: block !important;
    }
    .drawer-close-x {
        font-size: 26px;
        line-height: 1;
        color: #C8952C;
        cursor: pointer;
    }

    /* Top-level menu items */
    .elementor-element-424f130 .elementor-nav-menu--dropdown > ul > li > a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 17px 20px !important;
        font-size: 17px !important;
        font-weight: 500 !important;
        color: #222 !important;
        border-bottom: 1px solid #e0e0e0 !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .elementor-element-424f130 .elementor-nav-menu--dropdown > ul > li > a:hover,
    .elementor-element-424f130 .elementor-nav-menu--dropdown > ul > li > a:focus {
        background: #eaeaea !important;
    }

    /* SmartMenus strelica — rotira se kad je sub-menu otvoren */
    .elementor-element-424f130 .elementor-nav-menu--dropdown a.has-submenu .sub-arrow {
        font-size: 18px !important;
        transition: transform 0.2s !important;
        display: inline-block !important;
        margin-left: 8px !important;
    }
    .elementor-element-424f130 .elementor-nav-menu--dropdown a.has-submenu[aria-expanded="true"] .sub-arrow {
        transform: rotate(90deg) !important;
    }

    /* Sub-menu panel — inline accordion (ne dropdown) */
    .elementor-element-424f130 .elementor-nav-menu--dropdown ul.sub-menu {
        position: static !important;
        width: 100% !important;
        left: auto !important;
        top: auto !important;
        min-width: unset !important;
        box-shadow: none !important;
        border: none !important;
        background: #ebebeb !important;
        padding: 0 !important;
        margin: 0 !important;
        display: none; /* SmartMenus kontrolira expand */
    }

    .elementor-element-424f130 .elementor-nav-menu--dropdown ul.sub-menu li a {
        display: block !important;
        padding: 13px 20px 13px 32px !important;
        font-size: 15px !important;
        color: #444 !important;
        border-bottom: 1px solid #e0e0e0 !important;
        text-decoration: none !important;
    }

    .elementor-element-424f130 .elementor-nav-menu--dropdown ul.sub-menu li a:hover {
        background: #e2e2e2 !important;
        color: #222 !important;
    }

    /* Root ul/li — force visible; SmartMenus bi ih inače sakrio */
    .elementor-element-424f130 .elementor-nav-menu__container > ul {
        display: block !important;
        width: 100% !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        float: none !important;
    }

    .elementor-element-424f130 .elementor-nav-menu__container > ul > li {
        display: block !important;
        width: 100% !important;
        float: none !important;
        position: static !important;
        height: auto !important;
    }

    /* Scroll lock dok je meni otvoren */
    body.menu-is-open {
        overflow: hidden;
    }

    /* Hamburger/X ikona — eksplicitno kontroliramo obje ikone body klasom.
       Elementor koristi aria-expanded koji async resetira; zato koristimo vlastitu klasu. */
    .elementor-menu-toggle__icon--open {
        display: block !important;
    }
    .elementor-menu-toggle__icon--close {
        display: none !important;
    }
    body.menu-is-open .elementor-menu-toggle__icon--open {
        display: none !important;
    }
    body.menu-is-open .elementor-menu-toggle__icon--close {
        display: block !important;
    }

    /* Drawer open state — JS dodaje/skida .drawer-open klasu */
    .elementor-element-424f130 .elementor-nav-menu__container.elementor-nav-menu--dropdown.drawer-open {
        transform: translateX(0) !important;
    }
}

@media (min-width: 1025px) {
    .elementor-menu-toggle {
        display: none !important;
    }
}


/* ================================================================
   4. HEADER — Header image height cap + Mobile search widget
   ================================================================ */

.elementor-location-header {
    max-width: 1960px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body .elementor-21 .elementor-element.elementor-element-c7117e6 {
    --padding-left: 20px !important;
    --padding-right: 20px !important;
}

/* Ograničenje visine header slike — desktop i mobile */
.elementor-widget-image img {
    max-height: calc(100vh - 80px);
    object-fit: cover !important;
}



.elementor-element-ffccf3a .e-search-input {
    border-color: #ccc !important;
    border-radius: 8px 0 0 8px !important;
    border-width: 1px !important;
}

.elementor-element-ffccf3a .e-search-submit {
    background-color: #444 !important;
    border-radius: 0 8px 8px 0 !important;
}


/* ================================================================
   5. WOOCOMMERCE — Product cards & typography
   ================================================================ */

/* Sale badge — gore-lijevo unutar kartice, ne strši u gap */
span.onsale {
    background: #222 !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    border-radius: 2px !important;
    padding: 4px 8px !important;
    min-height: unset !important;
    min-width: unset !important;
    line-height: 1.4 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    margin: 0 !important;
    z-index: 5 !important;
    opacity: 0.85 !important;
}

/* Archive layout (shop, category): sidebar-left + products-right red — samo desktop
   IDs: 5b2d1f7 = shop, deef5a9 = category */
@media (min-width: 769px) {
    .elementor-element-5b2d1f7,
    .elementor-element-deef5a9 {
        max-width: 1440px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 60px !important;
        padding-right: 60px !important;
        box-sizing: border-box !important;
        gap: 40px !important;
        align-items: flex-start !important;
    }

    .elementor-element-5b2d1f7 .elementor-widget-sidebar,
    .elementor-element-deef5a9 .elementor-widget-sidebar {
        flex: 0 0 220px !important;
        max-width: 220px !important;
        min-width: 0 !important;
    }

    .elementor-element-5b2d1f7 .elementor-widget-wc-archive-products,
    .elementor-element-deef5a9 .elementor-widget-wc-archive-products {
        flex: 1 1 0 !important;
        min-width: 0 !important;
    }

    /* Brand stranice — svaka ima vlastiti Elementor template (drugi ID-evi),
       koristimo :has() da globalno ciljamo container sa sidebarom */
    body.tax-product_brand .e-con.e-flex:has(.elementor-widget-sidebar) {
        max-width: 1440px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 60px !important;
        padding-right: 60px !important;
        box-sizing: border-box !important;
        gap: 40px !important;
        align-items: flex-start !important;
    }

    body.tax-product_brand .e-con.e-flex:has(.elementor-widget-sidebar) .elementor-widget-sidebar {
        flex: 0 0 220px !important;
        max-width: 220px !important;
        min-width: 0 !important;
    }

    body.tax-product_brand .e-con.e-flex:has(.elementor-widget-sidebar) .elementor-widget-woocommerce-products,
    body.tax-product_brand .e-con.e-flex:has(.elementor-widget-sidebar) .elementor-widget-wc-archive-products {
        flex: 1 1 0 !important;
        min-width: 0 !important;
    }
}

/* Standardni product loop (shop, category, brand archive) */
.woocommerce-loop-product__title {
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    padding: 0 !important;
    margin: 0 !important;
    border-bottom: none !important;
}

.woocommerce-loop-product__link .price {
    font-size: 14px !important;
    font-weight: 700 !important;
}

/* Loop Carousel (Elementor widget — e-loop-item) */
.e-loop-item {
    cursor: pointer;
}

/* Brand — zajednički stilovi */
.e-loop-item .product-loop-brand,
li.product .product-loop-brand {
    display: block !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin: 8px 0 2px !important;
    color: #cc3366 !important;
}

/* Brand — centar u Elementor Loop, lijevo u standardnim WC listama */
.e-loop-item .product-loop-brand {
    text-align: center !important;
}
li.product .product-loop-brand {
    text-align: left !important;
}

/* Elementor Loop — title (klasa je elementor-heading-title, ne woocommerce-loop-product__title) */
.e-loop-item .elementor-heading-title {
    color: #2a2a2a !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    margin: 0 !important;
}

/* Elementor Loop — cijena */
.elementor-widget-woocommerce-product-price .price,
.elementor-widget-woocommerce-product-price .price *,
.e-loop-item .price,
.e-loop-item .price * {
    color: #cc3366 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-align: center !important;
}

.elementor-widget-woocommerce-product-price {
    text-align: center !important;
}

/* Elementor Loop — razmaci između widgeta */
.e-loop-item .elementor-widget-image {
    margin-bottom: 4px !important;
}
.e-loop-item .elementor-widget-woocommerce-product-title {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.e-loop-item .elementor-widget-woocommerce-product-price {
    margin-top: 2px !important;
}

@media (max-width: 768px) {
    .e-loop-item .elementor-heading-title {
        font-size: 15px !important;
    }

    .e-loop-item .elementor-widget-woocommerce-product-title {
        margin-top: 2px !important;
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    .e-loop-item .elementor-widget-woocommerce-product-price {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }

    .e-loop-item .price,
    .e-loop-item .price * {
        font-size: 14px !important;
    }
}


/* ================================================================
   6. WOOCOMMERCE — "Dodaj u košaricu" button
   Zlatna boja (#C8952C) iz loga + cart ikona kao SVG data-URI
   ================================================================ */

.woocommerce ul.products li.product a.button,
.e-loop-item a.add_to_cart_button,
#acta-wishlist-grid li.product a.button {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 8px 14px 8px 34px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em !important;
    text-transform: none !important;
    position: relative !important;
    display: inline-block !important;
    transition: background-color 0.2s ease !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.woocommerce ul.products li.product a.button::before,
.e-loop-item a.add_to_cart_button::before,
#acta-wishlist-grid li.product a.button::before {
    content: '' !important;
    position: absolute !important;
    left: 11px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 15px !important;
    height: 15px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'/%3E%3Ccircle cx='20' cy='21' r='1'/%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
}

.woocommerce ul.products li.product a.button:hover,
.e-loop-item a.add_to_cart_button:hover,
#acta-wishlist-grid li.product a.button:hover {
    background-color: #b07824 !important;
    color: #fff !important;
}


/* ================================================================
   7. WOOCOMMERCE — Shop controls (sorting, filter button, mobile row)
   ================================================================ */

/* Elementor button widget — outline stil */
.elementor-widget-button .elementor-button {
    border-radius: 6px !important;
    border-color: #333 !important;
    border-width: 1px !important;
    letter-spacing: 0.05em !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

.elementor-widget-button .elementor-button:hover {
    background-color: #333 !important;
    color: #fff !important;
}

/* Sorting dropdown */
.woocommerce-ordering select.orderby {
    border: 1px solid #ccc !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-size: 14px !important;
    background-color: #fff !important;
    outline: none !important;
    cursor: pointer !important;
}

.woocommerce-ordering select.orderby:focus {
    border-color: #888 !important;
}

/* Filter price range inputs */
.wpc-filters-range-min,
.wpc-filters-range-max {
    border: 1px solid #ccc !important;
    border-radius: 8px !important;
    padding: 8px 10px !important;
    font-size: 14px !important;
    outline: none !important;
}

.wpc-filters-range-min:focus,
.wpc-filters-range-max:focus {
    border-color: #888 !important;
}

/* Sakriti filtere na Akcije stranici (samo sortiranje ostaje) */
.is-on-sale-page [data-id="358ac55"],
.is-on-sale-page .wpc-filters-open-button-container {
    display: none !important;
}

/* Na mobileu sakrij sve sidebar widgete u WooCommerce shop/archive stranicama —
   filter kontrole su premještene u .shop-controls-row, sidebar nema što prikazati */
@media (max-width: 768px) {
    .woocommerce .elementor-widget-sidebar,
    .woocommerce-page .elementor-widget-sidebar,
    .tax-product_cat .elementor-widget-sidebar,
    .tax-product_brand .elementor-widget-sidebar,
    .post-type-archive-product .elementor-widget-sidebar {
        display: none !important;
    }
}

/* JS klasa: sidebar skriven na mobilnom (premještamo sadržaj u products kolonu) */
.sidebar-hidden {
    display: none !important;
}

/* WooCommerce products header (H1 naslov + category image) — Elementor template već ima naslov
   PHP filter woocommerce_show_page_title=false makne title, ovo je fallback */
.woocommerce-products-header {
    display: none !important;
}

/* Elementor postavlja color:#F5F5F5 na nothing-found — nevidljivo na bijeloj pozadini */
.elementor-products-nothing-found {
    color: #333 !important;
    text-align: center !important;
    padding: 40px 0 !important;
}


/* Filter naslov — bold */
.widget-title.wpc-filter-title {
    font-weight: 700 !important;
}

/* Sakrij taxonomy filter sekcije bez dostupnih termina (ne price/range filtere) */
.wpc-filters-section.wpc-filter-terms-count-0.wpc-filter-taxonomy {
    display: none !important;
}

/* Filter Everything — gumb "Filtri"
   Stil prati sorting dropdown (bijeli, border, ista visina).
   Plugin-ov originalni icon (3 linije) sakrivamo, koristimo ::before SVG. */
body .wpc-filters-open-button-container a.wpc-open-close-filters-button {
    background-color: #fff !important;
    color: #333 !important;
    border: 1px solid #ccc !important;
    border-radius: 8px !important;
    padding: 8px 12px 8px 32px !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    position: relative !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
}

body .wpc-filters-open-button-container a.wpc-open-close-filters-button::before {
    content: '' !important;
    position: absolute !important;
    left: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 14px !important;
    height: 14px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' y1='6' x2='20' y2='6'/%3E%3Cline x1='8' y1='12' x2='16' y2='12'/%3E%3Cline x1='11' y1='18' x2='13' y2='18'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
}

body .wpc-filters-open-button-container a.wpc-open-close-filters-button:hover {
    border-color: #888 !important;
}

.wpc-filters-open-button-container .wpc-icon-html-wrapper {
    display: none !important;
}

.wpc-posts-found { display: none !important; }

/* Result count + sorting: jedan red na desktopu, mobileu ne treba (ordering je u shop-controls-row) */
p.woocommerce-result-count {
    font-size: 0.82rem !important;
    color: #999 !important;
    margin: 0 !important;
}

@media (min-width: 769px) {
    .woocommerce p.woocommerce-result-count {
        float: left !important;
        clear: none !important;
        width: auto !important;
        line-height: 34px !important;
    }
    .woocommerce form.woocommerce-ordering {
        float: right !important;
        margin: 0 0 12px !important;
    }
    .woocommerce ul.products,
    .woocommerce .woocommerce-pagination {
        clear: both !important;
    }
}

/* Mobile: result-count i ordering — resetiraj WC-ove globalne floatove, složi vertikalno */
@media (max-width: 768px) {
    .woocommerce p.woocommerce-result-count {
        float: none !important;
        margin-bottom: 6px !important;
    }
    .woocommerce form.woocommerce-ordering {
        float: none !important;
        clear: both !important;
    }
    .woocommerce ul.products,
    .woocommerce .woocommerce-pagination {
        clear: both !important;
    }
}

/* Mobile: Filtri + Sortiranje u istom redu
   JS (initShopControlsRow) pomiče oba elementa u .shop-controls-row wrapper. */
@media (max-width: 768px) {
    .shop-controls-row {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        margin-bottom: 16px !important;
    }

    .shop-controls-row .wpc-filters-open-button-container {
        flex-shrink: 0 !important;
        margin: 0 !important;
    }

    .shop-controls-row .wpc-filters-open-button-container a.wpc-open-close-filters-button {
        height: 38px !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        margin-bottom: 0 !important;
    }

    .shop-controls-row .woocommerce-ordering {
        flex: 1 !important;
        margin: 0 !important;
    }

    .shop-controls-row .woocommerce-ordering select.orderby {
        width: 100% !important;
        height: 38px !important;
        box-sizing: border-box !important;
        margin: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
}


/* ================================================================
   8. FILTER EVERYTHING — Brand logo filter (desktop)
   .wpc-filter-has-brands — sekcija s logom brendova u sidebaru
   ================================================================ */

@media (min-width: 769px) {
    .wpc-filter-has-brands .wpc-term-image-wrapper img {
        max-height: 22px !important;
        width: auto !important;
        max-width: 60px !important;
        object-fit: contain !important;
    }

    .wpc-filter-has-brands .wpc-term-name {
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    .wpc-filter-has-brands .wpc-term-count {
        font-size: 11px !important;
    }

    .wpc-filter-has-brands .wpc-checkbox-item label {
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

}

/* L3VEL3 logo je bijeli PNG — invertiraj u crno (mobile i desktop) */
#wpc-term-taxonomy-product_brand-35 .wpc-term-image-wrapper img {
    filter: invert(1) !important;
}


/* ================================================================
   9. WOOCOMMERCE — Brand hero na taxonomy archive stranicama
   Renderira se PHP hookom (acta4hair_brand_hero u functions.php)
   ================================================================ */

.brand-hero {
    width: 100%;
    margin-bottom: 2rem;
}

.brand-hero img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}


/* ================================================================
   9. HOMEPAGE — Naši brendovi logo grid (plugin: UC Logo Grid)
   ================================================================ */

/* Svjetlija pozadina sekcije */
.elementor-element-461b211:not(.elementor-motion-effects-element-type-background),
.elementor-element-461b211 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-color: #f0f0f0 !important;
}

body .elementor-element-d6381e3 .logo-grid-item {
    background-color: transparent !important;
}

@media (max-width: 768px) {
    /* 2 kolone na mobilnom umjesto defaultnih više */
    #uc_logo_grid_elementor_d6381e3 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }

    #uc_logo_grid_elementor_d6381e3 .logo-grid-item {
        height: 90px !important;
    }

    /* Isključi filter efekt na mobilnom (logoi su dovoljno čitljivi) */
    #uc_logo_grid_elementor_d6381e3 .logo-grid-item img {
        padding: 12px !important;
        filter: none !important;
    }
}


/* ================================================================
   10. BLOG — Post thumbnails
   Elementor koristi absolute positioning za slike; forsiamo contain
   da product logoi ne budu izrezani
   ================================================================ */

.elementor-posts-container .elementor-post__thumbnail {
    background: #f8f8f8 !important;
}

.elementor-posts-container .elementor-post__thumbnail img {
    position: absolute !important;
    inset: 0 !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
}


/* ================================================================
   11. WOOCOMMERCE — Notices (košarica, greške, info)
   ================================================================ */

.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error {
    background: #faf7f2;
    border-top: 3px solid #C8952C;
    color: #2a2a2a;
    padding: 14px 20px;
    border-radius: 0 0 6px 6px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    box-shadow: none;
    list-style: none;
    margin-bottom: 16px;
}

.woocommerce-notices-wrapper .woocommerce-message::before,
.woocommerce-notices-wrapper .woocommerce-info::before {
    display: none;
}

.woocommerce-notices-wrapper .woocommerce-message a.button.wc-forward {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 8px 18px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em !important;
    text-transform: none !important;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background-color 0.2s ease !important;
    flex-shrink: 0;
}

.woocommerce-notices-wrapper .woocommerce-message a.button.wc-forward:hover {
    background-color: #b07824 !important;
    color: #fff !important;
}

/* ================================================================
   12. PAGINATION
   ================================================================ */

.woocommerce-pagination .page-numbers {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
    justify-content: center;
}

.woocommerce-pagination .page-numbers li {
    margin: 0;
}

.woocommerce-pagination .page-numbers a,
.woocommerce-pagination .page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: 4px;
    font-size: 14px;
    color: #444;
    background: transparent;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
}

.woocommerce-pagination .page-numbers a:hover {
    background: #f5ead8;
    color: #222;
}

.woocommerce-pagination .page-numbers span.current {
    background: #e8d4a8;
    color: #2a2a2a;
    font-weight: 700;
}

.woocommerce-pagination .page-numbers span.dots {
    background: transparent;
    color: #aaa;
    font-weight: 400;
}

/* ================================================================
   12. FOOTER
   ================================================================ */

@media (max-width: 768px) {
    .elementor-location-footer .elementor-text-editor,
    .elementor-location-footer .elementor-text-editor p,
    .elementor-location-footer .elementor-text-editor a,
    .elementor-744 .elementor-element.elementor-element-a8c8cc3,
    .elementor-744 .elementor-element.elementor-element-a8c8cc3 p,
    .elementor-744 .elementor-element.elementor-element-a8c8cc3 a {
        font-size: 14px !important;
        line-height: 1.7 !important;
    }

    .elementor-location-footer .elementor-heading-title {
        font-size: 18px !important;
    }
}


/* ================================================================
   13. SINGLE PRODUCT — cijena, qty stepper, dodaj u košaricu
   ================================================================ */

/* Title */
.single-product .product_title.entry-title {
    font-size: 1.6rem !important;
    line-height: 1.2 !important;
}

/* Cijena lijevo na single product */
.single-product .elementor-widget-woocommerce-product-price {
    text-align: left !important;
}
.single-product .elementor-widget-woocommerce-product-price .price,
.single-product .elementor-widget-woocommerce-product-price .price * {
    text-align: left !important;
}

/* Add-to-cart forma — qty i button u redu */
.single-product .cart {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    flex-wrap: wrap !important;
}

/* Quantity stepper — globalno (single product + sve .quantity) */
.quantity {
    display: inline-flex !important;
    align-items: center;
    border: 1.5px solid #ddd;
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
    height: 40px;
    width: auto !important;
    flex: none !important;
}

.qty-btn {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 100% !important;
    font-size: 20px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    color: #555 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0 !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
    transition: background 0.15s, color 0.15s !important;
}

.qty-btn:hover {
    background: #f5ead8;
    color: #C8952C;
}

input.qty {
    border: none !important;
    border-left: 1px solid #eee !important;
    border-right: 1px solid #eee !important;
    width: 44px !important;
    min-width: 0 !important;
    max-width: 44px !important;
    height: 100% !important;
    text-align: center !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    padding: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    -moz-appearance: textfield !important;
    flex: none !important;
}

input.qty::-webkit-outer-spin-button,
input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* Gumb Dodaj u košaricu */
.single-product .single_add_to_cart_button.button {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 10px 20px 10px 38px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em !important;
    text-transform: none !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: background-color 0.2s ease !important;
    position: relative !important;
    flex-basis: auto !important;
}

.single-product .single_add_to_cart_button.button::before {
    content: '' !important;
    position: absolute !important;
    left: 13px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'/%3E%3Ccircle cx='20' cy='21' r='1'/%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
}

.single-product .single_add_to_cart_button.button.added::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") !important;
}

.single-product .single_add_to_cart_button.button:hover {
    background-color: #b07824 !important;
    color: #fff !important;
}

.single-product .woocommerce-Tabs-panel {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Normalizacija fonta i line-height u description panelu —
   pokriva sadržaj paste-an iz Worda/Google Translatea (<pre>, random divovi, itd.) */
.woocommerce-Tabs-panel--description,
.woocommerce-Tabs-panel--description p,
.woocommerce-Tabs-panel--description span,
.woocommerce-Tabs-panel--description div,
.woocommerce-Tabs-panel--description li {
    font-family: "Montserrat", sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.7 !important;
    color: #000 !important;
    background: none !important;
}

.woocommerce-Tabs-panel--description pre {
    font-family: "Montserrat", sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 1.7 !important;
    white-space: pre-line !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 0 1em !important;
    color: #000 !important;
}

.woocommerce-Tabs-panel--description h2 {
    font-family: "Montserrat", sans-serif !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin: 0 0 12px !important;
    color: #000 !important;
    background: none !important;
}

.woocommerce-Tabs-panel--description strong,
.woocommerce-Tabs-panel--description b {
    font-weight: 600 !important;
}

/* WooCommerce layout.css postavlja float:left;width:48% na .images (galerija) —
   u Elementor template-u layout radi flex/grid, float samo smeta. */
.elementor-702 .woocommerce-product-gallery.images {
    float: none !important;
    width: 100% !important;
}

.single-product .related.products {
    clear: both !important;
}

/* Single product: max-width + centriranje kao na list stranicama */
@media (min-width: 769px) {
    .elementor-702 .elementor-element.elementor-element-20f3d56 {
        max-width: 1440px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 60px !important;
        padding-right: 60px !important;
        box-sizing: border-box !important;
    }
}

/* relprod25 — full-width related products container: ista logika kao list stranica */
.elementor-702 .elementor-element.elementor-element-relprod25 {
    max-width: 1440px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
    padding-left: 60px !important;
    padding-right: 60px !important;
}

/* Related products title — isti stil kao Preporučeni na početnoj */
.elementor-element-5f995ce ul.products li.product .woocommerce-loop-product__title {
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    padding: 0 !important;
    margin-top: 6px !important;
    margin-bottom: 2px !important;
}

/* Related products slike — bijela pozadina (Elementor template ne wrapa u .woocommerce div) */
.elementor-widget-woocommerce-product-related ul.products li.product img {
    background-color: #fff !important;
}

/* Related products heading link — nasljeđuje h2 font/boju, hover underline */
.elementor-widget-woocommerce-product-related .related.products h2 a {
    color: inherit;
    text-decoration: none;
}
.elementor-widget-woocommerce-product-related .related.products h2 a:hover {
    text-decoration: underline;
}
.elementor-widget-woocommerce-product-related .related.products h2 a::after {
    content: '';
    display: inline-block;
    width: 0.65em;
    height: 0.65em;
    margin-left: 0.3em;
    vertical-align: middle;
    position: relative;
    top: -0.05em;
    background-color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2.5'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M7%2017L17%207'/%3E%3Cpath%20d='M7%207h10v10'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2.5'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M7%2017L17%207'/%3E%3Cpath%20d='M7%207h10v10'/%3E%3C/svg%3E");
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    opacity: 0.5;
    transition: opacity 0.2s;
}
.elementor-widget-woocommerce-product-related .related.products h2 a:hover::after {
    opacity: 1;
}

/* ul.products: CSS grid → flex horizontal scroll (desktop + mobile) */
.elementor-element-5f995ce ul.products {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    gap: 12px !important;
    align-items: stretch !important;
}
.elementor-element-5f995ce ul.products::-webkit-scrollbar {
    display: none;
}
/* Desktop default: 5 kolona */
.elementor-element-5f995ce ul.products li.product {
    flex: 0 0 calc(20% - 10px) !important;
    width: calc(20% - 10px) !important;
    min-width: 160px !important;
    scroll-snap-align: start !important;
    box-sizing: border-box !important;
}
/* 4 kolone ispod 1200px */
@media (max-width: 1200px) and (min-width: 768px) {
    .elementor-element-5f995ce ul.products li.product {
        flex: 0 0 calc(25% - 9px) !important;
        width: calc(25% - 9px) !important;
    }
}
/* 3 kolone ispod 900px */
@media (max-width: 900px) and (min-width: 768px) {
    .elementor-element-5f995ce ul.products li.product {
        flex: 0 0 calc(33.333% - 8px) !important;
        width: calc(33.333% - 8px) !important;
    }
}

@media (max-width: 767px) {
    /* Ukloni 40px padding koji gura kartice desno */
    .elementor-702 .elementor-element.elementor-element-relprod25 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    /* Heading: poravnat s karticama + manji font */
    .elementor-element-5f995ce .related.products h2 {
        padding-left: 12px !important;
        font-size: 1.2rem !important;
    }
    /* Gradient sjena desno — isti pattern kao b7217ec (Preporučeni) */
    .elementor-element-5f995ce .related.products {
        position: relative !important;
    }
    .elementor-element-5f995ce .related.products::after {
        content: '';
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 48px !important;
        background: linear-gradient(to right, transparent, #fff) !important;
        pointer-events: none !important;
        z-index: 2 !important;
    }
    /* Scroll inset 12px — vidljiv dio 2. kartice (peek efekt) */
    .elementor-element-5f995ce ul.products {
        gap: 8px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        scroll-padding-left: 12px !important;
    }
    /* 180px kao na Preporučeni sekciji na početnoj */
    .elementor-element-5f995ce ul.products li.product {
        flex: 0 0 180px !important;
        width: 180px !important;
    }
}

.single-product .woocommerce-tabs ul.wc-tabs li.active a {
    border-bottom: 2px solid #C8952C !important;
    font-weight: 600 !important;
}


/* Single product — mobilni padding fix (max-width: 767px)
   - d86e056 (image widget): Elementor je postavio 40px direktno → nuliraj
   - c49fcb6 (cijena/košarica): nema padding → ostaje 0 (nema promjene)
   - cart forma: puna širina, gumb se širi do ruba
   - wc-tabs i panel: maknuti horizontalne paddinge */
@media (max-width: 767px) {
    /* Slika: makni 40px widget padding da kontejner (10px) preuzme.
       overflow:hidden sprječava horizontalni scroll od flex-control-thumbs
       koji ima margin: -10px i virio bi van kontejnera. */
    .elementor-702 .elementor-element.elementor-element-d86e056 {
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: hidden !important;
    }

    /* Add-to-cart forma — qty lijevo, gumb desno (auto-width) */
    .single-product .cart {
        width: 100% !important;
    }

    /* Tabs navigacija — makni horizontalni padding/margin */
    .single-product .woocommerce-tabs ul.wc-tabs {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Tab panel (opis, recenzije) — makni horizontalni padding */
    .single-product .woocommerce-Tabs-panel {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .single-product .woocommerce-Tabs-panel--description p {
        text-align: justify !important;
    }

    .single-product .woocommerce-tabs ul.wc-tabs li.active a {
        border-bottom: 2px solid #C8952C !important;
        font-weight: 600 !important;
    }
}

/* ================================================================
   14. HEADER — Cart ikona (mobile, pored hamburgera)
   ================================================================ */

.header-cart-link {
    display: none; /* JS je premješta pored hamburgera — vidljiva samo na mobile */
    align-items: center;
    position: relative;
    color: currentColor;
    text-decoration: none;
    padding: 6px;
    line-height: 0;
    margin-left: 4px;
}

@media (max-width: 1024px) {
    .header-cart-link {
        display: inline-flex;
        margin-left: auto; /* gura cart + hamburger skroz desno */
        align-self: center;
    }
}

.header-cart-count {
    position: absolute;
    top: 0;
    right: 0;
    background: #C8952C;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0 3px;
}

.header-cart-count:empty {
    display: none;
}

.header-favorites-link {
    display: none;
    align-items: center;
    position: relative;
    color: currentColor;
    text-decoration: none;
    padding: 6px;
    line-height: 0;
    margin-right: 4px;
}

/* Desktop: search je ikona, 655087f je kompaktan (ne raste) */
.elementor-element-655087f .header-favorites-link {
    display: inline-flex;
    align-self: center;
    margin-left: 4px;
}

/* Mobile: gura sebe + cart + hamburger desno */
.elementor-element-2936440 .header-favorites-link {
    display: inline-flex;
    align-self: center;
    margin-left: auto;
}

/* Mobile: ukloni cart-ov vlastiti margin-left:auto jer favorites preuzima tu ulogu */
.elementor-element-2936440 .header-cart-link {
    margin-left: 0 !important;
}

.header-sale-link {
    display: none;
}

.elementor-element-2936440 .header-sale-link {
    display: inline-flex;
    align-items: center;
    align-self: center;
    justify-content: center;
    font-size: 1.1rem;
    font-weight: 700;
    color: currentColor;
    text-decoration: none;
    padding: 6px;
    line-height: 1;
}

.header-favorites-count {
    position: absolute;
    top: 0;
    right: 0;
    background: #C8952C;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: 0 3px;
}

.header-favorites-count:empty {
    display: none;
}


/* ================================================================
   15. WOOCOMMERCE BLOCKS — Košarica (Block cart)
   ================================================================ */

/* Quantity selector */
.wc-block-components-quantity-selector {
    border: 1.5px solid #ddd !important;
    border-radius: 20px !important;
    height: 40px !important;
    width: auto !important;
    overflow: hidden;
    background: #fff;
}

.wc-block-components-quantity-selector__input {
    font-size: 15px !important;
    font-weight: 600 !important;
    min-width: 44px !important;
    padding: 0 !important;
    color: #333 !important;
}

.wc-block-components-quantity-selector__input::-webkit-outer-spin-button,
.wc-block-components-quantity-selector__input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

.wc-block-components-quantity-selector__button {
    -webkit-appearance: none !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 100% !important;
    font-size: 20px !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #555 !important;
    opacity: 1 !important;
    cursor: pointer !important;
    transition: background 0.15s, color 0.15s !important;
}

.wc-block-components-quantity-selector__button:hover {
    background: #f5ead8 !important;
    color: #C8952C !important;
    opacity: 1 !important;
}

/* alignwide na mobileu ruši layout — reset bez paddinga */
@media (max-width: 768px) {
    .woocommerce-cart .alignwide,
    .woocommerce-checkout .alignwide {
        margin-inline: 0 !important;
        padding-inline: 0 !important;
    }
    .wc-block-components-address-form__country {
        margin-top: 16px;
    }
}

/* Product description u košarici — sadrži h1 koji je ogroman, sakrivamo cijeli blok */
.wc-block-components-product-metadata__description {
    display: none !important;
}

/* "Kreni na plaćanje" gumb */
.wc-block-cart__submit-button {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 10px 24px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    text-decoration: none !important;
    text-align: center !important;
    transition: background-color 0.2s ease !important;
    display: block !important;
    min-height: 0 !important;      /* WC Blocks: body:not(.woocommerce-block-theme-has-button-styles) .wc-block-components-button { min-height: 3em } */
    height: auto !important;
    line-height: 1.4 !important;
}

.wc-block-cart__submit-button:hover {
    background-color: #b07824 !important;
    color: #fff !important;
}

/* Kupon forma — flex red, input + gumb side by side.
   Ne diramo floating label internals (WC Blocks ih animira JS-om). */
.wc-block-components-totals-coupon__form {
    display: flex !important;
    gap: 8px !important;
    align-items: flex-end !important;
}

.wc-block-components-totals-coupon__input {
    flex: 1 !important;
    border: 1.5px solid #ddd !important;
    border-radius: 20px !important;
    overflow: hidden !important;
}
.wc-block-components-totals-coupon__input:focus-within {
    border-color: #C8952C !important;
}
/* Label se ponaša kao placeholder: vidljiv centriran dok input prazan/nefokusiran,
   nestaje na focus/unos (.is-active). Padding je isti u svim stanjima → nema skoka visine. */
.wc-block-components-totals-coupon__input label {
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 14px !important;
    transition: none !important;
    left: 14px !important;
    color: #aaa !important;
    line-height: 1 !important;
}
.wc-block-components-totals-coupon__input.is-active label {
    display: none !important;
}
/* Input — isti padding u svim stanjima (!important pobijedi sve WC Blocks is-active/focus overrideove) */
.wc-block-components-totals-coupon__input.wc-block-components-text-input input[type="text"],
.wc-block-components-totals-coupon__input.wc-block-components-text-input.is-active input[type="text"] {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    height: auto !important;
    border-radius: 0 !important;
    background: transparent !important;
    padding: 6px 14px !important;
}

.wc-block-components-totals-coupon__button {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 10px 16px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    min-height: 0 !important;
    height: auto !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}
.wc-block-components-totals-coupon__button:hover {
    background-color: #b07824 !important;
}

/* Kreni na plaćanje container — ukloni extra padding koji WC Blocks dodaje */
.wc-block-cart__submit-container {
    padding: 0 !important;
}
/* Sticky verzija (mobile) — vrati padding da gumb ne dirne rubove ekrana */
.wc-block-cart .wc-block-cart__submit-container--sticky {
    padding: 12px 16px !important;
    padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
}

/* Sticky desna kolona (sažetak + kupon + botun) na desktopu */
@media (min-width: 700px) {
    .woocommerce-cart .wc-block-components-sidebar {
        position: sticky !important;
        top: 100px !important;        /* header ~80px + 20px disah */
        align-self: flex-start !important;
    }
    /* Makni top padding s H2 naslova sažetka da se poravna s vrhom lijeve kolone */
    .woocommerce-cart .wc-block-cart__totals-title {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
}

/* product-new block ("Novo u ponudi" na praznoj košarici) */
.wc-block-grid__product-link {
    text-decoration: none !important;
}
.wc-block-grid__product-title {
    font-size: 1rem !important;
    font-weight: 600 !important;
    color: #2a2a2a !important;
}
.wc-block-grid__product-price {
    font-size: 1.05rem !important;
    color: #cc3366 !important;
    font-weight: 600 !important;
}
.wc-block-grid__product-add-to-cart .wp-block-button__link {
    background-color: #C8952C !important;
    color: #fff !important;
    border-radius: 20px !important;
    padding: 8px 18px !important;
    font-size: 0.85rem !important;
    text-decoration: none !important;
    border: none !important;
}
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
    background-color: #b07824 !important;
}


/* ================================================================
   16. FOOTER — Newsletter forma
   ================================================================ */

.elementor-location-footer .elementor-form .elementor-form-fields-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}

.elementor-location-footer .elementor-form .elementor-field-textual {
    background: #fff !important;
    border: 1.5px solid #ccc !important;
    border-radius: 20px !important;
    color: #333 !important;
    padding: 9px 16px !important;
    font-size: 13px !important;
    height: 40px !important;
    box-shadow: none !important;
    outline: none !important;
    width: 100% !important;
    transition: border-color 0.2s !important;
}

.elementor-location-footer .elementor-form .elementor-field-textual::placeholder {
    color: #aaa !important;
}

.elementor-location-footer .elementor-form .elementor-field-textual:focus {
    border-color: #C8952C !important;
}

.elementor-location-footer .elementor-form .elementor-field-group.elementor-field-type-submit {
    flex-shrink: 0 !important;
    width: auto !important;
}

.elementor-location-footer .elementor-form .elementor-button {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 9px 20px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.06em !important;
    height: 40px !important;
    white-space: nowrap !important;
    transition: background-color 0.2s ease !important;
}

.elementor-location-footer .elementor-form .elementor-button:hover {
    background-color: #b07824 !important;
}

/* ============================================================
   8. SINGLE POST — hero image + title + content layout
   ============================================================ */

.post .wp-post-image {
    object-fit: contain !important;
    background: #f7f4f0;
}

.post-hero {
    position: relative;
    overflow: hidden;
    max-height: 520px;
}

.post-hero__image {
    width: 100%;
    height: 460px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.post-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.15) 55%, transparent 100%);
    display: flex;
    align-items: flex-end;
}

.post-hero__inner {
    padding: 36px 48px;
    width: 100%;
}

.post-hero__meta {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.75);
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

.post-hero__meta a {
    color: #C8952C;
    text-decoration: none;
}

.post-hero__meta a:hover {
    text-decoration: underline;
}

.post-hero__title {
    font-size: clamp(1.6rem, 4vw, 2.6rem);
    font-weight: 700;
    color: #fff;
    margin: 0;
    line-height: 1.2;
}

/* Fallback: no featured image */
.post-header-simple {
    background: #f7f4f0;
    border-bottom: 3px solid #C8952C;
    padding: 40px 0;
}

.post-header-simple__inner {
    max-width: 860px;
    margin: 0 auto;
    padding: 0 24px;
}

.post-header-simple__meta {
    font-size: 0.8rem;
    color: #999;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.post-header-simple__meta a {
    color: #C8952C;
    text-decoration: none;
}

.post-header-simple__title {
    font-size: clamp(1.6rem, 3.5vw, 2.4rem);
    font-weight: 700;
    color: #1a1a1a;
    margin: 0;
}

/* Content body */
.post-body {
    padding: 48px 24px 64px;
}

.post-body__inner {
    max-width: 860px;
    margin: 0 auto;
}

.post-body .page-content {
    font-size: 1rem;
    line-height: 1.85;
    color: #2a2a2a;
}

.post-body .page-content h2 {
    font-size: 1.3rem;
    font-weight: 700;
    color: #1a1a1a;
    margin: 2em 0 0.6em;
    padding-bottom: 6px;
    border-bottom: 2px solid #f0ebe3;
}

.post-body .page-content h3 {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin: 1.6em 0 0.5em;
}

.post-body .page-content ul,
.post-body .page-content ol {
    padding-left: 1.4em;
    margin: 0.8em 0 1.2em;
}

.post-body .page-content li {
    margin-bottom: 0.4em;
}

.post-body .page-content strong {
    color: #1a1a1a;
    font-weight: 600;
}

.post-body .page-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 1.5em 0;
}

.post-body .page-content a {
    color: #C8952C;
    text-decoration: underline;
}

.post-tags {
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid #eee;
    font-size: 0.85rem;
    color: #888;
}

/* Mobile */
@media (max-width: 768px) {
    .post-hero__image {
        height: 260px;
    }

    .post-hero__inner {
        padding: 24px 20px;
    }

    .post-body {
        padding: 32px 16px 48px;
    }
}

/* WooCommerce sticky sidebari (košarica + plaćanje) — sticky od dna headera, ne od top-a.
   JS mjeri visinu headera i stavlja --acta-header-h na :root.
   WooCommerce default je top: 24px, mi overridamo s header visinom + 16px razmaka. */
.wc-block-checkout__sidebar.is-sticky,
.wc-block-cart__sidebar.is-sticky {
    top: calc(var(--acta-header-h, 80px) + 16px) !important;
}

/* Legal stranice + checkout: ukloni max-width na .site-main da post-header-simple bude full-width.
   Hello Elementor ograničava .site-main na max 1140px za ne-Elementor stranice, ali mi
   kontroliramo širinu sadržaja putem .post-body__inner (max-width: 860px). */
body.page-id-3 .site-main,
body.page-id-9 .site-main,
body.page-id-11 .site-main,
body.page-id-4603 .site-main,
body.page-id-4604 .site-main,
body.page-id-4605 .site-main,
body.page-id-4606 .site-main,
body.page-id-4610 .site-main {
    max-width: 100% !important;
}

/* ============================================================
   9. ADD TO CART — zamijeni košaricu (::before) s checkmarkom (::after)
   ============================================================ */

.woocommerce ul.products li.product a.button.added::before,
.e-loop-item a.add_to_cart_button.added::before,
#acta-wishlist-grid li.product a.button.added::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") !important;
}

.add_to_cart_button.added::after {
    display: none !important;
}

/* "Prikaži košaricu" iznad gumba — grid pristup, bez layout shifta.
   grid-template-rows: 0px auto → link row nema visine (sadržaj overflow:visible),
   button row je auto. Named areas premještaju link vizualno iznad gumba.
   justify-self: start na gumbu čuva prirodnu širinu (ne stretcha). */
.woocommerce-loop-product__buttons {
    display: grid !important;
    grid-template-areas: "link" "button" !important;
    grid-template-rows: 0px auto !important;
}

@media (min-width: 769px) {
    .woocommerce ul.products li.product .woocommerce-loop-product__buttons,
    #acta-wishlist-grid li.product .woocommerce-loop-product__buttons {
        margin-top: 0 !important;
    }
}

@media (min-width: 769px) {
    .woocommerce-loop-product__buttons .add_to_cart_button,
    .woocommerce-loop-product__buttons .added_to_cart.wc-forward {
        margin-top: 4px !important;
    }
}

@media (max-width: 768px) {
    .woocommerce ul.products li.product .button,
    #acta-wishlist-grid li.product .button {
        margin-top: 0 !important;
    }
}

/* Mobile: flex-direction column-reverse vizualno preokreće redoslijed bez DOM manipulacije.
   U HTML-u: button je prvi, link drugi → column-reverse: link ide gore, button dolje.
   Gap razdvaja link od gumba. align-items flex-start čuva prirodnu širinu gumba. */
@media (max-width: 768px) {
    .woocommerce ul.products li.product .woocommerce-loop-product__buttons,
    #acta-wishlist-grid li.product .woocommerce-loop-product__buttons {
        display: flex !important;
        flex-direction: column-reverse !important;
        align-items: flex-start !important;
        gap: 0 !important;
        margin-top: 4px !important;
    }
    .woocommerce-loop-product__buttons .add_to_cart_button {
        padding-top: 0 !important;
    }
    .woocommerce-loop-product__buttons .added_to_cart.wc-forward {
        transform: none !important;
    }
}

.woocommerce-loop-product__buttons .add_to_cart_button {
    grid-area: button !important;
    justify-self: start !important;
    width: auto !important;
}

/* Desktop: smanji razmak između proizvoda u gridu */
@media (min-width: 769px) {
    ul.products,
    .woocommerce ul.products,
    .elementor-wc-products ul.products {
        grid-column-gap: 12px !important;
        column-gap: 12px !important;
        grid-row-gap: 14px !important;
        row-gap: 14px !important;
    }
}

/* Mobile: smanji razmak između proizvoda u gridu */
@media (max-width: 768px) {
    ul.products,
    .woocommerce ul.products,
    .elementor-wc-products ul.products {
        grid-column-gap: 6px !important;
        column-gap: 6px !important;
        grid-row-gap: 20px !important;
        row-gap: 20px !important;
    }
}

.woocommerce-loop-product__buttons .added_to_cart.wc-forward {
    display: none !important;
    grid-area: link !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    text-align: center !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    font-weight: 500 !important;
    color: #cc3366 !important;
    text-decoration: underline !important;
    white-space: nowrap !important;
    transform: translateY(0px) !important;
}

.woocommerce-loop-product__buttons .added_to_cart.wc-forward:hover {
    color: #a52248 !important;
    text-decoration: none !important;
}


/* ============================================================
   10. COMMENTS — globalni stil forme za komentare
   ============================================================ */

.comments-area {
    margin-top: 40px;
    padding-top: 32px;
    border-top: 1px solid #eee;
}

.comment-reply-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 24px;
}

.comment-reply-title small a {
    font-size: 0.8rem;
    font-weight: 400;
    color: #C8952C;
    text-decoration: none;
    margin-left: 10px;
}

.comment-notes {
    font-size: 0.82rem;
    color: #999;
    margin-bottom: 20px;
}

.comment-notes .required {
    color: #C8952C;
}

/* Sakrij "Web-stranica" polje — nije relevantno */
.comment-form-url {
    display: none;
}

.comment-form p {
    margin: 0 0 16px;
}

.comment-form label {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    color: #555;
    margin-bottom: 6px;
    letter-spacing: 0.03em;
}

.comment-form label .required {
    color: #C8952C;
    font-weight: 400;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px solid #ddd;
    border-radius: 10px;
    font-size: 0.92rem;
    color: #2a2a2a;
    background: #fafafa;
    box-sizing: border-box;
    transition: border-color 0.2s ease;
    outline: none;
}

.comment-form input[type="text"]:focus,
.comment-form input[type="email"]:focus,
.comment-form textarea:focus {
    border-color: #C8952C;
    background: #fff;
}

.comment-form textarea {
    resize: vertical;
    min-height: 130px;
    border-radius: 10px;
}

/* Cookies consent */
.comment-form-cookies-consent {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.8rem;
    color: #888;
    margin-bottom: 20px !important;
}

.comment-form-cookies-consent input[type="checkbox"] {
    width: 16px;
    height: 16px;
    min-width: 16px;
    margin-top: 2px;
    accent-color: #C8952C;
    cursor: pointer;
}

.comment-form-cookies-consent label {
    font-size: 0.8rem;
    font-weight: 400 !important;
    color: #888 !important;
    margin-bottom: 0 !important;
    cursor: pointer;
}

/* Submit */
.form-submit {
    margin-top: 4px;
}

.comment-form .submit,
#submit {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 10px 28px !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;
}

.comment-form .submit:hover,
#submit:hover {
    background-color: #b07824 !important;
}

/* Existing comments list */
.comment-list {
    list-style: none;
    padding: 0;
    margin: 0 0 40px;
}

.comment-list .comment {
    padding: 20px 0;
    border-bottom: 1px solid #f0ede8;
}

.comment-list .comment-author .fn {
    font-weight: 700;
    font-size: 0.92rem;
    color: #1a1a1a;
}

.comment-list .comment-meta {
    font-size: 0.78rem;
    color: #aaa;
    margin-top: 2px;
}

.comment-list .comment-content p {
    font-size: 0.92rem;
    color: #444;
    line-height: 1.7;
    margin: 8px 0 0;
}

.comment-list .reply a {
    font-size: 0.78rem;
    color: #C8952C;
    text-decoration: none;
    margin-top: 6px;
    display: inline-block;
}

@media (max-width: 768px) {
    .comment-form input[type="text"],
    .comment-form input[type="email"],
    .comment-form textarea {
        font-size: 16px;
    }
}


/* ================================================================
   17. BRAND PAGES — hero slike
   ================================================================ */

/* Brand hero slike — konzistentna visina calc(100vh - 80px).
   Koristimo specifične element ID-eve hero widgeta (ne generički .tax-product_brand selektor
   koji bi zahvatio i header logo na istoj stranici). */
.elementor-element-aca7255 img,   /* moroccanoil */
.elementor-element-3232bbc6 img,  /* jrl */
.elementor-element-161d0bed img,  /* l3vel3 */
.elementor-element-2b096b7f img,  /* vgr */
.elementor-element-42c61d6a img,  /* ascari */
.elementor-element-4d6e3329 img,  /* subrina */
.elementor-element-2adb23b0 img,  /* tecno-dry */
.elementor-element-291a7eb0 img,  /* supreme-trimmer */
.elementor-element-42eb012 img,   /* andis */
.elementor-element-18604912 img,  /* artecno */
.elementor-element-6ded437a img,  /* gabbiano */
.elementor-element-612fefe0 img,  /* labor */
.elementor-element-561410dd img,  /* marrakesh */
.elementor-element-65f8126 img,   /* maxpro */
.elementor-element-22bc9fee img,  /* mila-furniture */
.elementor-element-10de8b28 img,  /* olaplex */
.elementor-element-6ec7141a img,  /* termix */
.elementor-element-318b9a2f img { /* wahl */
    height: calc(100vh - 80px) !important;
    width: 100% !important;
    object-fit: cover !important;
    max-height: none !important;
}

/* Brand logo overlay — dolje lijevo u hero sekciji */
.tax-product_brand .elementor-absolute.elementor-widget-image {
    display: block !important;
    bottom: 20px !important;
    left: 20px !important;
    top: auto !important;
    right: auto !important;
}

.tax-product_brand .elementor-absolute.elementor-widget-image img {
    max-height: 60px !important;
    width: auto !important;
    object-fit: contain !important;
}

/* Brandovi gdje je logo već u hero slici — overlay sakrij.
   Mora doći POSLIJE display:block pravila gore (isti specifičnost 0,3,0). */
.tax-product_brand .elementor-absolute.elementor-element-1335ccab {
    display: none !important;
}

/* Brand hero — mobile: smanji visinu na 56.25vw (16:9), sakrij logo overlay */
@media (max-width: 768px) {
    .elementor-element-aca7255 img,
    .elementor-element-3232bbc6 img,
    .elementor-element-161d0bed img,
    .elementor-element-2b096b7f img,
    .elementor-element-42c61d6a img,
    .elementor-element-4d6e3329 img,
    .elementor-element-2adb23b0 img,
    .elementor-element-291a7eb0 img,
    .elementor-element-42eb012 img,
    .elementor-element-18604912 img,
    .elementor-element-6ded437a img,
    .elementor-element-612fefe0 img,
    .elementor-element-561410dd img,
    .elementor-element-65f8126 img,
    .elementor-element-22bc9fee img,
    .elementor-element-10de8b28 img,
    .elementor-element-6ec7141a img,
    .elementor-element-318b9a2f img {
        height: 56.25vw !important;
    }

    .tax-product_brand .elementor-absolute.elementor-widget-image {
        display: none !important;
    }
}

/* Generic template 4492 (ceriotti, caliber, ayala, kasai) —
   background-attachment: fixed → scroll da slika ne ostaje fiksna,
   visina: calc(100vh - 80px) umjesto 56.25vw */
.elementor-4492 .elementor-element.elementor-element-e3a04c6 {
    --min-height: calc(100vh - 80px) !important;
    max-height: calc(100vh - 80px) !important;
    overflow: hidden !important;
}
.elementor-4492 .elementor-element.elementor-element-e3a04c6:not(.elementor-motion-effects-element-type-background),
.elementor-4492 .elementor-element.elementor-element-e3a04c6 > .elementor-motion-effects-container > .elementor-motion-effects-layer {
    background-size: cover !important;
    background-position: center center !important;
    background-attachment: scroll !important;
}


/* ================================================================
   18. ARCHIVE PRODUCT CARDS — standardni izgled na svim list stranicama
   (shop, brand, category, homepage lista)
   — sivi background + padding konzistentni na svim templateima,
     override Elementor per-widget box_bg_color postavki
   ================================================================ */

.tax-product_brand .elementor-wc-products ul.products li.product,
body .woocommerce ul.products li.product,
#acta-wishlist-grid li.product {
    background-color: #F5F5F5 !important;
    padding: 12px !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Mobile: padding ostaje (ne 0), da sadržaj nije prislonjen uz rub */
@media (max-width: 768px) {
    .tax-product_brand .elementor-wc-products ul.products li.product,
    body .woocommerce ul.products li.product,
    #acta-wishlist-grid li.product {
        padding: 8px !important;
    }
}

.tax-product_brand ul.products li.product .woocommerce-LoopProduct-link,
body .woocommerce ul.products li.product .woocommerce-LoopProduct-link,
#acta-wishlist-grid li.product .woocommerce-LoopProduct-link {
    flex: 0 0 auto !important;
}

/* Naslov i link — boja i dekoracija */
.tax-product_brand ul.products li.product .woocommerce-loop-product__title,
body .woocommerce ul.products li.product .woocommerce-loop-product__title,
#acta-wishlist-grid li.product .woocommerce-loop-product__title {
    color: #2a2a2a !important;
}

.tax-product_brand ul.products li.product a.woocommerce-LoopProduct-link,
body .woocommerce ul.products li.product a.woocommerce-LoopProduct-link,
#acta-wishlist-grid li.product a.woocommerce-LoopProduct-link {
    color: inherit !important;
    text-decoration: none !important;
}

/* ----------------------------------------------------------------
   Cijena — sale prikaz: prekrižena cijena mala/siva, nova cijena tamna
   Override Elementor globalnog primary (#6EC1E4) koji kolorira del u plavo
   ---------------------------------------------------------------- */

/* Redovna cijena (bez akcije) */
.woocommerce ul.products li.product .price,
.elementor-wc-products ul.products li.product .price,
#acta-wishlist-grid li.product .price {
    color: #2a2a2a !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

/* Prekrižena (stara) cijena — crvena prekrižena */
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price del .amount,
.woocommerce ul.products li.product .price del bdi,
.elementor-wc-products ul.products li.product .price del,
.elementor-wc-products ul.products li.product .price del .amount,
.elementor-wc-products ul.products li.product .price del bdi,
#acta-wishlist-grid li.product .price del,
#acta-wishlist-grid li.product .price del .amount,
#acta-wishlist-grid li.product .price del bdi {
    color: #a52248 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    text-decoration: line-through !important;
    text-decoration-color: #cc3366 !important;
    opacity: 1 !important;
}

/* Nova (snižena) cijena — tamna, bold, normalna veličina */
.woocommerce ul.products li.product .price ins,
.woocommerce ul.products li.product .price ins .amount,
.woocommerce ul.products li.product .price ins bdi,
.elementor-wc-products ul.products li.product .price ins,
.elementor-wc-products ul.products li.product .price ins .amount,
.elementor-wc-products ul.products li.product .price ins bdi,
#acta-wishlist-grid li.product .price ins,
#acta-wishlist-grid li.product .price ins .amount,
#acta-wishlist-grid li.product .price ins bdi {
    color: #2a2a2a !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}


/* ================================================================
   19. HOMEPAGE — layout sekcija + Preporučeni proizvodi [data-id="b7217ec"]
   ================================================================ */

/* Sekcije početne: max-width + centriranje + smanjeni padding desktop */
@media (min-width: 769px) {
    .elementor-element-331a4c5,
    .elementor-element-f63ec8a,
    .elementor-element-8829770 {
        max-width: 1440px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 25px !important;
        padding-bottom: 25px !important;
        box-sizing: border-box !important;
    }
    .elementor-element-5a09c5d {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }
    .elementor-element-5d1f2b8,
    .elementor-element-355ab29 {
        max-width: 1360px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    /* Brandovi e-con-boxed: outer full-width, inner bez horizontalnog paddinga */
    .elementor-element-461b211 {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    .elementor-element-461b211 > .e-con-inner {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Preporučeni — grid: 5 kolona na punoj širini → 4 → 3 */
.elementor-element-b7217ec ul.products,
.elementor-element-b7217ec .woocommerce ul.products.columns-4 {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 12px !important;
}

/* WC clearfix pseudo-elementi postaju grid itemi — sakrij ih */
.elementor-element-b7217ec ul.products::before,
.elementor-element-b7217ec ul.products::after {
    display: none !important;
}

/* Reset WC shortcode li.product dimenzije — grid ignorira flex ali ne i width */
.elementor-element-b7217ec ul.products li.product {
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    float: none !important;
}

@media (max-width: 1200px) and (min-width: 901px) {
    .elementor-element-b7217ec ul.products,
    .elementor-element-b7217ec .woocommerce ul.products.columns-4 {
        grid-template-columns: repeat(4, 1fr) !important;
    }
}

@media (max-width: 900px) and (min-width: 769px) {
    .elementor-element-b7217ec ul.products,
    .elementor-element-b7217ec .woocommerce ul.products.columns-4 {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

/* Mobile: horizontalni scroll */
@media (max-width: 768px) {
    /* Wrapper za scroll + gradient fade desno */
    .elementor-element-b7217ec {
        position: relative !important;
    }
    .elementor-element-b7217ec::after {
        content: '';
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 48px !important;
        background: linear-gradient(to right, transparent, #fff) !important;
        pointer-events: none !important;
        z-index: 2 !important;
    }
    .elementor-element-b7217ec .elementor-shortcode {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important;
        scroll-snap-type: x mandatory !important;
    }
    .elementor-element-b7217ec .elementor-shortcode::-webkit-scrollbar {
        display: none !important;
    }
    .elementor-element-b7217ec ul.products,
    .elementor-element-b7217ec .woocommerce ul.products.columns-4 {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        width: max-content !important;
    }
    .elementor-element-b7217ec ul.products li.product {
        flex: 0 0 180px !important;
        width: 180px !important;
        max-width: none !important;
        scroll-snap-align: start !important;
    }
}

/* Flex card layout */
.elementor-element-b7217ec ul.products li.product {
    padding: 10px !important;
    display: flex !important;
    flex-direction: column !important;
}

.elementor-element-b7217ec ul.products li.product .woocommerce-LoopProduct-link {
    flex: 0 0 auto !important;
    text-decoration: none !important;
    color: inherit !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Slika — kvadratni omjer, bez margina */
.elementor-element-b7217ec ul.products li.product img,
body .woocommerce ul.products li.product img,
#acta-wishlist-grid li.product img {
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    object-fit: cover !important;
    height: auto !important;
    display: block !important;
    background-color: #fff !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Naslov */
.elementor-element-b7217ec ul.products li.product .woocommerce-loop-product__title {
    color: #2a2a2a !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    margin-top: 6px !important;
    margin-bottom: 2px !important;
}

/* Cijena */
.elementor-element-b7217ec ul.products li.product .price,
.elementor-element-b7217ec ul.products li.product .price .amount,
.elementor-element-b7217ec ul.products li.product .price ins .amount {
    color: #2a2a2a !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

/* Gumb — flex-start da ne stretcha */
.elementor-element-b7217ec ul.products li.product .woocommerce-loop-product__buttons {
    margin-top: 8px !important;
}

/* Mobile: 2 kolone umjesto shortcode-ovih columns-4 */
@media (max-width: 768px) {
    .elementor-element-b7217ec .woocommerce ul.products.columns-4 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}


/* ================================================================
   20. CHECKOUT — layout i prijevodi
   ================================================================ */

/* Na mobileu sakrijemo gornji collapsible sažetak narudžbe —
   isti sadržaj je uvijek vidljiv expandan u sekciji ispod forme */
@media (max-width: 699px) {
    .wc-block-checkout__sidebar {
        display: none !important;
    }
}

/* Ukloni padding sa .site-main na cart i checkout stranicama */
.woocommerce-checkout .site-main,
.woocommerce-cart .site-main {
    padding-inline-start: 0 !important;
    padding-inline-end: 0 !important;
}

/* "Naruči" gumb — zlatna boja kao ostali CTA gumbi */
.wc-block-components-checkout-place-order-button {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 10px 24px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 0.04em !important;
    transition: background-color 0.2s ease !important;
    display: inline-flex !important;
    width: auto !important;
    min-width: 220px !important;
}

.wc-block-components-checkout-place-order-button:hover {
    background-color: #b07824 !important;
}

/* OIB — puna širina na desktopu (flex layout, ≥700px) */
.wc-block-checkout__billing-fields .wc-block-components-address-form__acta4hair-billing_oib {
    flex: 1 0 100% !important;
}

/* Država — samo Hrvatska, ne može se mijenjati (no arrow, no interaction) */
.wc-block-components-address-form__country .wc-blocks-components-select__select {
    pointer-events: none !important;
    cursor: default !important;
    -webkit-appearance: none !important;
    appearance: none !important;
}
.wc-block-components-address-form__country .wc-blocks-components-select__expand {
    display: none !important;
}


/* ================================================================
   20. HEADER DESKTOP — Search & Cart widget
   ================================================================ */

/* --- Search (element 797e54d, samo desktop) — collapsible ikona --- */

/* Desktop: sakrij input, skupi widget na širinu same ikone */
@media (min-width: 1025px) {
    .elementor-element-797e54d .e-search-label,
    .elementor-element-797e54d .e-search-input-wrapper {
        display: none !important;
    }

    .elementor-element-797e54d,
    .elementor-element-797e54d .e-search,
    .elementor-element-797e54d .e-search-form {
        width: auto !important;
        min-width: 0 !important;
        flex-basis: auto !important;
    }

    .elementor-element-797e54d .e-search-form {
        display: inline-flex !important;
        align-items: center !important;
    }

    .elementor-element-797e54d .e-search-submit {
        background: none !important;
        border: none !important;
        border-radius: 0 !important;
        padding: 6px !important;
        height: auto !important;
        cursor: pointer !important;
        display: inline-flex !important;
        align-items: center !important;
        color: currentColor !important;
        transition: opacity 0.15s !important;
    }

    .elementor-element-797e54d .e-search-submit:hover {
        background: none !important;
        opacity: 0.65 !important;
    }

    .elementor-element-797e54d .e-search-submit svg {
        fill: currentColor !important;
        width: 18px !important;
        height: 18px !important;
    }
}

/* --- Search overlay (otvara se klikom na ikonu) --- */
.acta-search-overlay {
    display: none;
    position: fixed;
    inset: 0 0 auto 0;
    height: var(--acta-header-h, 80px);
    background: #fff;
    color: #2a2a2a;
    z-index: 9999;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.acta-search-overlay.is-active {
    display: flex;
    align-items: center;
}

.acta-search-overlay__form {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 860px;
    margin: 0 auto;
    padding: 0 40px;
    gap: 12px;
}

.acta-search-overlay__submit,
.acta-search-overlay__close {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    color: #111 !important;
    line-height: 0 !important;
    flex-shrink: 0 !important;
    border-radius: 0 !important;
    padding: 4px !important;
}

.acta-search-overlay__submit {
    padding: 4px;
}

.acta-search-overlay__submit svg {
    width: 18px !important;
    height: 18px !important;
    fill: #111 !important;
    display: block !important;
}

.acta-search-overlay__input {
    flex: 1;
    appearance: none;
    -webkit-appearance: none;
    border: none;
    border-bottom: 1.5px solid #ddd;
    outline: none;
    font-size: 16px;
    padding: 8px 0;
    background: #fff;
    color: #2a2a2a;
    font-family: inherit;
}

.acta-search-overlay__input:focus {
    border-bottom-color: #C8952C;
}

.acta-search-overlay__close {
    padding: 4px 8px !important;
    font-size: 22px !important;
    line-height: 1 !important;
    transition: color 0.15s;
}

/* --- Cart toggle: ikona poput mobile + odvojena cijena --- */
.elementor-menu-cart__toggle_button.elementor-button {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 6px 4px !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    transition: opacity 0.2s ease !important;
    line-height: 1 !important;
}

.elementor-menu-cart__toggle_button.elementor-button:hover {
    background: none !important;
    opacity: 0.75 !important;
}

/* Cijena — lijevo od ikone, s desnim separatorom */
.elementor-menu-cart__toggle_button .elementor-button-text {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #2a2a2a !important;
    letter-spacing: 0.01em !important;
    padding-right: 10px !important;
    border-right: 1px solid #d0c9be !important;
    line-height: 1 !important;
}

/* Icon wrapper — position relative za badge */
.elementor-menu-cart__toggle_button .elementor-button-icon {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 0 !important;
    padding: 2px !important;
}

/* Sakrij Elementor basket ikonu, zamijeni cart ikonom identičnom mobile verziji */
.elementor-menu-cart__toggle_button .e-font-icon-svg {
    display: none !important;
}

.elementor-menu-cart__toggle_button .elementor-button-icon::before {
    content: '' !important;
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232a2a2a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='21' r='1'/%3E%3Ccircle cx='20' cy='21' r='1'/%3E%3Cpath d='M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
}

/* Badge s brojem artikala — pozicioniran poput mobile */
.elementor-button-icon-qty {
    position: absolute !important;
    top: -4px !important;
    right: -6px !important;
    background: #C8952C !important;
    color: #fff !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    min-width: 16px !important;
    height: 16px !important;
    border-radius: 8px !important;
    padding: 0 3px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

/* --- Side cart panel --- */

/* Main: 420px umjesto Elementorovog defaulta 350px.
   padding:0 da svaka sekcija drži vlastiti padding konzistentno. */
.elementor-menu-cart__main {
    width: 420px !important;
    max-width: 100vw !important;
    background: #fff !important;
    padding: 0 !important;
}

.woocommerce-mini-cart__empty-message {
    padding: 24px !important;
    font-size: 15px !important;
    color: #555 !important;
}

/* Close button — mali X gumb, pozicioniran gore-desno s marginom.
   Ne smije biti display:flex jer ::before/::after koriste width:100% za crtanje X-a. */
.elementor-menu-cart__close-button {
    display: block !important;
    width: 26px !important;
    height: 26px !important;
    padding: 0 !important;
    margin: 18px 24px 14px auto !important;
    border-bottom: none !important;
    align-self: flex-end !important;
    flex-shrink: 0 !important;
}

/* Products lista — separator ide ovdje, ne na close button */
.elementor-menu-cart__products {
    border-top: 1px solid #f0ebe3 !important;
    padding: 0 24px !important;
    max-height: calc(100vh - 220px) !important;
    overflow-y: auto !important;
}

/* Artikl wrapper — padding-inline-end za remove gumb */
.elementor-menu-cart__product {
    padding-inline-end: 34px !important;
}

/* Artikl — ime */
.elementor-menu-cart__product-name a {
    font-size: 0.88rem !important;
    color: #2a2a2a !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
}

.elementor-menu-cart__product-name a:hover {
    color: #C8952C !important;
}

/* Artikl — cijena */
.elementor-menu-cart__product-price {
    font-size: 0.88rem !important;
    color: #555 !important;
}

/* WooCommerce dodaje border/padding na .quantity za quantity input;
   u mini cartu .quantity je samo text wrapper — resetiramo. */
.elementor-menu-cart__product-price .quantity {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    display: inline !important;
}

/* Remove ikona */
.elementor-menu-cart__product-remove a {
    color: #bbb !important;
    font-size: 18px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    transition: color 0.15s !important;
}

.elementor-menu-cart__product-remove a:hover {
    color: #c00 !important;
}

/* Subtotal */
.elementor-menu-cart__subtotal {
    border-top: 2px solid #f0ebe3 !important;
    padding: 14px 24px !important;
    font-size: 1rem !important;
    font-weight: normal !important;
    text-align: left !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.elementor-menu-cart__subtotal strong {
    font-weight: 600 !important;
    color: #1a1a1a !important;
}

.elementor-menu-cart__subtotal .woocommerce-Price-amount {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}

/* Footer gumbi */
.elementor-menu-cart__footer-buttons {
    display: flex !important;
    gap: 8px !important;
    padding: 12px 24px 20px !important;
    grid-template-columns: unset !important;
}

.elementor-menu-cart__footer-buttons .elementor-button {
    flex: 1 !important;
    text-align: center !important;
    border-radius: 20px !important;
    padding: 10px 12px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    display: block !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--view-cart {
    background: transparent !important;
    color: #333 !important;
    border: 1.5px solid #ddd !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--view-cart:hover {
    border-color: #333 !important;
    background: #f5f5f5 !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--checkout {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
}

.elementor-menu-cart__footer-buttons .elementor-button--checkout:hover {
    background-color: #b07824 !important;
}


/* ================================================================
   21. CHECKOUT — WC Blocks form inputs & selects
   ================================================================ */

/* Text inputi — floating label wrapper */
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"] {
    border: 1.5px solid #ddd !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    color: #2a2a2a !important;
    background: #fafafa !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.2s ease, background 0.2s ease !important;
}

.wc-block-components-text-input input:focus {
    border-color: #C8952C !important;
    background: #fff !important;
}

.wc-block-components-text-input.has-error input {
    border-color: #c00 !important;
}

/* Select dropdowns (Država, Regija/Županija) */
.wc-blocks-components-select__select {
    border: 1.5px solid #ddd !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    color: #2a2a2a !important;
    background: #fafafa !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color 0.2s ease !important;
    cursor: pointer !important;
}

.wc-blocks-components-select__select:focus {
    border-color: #C8952C !important;
    background: #fff !important;
}

/* Label (floating) */
.wc-block-components-text-input label {
    font-size: 13px !important;
    color: #888 !important;
}

.wc-blocks-components-select__label {
    font-size: 13px !important;
    color: #888 !important;
}

/* Checkboxevi — accent boja */
.wc-block-checkout input[type="checkbox"] {
    accent-color: #C8952C;
}

/* Step naslovi (Kontakt informacije, Adresa za naplatu, Opcije plaćanja) */
.wc-block-components-checkout-step__title {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    padding-bottom: 12px !important;
    border-bottom: 2px solid #f0ebe3 !important;
    margin-bottom: 20px !important;
}

/* Desktop sidebar (Sažetak narudžbe desno) */
.wc-block-components-checkout-order-summary__title-text {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}

.wc-block-components-order-summary-item__description h3 {
    font-size: 0.9rem !important;
    font-weight: 600 !important;
    color: #2a2a2a !important;
}

.wc-block-components-totals-item__label {
    font-size: 0.92rem !important;
    color: #555 !important;
}

.wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}

.wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
    font-size: 1.1rem !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
}

/* "Povratak u košaricu" link */
.wc-block-components-checkout-return-to-cart-button {
    font-size: 13px !important;
    color: #888 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    transition: color 0.2s !important;
}

.wc-block-components-checkout-return-to-cart-button:hover {
    color: #C8952C !important;
}

/* Panel "Dodaj kupone" */
.wc-block-components-panel__button {
    font-size: 0.9rem !important;
    color: #555 !important;
}


/* ================================================================
   21. MY ACCOUNT — klasični WooCommerce shortcode
   ================================================================ */

/* Layout: nav lijevo, content desno */
.woocommerce-account .woocommerce {
    display: flex;
    gap: 40px;
    align-items: flex-start;
}

.woocommerce-MyAccount-navigation {
    flex: 0 0 220px;
    background: #f9f6f1;
    border-radius: 12px;
    padding: 16px 0;
}

.woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.woocommerce-MyAccount-navigation ul li a {
    display: block;
    padding: 11px 20px;
    font-size: 0.9rem;
    color: #444;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    border-left: 3px solid transparent;
}

.woocommerce-MyAccount-navigation ul li a:hover {
    background: #f0ebe3;
    color: #1a1a1a;
}

.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--is-active a {
    background: #faf3e6;
    color: #C8952C;
    font-weight: 600;
    border-left-color: #C8952C;
}

.woocommerce-MyAccount-content {
    flex: 1;
    min-width: 0;
}

/* Login + Register forme */
.woocommerce-account .woocommerce-form input[type="text"],
.woocommerce-account .woocommerce-form input[type="email"],
.woocommerce-account .woocommerce-form input[type="password"] {
    border: 1.5px solid #ddd;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 15px;
    color: #2a2a2a;
    background: #fafafa;
    outline: none;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.woocommerce-account .woocommerce-form input:focus {
    border-color: #C8952C;
    background: #fff;
}

.woocommerce-account .woocommerce-form label {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    color: #555;
    margin-bottom: 6px;
    letter-spacing: 0.03em;
}

.woocommerce-account .woocommerce-form .form-row {
    margin-bottom: 16px;
}

/* Gumbi Prijava / Registracija */
.woocommerce-account .woocommerce-form button[type="submit"],
.woocommerce-account .woocommerce-form .button,
.woocommerce-account .button {
    background-color: #C8952C !important;
    color: #fff !important;
    border: none !important;
    border-radius: 20px !important;
    padding: 10px 28px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    cursor: pointer !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: background-color 0.2s ease !important;
}

.woocommerce-account .woocommerce-form button[type="submit"]:hover,
.woocommerce-account .woocommerce-form .button:hover,
.woocommerce-account .button:hover {
    background-color: #b07824 !important;
}

/* "Zapamti me" checkbox */
.woocommerce-account .woocommerce-form__input-checkbox {
    accent-color: #C8952C;
    width: 16px;
    height: 16px;
    cursor: pointer;
}

/* "Zaboravili ste lozinku?" link */
.woocommerce-LostPassword a,
.woocommerce-account a {
    color: #C8952C;
    text-decoration: none;
}

.woocommerce-LostPassword a:hover,
.woocommerce-account a:hover {
    text-decoration: underline;
}

/* Account edit forme (edit address, edit account) */
.woocommerce-address-fields input[type="text"],
.woocommerce-address-fields select {
    border: 1.5px solid #ddd;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 15px;
    color: #2a2a2a;
    background: #fafafa;
    outline: none;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.2s ease;
}

.woocommerce-address-fields input:focus,
.woocommerce-address-fields select:focus {
    border-color: #C8952C;
    background: #fff;
}

/* Narudžbe tablica */
.woocommerce-orders-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
}

.woocommerce-orders-table th {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #999;
    border-bottom: 2px solid #f0ebe3;
    padding: 8px 12px;
}

.woocommerce-orders-table td {
    padding: 12px;
    border-bottom: 1px solid #f5f5f5;
    color: #2a2a2a;
}

.woocommerce-orders-table .button {
    padding: 6px 16px !important;
    font-size: 12px !important;
}

@media (max-width: 768px) {
    .woocommerce-account .woocommerce {
        flex-direction: column;
        gap: 24px;
    }

    .woocommerce-MyAccount-navigation {
        flex: none;
        width: 100%;
        border-radius: 8px;
    }
}

/* ================================================================
   FOOTER — desktop: sužen i centriran
   ================================================================ */
@media (min-width: 769px) {
    .elementor-element-6e81025 {
        /* outer ostaje full-width da background ide do ruba */
        /* padding centrira sadržaj, na wide screenima se povećava */
        padding-left: max(60px, calc(50% - 660px)) !important;
        padding-right: max(60px, calc(50% - 660px)) !important;
        box-sizing: border-box !important;
    }
}

/* ================================================================
   HOMEPAGE — naslovi sekcija bold
   ================================================================ */
body.home .elementor-widget-heading .elementor-heading-title {
    font-weight: 700 !important;
}

/* ================================================================
   HOMEPAGE — mobile: maknuti margine između sekcija
   ================================================================ */
@media (max-width: 768px) {
    .elementor-element.elementor-element-1249281,
    .elementor-element.elementor-element-331a4c5,
    .elementor-element.elementor-element-f63ec8a,
    .elementor-element.elementor-element-8829770,
    .elementor-element.elementor-element-5a09c5d,
    .elementor-element.elementor-element-461b211 {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        --margin-top: 0px;
        --margin-bottom: 0px;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        --padding-top: 10px;
        --padding-bottom: 10px;
    }
    .elementor-element.elementor-element-1249281 > .e-con-inner,
    .elementor-element.elementor-element-331a4c5 > .e-con-inner,
    .elementor-element.elementor-element-f63ec8a > .e-con-inner,
    .elementor-element.elementor-element-8829770 > .e-con-inner,
    .elementor-element.elementor-element-5a09c5d > .e-con-inner,
    .elementor-element.elementor-element-461b211 > .e-con-inner {
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }
}

/* ================================================================
   PRAVNE STRANICE — maknuti theme padding na mobileu
   ================================================================ */
@media (max-width: 575px) {
    body.page-id-3 .site-main,
    body.page-id-11 .site-main,
    body.page-id-4603 .site-main,
    body.page-id-4604 .site-main,
    body.page-id-4605 .site-main,
    body.page-id-4606 .site-main,
    body.page-id-4610 .site-main {
        padding-inline-start: 0 !important;
        padding-inline-end: 0 !important;
    }
}

/* ================================================================
   COOKIE CONSENT BANNER
   ================================================================ */
.acta-cookie-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 99999;
    background: #1a1a1a;
    color: #fff;
    padding: 14px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    box-shadow: 0 -2px 12px rgba(0,0,0,0.3);
}
.acta-cookie-banner[hidden] {
    display: none !important;
}
.acta-cookie-banner p {
    margin: 0;
    font-size: 13px;
    color: rgba(255,255,255,0.8);
    line-height: 1.5;
}
.acta-cookie-banner p a {
    color: #fff;
    text-decoration: underline;
}
.acta-cookie-accept {
    flex-shrink: 0;
    background: #fff;
    color: #1a1a1a;
    border: none;
    padding: 8px 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    border-radius: 4px;
    white-space: nowrap;
    transition: background 0.2s, color 0.2s;
}
.acta-cookie-accept:hover {
    background: #6EC1E4;
    color: #fff;
}
@media (max-width: 575px) {
    .acta-cookie-banner {
        flex-direction: column;
        align-items: flex-start;
        padding: 14px 16px;
    }
    .acta-cookie-accept {
        width: 100%;
        text-align: center;
    }
}

/* ================================================================
   LEGAL BAR — footer linkovi na dnu stranice
   ================================================================ */
.acta-legal-bar {
    background: #1a1a1a;
    border-top: 1px solid rgba(255,255,255,0.08);
    padding: 12px 20px;
}
.acta-legal-bar__inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 20px;
    max-width: 1440px;
    margin: 0 auto;
}
.acta-legal-bar a {
    color: rgba(255,255,255,0.55);
    font-size: 12px;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s;
}
.acta-legal-bar a:hover {
    color: #fff;
}
@media (max-width: 768px) {
    .acta-legal-bar__inner {
        gap: 6px 14px;
    }
    .acta-legal-bar a {
        font-size: 11px;
    }
}

.acta-copyright {
    text-align: center;
    color: #aaa;
    font-size: 12px;
    padding: 8px 16px 12px;
    background: #1a1a1a;
}

/* ============================================================
   WISHLIST / FAVORITI
   ============================================================ */

/* Heart gumb — overlay na karticama */
.acta-wishlist-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 36px;
    height: 36px;
    background: transparent !important;
    border: none !important;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    transition: transform 0.15s;
    padding: 0;
    line-height: 1;
    box-shadow: none !important;
}

.acta-wishlist-btn:hover {
    background: transparent !important;
    transform: scale(1.1);
}

.acta-wishlist-btn svg {
    width: 18px;
    height: 18px;
    display: block;
    transition: fill 0.15s, stroke 0.15s;
}

.acta-wishlist-btn svg path {
    fill: none;
    stroke: #555;
    stroke-width: 1.5;
}

.acta-wishlist-btn.is-wishlisted svg path {
    fill: #C8952C;
    stroke: #C8952C;
}

/* Osiguraj da WC loop item i Elementor loop item imaju position: relative */
li.product,
.e-loop-item {
    position: relative;
}

/* Single product — gumb s labelom, nije overlay */
.acta-wishlist-btn--single {
    position: static !important;
    width: auto !important;
    height: auto !important;
    border-radius: 0 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 0 0 10px !important;
    flex-shrink: 0 !important;
}

.acta-wishlist-btn--single svg {
    width: 26px !important;
    height: 26px !important;
}

.acta-wishlist-btn--single:hover {
    border: none !important;
    transform: none !important;
    background: transparent !important;
}

.acta-wishlist-btn--single.is-wishlisted {
    border: none !important;
}

.acta-wishlist-label {
    line-height: 1.2;
}

/* ---- Favorites stranica ---- */
#acta-wishlist-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    /* gap je identičan shop gridu — definiran dolje u media queryjima */
    padding: 32px 0 !important;
    list-style: none !important;
    margin-left: 0 !important;
}

#acta-wishlist-grid li.product {
    width: auto !important;
    margin: 0 !important;
    float: none !important;
    position: relative !important;
}

/* Produkt link — makni border i underline */
#acta-wishlist-grid li.product a.woocommerce-LoopProduct-link,
#acta-wishlist-grid li.product a.woocommerce-LoopProduct-link:hover {
    border: none !important;
    border-bottom: none !important;
    text-decoration: none !important;
    outline: none !important;
}

/* Odmak između slike i branda */
#acta-wishlist-grid li.product .product-loop-brand {
    margin-top: 8px !important;
}

/* Button — manje visine nego shop (7px), bez bordera/underlinea */
#acta-wishlist-grid li.product a.button {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    font-size: 11px !important;
    text-decoration: none !important;
    border: none !important;
    border-bottom: none !important;
}

/* Smanji razmak između cijene i gumba */
@media (min-width: 769px) {
    #acta-wishlist-grid li.product .woocommerce-loop-product__buttons .add_to_cart_button,
    #acta-wishlist-grid li.product .woocommerce-loop-product__buttons .added_to_cart {
        margin-top: 8px !important;
    }
}

/* "Prikaži košaricu" link — bez underlinea */
#acta-wishlist-grid li.product .added_to_cart {
    text-decoration: none !important;
    color: inherit !important;
}

/* Gap — identičan shop gridu */
@media (min-width: 769px) {
    #acta-wishlist-grid {
        column-gap: 12px !important;
        row-gap: 14px !important;
    }
}

@media (max-width: 1024px) {
    #acta-wishlist-grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}

@media (max-width: 768px) {
    #acta-wishlist-grid {
        column-gap: 6px !important;
        row-gap: 20px !important;
    }
}

@media (max-width: 767px) {
    #acta-wishlist-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

.acta-wl-card {
    position: relative;
    border: 1px solid #efefef;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    transition: box-shadow 0.2s;
}

.acta-wl-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

.acta-wl-card__img-wrap {
    display: block;
    aspect-ratio: 1;
    overflow: hidden;
}

.acta-wl-card__img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s;
}

.acta-wl-card:hover .acta-wl-card__img-wrap img {
    transform: scale(1.04);
}

.acta-wl-card__body {
    padding: 12px 14px 14px;
}

.acta-wl-card__name {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: #1a1a1a;
    text-decoration: none;
    margin-bottom: 6px;
    line-height: 1.3;
}

.acta-wl-card__name:hover {
    color: #C8952C;
}

.acta-wl-card__price {
    font-size: 0.95rem;
    color: #1a1a1a;
}

.acta-wishlist-empty {
    text-align: center;
    padding: 48px 0;
    color: #666;
    font-size: 1rem;
}

.acta-wishlist-empty a {
    color: #C8952C;
    text-decoration: underline;
}

@media (max-width: 600px) {
    .acta-wishlist-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}

/* === Besplatna dostava progress bar === */
.acta-shipping-progress {
    background: #f8f6f2;
    border-radius: 8px;
    padding: 14px 16px;
    margin: 0 0 16px;
    font-size: 13px;
    color: #333;
    line-height: 1.5;
}
.acta-shipping-progress--free {
    background: #edf6ec;
    color: #2d6a2d;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
}
.acta-shipping-progress--free .acta-shipping-progress__icon {
    font-size: 18px;
    line-height: 1;
}
.acta-shipping-progress__text {
    margin: 0 0 10px;
}
.acta-shipping-progress__bar {
    background: #e0dbd3;
    border-radius: 99px;
    height: 6px;
    overflow: hidden;
}
.acta-shipping-progress__fill {
    height: 100%;
    background: linear-gradient(90deg, #C8952C, #e8b24a);
    border-radius: 99px;
    transition: width 0.4s ease;
}
/* Na cart stranici malo više prostora */
.woocommerce-cart .acta-shipping-progress {
    margin-bottom: 20px;
}

/* ─── Related Products Slider ───────────────────── */
.acta-rp-slider-wrapper {
    position: relative;
}
.elementor-element-5f995ce .products.elementor-grid {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    gap: 20px;
    padding-bottom: 2px;
}
.elementor-element-5f995ce .products.elementor-grid::-webkit-scrollbar { display: none; }

/* Mobile: ~2 items + peek of 3rd */
.elementor-element-5f995ce .products.elementor-grid li.product {
    flex: 0 0 calc(44% - 9px);
    min-width: calc(44% - 9px);
}

/* Desktop: 5 items per "page" */
@media (min-width: 1025px) {
    .elementor-element-5f995ce .products.elementor-grid li.product {
        flex: 0 0 calc(20% - 16px);
        min-width: calc(20% - 16px);
    }
}

/* Gradient scrim */
.acta-rp-scrim {
    position: absolute;
    top: 0; bottom: 0;
    width: 80px;
    pointer-events: none;
    z-index: 2;
    transition: opacity 0.3s;
}
.acta-rp-scrim--left {
    left: 0;
    background: linear-gradient(to right, rgba(255,255,255,1) 10%, rgba(255,255,255,0));
    opacity: 0;
}
.acta-rp-scrim--right {
    right: 0;
    background: linear-gradient(to left, rgba(255,255,255,1) 10%, rgba(255,255,255,0));
}
.acta-rp-slider-wrapper.acta-rp-started .acta-rp-scrim--left { opacity: 1; }
.acta-rp-slider-wrapper.acta-rp-end .acta-rp-scrim--right { opacity: 0; }

/* Arrows — desktop only */
.acta-rp-arrow { display: none; }

@media (min-width: 1025px) {
    .acta-rp-arrow {
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 44px;
        height: 44px;
        background: #fff;
        border: 1.5px solid #ddd;
        border-radius: 50%;
        cursor: pointer;
        z-index: 5;
        box-shadow: 0 2px 10px rgba(0,0,0,0.10);
        transition: box-shadow 0.2s, opacity 0.2s;
        padding: 0;
        color: #333;
    }
    .acta-rp-arrow:hover { box-shadow: 0 4px 18px rgba(0,0,0,0.16); }
    .acta-rp-arrow[disabled] { opacity: 0.2; cursor: default; pointer-events: none; }
    .acta-rp-arrow--prev { left: 8px; }
    .acta-rp-arrow--next { right: 8px; }
}

/* Checkout: pomakni "Naziv poduzeća" iznad OIB-a (na dno adresnog bloka) */
.wc-block-checkout__shipping-fields .wc-block-components-address-form,
.wc-block-checkout__billing-fields .wc-block-components-address-form {
    display: flex;
    flex-direction: column;
}
.wc-block-components-address-form__first_name  { order: 1; }
.wc-block-components-address-form__last_name   { order: 2; }
.wc-block-components-address-form__country     { order: 3; margin-top: 16px; }
.wc-block-components-address-form__address_1   { order: 4; }
.wc-block-components-address-form__address_2-toggle,
.wc-block-components-address-form__address_2-hidden-input,
.wc-block-components-address-form__address_2 { order: 5; }
.wc-block-components-address-form__city        { order: 6; }
.wc-block-components-address-form__state       { order: 7; }
.wc-block-components-address-form__postcode    { order: 8; }
.wc-block-components-address-form__phone       { order: 9; }
.wc-block-components-address-form__company     { order: 10; margin-top: 16px !important; }
.wc-block-components-address-form__acta4hair-billing_oib { order: 11; }

/* Desktop: vrati 2-kolumni layout (override container query neće raditi, ali flex-column s wrappom je ok) */
@media (min-width: 700px) {
    .wc-block-checkout__shipping-fields .wc-block-components-address-form,
    .wc-block-checkout__billing-fields .wc-block-components-address-form {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 0 12px;
    }
    .wc-block-components-address-form__company {
        flex: 0 0 100%;
    }
}

/* Mobile: makni padding, puni width */
@media (max-width: 699px) {
    .wp-block-woocommerce-checkout,
    .wp-block-woocommerce-checkout .wc-block-components-main {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .wc-block-components-address-form__company {
        flex: 0 0 100%;
    }
}
