/**
 * Custom Content Styles for SciuuuS Kids
 * WordPress Pages, Posts, and WooCommerce Content
 * 
 * @package Blocksy_Child_SciuuusKids
 * @version 1.0.0
 */

/* ==========================================================================
   Main Content Container
   ========================================================================== */

.site-main {
    background: var(--brand-white) !important;
}

/* Container is always full-width */
.ct-container-full {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--brand-white) !important;
}

/* Remove top padding from entry-content to be flush with header */
.entry-content.is-layout-constrained {
    padding-top: 0 !important;
    padding-bottom: 0px !important;
}

/* Also ensure no top padding on entry-content in general */
.entry-content {
    padding-top: 0 !important;
}

/* ==========================================================================
   Article Container
   ========================================================================== */

article.page,
article.post,
article.single {
    background: var(--brand-white) !important;
}

.entry-content {
    background: var(--brand-white) !important;
}

/* ==========================================================================
   Hero Section / Page Header
   ========================================================================== */

.hero-section {
    text-align: center;
    padding: var(--spacing-base) 0 0 0 !important;
    margin-bottom: 0 !important;
    background: var(--brand-white) !important;
}

.entry-header {
    margin-bottom: 0 !important;
    text-align: center !important;
}

/* Page Title - H1 */
h1.page-title,
h1.entry-title {
    font-family: var(--font-display) !important;
    font-size: var(--font-size-h1) !important;
    font-style: normal !important;
    font-weight: var(--font-weight-normal) !important;
    line-height: var(--line-height-heading) !important;
    color: var(--brand-gray-dark) !important;
    margin: 0 auto !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Override WooCommerce specific margin-bottom */
.entry-header .page-title,
.hero-section h1.page-title,
[data-prefix="single_page"] .entry-header .page-title {
    margin-bottom: 0 !important;
}

/* ==========================================================================
   Content Area
   ========================================================================== */

.entry-content {
    font-family: var(--font-primary);
    font-size: var(--font-size-content-body);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-content-body);
    color: var(--brand-gray-dark);
    margin: 0 auto;
    padding: var(--content-spacing-medium) 0;
}

/* Default: Constrained width for all non-whitelisted pages */
.entry-content {
    max-width: 800px;
}

/* Whitelist: Remove max-width constraint for full-width pages */
.home .entry-content,
.woocommerce-shop .entry-content,
.post-type-archive-product .entry-content,
.tax-product_cat .entry-content,
.tax-product_tag .entry-content,
.woocommerce-cart .entry-content,
.woocommerce-checkout .entry-content,
.single-product .entry-content,
/* Pages with product collection blocks (e.g., category collection pages) */
.entry-content:has(.wp-block-woocommerce-product-collection) {
    max-width: none;
}

/* ==========================================================================
   Headings
   ========================================================================== */

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    font-family: var(--font-display);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-heading);
    color: var(--brand-gray-dark);
    margin-top: var(--content-spacing-large);
    margin-bottom: var(--content-spacing-medium);
    clear: both;
}

.entry-content h1 {
    font-size: var(--font-size-h1);
}

.entry-content h2 {
    font-size: var(--font-size-h2);
}

.entry-content h3 {
    font-size: var(--font-size-h3);
}

.entry-content h4 {
    font-size: var(--font-size-h4);
}

.entry-content h5 {
    font-size: var(--font-size-h5);
}

.entry-content h6 {
    font-size: var(--font-size-h6);
}

/* First heading after page title */
.entry-content > h2:first-child,
.entry-content > h3:first-child {
    margin-top: 0;
}

/* ==========================================================================
   Paragraphs
   ========================================================================== */

.entry-content p {
    font-family: var(--font-primary);
    font-size: var(--font-size-content-body);
    font-weight: var(--font-weight-normal);
    line-height: var(--line-height-content-body);
    color: var(--brand-gray-dark);
    margin-bottom: var(--content-spacing-medium);
}

.entry-content p:last-child {
    margin-bottom: 0;
}

/* Lead paragraph */
.entry-content p.lead,
.entry-content > p:first-of-type {
    font-size: calc(var(--font-size-content-body) * 1.1);
    font-weight: var(--font-weight-medium);
}

/* ==========================================================================
   Links
   ========================================================================== */

.entry-content a {
    color: var(--brand-orange);
    text-decoration: underline;
    transition: color var(--transition-fast);
}

.entry-content a:hover {
    color: var(--brand-dark);
    text-decoration: none;
}

.entry-content a:focus {
    outline: 2px solid var(--brand-orange);
    outline-offset: 2px;
}

/* ==========================================================================
   Lists
   ========================================================================== */

.entry-content ul,
.entry-content ol {
    font-family: var(--font-primary);
    font-size: var(--font-size-content-body);
    line-height: var(--line-height-content-body);
    margin: 0 0 var(--content-spacing-medium) 0;
    padding-left: 2rem;
}

.entry-content ul {
    list-style-type: disc;
}

.entry-content ol {
    list-style-type: decimal;
}

.entry-content li {
    margin-bottom: var(--content-spacing-small);
}

.entry-content li:last-child {
    margin-bottom: 0;
}

