/*
Theme Name: Ecomus Child
Theme URI: https://wpecomus.com/
Author: DrFuri
Author URI: http://drfuri.com/
Description: Multipurpose WooCommerce WordPress Theme
Version: 1.0.0
Requires at least: 5.0
Tested up to: 5.8
Requires PHP: 7.0
License: GNU General Public License v2+
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ecomus
Domain Path: /lang/
Tags: one-column, two-columns, left-sidebar, right-sidebar, full-width-template, post-formats, theme-options, threaded-comments, translation-ready
Template: ecomus
*/

/* ---------- Google Fonts Import (must be first) ---------- */
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400;0,6..96,500;0,6..96,600;0,6..96,700;1,6..96,400;1,6..96,500&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,600;1,300;1,400&family=Inter:wght@300;400;500;600&family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,900;1,400;1,600&display=swap');

/* ---------- Cart page: top spacing ---------- */
body.woocommerce-cart .woocommerce,
body.page-shop-cart .entry-content,
body.page-shop-cart .woocommerce {
    padding-top: 60px;
}
@media (max-width: 768px) {
    body.woocommerce-cart .woocommerce,
    body.page-shop-cart .entry-content,
    body.page-shop-cart .woocommerce {
        padding-top: 32px;
    }
}

/* ---------- Cart page: unified action row (Coupon + Update Bag) ---------- */
/* Apply consistent 48px height to coupon input, Apply Coupon, and Update Bag */
body.woocommerce-cart .woocommerce-cart-form #coupon_code,
body.page-shop-cart .woocommerce-cart-form #coupon_code {
    height: 48px !important;
    padding: 0 16px !important;
    font-family: 'Manrope', system-ui, sans-serif !important;
    font-size: 13px !important;
    border: 1px solid #D6C5A8 !important;
    background: #fff !important;
    color: #2C1A14 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    line-height: 48px !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart button[name="apply_coupon"],
body.woocommerce-cart input[name="apply_coupon"],
body.page-shop-cart button[name="apply_coupon"],
body.page-shop-cart input[name="apply_coupon"],
body.woocommerce-cart button[name="update_cart"],
body.woocommerce-cart input[name="update_cart"],
body.page-shop-cart button[name="update_cart"],
body.page-shop-cart input[name="update_cart"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 180px !important;
    height: 48px !important;
    line-height: 1 !important;
    padding: 0 28px !important;
    background: #4B0F1F !important;
    color: #F5EBDD !important;
    border: 1px solid #4B0F1F !important;
    border-radius: 0 !important;
    font-family: 'Manrope', system-ui, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .24em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    opacity: 1 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: background .3s ease, color .3s ease, border-color .3s ease, box-shadow .35s ease !important;
}

