/* =========================================================
   SleepOps Theme × WooCommerce — Product Page v1.0
   ========================================================= */

/* -------------------------------------------------------------------------
   Global container: constrain all Woo pages to 1100px
   ------------------------------------------------------------------------- */
.woocommerce .site-main,
.woocommerce-page .site-main {
    max-width: var(--max-width);
    margin:    0 auto;
    padding:   0 var(--size-lg);
}

/* -------------------------------------------------------------------------
   Breadcrumb
   ------------------------------------------------------------------------- */
.woocommerce .woocommerce-breadcrumb {
    font-size:     0.8rem;
    color:         var(--color-muted);
    margin-bottom: 32px;
    padding-top:   24px;
}

.woocommerce .woocommerce-breadcrumb a {
    color:           var(--color-muted);
    text-decoration: none;
}

.woocommerce .woocommerce-breadcrumb a:hover {
    color: var(--color-primary);
}

/* -------------------------------------------------------------------------
   Single product: two-column grid layout
   Woo structure: div.product > [gallery hook] + div.summary + [after-summary hooks]
   Gallery is injected via hook BEFORE div.summary — both are direct children of div.product
   ------------------------------------------------------------------------- */

/* Make div.product a grid container */
.woocommerce div.product {
    display:               grid;
    grid-template-columns: 1.15fr 0.85fr;
    gap:                   48px;
    align-items:           start;
    padding:               0 0 64px;
}

/* Gallery occupies col 1, summary col 2 */
.woocommerce div.product .woocommerce-product-gallery {
    grid-column: 1;
    grid-row:    1;
    float:       none !important;
    width:       auto !important;
    margin:      0 !important;
}

.woocommerce div.product div.summary {
    grid-column: 2;
    grid-row:    1;
    float:       none !important;
    width:       auto !important;
    margin:      0 !important;
}

/* After-summary content (tabs, upsells, related) spans full width */
.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product section.up-sells,
.woocommerce div.product section.related {
    grid-column: 1 / -1;
    grid-row:    auto;
    width:       100%;
    float:       none !important;
    clear:       both;
}

/* -------------------------------------------------------------------------
   Sale / Preorder badges
   ------------------------------------------------------------------------- */

/* Positioning parents for badges */
.woocommerce div.product .woocommerce-product-gallery,
.woocommerce ul.products li.product {
    position: relative;
}

/* Shared badge styles */
.woocommerce ul.products li.product span.onsale,
.woocommerce div.product .woocommerce-product-gallery span.onsale {
    position:       absolute;
    left:           8px;
    z-index:        9;
    display:        inline-block;
    border-radius:  4px !important;
    font-size:      0.65rem !important;
    font-weight:    700 !important;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding:        3px 7px !important;
    min-height:     auto !important;
    min-width:      auto !important;
    line-height:    1.4 !important;
    box-shadow:     none !important;
    white-space:    nowrap;
}

/* Preorder badge: amber, always at top */
.woocommerce ul.products li.product span.onsale.on-preorder,
.woocommerce div.product .woocommerce-product-gallery span.onsale.on-preorder {
    background: #f59e0b !important;
    color:      #fff !important;
    top:        8px;
}

/* Sale badge: dark, sits below Preorder if both present */
.woocommerce ul.products li.product span.onsale:not(.on-preorder),
.woocommerce div.product .woocommerce-product-gallery span.onsale:not(.on-preorder) {
    background: var(--color-primary) !important;
    color:      #fff !important;
    top:        34px;
}

/* If Sale badge is the only badge, move it back to top */
.woocommerce ul.products li.product span.onsale:not(.on-preorder):first-child,
.woocommerce div.product .woocommerce-product-gallery span.onsale:not(.on-preorder):first-child {
    top: 8px;
}

/* On single product page, WooCommerce outputs span.onsale outside the gallery — hide it */
.woocommerce div.product > span.onsale {
    display: none !important;
}

/* -------------------------------------------------------------------------
   Gallery
   ------------------------------------------------------------------------- */
.woocommerce div.product div.images {
    margin: 0;
}