/* Nested lists */
.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul {
    margin-top: var(--content-spacing-small);
    margin-bottom: var(--content-spacing-small);
}

.entry-content ul ul {
    list-style-type: circle;
}

.entry-content ul ul ul {
    list-style-type: square;
}

/* ==========================================================================
   Blockquotes
   ========================================================================== */

.entry-content blockquote {
    font-family: var(--font-display);
    font-size: calc(var(--font-size-content-body) * 1.2);
    font-style: italic;
    line-height: var(--line-height-relaxed);
    color: var(--brand-gray-medium);
    margin: var(--content-spacing-large) 0;
    padding: var(--content-spacing-medium) var(--content-spacing-large);
    border-left: 4px solid var(--brand-orange);
    background: rgba(252, 125, 6, 0.05);
}

.entry-content blockquote p {
    font-family: var(--font-display);
    font-size: inherit;
    margin-bottom: var(--content-spacing-small);
}

.entry-content blockquote p:last-child {
    margin-bottom: 0;
}

.entry-content blockquote cite {
    display: block;
    font-family: var(--font-primary);
    font-size: var(--font-size-base);
    font-style: normal;
    color: var(--brand-gray-dark);
    margin-top: var(--content-spacing-small);
}

.entry-content blockquote cite::before {
    content: '— ';
}

/* ==========================================================================
   Images
   ========================================================================== */

.entry-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: var(--content-spacing-large) auto;
    border-radius: var(--radius-base);
}

.entry-content figure {
    margin: var(--content-spacing-large) 0;
    text-align: center;
}

.entry-content figure img {
    margin-bottom: var(--content-spacing-small);
}

.entry-content figcaption {
    font-family: var(--font-primary);
    font-size: var(--font-size-small);
    font-style: italic;
    color: var(--brand-gray-medium);
    text-align: center;
}

/* Image alignment */
.entry-content .alignleft {
    float: left;
    margin: 0 var(--content-spacing-large) var(--content-spacing-medium) 0;
}

.entry-content .alignright {
    float: right;
    margin: 0 0 var(--content-spacing-medium) var(--content-spacing-large);
}

.entry-content .aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* ==========================================================================
   Tables
   ========================================================================== */

.entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin: var(--content-spacing-large) 0;
    font-family: var(--font-primary);
    font-size: var(--font-size-base);
}

.entry-content table th {
    background: var(--brand-orange);
    color: var(--brand-white);
    font-weight: var(--font-weight-semibold);
    text-align: left;
    padding: var(--padding-medium);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.entry-content table td {
    padding: var(--padding-medium);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.entry-content table tr:nth-child(even) {
    background: rgba(252, 125, 6, 0.05);
}

.entry-content table tr:hover {
    background: rgba(252, 125, 6, 0.1);
}

/* ==========================================================================
   Size Guide Tables - Color Coded
   ========================================================================== */

/* Verde (Green) */
.entry-content table.table-verde th,
.entry-content .table-verde table th,
figure.table-verde table th,
.wp-block-table.table-verde th {
    background: #2e7d32 !important;
    color: #fff !important;
}

.entry-content table.table-verde tr:nth-child(even),
.entry-content .table-verde table tr:nth-child(even),
figure.table-verde table tr:nth-child(even),
.wp-block-table.table-verde tr:nth-child(even) {
    background: rgba(46, 125, 50, 0.08);
}

.entry-content table.table-verde tr:hover,
.entry-content .table-verde table tr:hover,
figure.table-verde table tr:hover,
.wp-block-table.table-verde tr:hover {
    background: rgba(46, 125, 50, 0.15);
}

/* Rosso (Red) */
.entry-content table.table-rosso th,
.entry-content .table-rosso table th,
figure.table-rosso table th,
.wp-block-table.table-rosso th {
    background: #c62828 !important;
    color: #fff !important;
}

.entry-content table.table-rosso tr:nth-child(even),
.entry-content .table-rosso table tr:nth-child(even),
figure.table-rosso table tr:nth-child(even),
.wp-block-table.table-rosso tr:nth-child(even) {
    background: rgba(198, 40, 40, 0.08);
}

.entry-content table.table-rosso tr:hover,
.entry-content .table-rosso table tr:hover,
figure.table-rosso table tr:hover,
.wp-block-table.table-rosso tr:hover {
    background: rgba(198, 40, 40, 0.15);
}

/* Arancione (Orange) - default, but explicit class */
.entry-content table.table-arancione th,
.entry-content .table-arancione table th,
figure.table-arancione table th,
.wp-block-table.table-arancione th {
    background: var(--brand-orange, #FC7D06) !important;
    color: #fff !important;
}

.entry-content table.table-arancione tr:nth-child(even),
.entry-content .table-arancione table tr:nth-child(even),
figure.table-arancione table tr:nth-child(even),
.wp-block-table.table-arancione tr:nth-child(even) {
    background: rgba(252, 125, 6, 0.08);
}

.entry-content table.table-arancione tr:hover,
.entry-content .table-arancione table tr:hover,
figure.table-arancione table tr:hover,
.wp-block-table.table-arancione tr:hover {
    background: rgba(252, 125, 6, 0.15);
}

/* Giallo (Yellow) */
.entry-content table.table-giallo th,
.entry-content .table-giallo table th,
figure.table-giallo table th,
.wp-block-table.table-giallo th {
    background: #f9a825 !important;
    color: #000 !important;
}

.entry-content table.table-giallo tr:nth-child(even),
.entry-content .table-giallo table tr:nth-child(even),
figure.table-giallo table tr:nth-child(even),
.wp-block-table.table-giallo tr:nth-child(even) {
    background: rgba(249, 168, 37, 0.12);
}

.entry-content table.table-giallo tr:hover,
.entry-content .table-giallo table tr:hover,
figure.table-giallo table tr:hover,
.wp-block-table.table-giallo tr:hover {
    background: rgba(249, 168, 37, 0.2);
}

/* Size Guide Tables by ID */
/* Verde - Coyote/Scriccicolo */
#size-guide-table-coyote-scriccicolo th {
    background: #2e7d32 !important;
    color: #fff !important;
}
#size-guide-table-coyote-scriccicolo tr:nth-child(even) {
    background: rgba(46, 125, 50, 0.08);
}
#size-guide-table-coyote-scriccicolo tr:hover {
    background: rgba(46, 125, 50, 0.15);
}
#size-guide-table-coyote-scriccicolo caption {
    color: #2e7d32;
    font-weight: 700;
}

