/* ═══════════════════════════════════════════
   TAVO ŠAMPŪNAS — Shoptimizer Bridge
   Applies Core Design variables to Shoptimizer
   ═══════════════════════════════════════════ */

/* ─── Global Typography & Background ─── */
/* Apply background ONLY to body to avoid overriding footer/section backgrounds */
html body,
html body.theme-shoptimizer {
    background-color: var(--ts-bg) !important;
    color: var(--ts-body-color) !important;
    font-family: var(--ts-sans) !important;
    font-weight: 300 !important;
    -webkit-font-smoothing: antialiased !important;
}

/* Force Instrument Sans on all text elements to unify typography */
html body.theme-shoptimizer p,
html body.theme-shoptimizer span,
html body.theme-shoptimizer a,
html body.theme-shoptimizer li,
html body.theme-shoptimizer div,
html body.theme-shoptimizer td,
html body.theme-shoptimizer th,
html body.theme-shoptimizer label,
html body.theme-shoptimizer button,
html body.theme-shoptimizer input,
html body.theme-shoptimizer textarea,
html body.theme-shoptimizer select,
html body.theme-shoptimizer strong,
html body.theme-shoptimizer em,
html body.theme-shoptimizer small {
    font-family: var(--ts-sans) !important;
}

/* Force transparent background on Shoptimizer content wrappers so body background shows through */
html body.theme-shoptimizer div#content,
html body.theme-shoptimizer .site-content,
html body.theme-shoptimizer .content-area,
html body.theme-shoptimizer main#main {
    background-color: transparent !important;
    background: transparent !important;
}

/* ─── Headings (Contextual) ─── */
/* Uses --ts-header-color which automatically turns white in dark sections */
html body.theme-shoptimizer h1, 
html body.theme-shoptimizer h2, 
html body.theme-shoptimizer h3, 
html body.theme-shoptimizer h4, 
html body.theme-shoptimizer h5, 
html body.theme-shoptimizer h6,
html body.theme-shoptimizer .woocommerce-loop-product__title,
html body.theme-shoptimizer .product_title,
html body.theme-shoptimizer .widget-title {
    font-family: var(--ts-serif) !important;
    font-weight: 400 !important;
    color: var(--ts-header-color) !important;
}

/* ─── Buttons (Primary) ─── */
/* Targeting Shoptimizer and WooCommerce buttons with high specificity */
/* We use .woocommerce-page to avoid hitting header search icons or burger menus */
html body.theme-shoptimizer .woocommerce-page .button.alt,
html body.theme-shoptimizer .woocommerce-page button.button.alt,
html body.theme-shoptimizer .woocommerce-page input.button.alt,
html body.theme-shoptimizer .woocommerce-page #respond input#submit.alt,
html body.theme-shoptimizer .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
html body.theme-shoptimizer .woocommerce-checkout .place-order button#place_order {
    background-color: var(--ts-ink) !important;
    color: var(--ts-bg) !important;
    font-family: var(--ts-sans) !important;
    font-size: 12px !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    font-weight: 400 !important;
    padding: 16px 34px !important;
    border-radius: 100px !important;
    border: none !important;
    transition: all 0.4s var(--ts-ease) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

html body.theme-shoptimizer .woocommerce-page .button.alt:hover,
html body.theme-shoptimizer .woocommerce-page button.button.alt:hover,
html body.theme-shoptimizer .woocommerce-page input.button.alt:hover,
html body.theme-shoptimizer .woocommerce-page #respond input#submit.alt:hover,
html body.theme-shoptimizer .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
html body.theme-shoptimizer .woocommerce-checkout .place-order button#place_order:hover {
    background-color: var(--ts-terra) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 28px rgba(26, 23, 20, 0.08) !important;
    color: var(--ts-bg) !important;
}

/* ─── Buttons (Secondary) ─── */
html body.theme-shoptimizer .woocommerce-page .button:not(.alt),
html body.theme-shoptimizer .woocommerce-page button.button:not(.alt),
html body.theme-shoptimizer .woocommerce-page input.button:not(.alt) {
    background-color: rgba(244, 241, 235, 0.92) !important;
    color: var(--ts-ink) !important;
    font-family: var(--ts-sans) !important;
    font-size: 11px !important;
    letter-spacing: 0.1em !important;
    text-transform: uppercase !important;
    font-weight: 400 !important;
    padding: 14px 28px !important;
    border-radius: 100px !important;
    border: 1px solid var(--ts-line) !important;
    transition: all 0.4s var(--ts-ease) !important;
}

html body.theme-shoptimizer .woocommerce-page .button:not(.alt):hover,
html body.theme-shoptimizer .woocommerce-page button.button:not(.alt):hover,
html body.theme-shoptimizer .woocommerce-page input.button:not(.alt):hover {
    background-color: var(--ts-white) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 28px rgba(26, 23, 20, 0.08) !important;
}