body.woocommerce-cart button[name="apply_coupon"]:hover,
body.woocommerce-cart input[name="apply_coupon"]:hover,
body.page-shop-cart button[name="apply_coupon"]:hover,
body.page-shop-cart input[name="apply_coupon"]:hover,
body.woocommerce-cart button[name="update_cart"]:hover,
body.woocommerce-cart input[name="update_cart"]:hover,
body.page-shop-cart button[name="update_cart"]:hover,
body.page-shop-cart input[name="update_cart"]:hover {
    background: linear-gradient(120deg, #B4923C 0%, #E5CD8A 50%, #B4923C 100%) !important;
    color: #3A0A17 !important;
    border-color: #C9A24A !important;
    box-shadow: 0 0 0 1px rgba(201,162,74,.4), 0 18px 40px -22px rgba(201,162,74,.55) !important;
}

/* Override WC's "disabled" class on Update Cart so it stops looking faded */
body.woocommerce-cart button[name="update_cart"].disabled,
body.woocommerce-cart input[name="update_cart"].disabled,
body.page-shop-cart button[name="update_cart"].disabled,
body.page-shop-cart input[name="update_cart"].disabled,
body.woocommerce-cart button[name="update_cart"][disabled],
body.page-shop-cart button[name="update_cart"][disabled] {
    background: #4B0F1F !important;
    color: #F5EBDD !important;
    border-color: #4B0F1F !important;
    opacity: 1 !important;
    cursor: pointer !important;
}

@media (max-width: 600px) {
    body.woocommerce-cart button[name="apply_coupon"],
    body.woocommerce-cart button[name="update_cart"],
    body.page-shop-cart button[name="apply_coupon"],
    body.page-shop-cart button[name="update_cart"] {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* ---------- Global: Bodoni Moda for ALL product names ---------- */
/* Shop / archives / related / cross-sells */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
.woocommerce ul.products li.product .product-title,
.woocommerce ul.products li.product .product-title a,
.products .product-title,
.products .product-title a,
/* Single product (PDP) */
.product_title.entry-title,
.woocommerce div.product .product_title,
.kh-product-title,
/* Cart */
.woocommerce-cart table.cart td.product-name,
.woocommerce-cart table.cart td.product-name a,
.woocommerce-cart .product-name,
.woocommerce-cart .product-name a,
/* Checkout */
.woocommerce-checkout table.shop_table .product-name,
.woocommerce-checkout table.shop_table .product-name a,
/* Order received / account orders */
.woocommerce-order table.shop_table .product-name,
.woocommerce-order table.shop_table .product-name a,
.woocommerce-account table.shop_table .product-name,
.woocommerce-account table.shop_table .product-name a,
/* Mini cart / side cart */
.widget_shopping_cart .product-name,
.widget_shopping_cart .product-name a,
.mini-cart .product-name,
.mini-cart .product-name a,
.tf-mini-cart .product-name,
.tf-mini-cart .product-name a,
/* Wishlist */
.wishlist_table .product-name,
.wishlist_table .product-name a,
.wcboost-wishlist-table .product-name,
.wcboost-wishlist-table .product-name a {
    font-family: 'Bodoni Moda', 'Playfair Display', Georgia, serif !important;
    letter-spacing: .01em;
}

/* 0. FORCE HIDE NATIVE HEADER IMMEDIATELY (Prevents Flicker) */
.site-header, 
.header-main, 
.ecomus-header-v1, 
#site-header,
.tf-sticky-header,
.header-sticky {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
}

/* ---------- Mini-cart drawer must sit ABOVE the custom header ----------
   .kh-global-header has z-index: 99999. The Ecomus cart drawer/backdrop
   ships at a lower value, so the navbar was covering the drawer's top
   strip. Two-part fix:
     1. Push every known cart drawer + overlay selector well above 99999.
     2. When the drawer is open (body gains a "modal-open"/"overflow-hidden"
        class), drop the header below the drawer entirely. */

/* 1a. Drawer panel — broad attribute match catches whatever class Ecomus uses */
[class*="mini-cart"],
[class*="cart-drawer"],
[class*="cart-side"],
[class*="canvas-cart"],
[id*="shoppingCart"],
[id*="cart-drawer"],
.tf-mini-cart,
.canvas-mini-cart,
.modal-shopping-cart,
.modal.show.modal-shopping-cart,
.modal.show .modal-shopping-cart,
.modal-mini-cart,
.cart-mini,
.cart-drawer,
.offcanvas-cart,
.offcanvas-cart.show,
.tf-product-modal,
#shoppingCart,
#cart-panel,
aside.canvas-sidebar.canvas-mini-cart,
.canvas-sidebar {
    z-index: 2147483000 !important;
}

/* 1b. Backdrop overlay */
.modal-backdrop,
.modal-backdrop.show,
.cart-overlay,
.canvas-overlay,
.tf-overlay,
.offcanvas-backdrop,
body.modal-open .modal-backdrop,
.overlay-canvas {
    z-index: 2147482000 !important;
}

/* 2. When ANY drawer/modal is open, demote the custom header so it can't
   cover the drawer. Bootstrap/Ecomus add one of these classes to <body>
   when the cart/canvas opens. */
body.modal-open .kh-global-header,
body.canvas-open .kh-global-header,
body.cart-open .kh-global-header,
body.overflow-hidden .kh-global-header,
html.overflow-hidden .kh-global-header,
body.has-canvas .kh-global-header,
body.no-scroll .kh-global-header,
body.offcanvas-opened .kh-global-header,
body.cart-panel-opened .kh-global-header {
    z-index: 1 !important;
}

/* --------------------------------------------------------------------------
   Hide Page Title / Breadcrumb Headers Globally
   (The section that says "Home" or "Category Name" below the menu)
-------------------------------------------------------------------------- */
.page-header, 
.ecomus-page-header, 
.woocommerce-products-header,
.site-breadcrumb,
.page-title-bar {
    display: none !important;
}

#site-content,
.site-content,
#content {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Kill parent-theme .em-container 30px gutters globally (edge-to-edge wrapper).
   Applies to ALL Khyati template pages (size-guide, delivery-exchange,
   customization, instagram, ig-showcase, landing, collection, taxonomy). */
.em-container,
.em-container.clearfix,
div[class*="em-container"],
.section-container,
div[class*="section-container"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Also neutralise Elementor / parent-theme content-width CSS variables globally
   so the 30px gutter can't sneak back in through Elementor sections. */
:root,
body {
    --e-global-spacing-padding: 0px;
    --content-width: 100%;
    --container-max-width: 100%;
}

/* Restore padding for Account, Checkout and standard pages */
.woocommerce-account .site-content,
.woocommerce-checkout .site-content,
.woocommerce-cart .site-content,
.woocommerce-account #site-content,
.archive.woocommerce-page .site-content:not(.khyati-custom-landing) {
    background-color: #F2E1C9 !important;
    padding: 60px 20px !important;
    max-width: 1400px;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Khyati custom product layouts (taxonomy archive) carry .khyati-custom-landing
   on an inner div, so the wrapper isn't matched by the cap above. Force the
   wrapping .site-content edge-to-edge so product grids use the full screen
   width on large screens. */
.archive.woocommerce-page .site-content:has(.khyati-custom-landing) {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}




/* ==========================================================================
   KHYATI HERITAGE LUXURY DESIGN SYSTEM
   Heritage Couture · Maroon × Cream × Gold
   ========================================================================== */

/* ---------- Brand Tokens (CSS Custom Properties) ---------- */
:root {
    /* Core Palette */
    --kh-maroon: #4B0F1F;
    --kh-maroon-deep: #3D0A13;
    --kh-maroon-900: #26060F;
    --kh-maroon-light: #5E1525;
    --kh-maroon-50: #FBF1F3;
    --kh-cream: #F2E1C9;
    --kh-cream-deep: #EFE0C9;
    --kh-cream-light: #FBF6EC;
    --kh-gold: #C9A24A;
    --kh-gold-soft: #D9BE7A;
    --kh-gold-dark: #A8853A;
    --kh-brown: #2C1A14;
    --kh-ink: #1A1A1A;
    --kh-muted: #6B5B4A;
    --kh-border: #D6C5A8;
    --kh-destructive: #C94A2E;
    --kh-card-bg: #F6EFE0;
    --kh-input-bg: #EFE3CC;
    --kh-input-border: #DCCBAE;

    /* Semantic Tokens */
    --kh-bg: var(--kh-cream);
    --kh-fg: var(--kh-brown);
    --kh-primary: var(--kh-maroon);
    --kh-primary-fg: var(--kh-cream);
    --kh-accent: var(--kh-gold);
    --kh-accent-fg: var(--kh-maroon);

    /* Gradients */
    --kh-gradient-royal: linear-gradient(135deg, #3D0A13 0%, #4B0F1F 60%, #2C1A14 100%);
    --kh-gradient-gold: linear-gradient(120deg, #B4923C 0%, #E5CD8A 50%, #B4923C 100%);
    --kh-gradient-overlay: linear-gradient(to top, rgba(61,10,19,.75), transparent 55%);

    /* Shadows */
    --kh-shadow-royal: 0 30px 80px -30px rgba(61,10,19,.6);
    --kh-shadow-gold: 0 0 0 1px rgba(201,162,74,.4), 0 20px 50px -25px rgba(201,162,74,.5);

    /* Typography */
    --kh-font-serif: 'Playfair Display', Georgia, serif;
    --kh-font-display: 'Cormorant Garamond', serif;
    --kh-font-sans: 'Inter', system-ui, sans-serif;

    /* Spacing & Shape */
    --kh-radius: 0.25rem;
    --kh-container: 1400px;
}



/* ---------- Global Body Override ---------- */
/* Use overflow-x: clip (not hidden) so it doesn't create a scrolling/containing
   context — position: sticky on the navbar requires no overflow:hidden ancestor.
   Fallback to hidden for browsers that don't support clip yet. */
html {
    overflow-x: hidden;
    overflow-x: clip;
    width: 100% !important;
    margin: 0 !important;
    padding-right: 0 !important;
    border-right: 0 !important;
}

body {
    background-color: var(--kh-bg) !important;
    color: var(--kh-fg) !important;
    font-family: var(--kh-font-sans) !important;
    overflow-x: hidden;
    overflow-x: clip;
    width: 100% !important;
    margin: 0 !important;
    padding-right: 0 !important;
    border-right: 0 !important;
    position: relative;
}

/* Global Box Sizing - Critical for preventing padding from pushing width > 100% */
*, *::before, *::after {
    box-sizing: border-box !important;
}

/* ==========================================================================
   GLOBAL MOBILE WIDTH FIX — eliminates right-side empty-space gap.
   Cause: off-canvas panels, wide images/iframes/tables, and unconstrained
   wrappers were pushing the document wider than the viewport. body had
   overflow-x:hidden but <html> did not, so the page rendered shifted with
   a visible blank strip on the right edge of every page on mobile.
   ========================================================================== */

/* Force every top-level wrapper to obey the viewport width on mobile */
@media (max-width: 1024px) {
    #page, .site, .ecomus-wrapper, .ecomus-main-wrapper,
    #main, .site-main, #primary,
    #site-content, .site-content, #content,
    .khyati-custom-landing, .khyati-hero-section, .khyati-hero-row,
    .khyati-hero-content, .khyati-hero-panel {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-right: 0 !important;
        overflow-x: clip;
    }
    /* Header is sticky — must NOT have an overflow ancestor or set overflow itself */
    .kh-global-header, header.kh-global-header {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        border-right: 0 !important;
    }

    #page, .site, .ecomus-wrapper, .ecomus-main-wrapper,
    #main, .site-main, #primary,
    #site-content, .site-content, #content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Media must never exceed viewport */
    img, video, iframe, embed, object, svg, canvas, picture {
        max-width: 100% !important;
        height: auto;
    }

    /* Tables in WC/account/order pages that overflow horizontally */
    table { max-width: 100% !important; }

    /* Off-canvas panels stay positioned by the parent theme — don't override
       their open/close state here (that broke the hamburger toggle). */
}

/* ---------- Mobile: hide the vertical scrollbar gutter ----------
   The styled ::-webkit-scrollbar (8px gold) was rendering as a permanent
   gold strip on the right edge on mobile browsers. Mobile uses overlay
   scrollbars by default, so we hide the styled one on small screens. */
@media (max-width: 1024px) {
    html, body {
        scrollbar-width: none !important;        /* Firefox */
        -ms-overflow-style: none !important;     /* IE/Edge legacy */
    }
    html::-webkit-scrollbar,
    body::-webkit-scrollbar,
    *::-webkit-scrollbar {
        width: 0 !important;
        height: 0 !important;
        background: transparent !important;
        display: none !important;
    }
}

/* ---------- Mobile Header — symmetric padding, content hugs both edges ---------- */
@media (max-width: 1024px) {
    .kh-global-header .kh-header-mobile {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 16px !important;
    }
    .kh-global-header .kh-header-mobile .kh-header-right {
        gap: 18px !important;
    }
    /* Stop the cart-count badge from bleeding past the viewport edge */
    .kh-global-header .kh-header-mobile .kh-action-icon {
        overflow: visible;
    }
    .kh-global-header .kh-header-mobile .mobile-count {
        right: -6px !important;
    }
}

/* ==========================================================================
   ORDER-RECEIVED ("Thank you") PAGE — top breathing room + mobile gutters
   The earlier mobile fix strips wrapper padding to 0, which made the order
   details run edge-to-edge and the success notice sit flush against the
   sticky navbar. Reintroduce comfortable spacing on this page specifically.
   ========================================================================== */
.woocommerce-order-received .site-content,
.woocommerce-order-received #site-content,
.woocommerce-order-received #main,
.woocommerce-order-received .ecomus-main-wrapper {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.woocommerce-order-received .woocommerce-notice,
.woocommerce-order-received .woocommerce-notice--success,
.woocommerce-order-received p.woocommerce-notice {
    margin-top: 0 !important;
    margin-bottom: 32px !important;
    padding: 20px 24px !important;
}

.woocommerce-order-received .woocommerce-order-overview,
.woocommerce-order-received ul.order_details {
    padding: 24px !important;
    margin: 0 0 32px 0 !important;
}

.woocommerce-order-received h2,
.woocommerce-order-received .woocommerce-column__title {
    margin-top: 32px !important;
    margin-bottom: 16px !important;
}

@media (max-width: 1024px) {
    .woocommerce-order-received .site-content,
    .woocommerce-order-received #site-content,
    .woocommerce-order-received #main,
    .woocommerce-order-received .ecomus-main-wrapper {
        padding-top: 28px !important;
        padding-bottom: 32px !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .woocommerce-order-received .woocommerce-notice,
    .woocommerce-order-received .woocommerce-notice--success,
    .woocommerce-order-received p.woocommerce-notice {
        padding: 16px 18px !important;
        margin-bottom: 24px !important;
        font-size: 15px !important;
        line-height: 1.5 !important;
    }

    .woocommerce-order-received .woocommerce-order-overview,
    .woocommerce-order-received ul.order_details {
        padding: 18px !important;
        margin-bottom: 24px !important;
    }

    .woocommerce-order-received .woocommerce-order-details,
    .woocommerce-order-received .woocommerce-customer-details {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }
}

/* ---------- Hero Image: Kill ALL parent-theme zoom/transform ---------- */
#khyati-hero-img,
#khyati-hero-img:hover,
#khyati-hero-img:focus,
.khyati-hero-panel img {
    transform: none !important;
    transition: none !important;
    animation: none !important;
    -webkit-animation: none !important;
}

/* ---------- Hero Section: Desktop-only top padding ---------- */
@media (min-width: 1025px) {
    .khyati-hero-panel {
        padding-top: 35px !important;
    }
}


/* ---------- Footer: ZERO child-theme CSS — Elementor template renders untouched ---------- */
/* Global link/heading rules below use :not(.site-footer *) so they never match footer. */

/* Suppress the duplicate Ecomus default footer container (Elementor template post id 5836).
   Footer v1 (post id 4421) is the active footer template. Ecomus is injecting 5836 as a
   "container" alongside Footer v1 from a theme option — hide it until that option is found. */
#site-footer .elementor-5836,
#site-footer [data-elementor-id="5836"] {
    display: none !important;
}

/* ---------- Footer: Maroon Background Override ---------- */
/* IMPORTANT: Do NOT use a bare `footer` selector here — Ecomus wraps the
   entire page (including account content) in a <footer> tag on some pages,
   which causes the maroon to bleed into the account page. */
footer#site-footer,
footer.site-footer,
.site-footer,
#site-footer,
.khyati-footer-v1,
#khyati-footer-v1 {
    background-color: #3F0A14 !important;
    color: #F2E1C9 !important;
}

#khyati-footer-v1 h1, #khyati-footer-v1 h2, #khyati-footer-v1 h3, 
#khyati-footer-v1 h4, #khyati-footer-v1 h5, #khyati-footer-v1 h6,
#khyati-footer-v1 p, #khyati-footer-v1 span, #khyati-footer-v1 div,
#khyati-footer-v1 li {
    color: #F2E1C9 !important;
}

#khyati-footer-v1 a {
    color: #C9A24A !important;
    transition: color 0.3s ease !important;
}

#khyati-footer-v1 a:hover {
    color: #F2E1C9 !important;
}

/* ---------- Footer V1: Typography Override ----------
   Matches the KHYATI logo wordmark (high-contrast didone serif).
   Body uses Manrope for legibility at small sizes; headings use Bodoni Moda. */
#khyati-footer-v1,
#khyati-footer-v1 p,
#khyati-footer-v1 span,
#khyati-footer-v1 div,
#khyati-footer-v1 a,
#khyati-footer-v1 li,
#khyati-footer-v1 label,
#khyati-footer-v1 input,
#khyati-footer-v1 button,
#khyati-footer-v1 .elementor-widget-container,
#khyati-footer-v1 .elementor-heading-title,
#khyati-footer-v1 .elementor-icon-list-text {
    font-family: 'Manrope', system-ui, -apple-system, sans-serif !important;
}

#khyati-footer-v1 h1,
#khyati-footer-v1 h2,
#khyati-footer-v1 h3,
#khyati-footer-v1 h4,
#khyati-footer-v1 h5,
#khyati-footer-v1 h6,
#khyati-footer-v1 .elementor-heading-title {
    font-family: 'Bodoni Moda', 'Playfair Display', Georgia, serif !important;
    letter-spacing: 0.04em !important;
}

/* Fix for White Boxes and Inconsistent Colors */
input[type="text"], 
input[type="email"], 
input[type="password"], 
input[type="tel"], 
input[type="url"], 
input[type="number"], 
textarea, 
select {
    background-color: #F2E1C9 !important;
    border: 1px solid rgba(44, 26, 20, 0.2) !important;
    color: #2C1A14 !important;
}

/* My Account / Checkout / Cart — paint the entire page cream up to the footer
   so the maroon footer makes a clean horizontal divide with the body. */
html.woocommerce-account,
html.woocommerce-checkout,
html.woocommerce-cart,
body.woocommerce-account,
body.woocommerce-checkout,
body.woocommerce-cart,
.woocommerce-account #page,
.woocommerce-checkout #page,
.woocommerce-cart #page,
.woocommerce-account .site,
.woocommerce-checkout .site,
.woocommerce-cart .site,
.woocommerce-account .ecomus-wrapper,
.woocommerce-checkout .ecomus-wrapper,
.woocommerce-cart .ecomus-wrapper,
.woocommerce-account #main,
.woocommerce-checkout #main,
.woocommerce-cart #main,
.woocommerce-account #site-content,
.woocommerce-checkout #site-content,
.woocommerce-cart #site-content,
.woocommerce-account .site-content,
.woocommerce-checkout .site-content,
.woocommerce-cart .site-content,
.woocommerce-account .site-main,
.woocommerce-checkout .site-main,
.woocommerce-cart .site-main,
.woocommerce-account #primary,
.woocommerce-checkout #primary,
.woocommerce-cart #primary,
.woocommerce-account .ecomus-main-wrapper,
.woocommerce-checkout .ecomus-main-wrapper,
.woocommerce-cart .ecomus-main-wrapper,
.woocommerce-account .woocommerce,
.woocommerce-account .woocommerce-MyAccount-content {
    background-color: #F2E1C9 !important;
    color: #2C1A14 !important;
}

/* My Account sidebar - light off-white background */
.woocommerce-account .woocommerce-MyAccount-navigation {
    background-color: #FAF6EF !important;
    color: #2C1A14 !important;
    padding: 20px 0 !important;
    border-radius: 4px !important;
    border: 1px solid rgba(201, 162, 74, 0.3) !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid rgba(63, 10, 20, 0.08) !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
    border-bottom: none !important;
}

/* The footer keeps its own maroon background — make sure no inherited cream leaks in */
.woocommerce-account .site-footer,
.woocommerce-checkout .site-footer,
.woocommerce-cart .site-footer,
.woocommerce-account footer.footer,
.woocommerce-checkout footer.footer,
.woocommerce-cart footer.footer {
    background-color: var(--kh-maroon, #3F0A14) !important;
    border-top: 1px solid #C9A24A !important;
    box-shadow: 0 -1px 0 rgba(201, 162, 74, 0.25) !important;
}




.woocommerce-account .woocommerce-MyAccount-navigation li a {
    color: #2C1A14 !important;
    display: block !important;
    padding: 12px 20px !important;
    text-decoration: none !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
    background-color: rgba(63, 10, 20, 0.06) !important;
    color: #3F0A14 !important;
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
    font-weight: bold !important;
    color: #3F0A14 !important;
    background-color: rgba(201, 162, 74, 0.12) !important;
    text-decoration: none !important;
    border-left: 3px solid #3F0A14 !important;
}

/* My Account Checkbox Fix - Accent Color */
input[type="checkbox"] {
    accent-color: #3F0A14 !important;
    width: 18px !important;
    height: 18px !important;
    cursor: pointer !important;
}

/* "Go Top" Button Recolor - Specific ID Override */
#gotop, .back-to-top, .ecomus-go-top {
    background-color: #3F0A14 !important;
    color: #F2E1C9 !important;
    border: 2px solid #C9A24A !important;
    opacity: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#gotop i, #gotop svg {
    color: #F2E1C9 !important;
    fill: #F2E1C9 !important;
}


/* Footer Subscription Field - Nuclear Transparency */
#khyati-footer-v1 .elementor-field-group input,
#khyati-footer-v1 .elementor-field-group .elementor-field-textual {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #F2E1C9 !important;
    border: none !important;
    border-bottom: 1px solid rgba(242, 225, 201, 0.4) !important;
}


/* Kill White Gap between Content and Footer */
.site-content, #content, #site-content {
    margin-bottom: 0 !important;
    padding-bottom: 0px !important;
}