/* Rosso - Koala/Coccinella */
#size-guide-table-koala-coccinella th {
    background: #c62828 !important;
    color: #fff !important;
}
#size-guide-table-koala-coccinella tr:nth-child(even) {
    background: rgba(198, 40, 40, 0.08);
}
#size-guide-table-koala-coccinella tr:hover {
    background: rgba(198, 40, 40, 0.15);
}
#size-guide-table-koala-coccinella caption {
    color: #c62828;
    font-weight: 700;
}

/* Arancione - Bimbi */
#size-guide-table-bimbi th {
    background: #FC7D06 !important;
    color: #fff !important;
}
#size-guide-table-bimbi tr:nth-child(even) {
    background: rgba(252, 125, 6, 0.08);
}
#size-guide-table-bimbi tr:hover {
    background: rgba(252, 125, 6, 0.15);
}
#size-guide-table-bimbi caption {
    color: #FC7D06;
    font-weight: 700;
}

/* Giallo - Sandali */
#size-guide-table-sandali th {
    background: #f9a825 !important;
    color: #000 !important;
}
#size-guide-table-sandali tr:nth-child(even) {
    background: rgba(249, 168, 37, 0.12);
}
#size-guide-table-sandali tr:hover {
    background: rgba(249, 168, 37, 0.2);
}
#size-guide-table-sandali caption {
    color: #f9a825;
    font-weight: 700;
}

/* Style all size guide captions */
#size-guide-table-coyote-scriccicolo caption,
#size-guide-table-koala-coccinella caption,
#size-guide-table-bimbi caption,
#size-guide-table-sandali caption {
    caption-side: top;
    text-align: center;
    font-size: 18px;
    padding: 12px 0;
    font-family: var(--font-primary, Quicksand);
}

/* ==========================================================================
   Code Blocks
   ========================================================================== */

.entry-content code {
    font-family: 'Courier New', Courier, monospace;
    font-size: 0.9em;
    background: var(--brand-gray-light);
    padding: 2px 6px;
    border-radius: var(--radius-small);
    color: var(--brand-dark);
}

.entry-content pre {
    font-family: 'Courier New', Courier, monospace;
    font-size: 0.9em;
    background: var(--brand-gray-light);
    padding: var(--content-spacing-medium);
    border-radius: var(--radius-base);
    overflow-x: auto;
    margin: var(--content-spacing-medium) 0;
    border-left: 4px solid var(--brand-orange);
}

.entry-content pre code {
    background: none;
    padding: 0;
}

/* ==========================================================================
   Horizontal Rule
   ========================================================================== */

.entry-content hr {
    border: none;
    border-top: 2px solid rgba(252, 125, 6, 0.3);
    margin: var(--content-spacing-large) auto;
    max-width: 200px;
}

/* ==========================================================================
   WordPress Core Classes
   ========================================================================== */

/* Screen reader text */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.screen-reader-text:focus {
    background-color: var(--brand-gray-light);
    border-radius: var(--radius-medium);
    box-shadow: var(--shadow-focus);
    clip: auto !important;
    clip-path: none;
    color: var(--brand-accent-blue);
    display: block;
    font-size: var(--font-size-small);
    font-weight: bold;
    height: auto;
    left: var(--padding-xs);
    line-height: normal;
    padding: var(--spacing-medium) 23px 14px;
    text-decoration: none;
    top: var(--padding-xs);
    width: auto;
    z-index: var(--z-index-screen-reader);
}

/* ==========================================================================
   WordPress Blocks Support
   ========================================================================== */

/* Buttons */
.entry-content .wp-block-button {
    margin: var(--content-spacing-medium) 0;
}

.entry-content .wp-block-button__link {
    background: var(--brand-orange);
    color: var(--brand-white);
    padding: var(--padding-medium) var(--content-spacing-large);
    border-radius: var(--radius-base);
    text-decoration: none;
    display: inline-block;
    font-family: var(--font-primary);
    font-weight: var(--font-weight-semibold);
    transition: background var(--transition-fast);
}