.woocommerce div.product div.images .woocommerce-product-gallery {
    width: 100%;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    margin: 0;
}

/* Fix flexslider .flex-viewport inline height being too tall (sums all slides).
   Force it to auto so it follows the active slide's actual image height. */
.woocommerce div.product div.images .flex-viewport {
    height: auto !important;
    overflow: hidden;
}

/* Each slide: non-active slides must be hidden, not stacked */
.woocommerce div.product div.images .woocommerce-product-gallery__image {
    display: none;
}

.woocommerce div.product div.images .woocommerce-product-gallery__image.flex-active-slide {
    display: block;
}

/* Main image: only the primary product image (not zoomImg overlay) */
.woocommerce div.product div.images .woocommerce-product-gallery__image > a > img {
    border:        1px solid var(--color-border);
    border-radius: var(--radius);
    display:       block;
    width:         100%;
    height:        auto;
}

/* Fix the extra blank space caused by .zoomImg overlay:
   it is position:absolute so it must not affect flow height */
.woocommerce div.product div.images .zoomImg {
    pointer-events: none;
}

/* Thumbnails: horizontal grid instead of vertical list */
.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs {
    display:               grid !important;
    grid-template-columns: repeat(6, 1fr);
    gap:                   10px;
    margin-top:            12px;
    padding:               0;
    list-style:            none;
}

.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs li {
    width:  auto !important;
    margin: 0 !important;
}

.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs img {
    border:        1px solid var(--color-border);
    border-radius: 4px;
    opacity:       0.75;
    cursor:        pointer;
    transition:    opacity 0.15s, border-color 0.15s;
}

.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs img:hover,
.woocommerce div.product div.images .flex-control-nav.flex-control-thumbs img.flex-active {
    opacity:      1;
    border-color: var(--color-primary);
}

/* -------------------------------------------------------------------------
   Summary
   ------------------------------------------------------------------------- */
.woocommerce div.product div.summary {
    margin: 0;
}

.woocommerce div.product .product_title {
    font-size:      2rem;
    font-weight:    700;
    color:          var(--color-primary);
    letter-spacing: -0.03em;
    line-height:    1.2;
    margin-bottom:  12px;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    font-size:     1.1rem;
    font-weight:   600;
    color:         var(--color-primary);
    margin-bottom: 16px;
    display:       block;
}

.woocommerce div.product .woocommerce-product-details__short-description {
    font-size:     0.95rem;
    color:         var(--color-muted);
    line-height:   1.7;
    margin-bottom: 20px;
}

.woocommerce div.product .woocommerce-product-details__short-description p {
    margin-bottom: 8px;
}

/* -------------------------------------------------------------------------
   CTA — Add to cart / External product
   ------------------------------------------------------------------------- */
.woocommerce div.product form.cart {
    margin:      20px 0 12px;
    display:     flex;
    align-items: center;
    gap:         12px;
    flex-wrap:   wrap;
}

/* Quantity input */
.woocommerce div.product form.cart .quantity {
    display:     flex;
    align-items: center;
}

.woocommerce div.product form.cart .quantity input.qty {
    width:         64px !important;
    height:        44px;
    padding:       0 10px;
    border:        1px solid var(--color-border) !important;
    border-radius: var(--radius) !important;
    font-family:   var(--font-sans);
    font-size:     0.95rem;
    color:         var(--color-primary);
    background:    #fff;
    text-align:    center;
    outline:       none;
    -moz-appearance: textfield;
}

.woocommerce div.product form.cart .quantity input.qty:focus {
    border-color: var(--color-primary) !important;
}

.woocommerce div.product form.cart .quantity input.qty::-webkit-inner-spin-button,
.woocommerce div.product form.cart .quantity input.qty::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.woocommerce div.product .single_add_to_cart_button,
.woocommerce div.product .button.single_add_to_cart_button,
.woocommerce div.product a.button {
    display:         inline-block;
    background:      var(--color-primary) !important;
    color:           #fff !important;
    border:          none !important;
    border-radius:   var(--radius) !important;
    padding:         13px 24px !important;
    font-size:       0.95rem !important;
    font-weight:     600 !important;
    text-decoration: none;
    box-shadow:      none !important;
    transition:      opacity 0.15s;
    cursor:          pointer;
}