footer#site-footer, footer.site-footer, .site-footer, .khyati-footer-v1 {
    margin-top: 0 !important;
    border-top: none !important;
}









/* Ensure Elementor elements inside the footer are transparent */
#khyati-footer-v1 section,
#khyati-footer-v1 .elementor-section,
#khyati-footer-v1 .elementor-container,
#khyati-footer-v1 .elementor-column,
#khyati-footer-v1 .elementor-column-wrap,
#khyati-footer-v1 .elementor-widget-wrap {
    background-color: transparent !important;
    background-image: none !important;
}





/* ---------- WooCommerce Buttons (excluded from footer) ---------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.wp-block-button__link,
.ecomus-btn:not(.site-footer .ecomus-btn),
.button:not(.site-footer .button),
button[type="submit"]:not(.site-footer button) {
    background-color: var(--kh-maroon) !important;
    color: var(--kh-cream) !important;
    border: 1px solid var(--kh-gold) !important;
    border-radius: var(--kh-radius) !important;
    font-family: var(--kh-font-sans) !important;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.5s ease !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wp-block-button__link:hover,
.ecomus-btn:not(.site-footer .ecomus-btn):hover,
.button:not(.site-footer .button):hover,
button[type="submit"]:not(.site-footer button):hover {
    background: var(--kh-gradient-gold) !important;
    color: var(--kh-maroon-deep) !important;
    border-color: var(--kh-gold) !important;
    box-shadow: var(--kh-shadow-gold) !important;
}

/* ---------- WooCommerce Product Cards ---------- */
.woocommerce ul.products li.product,
.products .product,
.ecomus-product-card {
    background: var(--kh-card-bg) !important;
    border: 1px solid var(--kh-border) !important;
    border-radius: var(--kh-radius) !important;
    transition: box-shadow 0.5s ease, transform 0.5s ease !important;
}
.woocommerce ul.products li.product:hover,
.products .product:hover {
    box-shadow: var(--kh-shadow-royal) !important;
    transform: translateY(-2px);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.products .product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
.products .product h2.woocommerce-loop-product__title,
.products .product h3.woocommerce-loop-product__title {
    font-family: 'Bodoni Moda', Georgia, serif !important;
    font-weight: 500 !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    letter-spacing: -0.03em !important;
    color: #4A1F24 !important;
    font-style: normal !important;
}
.woocommerce ul.products li.product .price,
.products .product .price {
    color: var(--kh-maroon) !important;
    font-weight: 600 !important;
}

/* ---------- WooCommerce Forms & Inputs (excluded from footer) ---------- */
/* Fix input and label alignment in WooCommerce forms (My Account / Login / Register) */
.woocommerce form .form-row label,
.woocommerce-account .woocommerce form label {
    display: block !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    text-align: left !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form select,
.woocommerce form .form-row .password-input,
.woocommerce form .form-row .password-input input.input-text {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form select,
.woocommerce form .form-row .password-input input.input-text {
    padding: 6.4px 17.6px !important;
}

.woocommerce form .form-row .password-input {
    padding: 0 !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form select,
input[type="text"]:not(.site-footer input),
input[type="email"]:not(.site-footer input),
input[type="password"]:not(.site-footer input),
input[type="search"]:not(.site-footer input),
input[type="tel"]:not(.site-footer input),
input[type="number"]:not(.site-footer input),
textarea:not(.site-footer textarea),
select:not(.site-footer select) {
    background-color: var(--kh-input-bg) !important;
    border: 1px solid var(--kh-input-border) !important;
    color: var(--kh-brown) !important;
    border-radius: var(--kh-radius) !important;
    font-family: var(--kh-font-sans) !important;
}
input:not(.site-footer input):focus,
textarea:not(.site-footer textarea):focus,
select:not(.site-footer select):focus {
    border-color: var(--kh-gold) !important;
    box-shadow: 0 0 0 2px rgba(201,162,74,0.3) !important;
    outline: none !important;
}

/* ---------- Global Link Colors (excluded from footer) ---------- */
a:not(.site-footer *) {
    color: var(--kh-maroon) !important;
    transition: color 0.4s ease !important;
}
a:not(.site-footer *):hover {
    color: var(--kh-gold) !important;
}

/* Exclude landing page links from body link rule */
.khyati-custom-landing a {
    color: inherit !important;
}

/* ---------- Heading Typography (excluded from footer) ---------- */
h1:not(.site-footer *), h2:not(.site-footer *),
h3:not(.site-footer *), h4:not(.site-footer *),
h5:not(.site-footer *), h6:not(.site-footer *) {
    font-family: var(--kh-font-serif) !important;
    color: var(--kh-brown) !important;
}

/* ---------- Hero Section: Restore Cream Text on Dark Background ---------- */
/* The global h1 brown rule was overriding the inline cream color in the hero */
.khyati-hero-content h1,
.khyati-hero-content h2,
.khyati-hero-content h3,
.khyati-hero-content p,
.khyati-custom-landing .khyati-hero-content h1 {
    color: #F2E1C9 !important;
}

/* ---------- Scrollbar Styling ---------- */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--kh-cream);
}
::-webkit-scrollbar-thumb {
    background: var(--kh-gold-soft);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--kh-gold);
}

/* ---------- Selection Highlight ---------- */
::selection {
    background-color: var(--kh-maroon);
    color: var(--kh-cream);
}

/* ---------- Khyati Button Classes ---------- */
.btn-royal {
    background-color: var(--kh-maroon) !important;
    color: var(--kh-cream) !important;
    border: 1px solid var(--kh-gold) !important;
    padding: 14px 32px;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    font-family: var(--kh-font-sans);
    font-weight: 500;
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: var(--kh-radius);
}
.btn-royal:hover {
    background: var(--kh-gradient-gold) !important;
    color: var(--kh-maroon-deep) !important;
    box-shadow: var(--kh-shadow-gold);
}

.btn-ghost-gold {
    background: transparent !important;
    color: var(--kh-gold) !important;
    border: 1px solid var(--kh-gold) !important;
    padding: 14px 32px;
    font-size: 11px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    font-family: var(--kh-font-sans);
    font-weight: 500;
    cursor: pointer;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: var(--kh-radius);
}
.btn-ghost-gold:hover {
    background: var(--kh-gold) !important;
    color: var(--kh-maroon-deep) !important;
}

/* ---------- Gold Divider Ornament ---------- */
.kh-divider {
    width: 60px;
    height: 1px;
    background: var(--kh-gold);
    opacity: 0.6;
}

/* ---------- WooCommerce Breadcrumbs (if shown) ---------- */
.woocommerce-breadcrumb {
    color: var(--kh-muted) !important;
    font-family: var(--kh-font-sans) !important;
    font-size: 11px !important;
    letter-spacing: 0.08em;
}
.woocommerce-breadcrumb a {
    color: var(--kh-gold) !important;
}

/* ---------- WooCommerce Sale Badge ---------- */
.woocommerce span.onsale {
    background: var(--kh-maroon) !important;
    color: var(--kh-cream) !important;
    border-radius: var(--kh-radius) !important;
    font-family: var(--kh-font-sans) !important;
    font-size: 10px !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* ---------- WooCommerce Star Ratings ---------- */
.woocommerce .star-rating span::before {
    color: var(--kh-gold) !important;
}

/* ---------- Sale Price: kill background highlight + center the strikethrough ----------
   <del> is only used on the site for the original (struck-through) price, so we
   style it globally rather than relying on a .price ancestor (Khyati's category
   template renders prices outside the standard .price wrapper). */

/* Strip any browser/theme background on the price elements */
del,
ins,
del .woocommerce-Price-amount,
ins .woocommerce-Price-amount,
del .woocommerce-Price-amount bdi,
ins .woocommerce-Price-amount bdi,
del.woocommerce-Price-amount,
ins.woocommerce-Price-amount,
.woocommerce-Price-amount,
.woocommerce-Price-amount bdi {
    background: none !important;
    background-color: transparent !important;
    background-image: none !important;
    padding: 0 !important;
    box-shadow: none !important;
}

/* New (sale) price — no underline */
ins,
ins .woocommerce-Price-amount,
ins.woocommerce-Price-amount {
    text-decoration: none !important;
}

/* Old (struck-through) price — draw the line on the inner price span (which uses
   the actual price font/size) so the strike sits at that font's visual middle.
   Drawing on <del> itself caused a second misaligned line in the parent font. */
del {
    text-decoration: none !important;
    opacity: 0.6;
    font-weight: 400;
    margin-right: 8px;
}
del .woocommerce-Price-amount,
del .amount,
del bdi,
del > span {
    text-decoration: line-through !important;
    text-decoration-color: currentColor !important;
    text-decoration-thickness: 1px !important;
}

/* ==========================================================================
   GLOBAL PRICE TYPOGRAPHY — Cormorant Garamond Italic (400)
   Applied everywhere prices appear: grids, PDP, cart, checkout, orders
   ========================================================================== */
/* WooCommerce price amount wrapper */
.woocommerce-Price-amount,
.woocommerce-Price-amount bdi,
.price .woocommerce-Price-amount,
/* Product loops / grids */
.woocommerce ul.products li.product .price,
.woocommerce ul.products li.product .price .amount,
.products .product .price,
.products .product .price .woocommerce-Price-amount,
/* Single product page */
.woocommerce .product .price,
.woocommerce .product p.price,
.woocommerce .product span.price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce div.product .price .amount,
/* Cart & Mini-cart */
.woocommerce-cart .cart_item .amount,
.woocommerce-mini-cart__total .amount,
.woocommerce .cart_totals .amount,
.cart-collaterals .amount,
.widget_shopping_cart .amount,
/* Checkout */
.woocommerce-checkout .order-total .amount,
.woocommerce-checkout .cart-subtotal .amount,
.woocommerce table.shop_table .amount,
/* Order review & confirmation */
.woocommerce-order-details .amount,
.woocommerce-table--order-details .amount,
/* Custom Khyati PDP */
.kh-price,
.kh-price .woocommerce-Price-amount,
/* Custom Khyati PDP product price */
.kh-product-price,
.kh-product-price .woocommerce-Price-amount,
.kh-product-price .amount,
.kh-dynamic-price {
    font-family: 'Cormorant Garamond', serif !important;
    font-style: italic !important;
    font-weight: 500 !important;
    font-size: 22px !important;
    letter-spacing: 0.01em !important;
    color: #7B7B7B !important;
}

/* ---------- Pagination ---------- */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    color: var(--kh-muted) !important;
    border-color: var(--kh-border) !important;
}
.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--kh-maroon) !important;
    color: var(--kh-cream) !important;
    border-color: var(--kh-maroon) !important;
}

