/* ==========================================================================
   1. CROSS-BROWSER PRICE CONFIGURATION (Enforced Universal Green)
   ========================================================================== */
/* Combines all individual, loop, and cross-platform elements into one clean engine */
body.single-product .summary p.price,
body.single-product .price,
body.single-product .price *,
ul.products li.product .price,
ul.products li.product .price *,
.shoptimizer-purchasable-wrapper p.price span.amount,
.summary-mobile p.price span.amount,
span.woocommerce-Price-amount.amount,
.price ins .amount {
    color: #008000 !important; /* Force exact true green */
    -webkit-text-fill-color: #008000 !important; /* Fixes iOS Safari/Chrome mobile color lock */
    font-size: 17px !important;
    font-weight: bold !important;
}

/* Keeps the original un-slashed/sale strike-through price a clean grey */
body.single-product .price del,
body.single-product .price del *,
.price del .amount,
.price del span.amount {
    color: #a0a0a0 !important;
    -webkit-text-fill-color: #a0a0a0 !important; /* Fixes iOS Safari/Chrome mobile color lock */
    font-size: 14px !important;
    font-weight: normal !important;
}

/* ==========================================================================
   2. REINFORCED KLARNA & STRIPE SPACING ENGINE (No-Overlap Protection)
   ========================================================================== */
/* Create a physical, un-collapsible structural margin under the cart wrapper */
.single-product form.cart,
.summary-mobile form.cart,
.commercekit-mobile-summary form.cart,
.shoptimizer-purchasable-wrapper {
    margin-bottom: 60px !important; /* Pushes third-party tools cleanly away from button */
    display: block !important;
    clear: both !important;
    position: relative !important;
}

/* Forces Klarna and Stripe to respect natural device document flow */
klarna-placement,
.klarna-placement,
.klarna-express-button,
.afterpay-paragraph,
[class*="-message"],
[id*="klarna-"],
[class*="klarna-"],
.wc-stripe-payment-request-wrapper,
#wc-stripe-payment-request-wrapper,
.stripe-payment-request-button {
    display: block !important;
    clear: both !important;
    position: relative !important;
    transform: none !important; /* REMOVES the broken invisible slide effect entirely */
    margin-top: 25px !important; /* Adds natural blank whitespace */
    margin-bottom: 25px !important;
    width: 100% !important;
    visibility: visible !important;
}

/* Your working layer layout correction */
.summary #payment-method-message {
    clear: both !important;
    height: auto !important;
}

/* ==========================================================================
   3. CHECKOUT & CART LAYOUT PROTECTION
   ========================================================================== */
.woocommerce-cart .wc-proceed-to-checkout,
.woocommerce-checkout #payment {
    clear: both !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
}

.stripe-banner,
.klarna-express-button,
[id*="stripe-"],
[class*="payment_box_stripe"] {
    clear: both !important;
    display: block !important;
    margin-bottom: 20px !important;
    position: relative !important;
}

.woocommerce-cart #payment-method-message {
    margin-bottom: 1.5rem !important;
    overflow: hidden;
}

.wc-amazon-checkout-message,
.wc-amazon-payments-advanced-info {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.wc-amazon-payments-advanced-info {
    overflow: hidden;
}

.woopay-save-new-user-container .save-details-form.form-row .phone-input {
    margin-left: 5em;
}

#payment .payment_methods.wc_payment_methods li[class*=payment_method_woocommerce_payments] .woopayments-rich-payment-method-label {
    max-width: calc(100% - 60px) !important;
}

@media (max-width: 768px) {
    .woocommerce-cart .wc-proceed-to-checkout .checkout-button,
    #place_order {
        margin-top: 25px !important;
        position: relative !important;
        clear: both !important;
    }
}

/* ==========================================================================
   4. SINGLE PRODUCT METADATA CONFIGURATION
   ========================================================================== */
.single-product .woocommerce-product-details__short-description {
    margin-top: 30px;
}

.product_meta {
    left: 0;
    right: 0;
    margin-left: 0;
    margin-right: 0;
}

/* ==========================================================================
   5. GALLERY ENGINE & UNIVERSAL IMAGE ALIGNMENT (Dimension Lock Edition)
   ========================================================================== */
/* Grid card containers retain perfectly rigid structures to keep 0 CLS */
.woocommerce-product-gallery__wrapper,
.commercekit-gallery,
.commercekit-gallery-slide,
.shoptimizer-loop-image-wrapper {
    aspect-ratio: 1 / 1 !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
}

/* Image elements are structurally locked to standard responsive mobile dimensions */
.woocommerce-product-gallery__wrapper img,
.commercekit-gallery-slide img,
.shoptimizer-loop-image-wrapper img,
.commercekit-gallery img,
.products .product img {
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    max-width: 320px !important; /* FIXED: Caps display request size on mobile grids */
    height: auto !important;
    max-height: 320px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
}

@media (min-width: 769px) {
    .woocommerce-product-gallery__wrapper img,
    .commercekit-gallery-slide img,
    .shoptimizer-loop-image-wrapper img,
    .commercekit-gallery img,
    .products .product img {
        max-width: 100% !important; /* Restores full grid sizing back to desktop views */
        max-height: 100% !important;
    }
    .woocommerce-product-gallery__wrapper,
    .commercekit-gallery-slide,
    .shoptimizer-loop-image-wrapper {
        background-color: #fcfcfc;
    }
}

/* ==========================================================================
   MOBILE PRODUCT GALLERY RENDER RESTRAINTS & CLS ANCHOR ENGINE
   ========================================================================== */
@media (max-width: 768px) {
    .single-product .woocommerce-product-gallery__wrapper, 
    .single-product .commercekit-gallery, 
    .single-product .commercekit-gallery-slide {
        max-width: 441px !important; 
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .single-product .woocommerce-product-gallery__wrapper {
        min-height: 382px !important; 
        aspect-ratio: 1 / 1 !important;
        contain: layout size !important;
    }
}

/* ==========================================================================
   CROSS-BROWSER HIGH-DENSITY DIMENSION LOCK (Fixes Size Mismatch)
   ========================================================================== */
@media (max-width: 768px) {
    .single-product .woocommerce-product-gallery__wrapper img,
    .single-product .commercekit-gallery-slide img {
        width: 100% !important;
        max-width: 441px !important;
        height: auto !important;
        object-fit: contain !important;
    }
}

@media (min-width: 769px) {
    .single-product .woocommerce-product-gallery__wrapper img,
    .single-product .commercekit-gallery-slide img {
        width: 100% !important;
        max-width: 717px !important;
        height: auto !important;
        object-fit: contain !important;
    }
}
/* ==========================================================================
   6. ABSOLUTE MOBILE IMAGE RECOVERY FORCE (Streamlined Theme Edition)
   ========================================================================== */
@media (max-width: 768px) {
    /* 1. Forces the true hidden images inside the theme layout to display instantly */
    .products .product img,
    .shoptimizer-loop-image-wrapper img {
        opacity: 1 !important;
        visibility: visible !important;
        display: block !important;
    }
    
    /* 2. Forces the theme's fallback noscript wrappers to paint immediately if scripts are delayed */
    .products .product noscript,
    .shoptimizer-loop-image-wrapper noscript {
        display: block !important;
    }
    
    /* 3. Instantly hides the blank placeholder boxes that freeze the LCP clock */
    .cgkit-image-facade {
        display: none !important;
        opacity: 0 !important;
    }
}