.woocommerce div.product .single_add_to_cart_button:hover,
.woocommerce div.product .button.single_add_to_cart_button:hover,
.woocommerce div.product a.button:hover {
    opacity:         0.88 !important;
    text-decoration: none !important;
    color:           #fff !important;
}

/* External product redirect notice */
.sleepops-external-notice {
    display:    block;
    font-size:  0.78rem;
    color:      var(--color-muted);
    margin-top: 8px;
}

/* -------------------------------------------------------------------------
   Variations table (Sizes / Colors selectors)
   ------------------------------------------------------------------------- */
.woocommerce div.product form.cart table.variations {
    width:           100%;
    border-collapse: collapse;
    margin-bottom:   16px;
}

.woocommerce div.product form.cart table.variations tr {
    display:       flex;
    align-items:   center;
    gap:           12px;
    margin-bottom: 10px;
}

.woocommerce div.product form.cart table.variations td {
    padding:  0;
    border:   none;
    vertical-align: middle;
}

.woocommerce div.product form.cart table.variations td.label {
    flex:       0 0 72px;
    min-width:  72px;
}

.woocommerce div.product form.cart table.variations td.label label {
    font-size:   0.82rem;
    font-weight: 600;
    color:       var(--color-primary);
    margin:      0;
}

.woocommerce div.product form.cart table.variations td.value {
    flex: 1;
}

.woocommerce div.product form.cart table.variations td.value select {
    width:         100%;
    height:        40px;
    padding:       0 32px 0 12px;
    border:        1px solid var(--color-border) !important;
    border-radius: var(--radius) !important;
    font-family:   var(--font-sans);
    font-size:     0.88rem;
    color:         var(--color-primary);
    background:    #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 12px center !important;
    -webkit-appearance: none;
    -moz-appearance:    none;
    appearance:         none;
    cursor:             pointer;
    outline:            none;
    transition:         border-color 0.15s;
}

.woocommerce div.product form.cart table.variations td.value select:focus {
    border-color: var(--color-primary) !important;
}

/* "Clear" link */
.woocommerce div.product form.cart table.variations .reset_variations {
    display:         inline-block;
    margin-top:      4px;
    font-size:       0.78rem;
    color:           var(--color-muted);
    text-decoration: none;
}

.woocommerce div.product form.cart table.variations .reset_variations:hover {
    color: var(--color-primary);
}

/* -------------------------------------------------------------------------
   SleepOps product note (shortcode / hook output)
   ------------------------------------------------------------------------- */
.sleepops-product-note {
    border:        1px solid var(--color-border);
    border-radius: var(--radius);
    padding:       14px 16px;
    margin-top:    20px;
    background:    var(--color-surface);
    font-size:     0.85rem;
    color:         var(--color-muted);
    line-height:   1.65;
}

.sleepops-product-note strong {
    color: var(--color-primary);
}

/* -------------------------------------------------------------------------
   Tabs
   ------------------------------------------------------------------------- */
.woocommerce div.product .woocommerce-tabs {
    margin-top:  48px;
    border-top:  1px solid var(--color-border);
    padding-top: 32px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding:         0;
    margin:          0 0 24px;
    border:          none;
    display:         flex;
    gap:             8px;
    list-style:      none;
    flex-wrap:       wrap;
    background:      none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
    display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    border:        1px solid var(--color-border) !important;
    border-radius: 100px !important;
    padding:       6px 16px !important;
    background:    #fff !important;
    margin:        0 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    border-color: var(--color-primary) !important;
    background:   var(--color-primary) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    font-size:   0.85rem;
    font-weight: 600;
    color:       var(--color-primary);
    padding:     0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: #fff;
}

.woocommerce div.product .woocommerce-tabs .panel {
    margin: 0;
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
    font-size:     1.1rem;
    font-weight:   600;
    color:         var(--color-primary);
    margin-bottom: 16px;
}

/* Hide the auto-generated tab title h2 (e.g. "Description", "Reviews") */
.woocommerce div.product .woocommerce-tabs .panel > h2:first-child {
    display: none;
}