/* ---------- Notices & Messages ---------- */
.woocommerce-info,
.woocommerce-message {
    border-top-color: var(--kh-gold) !important;
}
.woocommerce-info::before,
.woocommerce-message::before {
    color: var(--kh-gold) !important;
}
.woocommerce-error {
    border-top-color: var(--kh-destructive) !important;
}

/* Anchor links inside WC notices (e.g. "BROWSE PRODUCTS" in the empty-orders
   message) should render as plain underlined text, not as filled buttons.
   Selector is intentionally aggressive to win over .woocommerce a.button. */
.woocommerce div.woocommerce-info a,
.woocommerce div.woocommerce-message a,
.woocommerce div.woocommerce-error a,
div.woocommerce-info a,
div.woocommerce-message a,
div.woocommerce-error a,
.woocommerce div.woocommerce-info a.button,
.woocommerce div.woocommerce-info a.wc-forward,
.woocommerce div.woocommerce-info a.woocommerce-Button,
.woocommerce div.woocommerce-message a.button,
.woocommerce div.woocommerce-message a.wc-forward,
.woocommerce div.woocommerce-message a.woocommerce-Button,
.woocommerce-info a.button.wc-forward,
.woocommerce-message a.button.wc-forward {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--kh-maroon) !important;
    border: none !important;
    padding: 0 !important;
    box-shadow: none !important;
    text-decoration: underline !important;
    font-weight: 600;
    letter-spacing: normal !important;
    text-transform: uppercase;
    line-height: inherit !important;
    min-height: 0 !important;
}
.woocommerce div.woocommerce-info a:hover,
.woocommerce div.woocommerce-message a:hover,
.woocommerce div.woocommerce-error a:hover,
div.woocommerce-info a:hover,
div.woocommerce-message a:hover,
div.woocommerce-error a:hover {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--kh-gold) !important;
    text-decoration: underline !important;
}

