:root {
    --c-black: #1a1a1a;
    --c-white: #fffff0;
    --c-red: #e74c3c;
    --c-yellow: #f1c40f;
    --c-blue: #2c3e50;
    --c-cream: #fef3c7;
    --font-head: 'Playfair Display', serif;
    --font-body: 'DM Sans', sans-serif;

    /* Pop Variables (Global Scope for Stability) */
    --pop-black: #1a1a1a;
    --pop-white: #fffff0;
    --pop-red: #e74c3c;
    --pop-yellow: #f1c40f;
    --pop-blue: #2c3e50;
    --pop-cream: #fef3c7;
    --shadow-hard: 8px 8px 0px 0px var(--pop-black);
}

/* Global Woo Wrapper - Miró Pop Shop Atmosphere */
.woocommerce-page {
    background-color: #FDFBF7 !important;
    position: relative;
    /* Paper Texture */
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.04'/%3E%3C/svg%3E");
}

/* Miró Pop Background Zones (Atmosphere) */
.woocommerce-page::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
    /* Behind content */
    background:
        /* Yellow Sun Top Right */
        radial-gradient(circle at 85% 15%, rgba(241, 196, 15, 0.4) 0, rgba(241, 196, 15, 0.4) 120px, transparent 125px),
        /* Blue Geometric Wedge Bottom Left */
        linear-gradient(135deg, rgba(44, 62, 80, 0.1) 0%, rgba(44, 62, 80, 0.1) 25%, transparent 25.5%),
        /* Red Line Accent */
        radial-gradient(circle at 10% 80%, transparent 50px, rgba(231, 76, 60, 0.2) 51px, rgba(231, 76, 60, 0.2) 55px, transparent 56px);
}

/* Buttons - Sticker Style */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce .wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link {
    background: var(--c-black) !important;
    color: var(--c-yellow) !important;
    border: 4px solid var(--c-black) !important;
    font-family: var(--font-head) !important;
    text-transform: uppercase;
    font-weight: 900;
    padding: 12px 24px;
    transition: all 0.2s;
    box-shadow: 4px 4px 0px 0px var(--c-red);
    border-radius: 0 !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover {
    transform: translate(-2px, -2px);
    box-shadow: 8px 8px 0px 0px var(--c-red);
    background: var(--c-blue) !important;
    color: var(--c-white) !important;
}

/* Miro Box for Products */
.miro-box {
    background: var(--c-white);
    border: 4px solid var(--c-black);
    box-shadow: 8px 8px 0px 0px var(--c-black);
    padding: 1rem;
    position: relative;
    transition: transform 0.2s;
}

.miro-box:hover {
    transform: translate(-4px, -4px);
    box-shadow: 12px 12px 0px 0px var(--c-red);
}

/* Product Grid */
.miro-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 2rem;
    margin-bottom: 4rem;
}

.woocommerce ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 3rem;
}

.woocommerce ul.products li.product {
    width: 100% !important;
    margin: 0 !important;
    /* Pop Card Container */
    border: 4px solid var(--c-black);
    background: #fff;
    box-shadow: 8px 8px 0px 0px var(--c-black);
    transition: transform 0.2s ease;
    padding: 1rem;
}

.woocommerce ul.products li.product:hover {
    transform: translate(-3px, -3px);
    box-shadow: 12px 12px 0px 0px var(--c-red);
}

/* Product Images - FULL VISIBILITY (No Crop) */
.woocommerce ul.products li.product a img {
    object-fit: contain !important;
    /* Critical Rule */
    width: 100%;
    height: 300px;
    /* Fixed height for alignment */
    margin-bottom: 1rem;
    padding: 10px;
}

/* Price Sticker */
.price-sticker {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: var(--c-yellow);
    border: 2px solid var(--c-black);
    color: var(--c-black);
    padding: 0.5rem 1rem;
    font-weight: bold;
    font-family: var(--font-head);
    transform: rotate(3deg);
    z-index: 10;
    box-shadow: 2px 2px 0px 0px var(--c-black);
}