.entry-content .wp-block-button__link:hover {
    background: var(--brand-dark);
    color: var(--brand-white);
}

/* Columns */
.entry-content .wp-block-columns {
    margin-bottom: var(--content-spacing-large);
}

/* Cover block */
.entry-content .wp-block-cover {
    margin: var(--content-spacing-large) 0;
    border-radius: var(--radius-base);
}

/* Gallery */
.entry-content .wp-block-gallery {
    margin: var(--content-spacing-large) 0;
}

/* ==========================================================================
   Responsive Design
   ========================================================================== */

@media (max-width: 768px) {
    .ct-container-full {
        padding: 0 var(--spacing-medium);
    }
    
    .hero-section {
        padding: var(--content-spacing-medium) 0;
        margin-bottom: var(--content-spacing-medium);
    }
    
    h1.page-title,
    h1.entry-title {
        font-size: calc(var(--font-size-h1) * 0.8) !important;
    }
    
    .entry-content {
        padding: var(--content-spacing-small) 0;
    }
    
    .entry-content h1 {
        font-size: calc(var(--font-size-h1) * 0.8);
    }
    
    .entry-content h2 {
        font-size: calc(var(--font-size-h2) * 0.85);
    }
    
    .entry-content h3 {
        font-size: calc(var(--font-size-h3) * 0.85);
    }
    
    .entry-content h4 {
        font-size: var(--font-size-h4);
    }
    
    .entry-content p,
    .entry-content ul,
    .entry-content ol {
        font-size: var(--font-size-base);
    }
    
    .entry-content blockquote {
        padding: var(--content-spacing-medium);
        margin: var(--content-spacing-medium) 0;
        font-size: var(--font-size-medium);
    }
    
    .entry-content .alignleft,
    .entry-content .alignright {
        float: none;
        display: block;
        margin: var(--content-spacing-medium) auto;
    }
    
    .entry-content table {
        font-size: var(--font-size-small);
    }
    
    .entry-content table th,
    .entry-content table td {
        padding: var(--padding-xs);
    }
}

@media (max-width: 480px) {
    h1.page-title,
    h1.entry-title {
        font-size: calc(var(--font-size-h1) * 0.7) !important;
    }
    
    .entry-content h1 {
        font-size: calc(var(--font-size-h1) * 0.7);
    }
    
    .entry-content h2 {
        font-size: calc(var(--font-size-h2) * 0.75);
    }
    
    .entry-content h3 {
        font-size: var(--font-size-h4);
    }
    
    .entry-content blockquote {
        padding: var(--content-spacing-small);
        font-size: var(--font-size-base);
    }
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {
    .entry-content {
        font-size: 12pt;
        line-height: 1.5;
        color: #000;
    }

    .entry-content a {
        color: #000;
        text-decoration: underline;
    }

    .entry-content a[href]:after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
    }
}

/* ==========================================================================
   Cart Page Styles
   ========================================================================== */

/* ==========================================================================
   Empty Cart Styling (WooCommerce Blocks)
   ========================================================================== */

/* Hide the crying face SVG completely */
.wc-block-cart__empty-cart__image,
.woocommerce-cart .wc-block-cart__empty-cart__image,
.woocommerce-cart svg.wc-block-cart__empty-cart__image,
svg[class*="empty-cart"],
.wc-block-cart--is-empty svg,
.wc-block-cart__empty-cart__image svg {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
    opacity: 0 !important;
}

/* Hide the CSS pseudo-element icon from with-empty-cart-icon class */
.woocommerce-cart h2.with-empty-cart-icon::before,
.woocommerce-cart .with-empty-cart-icon::before,
h2.with-empty-cart-icon::before {
    display: none !important;
    content: none !important;
}

/* Hide the "Browse store" link */
.wc-block-cart__empty-cart__link,
.woocommerce-cart .wc-block-cart__empty-cart__link,
.woocommerce-cart a[href*="shop"],
.wc-block-cart--is-empty a.wc-block-cart__empty-cart__link,
a.wc-block-components-empty-cart__browse-store {
    display: none !important;
}