/* ==========================================================================
   KHYATI GLOBAL LUXURY HEADER (CUSTOM INJECTED)
   ========================================================================== */

/* 1. CSS for the custom header is now primarily managed in functions.php 
      to ensure high-priority injection and prevent FOUC.
      Redundant rules removed from here. */

.kh-global-header a {
    text-decoration: none !important;
}

@media (max-width: 1024px) {
    .kh-logo-text { font-size: 18px !important; letter-spacing: 0.25em !important; }
}

/* ==========================================================================
   ORDER TRACKING / VIEW ORDER — mobile layout
   ========================================================================== */

.vpc-order-preview-wrap {
    margin-top: 0.5rem;
}
.vpc-order-preview-thumb {
    display: block;
    width: 96px;
    height: auto;
    border: 1px solid var(--kh-border);
    border-radius: 4px;
    background: #fff;
}

@media (max-width: 600px) {
    .vpc-order-preview-thumb { width: 80px; }

    /* Break the table out of its grid layout but keep tfoot rows as flex pairs. */
    .woocommerce-order-details table.shop_table,
    .woocommerce-order-details table.shop_table > tbody,
    .woocommerce-order-details table.shop_table > tfoot {
        display: block;
        width: 100% !important;
        box-sizing: border-box;
    }
    .woocommerce-order-details table.shop_table thead { display: none; }

    /* --- Product line row (tbody): stacked, price right-aligned underneath --- */
    .woocommerce-order-details table.shop_table > tbody > tr {
        display: block;
        width: 100% !important;
        padding: 0.75rem 0;
        border-bottom: 1px solid var(--kh-border);
    }
    .woocommerce-order-details table.shop_table > tbody > tr > td {
        display: block;
        width: 100% !important;
        text-align: left !important;
        padding: 0.15rem 0;
        border: 0;
        word-break: break-word;
        overflow-wrap: anywhere;
        box-sizing: border-box;
    }
    .woocommerce-order-details table.shop_table > tbody > tr > td.product-total {
        text-align: right !important;
        font-weight: 600;
    }

    /* --- Tfoot rows: label LEFT, value RIGHT on the same line --- */
    .woocommerce-order-details table.shop_table > tfoot > tr {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 0.5rem 1rem;
        padding: 0.65rem 0;
        border-bottom: 1px solid var(--kh-border);
    }
    .woocommerce-order-details table.shop_table > tfoot > tr > th {
        flex: 0 0 auto;
        width: auto !important;
        text-align: left !important;
        font-weight: 600;
        padding: 0;
        border: 0;
        white-space: nowrap;
    }
    .woocommerce-order-details table.shop_table > tfoot > tr > td {
        flex: 0 1 auto;
        width: auto !important;
        max-width: 65%;
        text-align: right !important;
        padding: 0;
        border: 0;
        word-break: break-word;
        overflow-wrap: anywhere;
    }
    /* Don't inject a duplicate label — the <th> already shows "Subtotal:" etc. */
    .woocommerce-order-details table.shop_table td::before { content: none !important; }

    /* Customization meta list (Customizations / sleeves / length) */
    .woocommerce-order-details .wc-item-meta,
    .woocommerce-order-details .wc-item-meta li,
    .woocommerce-order-details .wc-item-meta p {
        word-break: break-word;
        overflow-wrap: anywhere;
        margin-left: 0;
        padding-left: 0;
        list-style: none;
    }

    /* Action buttons sit inline on the right of the Actions row, wrapping if needed. */
    .woocommerce-order-details table.shop_table > tfoot td a.button,
    .woocommerce-order-details table.shop_table > tfoot td button.button {
        display: inline-block !important;
        width: auto !important;
        margin: 0.15rem 0 0.15rem 0.35rem !important;
        white-space: nowrap !important;
    }
}