/* Shop Title */
.shop-title {
    font-family: var(--font-head);
    font-size: 5rem;
    text-transform: uppercase;
    color: var(--c-black);
    font-style: italic;
    line-height: 0.9;
    margin-bottom: 2rem;
    text-shadow: 4px 4px 0px var(--c-white);
}

/* Filter Menu */
.shop-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 3rem;
    border-bottom: 4px solid var(--c-black);
    padding-bottom: 2rem;
}

.shop-filter-btn {
    background: var(--c-white);
    border: 2px solid var(--c-black);
    padding: 0.5rem 1.5rem;
    font-weight: bold;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.2s;
}

.shop-filter-btn:hover,
.shop-filter-btn.active {
    background: var(--c-black);
    color: var(--c-white);
}

/* Forms & Inputs - Pop Art Style */
.woocommerce form {
    border: 4px solid var(--c-black);
    box-shadow: 8px 8px 0px 0px var(--c-black);
    background: var(--c-white);
    padding: 2rem;
    border-radius: 0;
    margin-bottom: 2rem;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
    border: 2px solid var(--c-blue) !important;
    background: white !important;
    font-family: var(--font-body) !important;
    padding: 10px;
    border-radius: 0 !important;
    height: auto;
    line-height: 1.5;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
    box-shadow: 4px 4px 0px 0px var(--c-yellow);
    outline: none;
}

/* Labels */
.woocommerce form label {
    font-family: var(--font-head);
    text-transform: uppercase;
    font-weight: bold;
    color: var(--c-black);
}

/* Checkout Layout */
.woocommerce-checkout .col2-set {
    width: 100%;
    margin-right: 0;
}

.woocommerce-checkout .col-1,
.woocommerce-checkout .col-2 {
    float: none;
    width: 100%;
    margin-bottom: 2rem;
}

.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review {
    border: 4px solid var(--c-black);
    padding: 2rem;
    background: var(--c-cream);
    box-shadow: 8px 8px 0px 0px var(--c-red);
}

.woocommerce table.shop_table {
    border: 2px solid var(--c-black);
    border-radius: 0;
}

.woocommerce table.shop_table th {
    background: var(--c-black);
    color: var(--c-yellow);
    font-family: var(--font-head);
    text-transform: uppercase;
    padding: 1rem;
}

.woocommerce table.shop_table td {
    border-top: 2px solid var(--c-black);
    padding: 1rem;
}

/* Payment Methods */
#payment .payment_methods {
    background: white;
    padding: 1rem;
    border: 2px solid var(--c-black);
}

#payment .place-order {
    padding: 1rem 0 0;
}

/* Cart Specifics */
.woocommerce-cart .cart-collaterals .cart_totals {
    float: none;
    width: 100%;
    border: 4px solid var(--c-black);
    padding: 2rem;
    background: var(--c-white);
    box-shadow: 8px 8px 0px 0px var(--c-blue);
}

/* Notices - Fixed Toast Style (No Layout Shift) */
.woocommerce-notices-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    padding: 0;
    margin: 0;
    z-index: 99999;
    pointer-events: none;
    /* Let clicks pass through wrapper */
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
    position: fixed;
    /* Desktop Default */
    top: 110px;
    right: 24px;
    max-width: 420px;
    /* Styling */
    background-color: var(--c-white);
    color: var(--c-black);
    border: 4px solid var(--c-black);
    box-shadow: 4px 4px 0px 0px var(--c-black);
    font-family: var(--font-head);
    padding: 1rem 2.5rem 1rem 1.5rem !important;
    /* Extra right pad for close btn */
    width: auto !important;
    margin: 0 !important;
    pointer-events: auto;
    /* Re-enable clicks on toast */
    box-sizing: border-box;
    overflow-wrap: anywhere;

    /* Animation */
    opacity: 0;
    transform: translateY(-20px);
    animation: slideInToast 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