/* Style the empty cart message */
.wc-block-cart__empty-cart__title,
.woocommerce-cart .wc-block-cart__empty-cart__title {
    font-family: var(--font-display, 'Gochi Hand') !important;
    font-size: 28px !important;
    font-weight: 400 !important;
    color: var(--brand-gray-dark, #333) !important;
    margin: 40px auto 30px !important;
    text-align: center !important;
}

/* Classic WooCommerce fallbacks */
.woocommerce-cart .woocommerce-info::before,
.woocommerce-cart .cart-empty::before,
.cart-empty-container .woocommerce-info::before {
    display: none !important;
}

.cart-empty-container {
    text-align: center;
    padding: 40px 20px;
    max-width: 600px;
    margin: 0 auto;
}

.cart-empty-container .cart-empty,
.woocommerce-cart .cart-empty {
    font-family: var(--font-primary, Quicksand);
    font-size: 18px;
    font-weight: 500;
    color: var(--brand-gray-dark, #333);
    background: transparent !important;
    border: none !important;
    padding: 20px !important;
    margin: 0 auto !important;
}

/* Hide default return to shop button */
.woocommerce-cart .return-to-shop,
.woocommerce-cart a.button.wc-backward {
    display: none !important;
}

/* Custom astronaut empty cart image wrapper */
.sciuuuskids-empty-cart-image-wrapper {
    text-align: center !important;
    margin: 40px auto 30px !important;
    padding: 20px !important;
}

.sciuuuskids-empty-cart-image {
    max-width: 280px !important;
    height: auto !important;
    margin: 0 auto 20px !important;
    display: block !important;
}

.sciuuuskids-empty-cart-text {
    font-family: var(--font-display, 'Gochi Hand') !important;
    font-size: 24px !important;
    color: var(--brand-gray-dark, #333) !important;
    text-align: center !important;
    margin: 15px 0 0 !important;
    display: block !important;
}

/* ==========================================================================
   "New in Store" Products Section on Empty Cart Page
   Legacy WooCommerce Product Grid (woocommerce/product-new block)

   IMPORTANT: This block uses the LEGACY grid structure:
   div.wc-block-grid.has-3-columns > ul.wc-block-grid__products > li.wc-block-grid__product

   WooCommerce's own CSS applies flex/inline-block to these elements.
   We must override with maximum specificity + !important to force grid layout.
   ========================================================================== */

/* --- Container: the outer div.wc-block-grid wrapper --- */
/* Empty cart container - wider layout */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-grid,
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wp-block-product-new,
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-grid.has-3-columns {
    display: block !important;
    max-width: 1200px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

/* Other cart grid containers */
body.woocommerce-cart .wc-block-grid.wp-block-product-new {
    display: block !important;
    max-width: 900px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    box-sizing: border-box !important;
    text-align: left !important;
}

/* --- Products list: the <ul> that MUST be CSS Grid --- */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-grid__products,
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block ul.wc-block-grid__products,
body.woocommerce-cart .wc-block-grid.has-3-columns .wc-block-grid__products,
body.woocommerce-cart .wc-block-grid.has-3-columns > .wc-block-grid__products,
body.woocommerce-cart .wc-block-grid .wc-block-grid__products,
body.woocommerce-cart .wp-block-product-new .wc-block-grid__products,
body.woocommerce-cart ul.wc-block-grid__products,
body.woocommerce-cart .wc-block-grid__products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 25px !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 20px 0 !important;
    list-style: none !important;
    box-sizing: border-box !important;
    /* Reset any WooCommerce flex layout */
    flex-wrap: unset !important;
    flex-direction: unset !important;
}

/* --- Product card: each <li> item --- */
body.woocommerce-cart .wp-block-woocommerce-empty-cart-block .wc-block-grid__product,
body.woocommerce-cart .wc-block-grid.has-3-columns .wc-block-grid__products .wc-block-grid__product,
body.woocommerce-cart .wc-block-grid .wc-block-grid__product {
    display: flex !important;
    flex-direction: column !important;
    background: var(--brand-white, #fff) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    padding: 0 !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    /* Reset WooCommerce flex-item properties */
    flex: unset !important;
    margin: 0 !important;
    float: none !important;
}

body.woocommerce-cart .wc-block-grid__product:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2) !important;
}

/* --- Product link (wraps image + title) --- */
body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-link {
    display: block !important;
    width: 100% !important;
    text-decoration: none !important;
}

/* --- Product image --- */
body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-image {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-image img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4/3 !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 0 !important;
    transition: transform 0.8s ease !important;
}

body.woocommerce-cart .wc-block-grid__product:hover .wc-block-grid__product-image img {
    transform: scale(1.05) !important;
}

/* --- Product title --- */
body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-title {
    font-family: var(--font-primary, Quicksand) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--brand-black, #000) !important;
    margin: 15px 15px 8px !important;
    padding: 0 !important;
    text-align: center !important;
    display: block !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    line-height: 1.4 !important;
}

/* --- Product price --- */
body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-price {
    font-family: var(--font-primary, Quicksand) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: var(--brand-black, #000) !important;
    margin: 0 15px 15px !important;
    padding: 0 !important;
    text-align: center !important;
}

/* --- Add to cart button --- */
body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-add-to-cart {
    margin: auto 15px 15px !important;
    padding: 0 !important;
}

body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-add-to-cart .wp-block-button__link,
body.woocommerce-cart .wc-block-grid__product .wp-block-button__link {
    display: block !important;
    width: 100% !important;
    background-color: var(--brand-orange, #FC7D06) !important;
    color: var(--brand-white, #fff) !important;
    font-family: var(--font-primary, Quicksand) !important;
    font-weight: 700 !important;
    padding: 12px 15px !important;
    border-radius: 4px !important;
    text-align: center !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    font-size: 14px !important;
    transition: background-color 0.3s ease !important;
    border: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
body.woocommerce-cart .wc-block-grid__product .wp-block-button__link:hover {
    background-color: #e06d05 !important;
}

/* Product grid layout for cart page - Product Collection template (non-legacy) */
.woocommerce-cart .wc-block-product-template,
.woocommerce-cart ul.wc-block-product-template,
.woocommerce-cart ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 25px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 30px auto !important;
    max-width: 1000px !important;
    width: 100% !important;
}

/* Product card styling for cart page - Product Collection template (non-legacy) */
.woocommerce-cart .wc-block-product-template li.wc-block-product,
.woocommerce-cart li.wc-block-product,
.woocommerce-cart li.product {
    background: var(--brand-white, #fff) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 0 !important;
    height: 100% !important;
    min-height: 400px !important;
    min-width: 0 !important;
    width: 100% !important;
    writing-mode: horizontal-tb !important;
}

/* Force proper text flow in product cards */
.woocommerce-cart .wc-block-product-template li.wc-block-product *,
.woocommerce-cart li.wc-block-product *,
.woocommerce-cart .wc-block-grid__product *,
.woocommerce-cart li.product * {
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

.woocommerce-cart .wc-block-product:hover,
.woocommerce-cart .wc-block-grid__product:hover,
.woocommerce-cart li.product:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2) !important;
}

/* Product image in cart page collection */
.woocommerce-cart .wc-block-components-product-image,
.woocommerce-cart .wc-block-grid__product-image,
.woocommerce-cart li.product .attachment-woocommerce_thumbnail {
    position: relative !important;
    width: 100% !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-cart .wc-block-components-product-image img,
.woocommerce-cart .wc-block-grid__product-image img,
.woocommerce-cart li.product img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4/3 !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.8s ease !important;
}

.woocommerce-cart .wc-block-product:hover .wc-block-components-product-image img,
.woocommerce-cart .wc-block-grid__product:hover img,
.woocommerce-cart li.product:hover img {
    transform: scale(1.05) !important;
}

/* Product title in cart page collection */
.woocommerce-cart .wc-block-product h2.wp-block-post-title,
.woocommerce-cart .wc-block-grid__product-title,
.woocommerce-cart li.product .woocommerce-loop-product__title {
    font-family: var(--font-primary, Quicksand) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    margin: 15px 15px 8px !important;
    padding: 0 !important;
    color: var(--brand-black, #000) !important;
    line-height: 1.4 !important;
    text-align: center !important;
}

.woocommerce-cart .wc-block-product h2 a,
.woocommerce-cart .wc-block-grid__product-title a,
.woocommerce-cart li.product .woocommerce-loop-product__title a {
    color: var(--brand-black, #000) !important;
    text-decoration: none !important;
}

.woocommerce-cart .wc-block-product h2 a:hover,
.woocommerce-cart .wc-block-grid__product-title a:hover,
.woocommerce-cart li.product a:hover .woocommerce-loop-product__title {
    color: var(--brand-orange, #FC7D06) !important;
}

/* Product price in cart page collection */
.woocommerce-cart .wc-block-product .wc-block-components-product-price,
.woocommerce-cart .wc-block-grid__product-price,
.woocommerce-cart li.product .price {
    font-family: var(--font-primary, Quicksand) !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: var(--brand-black, #000) !important;
    text-align: center !important;
    margin: 0 15px 15px !important;
    padding: 0 !important;
}

/* Add to cart button in cart page collection */
.woocommerce-cart .wc-block-product .wc-block-components-product-button,
.woocommerce-cart .wc-block-grid__product .wp-block-button,
.woocommerce-cart li.product .add_to_cart_button,
.woocommerce-cart li.product .button {
    margin: auto 15px 15px !important;
    padding: 0 !important;
}

.woocommerce-cart .wc-block-product .wp-block-button__link,
.woocommerce-cart .wc-block-product .wc-block-components-product-button__button,
.woocommerce-cart .wc-block-grid__product .wp-block-button__link,
.woocommerce-cart li.product .add_to_cart_button,
.woocommerce-cart li.product .button {
    display: block !important;
    width: 100% !important;
    background-color: var(--brand-orange, #FC7D06) !important;
    color: var(--brand-white, #fff) !important;
    padding: 12px 15px !important;
    text-align: center !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    font-family: var(--font-primary, Quicksand) !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    transition: background-color 0.3s ease !important;
    border: none !important;
    cursor: pointer !important;
}

.woocommerce-cart .wc-block-product .wp-block-button__link:hover,
.woocommerce-cart .wc-block-product .wc-block-components-product-button__button:hover,
.woocommerce-cart .wc-block-grid__product .wp-block-button__link:hover,
.woocommerce-cart li.product .add_to_cart_button:hover,
.woocommerce-cart li.product .button:hover {
    background-color: #e06d05 !important;
}

/* Sale badges on cart page products */
.woocommerce-cart .wc-block-product .onsale,
.woocommerce-cart .wc-block-grid__product .onsale,
.woocommerce-cart li.product .onsale {
    background: var(--brand-white, #fff) !important;
    color: var(--brand-black, #000) !important;
    border: 1px solid var(--brand-gray-dark, #333) !important;
    border-radius: 4px !important;
    padding: 6px 12px !important;
    font-family: var(--font-primary, Quicksand) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 10 !important;
}

/* Responsive: Tablet (2 columns) */
@media (max-width: 1024px) {
    .woocommerce-cart .wc-block-product-template,
    .woocommerce-cart ul.wc-block-product-template,
    .woocommerce-cart ul.products,
    body.woocommerce-cart .wc-block-grid.has-3-columns .wc-block-grid__products,
    body.woocommerce-cart .wc-block-grid__products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
    }
}

/* Responsive: Small tablet (2 columns) */
@media (max-width: 768px) {
    .woocommerce-cart .wc-block-product-template,
    .woocommerce-cart ul.wc-block-product-template,
    .woocommerce-cart ul.products,
    body.woocommerce-cart .wc-block-grid.has-3-columns .wc-block-grid__products,
    body.woocommerce-cart .wc-block-grid__products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }

    .woocommerce-cart .wc-block-product,
    body.woocommerce-cart .wc-block-grid__product,
    .woocommerce-cart li.product {
        min-height: 350px !important;
    }
}

/* Responsive: Mobile (1 column for empty cart products) */
@media (max-width: 640px) {
    /* Force 1 column on mobile - target exact WooCommerce product-new block structure */
    .wc-block-grid.has-3-columns ul.wc-block-grid__products,
    .wc-block-grid.has-3-columns .wc-block-grid__products,
    .wp-block-product-new.has-3-columns ul.wc-block-grid__products,
    .wp-block-woocommerce-product-new.has-3-columns ul.wc-block-grid__products,
    .wc-block-product-new.has-3-columns ul.wc-block-grid__products,
    body.woocommerce-cart .wc-block-grid.has-3-columns ul.wc-block-grid__products,
    body.woocommerce-cart .wp-block-product-new ul.wc-block-grid__products,
    body.woocommerce-cart .wc-block-grid__products,
    .woocommerce-cart .wc-block-product-template,
    .woocommerce-cart ul.wc-block-product-template,
    .woocommerce-cart ul.products {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 25px !important;
    }

    /* Product cards - center and constrain width */
    .wc-block-grid.has-3-columns li.wc-block-grid__product,
    .wp-block-product-new li.wc-block-grid__product,
    body.woocommerce-cart .wc-block-grid__product,
    .woocommerce-cart .wc-block-product,
    .woocommerce-cart li.product {
        min-height: auto !important;
        max-width: 350px !important;
        margin: 0 auto !important;
        width: 100% !important;
    }

    .woocommerce-cart .wc-block-product h2.wp-block-post-title,
    body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-title,
    .woocommerce-cart li.product .woocommerce-loop-product__title {
        font-size: 16px !important;
        margin: 15px 15px 8px !important;
    }

    .woocommerce-cart .wc-block-product .wc-block-components-product-price,
    body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-price,
    .woocommerce-cart li.product .price {
        font-size: 22px !important;
        margin: 0 15px 12px !important;
    }

    .woocommerce-cart .wc-block-product .wc-block-components-product-button,
    body.woocommerce-cart .wc-block-grid__product .wc-block-grid__product-add-to-cart,
    .woocommerce-cart li.product .add_to_cart_button,
    .woocommerce-cart li.product .button {
        margin: auto 15px 15px !important;
    }

    .woocommerce-cart .wc-block-product .wp-block-button__link,
    body.woocommerce-cart .wc-block-grid__product .wp-block-button__link,
    .woocommerce-cart li.product .add_to_cart_button,
    .woocommerce-cart li.product .button {
        padding: 12px 15px !important;
        font-size: 14px !important;
    }
}

/* Override entry-content link styles for cart/checkout buttons - force white text */
.woocommerce-cart .entry-content .wc-block-components-button__text,
.woocommerce-cart .entry-content .wc-block-cart__submit-button .wc-block-components-button__text,
.woocommerce-cart .wc-block-components-button__text,
.woocommerce-cart .wp-element-button,
.woocommerce-cart .entry-content .wp-element-button,
.woocommerce-checkout .entry-content .wc-block-components-button__text,
.woocommerce-checkout .wc-block-components-button__text,
.woocommerce-checkout .wp-element-button,
.woocommerce-checkout .entry-content .wp-element-button {
    color: #fff !important;
    text-decoration: none !important;
}

/* Product title links in cart - cleaner look */
.woocommerce-cart .wc-block-cart-item__product a,
.woocommerce-cart .wc-block-components-product-name,
.woocommerce-cart .cart_item .product-name a,
.woocommerce-cart a.wc-block-components-product-name {
    color: var(--brand-green, #009285) !important;
    text-decoration: none !important;
    font-weight: 600;
    transition: color 0.2s ease;
}

.woocommerce-cart .wc-block-cart-item__product a:hover,
.woocommerce-cart .wc-block-components-product-name:hover,
.woocommerce-cart .cart_item .product-name a:hover,
.woocommerce-cart a.wc-block-components-product-name:hover {
    color: var(--brand-orange, #FC7D06) !important;
    text-decoration: none !important;
}

/* Remove item link - subtle styling */
.woocommerce-cart .wc-block-cart-item__remove-link,
.woocommerce-cart .wc-block-components-product-details + a,
.woocommerce-cart a.remove,
.woocommerce-cart .product-remove a,
.woocommerce-cart a[href*="remove_item"] {
    color: var(--brand-gray-medium, #666) !important;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 500;
    opacity: 0.8;
    transition: all 0.2s ease;
}

.woocommerce-cart .wc-block-cart-item__remove-link:hover,
.woocommerce-cart .wc-block-components-product-details + a:hover,
.woocommerce-cart a.remove:hover,
.woocommerce-cart .product-remove a:hover,
.woocommerce-cart a[href*="remove_item"]:hover {
    color: #dc3545 !important;
    text-decoration: underline !important;
    opacity: 1;
}

/* Stock/inventory notices in cart */
.woocommerce-cart .wc-block-components-product-badge,
.woocommerce-cart .stock-notice {
    background: rgba(252, 125, 6, 0.1);
    color: var(--brand-orange, #FC7D06);
    border: 1px solid rgba(252, 125, 6, 0.3);
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    display: inline-block;
    margin-top: 8px;
}

/* Cart item variation details (size, color) */
.woocommerce-cart .wc-block-components-product-details,
.woocommerce-cart .variation {
    font-size: 14px;
    color: var(--brand-gray-dark, #333);
    margin-top: 5px;
}

.woocommerce-cart .wc-block-components-product-details dt,
.woocommerce-cart .variation dt {
    font-weight: 600;
    display: inline;
}

.woocommerce-cart .wc-block-components-product-details dd,
.woocommerce-cart .variation dd {
    display: inline;
    margin-left: 0;
    color: var(--brand-gray-medium, #666);
}

/* Coupon/promo code link */
.woocommerce-cart .wc-block-components-totals-coupon-link,
.woocommerce-cart a[class*="coupon"] {
    color: var(--brand-gray-dark, #333) !important;
    text-decoration: none !important;
    font-weight: 500;
}

.woocommerce-cart .wc-block-components-totals-coupon-link:hover,
.woocommerce-cart a[class*="coupon"]:hover {
    color: var(--brand-orange, #FC7D06) !important;
}

/* ==========================================================================
   Cart & Checkout Mobile Responsive Fixes
   ========================================================================== */

/* Ensure cart/checkout items don't overflow on mobile */
@media (max-width: 768px) {
    /* Cart item layout - stack on mobile */
    .woocommerce-cart .wc-block-cart-items,
    .woocommerce-checkout .wc-block-components-order-summary-item {
        width: 100% !important;
        overflow: hidden;
    }

    /* Cart item row - flexible layout */
    .woocommerce-cart .wc-block-cart-items__row,
    .woocommerce-cart .wc-block-cart-item,
    .woocommerce-checkout .wc-block-components-order-summary-item {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        padding: 15px 10px !important;
        position: relative;
    }

    /* Product image smaller on mobile */
    .woocommerce-cart .wc-block-cart-item__image,
    .woocommerce-checkout .wc-block-components-order-summary-item__image {
        width: 60px !important;
        min-width: 60px !important;
        flex-shrink: 0;
    }

    /* Product details - take remaining space */
    .woocommerce-cart .wc-block-cart-item__product,
    .woocommerce-checkout .wc-block-components-order-summary-item__description {
        flex: 1;
        min-width: 0;
        padding-right: 70px !important;
    }

    /* Price positioning - absolute right */
    .woocommerce-cart .wc-block-cart-item__total,
    .woocommerce-checkout .wc-block-components-order-summary-item__total-price {
        position: absolute !important;
        right: 10px !important;
        top: 15px !important;
        text-align: right !important;
        max-width: 65px;
        font-size: 14px !important;
    }

    /* Product name - prevent overflow */
    .woocommerce-cart .wc-block-components-product-name,
    .woocommerce-checkout .wc-block-components-product-name {
        font-size: 14px !important;
        word-break: break-word;
        overflow-wrap: break-word;
    }

    /* Quantity selector - compact */
    .woocommerce-cart .wc-block-components-quantity-selector {
        transform: scale(0.9);
        transform-origin: left center;
    }

    /* Order summary totals */
    .woocommerce-cart .wc-block-components-totals-wrapper,
    .woocommerce-checkout .wc-block-components-totals-wrapper {
        padding: 10px !important;
    }

    .woocommerce-cart .wc-block-components-totals-item,
    .woocommerce-checkout .wc-block-components-totals-item {
        display: flex;
        justify-content: space-between;
        flex-wrap: nowrap;
        gap: 10px;
    }

    .woocommerce-cart .wc-block-components-totals-item__value,
    .woocommerce-checkout .wc-block-components-totals-item__value {
        text-align: right;
        white-space: nowrap;
    }
}

@media (max-width: 480px) {
    /* Even smaller screens */
    .woocommerce-cart .wc-block-cart-item__product,
    .woocommerce-checkout .wc-block-components-order-summary-item__description {
        padding-right: 60px !important;
    }

    .woocommerce-cart .wc-block-cart-item__total,
    .woocommerce-checkout .wc-block-components-order-summary-item__total-price {
        max-width: 55px;
        font-size: 13px !important;
    }

    .woocommerce-cart .wc-block-components-product-name,
    .woocommerce-checkout .wc-block-components-product-name {
        font-size: 13px !important;
    }
}