/* ==========================================================================
   1. ORIGINAL STYLE FIXES (THUMBNAILS, METADATA, & CATEGORY HIDING)
   ========================================================================== */
.nv-thumb-wrap {
    text-align: center;
}

.nv-thumb-wrap img {
    margin: 0 auto;
    display: block;
}

.nv-single-post-wrap .nv-meta-list {
    justify-content: center;
    display: flex;
}

.single-product .product_meta {
    display: none !important;
}

/* Space after custom description */
.custom-archive-intro {
    margin-bottom: 2rem;
}

.category .nv-page-title h1, .category .nv-page-title-wrap h1 { display: none !important; }
.category .nv-page-title p, .category .nv-page-title-wrap p { display: none !important; }
.paged.category h1:first-of-type { display: none !important; }
.category .term-description { display: none !important; }

/* ==========================================================================
   2. SINGLE PRODUCT PAGE: LEFT-ALIGNED TEXT & CENTERED 2x2 BUTTONS
   ========================================================================== */
@media (min-width: 768px) {
    /* Reset parent area text alignment to default left for headings */
    .product .summary.entry-summary {
        display: block !important;
        text-align: left !important;
    }

    /* Clamp, narrow, and center the Add to Cart form block row */
    .product .summary.entry-summary form.cart {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        max-width: 320px !important; 
        width: 100% !important;
        margin-left: auto !important;   
        margin-right: auto !important;  
        margin-bottom: 20px !important; 
        border-bottom: 0 !important;    
    }

    /* Keep the quantity input box uniform on the left side of its narrow row */
    .product .summary.entry-summary form.cart .quantity {
        display: inline-block !important;
        margin-right: 8px !important;
        margin-bottom: 0px !important;
        flex: 0 0 60px !important;
    }

    /* Allow the blue button to scale horizontally within the 320px boundaries */
    .product .summary.entry-summary form.cart .single_add_to_cart_button {
        display: inline-block !important;
        flex: 1 1 auto !important;
        width: auto !important;
        height: 41px !important; 
        line-height: 41px !important;
        padding: 0 15px !important;
        margin: 0 !important;
        white-space: nowrap !important;
    }

    /* Center the 2x2 wallet smart buttons container below description text */
    .product .summary.entry-summary ul.wc-ppcp-product-payment__methods {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 12px !important;
        max-width: 480px !important; 
        width: 100% !important;
        margin-left: auto !important;   
        margin-right: auto !important;  
        margin-bottom: 12px !important;
        padding: 0 !important;
        list-style: none !important;
        border: 0 !important;
    }

    /* Strip native plugin margins from individual row elements */
    .product .summary.entry-summary ul.wc-ppcp-product-payment__methods li.wc-ppcp-product-payment-method {
        max-width: 100% !important;
        width: 100% !important;
        margin-top: 0 !important;
        border: 0 !important;
    }

    /* Force the checkout iframes to expand cleanly inside their containers */
    .product .summary.entry-summary .paypal-buttons,
    .product .summary.entry-summary .gpay-button-fill {
        width: 100% !important;
    }
}

/* Wipes out any native line dividers or pseudo-elements in descriptions */
.product .summary.entry-summary hr,
.product .summary.entry-summary form.cart,
.product .summary.entry-summary ul,
.product .summary.entry-summary li,
.product .summary.entry-summary div[class*="ppcp"],
.product .summary.entry-summary div[class*="payment"],
.product .summary.entry-summary form.cart::after, 
.product .summary.entry-summary ul::after, 
.product .summary.entry-summary div[class*="ppcp"]::after, 
.product .summary.entry-summary div[class*="payment"]::after {
    border-bottom: 0 !important;
    border-top: 0 !important;
    box-shadow: none !important;
    content: none !important;
}