/* Return-to-shop button in mini-cart empty state */
.woocommerce-mini-cart__empty-message .em-button,
.woocommerce-mini-cart__empty-message a.em-button {
    background-color: #4B0F1F !important;
    color: #C9A24A !important;
    border: none !important;
    border-radius: 0 !important;
}
.woocommerce-mini-cart__empty-message .em-button:hover,
.woocommerce-mini-cart__empty-message a.em-button:hover {
    background-color: #3D0A13 !important;
    color: #D9BE7A !important;
}

/* ============================================================
   Mobile fix for /shop-cart/ table layout
   Page uses standard WooCommerce shop_table (not khyati-cart-wrap).
   Image was bleeding wide and price/qty columns were cramped.
   ============================================================ */
@media (max-width: 760px) {
    .woocommrece-cart-content { overflow-x: hidden; }

    table.shop_table_responsive.cart,
    .woocommerce-cart-form table.cart {
        display: block !important;
        width: 100% !important;
        border-collapse: collapse !important;
    }
    table.shop_table_responsive.cart thead { display: none !important; }
    table.shop_table_responsive.cart tbody,
    table.shop_table_responsive.cart tfoot { display: block !important; width: 100% !important; }

    /* Each cart item becomes a vertical card */
    table.shop_table_responsive.cart tr.cart_item,
    table.shop_table_responsive.cart .woocommerce-cart-form__cart-item {
        display: grid !important;
        grid-template-columns: 100px 1fr !important;
        grid-template-areas:
            "thumb  name"
            "thumb  price"
            "qty    qty"
            "sub    sub" !important;
        gap: 8px 14px !important;
        padding: 18px 0 !important;
        border-bottom: 1px solid rgba(214,197,168,.5) !important;
        width: 100% !important;
    }

    /* Cells display as blocks, no table-cell behavior */
    table.shop_table_responsive.cart tr.cart_item > td {
        display: block !important;
        width: auto !important;
        padding: 0 !important;
        border: none !important;
        text-align: left !important;
    }

    /* Thumbnail: small, constrained, on the left */
    table.shop_table_responsive.cart tr.cart_item > td.product-thumbnail {
        grid-area: thumb !important;
        width: 100px !important;
        max-width: 100px !important;
    }
    table.shop_table_responsive.cart tr.cart_item > td.product-thumbnail a,
    table.shop_table_responsive.cart tr.cart_item > td.product-thumbnail img {
        display: block !important;
        width: 100px !important;
        height: 130px !important;
        max-width: 100% !important;
        object-fit: cover !important;
    }

    /* Name + remove link */
    table.shop_table_responsive.cart tr.cart_item > td.product-name {
        grid-area: name !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
    }
    table.shop_table_responsive.cart tr.cart_item > td.product-name::before { content: none !important; }
    table.shop_table_responsive.cart tr.cart_item > td.product-name a {
        font-size: 15px !important;
        color: #4B0F1F !important;
        text-decoration: none !important;
        font-weight: 500 !important;
    }
    table.shop_table_responsive.cart tr.cart_item .product-remove {
        margin-top: 6px !important;
    }
    table.shop_table_responsive.cart tr.cart_item .product-remove a.remove {
        font-size: 11px !important;
        letter-spacing: .15em !important;
        text-transform: uppercase !important;
        color: #888 !important;
        text-decoration: none !important;
    }

    /* Price inline under name */
    table.shop_table_responsive.cart tr.cart_item > td.product-price {
        grid-area: price !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        color: #4B0F1F !important;
    }
    table.shop_table_responsive.cart tr.cart_item > td.product-price::before {
        content: "Price: " !important;
        font-weight: 600 !important;
        font-size: 11px !important;
        color: #888 !important;
        letter-spacing: .15em !important;
        text-transform: uppercase !important;
        margin-right: 6px !important;
    }

    /* Quantity row spans full width below */
    table.shop_table_responsive.cart tr.cart_item > td.product-quantity {
        grid-area: qty !important;
        padding-top: 12px !important;
        margin-top: 6px !important;
        border-top: 1px solid rgba(214,197,168,.4) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
    }
    table.shop_table_responsive.cart tr.cart_item > td.product-quantity::before {
        content: "Quantity" !important;
        font-weight: 600 !important;
        font-size: 11px !important;
        color: #888 !important;
        letter-spacing: .15em !important;
        text-transform: uppercase !important;
    }

    /* Subtotal row spans full width */
    table.shop_table_responsive.cart tr.cart_item > td.product-subtotal {
        grid-area: sub !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        color: #4B0F1F !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
    table.shop_table_responsive.cart tr.cart_item > td.product-subtotal::before {
        content: "Subtotal" !important;
        font-weight: 600 !important;
        font-size: 11px !important;
        color: #888 !important;
        letter-spacing: .15em !important;
        text-transform: uppercase !important;
    }

    /* Actions row (coupon + update bag) */
    table.shop_table_responsive.cart tr:not(.cart_item) td.actions {
        display: block !important;
        padding: 18px 0 !important;
    }
    table.shop_table_responsive.cart td.actions .coupon {
        display: flex !important;
        gap: 8px !important;
        margin-bottom: 14px !important;
    }
    table.shop_table_responsive.cart td.actions .coupon input.input-text {
        flex: 1 !important;
        min-width: 0 !important;
    }
    table.shop_table_responsive.cart td.actions .coupon .button,
    table.shop_table_responsive.cart td.actions button[name="update_cart"] {
        width: 100% !important;
    }
    table.shop_table_responsive.cart td.actions .coupon .button { width: auto !important; }
}

/* ============================================================
 * KHYATI — Hide Shipping row from cart totals
 * ============================================================ */
.cart_totals .shipping,
.cart_totals tr.shipping,
.cart_totals tr.woocommerce-shipping-totals,
.cart_totals .woocommerce-shipping-totals,
.cart_totals .woocommerce-shipping-calculator,
.cart-collaterals .shipping,
.cart-collaterals tr.shipping,
.cart-collaterals .woocommerce-shipping-totals,
.cart-collaterals .woocommerce-shipping-calculator {
    display: none !important;
}

/* My Account > Orders: strip parent-theme button styles from Actions column
   (VIEW / INVOICE / TRACK) so they appear as plain text links. */
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions a,
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions a.button,
.woocommerce-MyAccount-content .my_account_orders .order-actions a,
.woocommerce-MyAccount-content .my_account_orders .order-actions a.button,
.woocommerce-account .woocommerce-orders-table__cell-order-actions a,
.woocommerce-account .woocommerce-orders-table__cell-order-actions a.button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: var(--kh-maroon, #5a1a1a) !important;
    padding: 0 8px 0 0 !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-radius: 0 !important;
    line-height: 1.4 !important;
    transition: color 0.3s ease !important;
}
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions a:hover,
.woocommerce-MyAccount-content .woocommerce-orders-table__cell-order-actions a.button:hover,
.woocommerce-MyAccount-content .my_account_orders .order-actions a:hover,
.woocommerce-MyAccount-content .my_account_orders .order-actions a.button:hover,
.woocommerce-account .woocommerce-orders-table__cell-order-actions a:hover,
.woocommerce-account .woocommerce-orders-table__cell-order-actions a.button:hover {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--kh-gold, #c9a55a) !important;
    text-decoration: underline !important;
}