/* -------------------------------------------------------------------------
   Attributes table
   ------------------------------------------------------------------------- */
.woocommerce table.shop_attributes {
    width:            100%;
    border:           1px solid var(--color-border);
    border-radius:    var(--radius);
    overflow:         hidden;
    border-collapse:  separate;
    border-spacing:   0;
    font-size:        0.9rem;
}

.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td {
    padding:       12px 16px;
    border-bottom: 1px solid var(--color-border);
    vertical-align: top;
}

.woocommerce table.shop_attributes th {
    font-weight:      600;
    color:            var(--color-primary);
    background:       var(--color-surface);
    width:            30%;
}

.woocommerce table.shop_attributes td {
    color: var(--color-text);
}

.woocommerce table.shop_attributes tr:last-child th,
.woocommerce table.shop_attributes tr:last-child td {
    border-bottom: none;
}

/* -------------------------------------------------------------------------
   Related / Up-sells
   ------------------------------------------------------------------------- */
.woocommerce .related,
.woocommerce .up-sells {
    margin-top:  48px;
    padding-top: 32px;
    border-top:  1px solid var(--color-border);
    display:     block !important;
    width:       100% !important;
    float:       none !important;
    clear:       both;
}

.woocommerce .related h2,
.woocommerce .up-sells h2 {
    font-size:      1.1rem;
    font-weight:    700;
    color:          var(--color-primary);
    letter-spacing: -0.01em;
    margin-bottom:  24px;
    display:        block;
    width:          100%;
}

/* Ensure related products grid spans full width — keep 4 cols on single product page */
.woocommerce .related ul.products,
.woocommerce .up-sells ul.products {
    display:               grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap:                   16px !important;
    width:                 100% !important;
    float:                 none !important;
}

.woocommerce ul.products {
    display:               grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap:                   20px;
    list-style:            none;
    padding:               0;
    margin:                0;
}

.woocommerce ul.products li.product {
    border:        1px solid var(--color-border) !important;
    border-radius: var(--radius) !important;
    padding:       16px !important;
    background:    #fff !important;
    float:         none !important;
    width:         auto !important;
    margin:        0 !important;
    transition:    border-color 0.15s;
}

.woocommerce ul.products li.product:hover {
    border-color: var(--color-primary) !important;
}

.woocommerce ul.products li.product img {
    border-radius: 4px;
    border:        1px solid var(--color-border);
    margin-bottom: 10px;
    width:         100%;
    height:        180px;
    object-fit:    cover;
    object-position: center;
    display:       block;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size:     0.9rem;
    font-weight:   600;
    color:         var(--color-primary);
    padding:       0;
    margin-bottom: 6px;
    line-height:   1.4;
}

.woocommerce ul.products li.product .price {
    font-size:   0.88rem;
    font-weight: 600;
    color:       var(--color-primary);
}

.woocommerce ul.products li.product .button {
    display:       block !important;
    width:         100% !important;
    text-align:    center !important;
    font-size:     0.8rem !important;
    padding:       8px 10px !important;
    margin-top:    12px;
    border-radius: var(--radius) !important;
    white-space:   nowrap;
    overflow:      hidden;
    text-overflow: ellipsis;
    box-sizing:    border-box !important;
}

/* -------------------------------------------------------------------------
   Archive / shop page
   ------------------------------------------------------------------------- */
.woocommerce-page .page-standard {
    padding-top: 40px;
}

.woocommerce-ordering select,
.woocommerce-result-count {
    font-size:  0.85rem;
    color:      var(--color-muted);
}

/* -------------------------------------------------------------------------
   Notices
   ------------------------------------------------------------------------- */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
    border-radius:   var(--radius) !important;
    border-left:     3px solid var(--color-primary) !important;
    font-size:       0.9rem !important;
    background:      var(--color-surface) !important;
    padding:         12px 16px !important;
    margin-bottom:   16px !important;
}

/* -------------------------------------------------------------------------
   Responsive
   ------------------------------------------------------------------------- */