/* Pull summary product details tabs closer to button layouts */
.woocommerce-tabs {
    margin-top: 15px !important;
    padding-top: 25px !important;
    border-top: 1px solid #e2e8f0 !important;
    clear: both !important;
}
.product .summary.entry-summary, 
.product .summary.entry-summary .wc-ppcp-product-payments__container, 
.product .summary.entry-summary ul.wc-ppcp-product-payment__methods {
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

/* ==========================================================================
   3. DESKTOP CART PAGE: CLEAN COLUMN STACK & NO SEPARATOR (OVER 768PX)
   ========================================================================== */
@media (min-width: 768px) {
    /* Stack the cart checkout block components vertically and right-align them */
    .woocommerce-cart .wc-proceed-to-checkout {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important; 
        gap: 10px !important;           
        width: 100% !important;
        max-width: 320px !important;    
        margin-left: auto !important;   
        margin-right: 0 !important;
    }

    /* Standardize checkout actions primary layout size */
    .woocommerce-cart .wc-proceed-to-checkout .checkout-button {
        width: 100% !important;
        height: 45px !important;
        line-height: 45px !important;
        padding: 0 !important;
        display: block !important;
        text-align: center !important;
        margin: 0 !important;
    }

    /* Strike out the native plugin "-- or --" text labels on desktop */
    .woocommerce-cart .wc-proceed-to-checkout p.wc-ppcp-cart-or,
    .woocommerce-cart .wc-proceed-to-checkout li.or,
    .woocommerce-cart .wc-proceed-to-checkout span[class*="divider"],
    .woocommerce-cart .wc-proceed-to-checkout .wc-ppcp-cart-payment-methods-divider {
        display: none !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Force list items and express elements to span full-width inside column */
    .woocommerce-cart .wc-proceed-to-checkout ul,
    .woocommerce-cart .wc-proceed-to-checkout li,
    .woocommerce-cart .wc-proceed-to-checkout div[class*="ppcp"],
    .woocommerce-cart .wc-proceed-to-checkout div[class*="payment"],
    .woocommerce-cart .wc-proceed-to-checkout .wc-ppcp-cart-payments__container {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;           
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        list-style: none !important;
        float: none !important;
        border: 0 !important;
    }

    /* Force the payment plugin secure iframes to fill out the column layout width */
    .woocommerce-cart .wc-proceed-to-checkout iframe,
    .woocommerce-cart .wc-proceed-to-checkout .paypal-buttons,
    .woocommerce-cart .wc-proceed-to-checkout .gpay-button-fill {
        width: 100% !important;
    }
}

/* ==========================================================================
   4. MOBILE CART PAGE: VERTICAL STACK & FULL PHRASE UNROLL (UNDER 768PX)
   ========================================================================== */
@media (max-width: 767px) {
    /* 1. Force the cart collaterals and cart totals areas to behave as stacked columns */
    .woocommerce-cart .cart-collaterals,
    .woocommerce-cart .cart_totals,
    .woocommerce-cart .wc-proceed-to-checkout {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important; /* Forces all buttons to line up in the absolute center */
        float: none !important;
        width: 100% !important;
    }

    /* 2. Squeeze the final checkout stack container down to a crisp width */
    .woocommerce-cart .wc-proceed-to-checkout {
        max-width: 290px !important; /* Compact look that prevents screen edge crowding */
        margin-left: auto !important; /* Automated margins lock the column in place */
        margin-right: auto !important;
        gap: 10px !important; /* Equal vertical spacing between all choices */
    }

    /* 3. Format the inner containers to stack smoothly without overlapping edges */
    .woocommerce-cart .wc-proceed-to-checkout ul,
    .woocommerce-cart .wc-proceed-to-checkout li,
    .woocommerce-cart .wc-proceed-to-checkout div[class*="ppcp"],
    .woocommerce-cart .wc-proceed-to-checkout div[class*="payment"],
    .woocommerce-cart .wc-proceed-to-checkout .wc-ppcp-cart-payments__container {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        float: none !important;
    }

    /* 4. Keep the blue Proceed button uniform in size and font placement */
    .woocommerce-cart .wc-proceed-to-checkout .checkout-button {
        width: 100% !important;
        height: auto !important; /* Lets text expand natively without vertical cropping */
        line-height: normal !important;
        padding: 12px 10px !important; /* Sleek mobile-friendly interior text spacing */
        text-align: center !important;
        margin: 0 !important;
    }

    /* 5. Total elimination of the "-- or --" placeholder row on mobile viewports */
    .woocommerce-cart .wc-proceed-to-checkout p.wc-ppcp-cart-or,
    .woocommerce-cart .wc-proceed-to-checkout li.or,
    .woocommerce-cart .wc-proceed-to-checkout .wc-ppcp-cart-payment-methods-divider,
    .woocommerce-cart .wc-proceed-to-checkout p[class*="-or-"] {
        display: none !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        visibility: hidden !important;
    }
}