.woocommerce-info {
    border-color: var(--c-blue);
    box-shadow: 4px 4px 0px 0px var(--c-blue);
}

.woocommerce-error {
    border-color: var(--c-red);
    box-shadow: 4px 4px 0px 0px var(--c-red);
}

.woocommerce-message {
    border-color: var(--c-yellow);
    box-shadow: 4px 4px 0px 0px var(--c-yellow);
}

.woocommerce-message::after,
.woocommerce-error::after,
.woocommerce-info::after {
    content: '';
    display: block;
    clear: both;
}

/* Animation Keyframes */
@keyframes slideInToast {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Ensure Button inside Toast doesn't break layout */
.woocommerce-message a.button,
.woocommerce-message a {
    display: inline-flex;
    max-width: 100%;
    white-space: nowrap;
    margin-left: 1rem;
    font-size: 0.9em !important;
    padding: 0.5rem 1rem !important;
}

/* Mobile Toast */
@media (max-width: 768px) {

    .woocommerce-message,
    .woocommerce-info,
    .woocommerce-error {
        left: 50% !important;
        transform: translateX(-50%) translateY(-20px);
        /* Start pos for anim */
        right: auto;
        top: 96px;
        width: calc(100% - 32px) !important;
        max-width: none;
        text-align: center;
        /* Use unique mobile animation name found in global scope */
        animation-name: slideInToastMobile !important;
    }
}

/* Global Keyframes (Avoid nesting in Media Queries) */
@keyframes slideInToastMobile {
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

/* Stepper (Bonus) - handled via hooks but styled here */
.checkout-steps {
    display: flex;
    justify-content: center;
    margin-bottom: 3rem;
    gap: 1rem;
    font-family: var(--font-head);
    text-transform: uppercase;
}

.checkout-step {
    padding: 0.5rem 1rem;
    background: var(--c-white);
    border: 2px solid var(--c-black);
    opacity: 0.5;
}

.checkout-step.active {
    background: var(--c-yellow);
    opacity: 1;
    box-shadow: 4px 4px 0px 0px var(--c-black);
    transform: rotate(-2deg);
}

/* Single Product Styling */
/* === SINGLE PRODUCT UPGRADE (SAFE SCOPE) === */

/* 1. Desktop Layout (2 Columns) */
@media (min-width: 992px) {
    .single-product div.product {
        display: grid !important;
        grid-template-columns: 1.2fr 1fr;
        /* Gallery slightly wider */
        gap: 4rem;
        align-items: start;
        margin-top: 2rem;
    }

    .single-product .woocommerce-product-gallery {
        width: 100% !important;
        float: none !important;
        grid-column: 1;
    }

    .single-product .summary.entry-summary {
        width: 100% !important;
        float: none !important;
        grid-column: 2;
        padding-top: 1rem;
    }
}

/* 2. Gallery Frame (Miró-pop) */
.single-product .woocommerce-product-gallery {
    border: 4px solid var(--c-black);
    box-shadow: var(--shadow-hard);
    background: var(--c-white);
    padding: 1rem;
    position: relative;
    margin-bottom: 2rem;
}

/* Texture for Gallery Background */
.single-product .woocommerce-product-gallery::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(var(--c-black) 1px, transparent 1px);
    background-size: 20px 20px;
    opacity: 0.05;
    pointer-events: none;
    z-index: 0;
}

.single-product .woocommerce-product-gallery img {
    border: 2px solid var(--c-black);
    box-shadow: 2px 2px 0px rgba(0, 0, 0, 0.1);
}

/* 3. Summary Typography & Elements */
.single-product .product_title {
    font-family: var(--font-head) !important;
    font-size: 3.5rem;
    line-height: 0.9;
    text-transform: uppercase;
    color: var(--c-black);
    margin-bottom: 0.5rem;
    font-style: italic;
    text-shadow: 2px 2px 0px var(--c-white);
}

/* Price Sticker (Enhanced) */
.single-product .price {
    display: inline-block;
    background: var(--c-yellow);
    border: 3px solid var(--c-black);
    padding: 0.5rem 1.5rem;
    font-family: var(--font-head);
    font-weight: 900;
    font-size: 2rem !important;
    color: var(--c-black) !important;
    transform: rotate(-2deg);
    box-shadow: 4px 4px 0px var(--c-black);
    margin: 1rem 0 2rem;
}

.single-product .woocommerce-product-details__short-description {
    font-family: var(--font-body);
    font-size: 1.1rem;
    line-height: 1.6;
    margin-bottom: 2rem;
    border-left: 4px solid var(--c-red);
    padding-left: 1.5rem;
}

/* 4. CTA & Quantity */
.single-product form.cart {
    display: flex;
    gap: 1rem;
    margin-bottom: 3rem;
    align-items: stretch;
}

.single-product .quantity input {
    border: 4px solid var(--c-black) !important;
    font-family: var(--font-head);
    font-size: 1.5rem;
    width: 5rem;
    text-align: center;
    height: 100% !important;
    /* Match button height */
    min-height: 60px;
    border-radius: 0 !important;
    box-shadow: 4px 4px 0px var(--c-black);
}

.single-product .single_add_to_cart_button {
    background: var(--c-black) !important;
    color: var(--c-white) !important;
    font-family: var(--font-pop) !important;
    font-size: 1.8rem !important;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 1rem 3rem !important;
    border: 4px solid var(--c-black) !important;
    box-shadow: 6px 6px 0px var(--c-red) !important;
    transition: all 0.2s;
    flex-grow: 1;
    border-radius: 0 !important;
    height: auto !important;
}

.single-product .single_add_to_cart_button:hover {
    transform: translate(-2px, -2px);
    box-shadow: 10px 10px 0px var(--c-red) !important;
    background: var(--c-blue) !important;
}

/* 5. Meta Data (Categories/Tags) */
.single-product .product_meta {
    margin-top: 3rem;
    padding-top: 1.5rem;
    border-top: 2px dashed var(--c-black);
    font-family: var(--font-body);
    font-size: 0.9rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.single-product .product_meta>span {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: bold;
    text-transform: uppercase;
}

.single-product .product_meta a {
    background: var(--c-cream);
    border: 1px solid var(--c-black);
    padding: 2px 8px;
    text-decoration: none;
    transition: background 0.2s;
}

.single-product .product_meta a:hover {
    background: var(--c-yellow);
}

/* 6. Tabs Scoped Styling */
.single-product .woocommerce-tabs ul.tabs {
    border-bottom: 4px solid var(--c-black) !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
    background: transparent !important;
}

.single-product .woocommerce-tabs ul.tabs li {
    background: var(--c-white) !important;
    border: 2px solid var(--c-black) !important;
    border-bottom: none !important;
    border-radius: 0 !important;
    margin-right: 0.5rem !important;
}

.single-product .woocommerce-tabs ul.tabs li.active {
    background: var(--c-black) !important;
    border-color: var(--c-black) !important;
}

.single-product .woocommerce-tabs ul.tabs li.active a {
    color: var(--c-yellow) !important;
}

.single-product .woocommerce-tabs .panel {
    border: 4px solid var(--c-black);
    border-top: none;
    padding: 2rem;
    background: var(--c-white);
    box-shadow: 8px 8px 0px var(--c-black);
    margin-bottom: 3rem;
}

/* Mobile Stacking handled by default or specificity overrides */
@media (max-width: 991px) {
    .single-product .product_title {
        font-size: 2.5rem;
    }

    .single-product form.cart {
        flex-direction: column;
    }

    .single-product .quantity input {
        width: 100%;
        margin-bottom: 1rem;
    }

    .single-product .single_add_to_cart_button {
        width: 100%;
    }
}

/* Checkout & Order Review Refinements */
#order_review_heading {
    font-family: var(--font-head);
    font-size: 2.5rem;
    text-transform: uppercase;
    margin-top: 2rem;
    margin-bottom: 1rem;
}

/* Checkout Payment Box */
#payment {
    background: var(--c-white) !important;
    border: 4px solid var(--c-black) !important;
    border-radius: 0 !important;
    box-shadow: 8px 8px 0px 0px var(--c-blue) !important;
}