@media (max-width: 980px) {
    .woocommerce div.product {
        grid-template-columns: 1fr;
        gap:                   24px;
    }

    .woocommerce div.product .product_title {
        font-size: 1.6rem;
    }

    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .woocommerce div.product div.images .flex-control-nav.flex-control-thumbs {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 520px) {
    .woocommerce div.product .product_title {
        font-size: 1.4rem;
    }

    .woocommerce ul.products {
        grid-template-columns: 1fr !important;
    }

    .woocommerce div.product div.images .flex-control-nav.flex-control-thumbs {
        grid-template-columns: repeat(4, 1fr);
    }
}

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

/* Remove prose max-width constraint for WooCommerce content */
.woocommerce-page .prose,.prose .woocommerce {
    max-width: none;
}

/* Page title */
.woocommerce-cart h1.page-title,
.woocommerce-cart .page-standard h1 {
    font-size:      1.75rem;
    font-weight:    700;
    color:          var(--color-primary);
    letter-spacing: -0.02em;
    margin-bottom:  32px;
    padding-top:    32px;
}

/* Two-column layout: cart table (left) + totals (right)
   Works regardless of whether cart is rendered via Elementor shortcode or native template. */

/* The .woocommerce div that wraps both form and cart-collaterals */
.woocommerce:has(form.woocommerce-cart-form) {
    display:               grid;
    grid-template-columns: 1fr 340px;
    gap:                   40px;
    align-items:           start;
}

/* Notices span full width */
.woocommerce:has(form.woocommerce-cart-form) .woocommerce-notices-wrapper {
    grid-column: 1 / -1;
}

/* Cart form (left column) */
.woocommerce form.woocommerce-cart-form {
    grid-column: 1;
}

/* Cart totals (right column) */
.woocommerce .cart-collaterals {
    grid-column: 2;
}

/* Cart table — use .woocommerce prefix so it works inside Elementor too */
.woocommerce table.woocommerce-cart-form__contents {
    width:           100%;
    border:          1px solid var(--color-border);
    border-radius:   var(--radius);
    border-collapse: separate;
    border-spacing:  0;
    overflow:        hidden;
    font-size:       0.9rem;
}

.woocommerce table.woocommerce-cart-form__contents thead {
    background: var(--color-surface);
}

.woocommerce table.woocommerce-cart-form__contents th {
    padding:        12px 16px;
    font-size:      0.75rem;
    font-weight:    700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color:          var(--color-muted);
    border-bottom:  1px solid var(--color-border);
    text-align:     left;
}

.woocommerce table.woocommerce-cart-form__contents td {
    padding:        16px;
    border-bottom:  1px solid var(--color-border);
    vertical-align: middle;
    color:          var(--color-text);
}

.woocommerce table.woocommerce-cart-form__contents tr:last-child td {
    border-bottom: none;
}

/* Product image in cart */
.woocommerce table.woocommerce-cart-form__contents td.product-thumbnail img {
    width:         72px;
    height:        72px;
    object-fit:    cover;
    border-radius: var(--radius);
    border:        1px solid var(--color-border);
    display:       block;
}

/* Product name */
.woocommerce table.woocommerce-cart-form__contents td.product-name a {
    font-weight:     600;
    color:           var(--color-primary);
    text-decoration: none;
    font-size:       0.9rem;
    line-height:     1.4;
}

.woocommerce table.woocommerce-cart-form__contents td.product-name a:hover {
    text-decoration: underline;
}

/* Shipping notice under product name */
.woocommerce table.woocommerce-cart-form__contents td.product-name small {
    font-size:  0.78rem;
    color:      var(--color-muted);
    display:    block;
    margin-top: 4px;
}

/* Remove button (×) */
.woocommerce table.woocommerce-cart-form__contents td.product-remove a.remove {
    display:         flex;
    align-items:     center;
    justify-content: center;
    width:           24px;
    height:          24px;
    border-radius:   50%;
    background:      var(--color-surface);
    border:          1px solid var(--color-border);
    color:           var(--color-muted) !important;
    font-size:       1rem;
    font-weight:     400;
    text-decoration: none;
    transition:      background 0.15s, border-color 0.15s;
}

.woocommerce table.woocommerce-cart-form__contents td.product-remove a.remove:hover {
    background:   #fee;
    border-color: #e88;
    color:        #c33 !important;
}

/* Quantity input in cart */
.woocommerce form.woocommerce-cart-form .quantity input.qty {
    width:         60px !important;
    height:        36px;
    padding:       0 8px;
    border:        1px solid var(--color-border) !important;
    border-radius: var(--radius) !important;
    font-size:     0.9rem;
    text-align:    center;
    color:         var(--color-primary);
    background:    #fff;
    outline:       none;
    -moz-appearance: textfield;
}

.woocommerce form.woocommerce-cart-form .quantity input.qty:focus {
    border-color: var(--color-primary) !important;
}

.woocommerce form.woocommerce-cart-form .quantity input.qty::-webkit-inner-spin-button,
.woocommerce form.woocommerce-cart-form .quantity input.qty::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

/* Coupon + Update buttons row */
.woocommerce table.woocommerce-cart-form__contents td.actions {
    padding: 16px;
}

.woocommerce table.woocommerce-cart-form__contents td.actions .coupon {
    display:     flex;
    align-items: center;
    gap:         8px;
    flex-wrap:   wrap;
}

.woocommerce table.woocommerce-cart-form__contents td.actions .coupon input#coupon_code {
    width:         180px !important;
    height:        38px;
    padding:       0 12px;
    border:        1px solid var(--color-border) !important;
    border-radius: var(--radius) !important;
    font-size:     0.85rem;
    color:         var(--color-text);
    background:    #fff;
    outline:       none;
}