/* ─── Prices ─── */
html body.theme-shoptimizer .price,
html body.theme-shoptimizer .woocommerce-Price-amount {
    font-family: var(--ts-serif) !important;
    color: var(--ts-header-color) !important;
    font-weight: 400 !important;
}

html body.theme-shoptimizer .price del .woocommerce-Price-amount {
    color: var(--ts-ink4) !important;
    font-family: var(--ts-sans) !important;
    font-weight: 300 !important;
}

/* ─── Inputs & Forms ─── */
html body.theme-shoptimizer input[type="text"],
html body.theme-shoptimizer input[type="email"],
html body.theme-shoptimizer input[type="tel"],
html body.theme-shoptimizer input[type="password"],
html body.theme-shoptimizer textarea,
html body.theme-shoptimizer select,
html body.theme-shoptimizer .select2-container .select2-selection--single {
    font-family: var(--ts-sans) !important;
    font-weight: 300 !important;
    color: var(--ts-ink) !important;
    border-color: var(--ts-line) !important;
    background-color: var(--ts-white) !important;
}

html body.theme-shoptimizer input[type="text"]:focus,
html body.theme-shoptimizer input[type="email"]:focus,
html body.theme-shoptimizer input[type="tel"]:focus,
html body.theme-shoptimizer input[type="password"]:focus,
html body.theme-shoptimizer textarea:focus,
html body.theme-shoptimizer select:focus {
    border-color: var(--ts-ink4) !important;
    outline: none !important;
}

/* ─── Cart & Checkout Specifics ─── */
html body.theme-shoptimizer .woocommerce-cart-form,
html body.theme-shoptimizer .woocommerce-checkout {
    background-color: var(--ts-bg) !important;
}

html body.theme-shoptimizer .woocommerce-checkout #payment {
    background-color: var(--ts-bg2) !important;
    border-radius: 8px !important;
}

html body.theme-shoptimizer .woocommerce-checkout #payment div.payment_box {
    background-color: var(--ts-bg) !important;
    color: var(--ts-ink2) !important;
}

/* ─── Fix for Cart Drawer Payment Strip ─── */
html body.theme-shoptimizer #shoptimizerCartDrawer .ts-payment-strip {
    background-color: transparent !important;
    border-top: 1px solid rgba(33, 27, 21, 0.08) !important;
}

html body.theme-shoptimizer #shoptimizerCartDrawer .ts-pm-icons {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 14px !important;
}

html body.theme-shoptimizer #shoptimizerCartDrawer .ts-pm-icons img {
    display: block !important;
    height: 20px !important;
    width: auto !important;
    opacity: 1 !important;
    flex-shrink: 0 !important;
}

/* ─── Scrollbar Fix ─── */
/* Force scrollbar to be visible, as Shoptimizer JS sometimes sets it to hidden */
html,
body.theme-shoptimizer.archive.woocommerce {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: auto !important;
}

/* ─── WooCommerce Product Grid ─── */
html body.theme-shoptimizer.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important;
    gap: 24px !important;
}

/* ─── WooCommerce Loop Override (cs-offer-card integration) ─── */
/* Reset Shoptimizer's default product list styles */
html body.theme-shoptimizer.woocommerce ul.products li.product,
html body.theme-shoptimizer.archive.woocommerce ul.products li.product {
    margin-bottom: 24px !important;
    text-align: left !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Hide any remaining Shoptimizer wrappers inside the loop item */
html body.theme-shoptimizer.woocommerce ul.products li.product > *:not(.cs-offer-card),
html body.theme-shoptimizer.archive.woocommerce ul.products li.product > *:not(.cs-offer-card) {
    display: none !important;
}

/* Ensure our cs-offer-card is visible and takes full height */
html body.theme-shoptimizer.woocommerce ul.products li.product .cs-offer-card,
*/
html body.theme-shoptimizer.archive.woocommerce ul.products li.product .cs-offer-card {
    display: flex !important;
    height: 100%;
    width: 100%;
    margin: 0 !important;
} 

/* gemini */
html body.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* Mobilus: 2 stulpeliai */
    gap: 15px !important;
    padding: 10px !important;
}
@media (min-width: 992px) {
    html body.woocommerce ul.products {
        grid-template-columns: repeat(4, 1fr) !important; /* Desktop: 4 stulpeliai */
    }
}
html body.woocommerce ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
    background: transparent !important;
}
@media (max-width: 770px){
    html body.theme-shoptimizer.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
    gap: 10px !important;
}
}
.site-main ul.products li.product:focus-within::before, .site-main ul.products li.product:hover::before {
    visibility: visible;
    opacity: 0 !important;
}
.cs-landing-page .cs-offer-card__actions{
    display: none !important;
}