#payment ul.payment_methods {
    border-bottom: 2px solid var(--c-black) !important;
    padding: 2rem !important;
}

#payment div.place-order {
    padding: 2rem !important;
    background: var(--c-cream) !important;
    /* Hardening: Ensure button is clickable and not covered */
    position: relative;
    z-index: 10;
}

/* Palette Utilities for PHP-based cycling */
.bg-pop-white {
    background-color: var(--c-white) !important;
}

.bg-pop-yellow {
    background-color: var(--c-yellow) !important;
}

.bg-pop-black {
    background-color: var(--c-black) !important;
}

.bg-pop-blue {
    background-color: var(--c-blue) !important;
}

.bg-pop-red {
    background-color: var(--c-red) !important;
}

.bg-pop-turquoise {
    background-color: #118AB2 !important;
}

.text-pop-black {
    color: var(--c-black) !important;
}

.text-pop-white {
    color: var(--c-white) !important;
}

.text-pop-yellow {
    color: var(--c-yellow) !important;
}

.text-pop-red {
    color: var(--c-red) !important;
}

/* --- MIRÓ-POP: CART & CHECKOUT REDESIGN (BLOCKS) --- */

/* 2. Page Background & Texture */
.woocommerce-cart .wp-site-blocks,
.woocommerce-checkout .wp-site-blocks,
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content {
    background-color: var(--pop-cream);
    background-image: radial-gradient(var(--pop-blue) 1px, transparent 1px);
    background-size: 20px 20px;
    /* Subtle Pop dots */
}