.woocommerce table.woocommerce-cart-form__contents td.actions .coupon input#coupon_code:focus {
    border-color: var(--color-primary) !important;
}

.woocommerce table.woocommerce-cart-form__contents td.actions .coupon .button,
.woocommerce table.woocommerce-cart-form__contents td.actions button[name="update_cart"] {
    height:        38px;
    padding:       0 16px !important;
    font-size:     0.85rem !important;
    border-radius: var(--radius) !important;
}

/* Cart totals box */
.woocommerce .cart_totals {
    background:    var(--color-surface);
    border:        1px solid var(--color-border);
    border-radius: var(--radius);
    padding:       24px;
}

.woocommerce .cart_totals h2 {
    font-size:      1rem;
    font-weight:    700;
    color:          var(--color-primary);
    letter-spacing: -0.01em;
    margin-bottom:  16px;
    padding-bottom: 12px;
    border-bottom:  1px solid var(--color-border);
}

.woocommerce .cart_totals table {
    width:           100%;
    border-collapse: collapse;
    margin-bottom:   20px;
}

.woocommerce .cart_totals table th,
.woocommerce .cart_totals table td {
    padding:       10px 0;
    border-bottom: 1px solid var(--color-border);
    font-size:     0.9rem;
}

.woocommerce .cart_totals table th {
    font-weight: 600;
    color:       var(--color-primary);
    width:       40%;
}

.woocommerce .cart_totals table td {
    color:      var(--color-text);
    text-align: right;
}

.woocommerce .cart_totals table tr:last-child th,
.woocommerce .cart_totals table tr:last-child td {
    border-bottom: none;
    font-weight:   700;
    font-size:     1rem;
}

/* Proceed to checkout button */
.woocommerce .cart_totals .wc-proceed-to-checkout {
    margin-top: 0;
}

.woocommerce .cart_totals .wc-proceed-to-checkout a.checkout-button {
    display:         block;
    width:           100%;
    text-align:      center;
    background:      var(--color-primary) !important;
    color:           #fff !important;
    border-radius:   var(--radius) !important;
    padding:         13px 20px !important;
    font-size:       0.95rem !important;
    font-weight:     600 !important;
    text-decoration: none;
    border:          none !important;
    transition:      opacity 0.15s;
    box-sizing:      border-box;
}

.woocommerce .cart_totals .wc-proceed-to-checkout a.checkout-button:hover {
    opacity:         0.88 !important;
    text-decoration: none !important;
}