/* 3. Main Container (The "Paper" Sheet) */
.wc-block-cart,
.wc-block-checkout {
    max-width: 1180px;
    margin: 40px auto;
    background: var(--pop-white);
    border: 4px solid var(--pop-black);
    box-shadow: var(--shadow-hard);
    padding: 2rem;
    /* Desktop spacing */
}

/* 4. Headings & Type */
.wc-block-cart__title,
.wc-block-checkout__title {
    font-family: 'Playfair Display', serif;
    /* Or your theme header font */
    font-size: 3rem;
    font-weight: 900;
    text-transform: uppercase;
    font-style: italic;
    color: var(--pop-black);
    text-shadow: 2px 2px 0px var(--pop-white);
    margin-bottom: 2rem;
    position: relative;
    display: inline-block;
}

/* Red underline accent */
.wc-block-cart__title::after,
.wc-block-checkout__title::after {
    content: '';
    display: block;
    width: 100%;
    height: 6px;
    background: var(--pop-red);
    margin-top: 5px;
    transform: rotate(-1deg);
}

/* 5. Buttons (Primary CTA) */
.wc-block-components-button:not(.is-link) {
    background-color: var(--pop-black) !important;
    color: var(--pop-yellow) !important;
    border: 4px solid var(--pop-black) !important;
    border-radius: 0 !important;
    text-transform: uppercase;
    font-weight: 800;
    letter-spacing: 1px;
    box-shadow: 4px 4px 0px 0px var(--pop-red);
    transition: all 0.2s;
    padding: 15px 30px !important;
}

.wc-block-components-button:not(.is-link):hover {
    transform: translate(-2px, -2px);
    box-shadow: 8px 8px 0px 0px var(--pop-red);
    background-color: var(--pop-blue) !important;
    color: var(--pop-white) !important;
}

/* 6. Form Fields (Inputs) */
.wc-block-components-text-input input,
.wc-block-components-combobox-control input {
    border: 2px solid var(--pop-black) !important;
    border-radius: 0 !important;
    background: #fff !important;
    padding: 12px !important;
    box-shadow: 4px 4px 0px 0px rgba(0, 0, 0, 0.1);
}

.wc-block-components-text-input input:focus {
    border-color: var(--pop-blue) !important;
    box-shadow: 4px 4px 0px 0px var(--pop-yellow) !important;
    outline: none;
}

/* 7. Order Summary / Totals Box */
.wc-block-cart__totals,
.wc-block-checkout__order-summary {
    background-color: var(--pop-white);
    border: 4px solid var(--pop-black);
    padding: 20px;
}

/* 8. Mobile Tweaks */
@media (max-width: 768px) {

    .wc-block-cart,
    .wc-block-checkout {
        border-width: 0;
        /* Removing heavy border on mobile to save space */
        box-shadow: none;
        padding: 1rem 0;
        background: transparent;
    }

    .wc-block-cart__totals,
    .wc-block-checkout__order-summary {
        border-width: 2px;
        box-shadow: 4px 4px 0px 0px var(--pop-black);
    }

    .wc-block-cart__title,
    .wc-block-checkout__title {
        font-size: 2rem;
    }
}

/* === P0 LAYOUT: CART & CHECKOUT (BLOCKS + CLASSIC FALLBACK) === */

/* Note: 'body' prefix added for Specificity Safety against LiteSpeed/Minification */

@media (min-width: 992px) {

    /* --- 1. BLOCKS Layout (Desktop) --- */
    body .wc-block-cart,
    body .wc-block-checkout {
        display: grid !important;
        grid-template-columns: 1.8fr 1fr;
        /* 65% / 35% ratio approx */
        gap: 3rem;
        align-items: start;
    }

    /* Ensure internal block columns respect the grid */
    .wc-block-cart__main,
    .wc-block-checkout__main {
        grid-column: 1;
        width: 100% !important;
        margin: 0 !important;
        padding-right: 1rem;
    }

    .wc-block-cart__sidebar,
    .wc-block-checkout__sidebar {
        grid-column: 2;
        width: 100% !important;
        margin: 0 !important;
        position: sticky;
        top: 140px;
        /* Stick below header + toast */
    }

    /* --- 2. CLASSIC Layout (Desktop Fallback) --- */
    body .woocommerce-cart .woocommerce {
        display: grid;
        grid-template-columns: 2fr 1fr;
        gap: 3rem;
        align-items: start;
        max-width: 1200px;
        margin: 0 auto;
    }

    body .woocommerce-cart .woocommerce-cart-form {
        grid-column: 1;
        width: 100%;
    }

    body .woocommerce-cart .cart-collaterals {
        grid-column: 2;
        width: 100%;
        margin-top: 0 !important;
    }

    /* Classic Checkout */
    body .woocommerce-checkout form.checkout {
        display: grid;
        grid-template-columns: 1.5fr 1fr;
        gap: 3rem;
        align-items: start;
        max-width: 1200px;
        margin: 0 auto;
    }

    body .woocommerce-checkout #customer_details {
        grid-column: 1;
        width: 100%;
        float: none !important;
        margin: 0 !important;
    }

    body .woocommerce-checkout #order_review_heading,
    body .woocommerce-checkout #order_review {
        grid-column: 2;
        width: 100%;
        float: none !important;
    }

    /* Fix weird Classic Woo spacing */
    .col2-set .col-1,
    .col2-set .col-2 {
        float: none;
        width: 100%;
        margin-bottom: 1.5rem;
    }
}