/* Empty cart */
.woocommerce p.cart-empty {
    font-size:  1rem;
    color:      var(--color-muted);
    padding:    40px 0;
    text-align: center;
}

.woocommerce p.return-to-shop {
    text-align: center;
    margin-top: 16px;
}

.woocommerce p.return-to-shop .button {
    font-size: 0.9rem !important;
}

/* =========================================================
   Checkout Page
   ========================================================= */

.woocommerce-checkout h1.page-title,
.woocommerce-checkout .page-standard h1 {
    font-size:      1.75rem;
    font-weight:    700;
    color:          var(--color-primary);
    letter-spacing: -0.02em;
    margin-bottom:  32px;
    padding-top:    32px;
}

/* Two-column: billing (left) + order summary (right) */
.woocommerce-checkout .woocommerce {
    display:               grid;
    grid-template-columns: 1fr 380px;
    gap:                   40px;
    align-items:           start;
}

.woocommerce-checkout .woocommerce .woocommerce-notices-wrapper {
    grid-column: 1 / -1;
}

.woocommerce-checkout .woocommerce #customer_details {
    grid-column: 1;
}

.woocommerce-checkout .woocommerce #order_review_heading,
.woocommerce-checkout .woocommerce #order_review {
    grid-column: 2;
}

/* Form fields */
.woocommerce-checkout .woocommerce-checkout .form-row {
    margin-bottom: 16px;
}

.woocommerce-checkout .woocommerce-checkout .form-row label {
    font-size:     0.82rem;
    font-weight:   600;
    color:         var(--color-primary);
    margin-bottom: 6px;
}

.woocommerce-checkout .woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .woocommerce-checkout .form-row select,
.woocommerce-checkout .woocommerce-checkout .form-row textarea {
    border:        1px solid var(--color-border) !important;
    border-radius: var(--radius) !important;
    padding:       10px 12px !important;
    font-size:     0.9rem !important;
    color:         var(--color-text) !important;
    width:         100% !important;
    outline:       none;
}

.woocommerce-checkout .woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .woocommerce-checkout .form-row textarea:focus {
    border-color: var(--color-primary) !important;
}

/* Order summary box */
.woocommerce-checkout #order_review {
    background:    var(--color-surface);
    border:        1px solid var(--color-border);
    border-radius: var(--radius);
    padding:       24px;
}

.woocommerce-checkout #order_review_heading {
    font-size:     1rem;
    font-weight:   700;
    color:         var(--color-primary);
    margin-bottom: 12px;
}

.woocommerce-checkout table.shop_table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.88rem;
    margin-bottom:   16px;
}

.woocommerce-checkout table.shop_table th,
.woocommerce-checkout table.shop_table td {
    padding:       10px 0;
    border-bottom: 1px solid var(--color-border);
    color:         var(--color-text);
}

.woocommerce-checkout table.shop_table th {
    font-weight: 600;
    color:       var(--color-primary);
}

.woocommerce-checkout table.shop_table tr:last-child th,
.woocommerce-checkout table.shop_table tr:last-child td {
    border-bottom: none;
    font-weight:   700;
}

/* Place order button */
.woocommerce-checkout #place_order {
    display:         block;
    width:           100%;
    background:      var(--color-primary) !important;
    color:           #fff !important;
    border:          none !important;
    border-radius:   var(--radius) !important;
    padding:         14px 20px !important;
    font-size:       1rem !important;
    font-weight:     700 !important;
    cursor:          pointer;
    text-align:      center;
    margin-top:      16px;
    transition:      opacity 0.15s;
}

.woocommerce-checkout #place_order:hover {
    opacity: 0.88 !important;
}

/* =========================================================
   Cart + Checkout responsive
   ========================================================= */
@media (max-width: 860px) {
    .woocommerce:has(form.woocommerce-cart-form),
    .woocommerce-checkout .woocommerce {
        grid-template-columns: 1fr;
    }

    .woocommerce .cart-collaterals {
        grid-column: 1;
        grid-row:    auto;
    }

    .woocommerce-checkout .woocommerce #order_review_heading,
    .woocommerce-checkout .woocommerce #order_review {
        grid-column: 1;
    }
}