@media (max-width: 991px) {

    /* --- Mobile Stacking (Force Single Column) --- */
    body .wc-block-cart,
    body .wc-block-checkout,
    body .woocommerce-cart .woocommerce,
    body .woocommerce-checkout form.checkout {
        display: flex !important;
        flex-direction: column;
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 1rem;
        gap: 2rem;
    }

    /* Order: Items first, then Totals/Payment */
    .wc-block-cart__main,
    .wc-block-checkout__main,
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-checkout #customer_details {
        order: 1;
        width: 100% !important;
    }

    .wc-block-cart__sidebar,
    .wc-block-checkout__sidebar,
    .woocommerce-cart .cart-collaterals,
    .woocommerce-checkout #order_review {
        order: 2;
        width: 100% !important;
    }

    /* Ensure no horizontal scroll */
    .woocommerce table.shop_table {
        width: 100%;
        display: block;
        overflow-x: auto;
    }
}

/* === FIX: CHECKOUT COUPON (PREVENT FLOATING) === */
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: none !important;
    margin-bottom: 2rem !important;
    animation: none !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
    /* Ensure Miró look is maintained in-flow */
    border: 4px solid var(--c-black);
    background: var(--c-white);
    box-shadow: 8px 8px 0px 0px var(--c-blue);
    padding: 1rem 2rem !important;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info:hover {
    transform: translate(-2px, -2px) !important;
    box-shadow: 10px 10px 0px 0px var(--c-blue);
}

/* Ensure the coupon FORM itself is robust */
.woocommerce-checkout form.checkout_coupon {
    border: 4px solid var(--c-black) !important;
    background: var(--c-cream) !important;
    padding: 2rem !important;
    margin-bottom: 2rem !important;
    border-radius: 0 !important;
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    box-shadow: 8px 8px 0px 0px var(--c-black) !important;
}

/* Mobile Safety for Coupon */
@media (max-width: 768px) {

    .woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info,
    .woocommerce-checkout form.checkout_coupon {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box;
    }
}

/* =========================
   SHOP (TIENDA) — MIRÓ-POP PAPER BACKGROUND
   Scope: SOLO archive/tax de productos
========================= */
body.post-type-archive-product,
body.tax-product_cat,
body.tax-product_tag {
    background: #FFFCF4;
    /* papel casi blanco */
}

/* Aplica el lienzo al contenedor principal real del shop.
   Si tu tema usa .wp-site-blocks o .entry-content, ambos están cubiertos. */
body.post-type-archive-product .wp-site-blocks,
body.post-type-archive-product main,
body.post-type-archive-product .entry-content,
body.tax-product_cat .wp-site-blocks,
body.tax-product_cat main,
body.tax-product_cat .entry-content,
body.tax-product_tag .wp-site-blocks,
body.tax-product_tag main,
body.tax-product_tag .entry-content {
    position: relative;
    background: #FFFCF4;
    overflow: hidden;
}

/* capa 1: papel + grano + motas */
body.post-type-archive-product .wp-site-blocks::before,
body.post-type-archive-product main::before,
body.post-type-archive-product .entry-content::before,
body.tax-product_cat .wp-site-blocks::before,
body.tax-product_cat main::before,
body.tax-product_cat .entry-content::before,
body.tax-product_tag .wp-site-blocks::before,
body.tax-product_tag main::before,
body.tax-product_tag .entry-content::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        /* viñeta sutil */
        radial-gradient(1200px 800px at 50% 40%, rgba(26, 26, 26, 0) 0%, rgba(26, 26, 26, .04) 70%, rgba(26, 26, 26, .07) 100%),

        /* motas/salpicado disperso */
        radial-gradient(circle at 10% 20%, rgba(26, 26, 26, .12) 1px, transparent 2px),
        radial-gradient(circle at 30% 70%, rgba(26, 26, 26, .10) 1px, transparent 2px),
        radial-gradient(circle at 70% 30%, rgba(26, 26, 26, .10) 1px, transparent 2px),
        radial-gradient(circle at 90% 75%, rgba(26, 26, 26, .08) 1px, transparent 2px),

        /* grano uniforme */
        radial-gradient(circle, rgba(26, 26, 26, .06) 1px, transparent 1px);
    background-size:
        auto,
        260px 260px,
        300px 300px,
        280px 280px,
        320px 320px,
        14px 14px;
    opacity: .95;
    z-index: 0;
}

/* capa 2: manchas de color + líneas sutiles (Miró-Pop) */
body.post-type-archive-product .wp-site-blocks::after,
body.post-type-archive-product main::after,
body.post-type-archive-product .entry-content::after,
body.tax-product_cat .wp-site-blocks::after,
body.tax-product_cat main::after,
body.tax-product_cat .entry-content::after,
body.tax-product_tag .wp-site-blocks::after,
body.tax-product_tag main::after,
body.tax-product_tag .entry-content::after {
    content: "";
    position: absolute;
    inset: -40px;
    pointer-events: none;
    background:
        /* manchas tinta (amarillo/rojo/azul) */
        radial-gradient(circle at 25% 35%, rgba(232, 185, 35, .22) 0 220px, transparent 360px),
        radial-gradient(circle at 75% 30%, rgba(217, 59, 48, .18) 0 190px, transparent 330px),
        radial-gradient(circle at 45% 70%, rgba(42, 75, 124, .20) 0 240px, transparent 380px),

        /* acentos negros suaves */
        radial-gradient(circle at 20% 75%, rgba(26, 26, 26, .12) 0 120px, transparent 220px),
        radial-gradient(circle at 85% 65%, rgba(26, 26, 26, .10) 0 110px, transparent 210px),

        /* líneas curvas finas */
        radial-gradient(1200px 520px at 10% 55%, transparent 61%, rgba(26, 26, 26, .14) 61.35%, transparent 62.1%),
        radial-gradient(980px 460px at 90% 50%, transparent 63%, rgba(26, 26, 26, .12) 63.35%, transparent 64.1%);
    opacity: .75;
    z-index: 0;
}

/* asegura que el contenido del shop quede encima del fondo */
body.post-type-archive-product .wp-site-blocks>*,
body.post-type-archive-product main>*,
body.post-type-archive-product .entry-content>*,
body.tax-product_cat .wp-site-blocks>*,
body.tax-product_cat main>*,
body.tax-product_cat .entry-content>*,
body.tax-product_tag .wp-site-blocks>*,
body.tax-product_tag main>*,
body.tax-product_tag .entry-content>* {
    position: relative;
    z-index: 1;
}

/* =========================
   SHOP — IMÁGENES COMPLETAS (NO CROP)
========================= */

/* Woo Classic grid */
body.post-type-archive-product .woocommerce ul.products li.product a img,
body.tax-product_cat .woocommerce ul.products li.product a img,
body.tax-product_tag .woocommerce ul.products li.product a img {
    width: 100%;
    height: 320px;
    /* altura consistente del frame */
    object-fit: contain;
    /* clave: NO RECORTAR */
    object-position: center;
    background: #fffff0;
    /* “papel” dentro del frame */
    padding: 12px;
    /* aire para portadas horizontales */
    box-sizing: border-box;
}

/* Woo Blocks grid */
body.post-type-archive-product .wc-block-grid__product-image img,
body.tax-product_cat .wc-block-grid__product-image img,
body.tax-product_tag .wc-block-grid__product-image img {
    width: 100% !important;
    height: 320px !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #fffff0 !important;
    padding: 12px !important;
    box-sizing: border-box !important;
}

/* Ajuste responsive para mobile */
@media (max-width: 768px) {

    body.post-type-archive-product .woocommerce ul.products li.product a img,
    body.tax-product_cat .woocommerce ul.products li.product a img,
    body.tax-product_tag .woocommerce ul.products li.product a img,
    body.post-type-archive-product .wc-block-grid__product-image img,
    body.tax-product_cat .wc-block-grid__product-image img,
    body.tax-product_tag .wc-block-grid__product-image img {
        height: 240px !important;
        padding: 10px !important;
    }
}