/* ══════════════════════════════════════════════════════════════════════════
   Chawang Header Suite Pro — chs-public.css
   ALL selectors use var(--chs-*) so JS theme-switching is instant.
   PHP sets the vars on :root; JS updates them on user theme pick.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Body offset for fixed bar ─────────────────────────────────────────── */
html { scroll-padding-top: var(--chs-bar-height, 60px); }
body { padding-top: var(--chs-bar-height, 60px) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §1  BASE — body, page, content wrappers
   ══════════════════════════════════════════════════════════════════════════ */
body,
#page,
.site,
.hfeed,
.page-wrapper,
.main-wrapper,
.site-content,
#content,
.content-area,
.woocommerce-page,
.page-template-default .entry-content {
    background-color: var(--chs-bg) !important;
    color: var(--chs-text) !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.woocommerce-products-header__title {
    color: var(--chs-text) !important;
}

/* Body text */
p, li, td, th, label, span,
.woocommerce-loop-product__title,
.woocommerce-Price-currencySymbol {
    color: var(--chs-text);
}

/* Links */
a { color: var(--chs-link) !important; text-decoration: none; }
a:hover { opacity: .85; color: var(--chs-accent) !important; }

/* Dividers */
hr,
.woocommerce-separator {
    border-color: var(--chs-border) !important;
    background: var(--chs-border) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §2  CHS HEADER BAR
   ══════════════════════════════════════════════════════════════════════════ */
#chs-header-bar {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 999999;
    height: var(--chs-bar-height, 60px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    gap: 10px;
    background: var(--chs-header-bg) !important;
    color: var(--chs-header-text) !important;
    box-shadow: 0 2px 24px rgba(0,0,0,.5);
    border-bottom: 1px solid rgba(255,255,255,.06);
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
}

.chs-zone { display: flex; align-items: center; flex: 1; min-width: 0; }
.chs-zone--left   { justify-content: flex-start; gap: 8px; }
.chs-zone--center { justify-content: center; flex: 2; }
.chs-zone--right  { justify-content: flex-end; gap: 8px; }

.chs-left-shortcode { display: flex; align-items: center; color: var(--chs-header-text) !important; font-size: 13px; }
.chs-left-shortcode a, .chs-left-shortcode button { color: var(--chs-header-text) !important; }

.chs-site-name-link { text-decoration: none !important; color: inherit !important; }
.chs-site-name {
    font-size: clamp(13px, 2.2vw, 19px);
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--chs-header-text) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-shadow: 0 0 24px rgba(255,255,255,.2);
}
.chs-logo-link { display: flex; align-items: center; text-decoration: none !important; }
.chs-logo-img  { max-height: calc(var(--chs-bar-height, 60px) - 14px); max-width: 200px; width: auto; object-fit: contain; display: block; }

/* Wallet badge */
.chs-wallet-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: var(--chs-wallet-bg) !important;
    border: 1.5px solid var(--chs-wallet-border) !important;
    border-radius: 50px;
    padding: 5px 14px 5px 10px;
    color: var(--chs-header-text) !important;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: box-shadow .2s, transform .15s;
}
.chs-wallet-badge:hover { transform: translateY(-1px); box-shadow: 0 0 0 3px rgba(255,255,255,.1); }
.chs-wallet-icon { display: flex; align-items: center; color: var(--chs-wallet-border) !important; }
.chs-wallet-icon svg { filter: drop-shadow(0 0 4px currentColor); }
.chs-wallet-amount { display: flex; align-items: center; gap: 3px; }
.chs-wallet-amount .wps-wallet,
.chs-wallet-amount .wps_wallet,
.chs-wallet-amount span,
.chs-wallet-amount p,
.chs-wallet-amount div {
    display: inline !important; font-size: inherit !important; font-weight: inherit !important;
    color: inherit !important; background: transparent !important; border: none !important;
    padding: 0 !important; margin: 0 !important; line-height: 1 !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §3  WOOMART NATIVE HEADER / NAVIGATION
   ══════════════════════════════════════════════════════════════════════════ */
.site-header,
#masthead,
.woomart-header,
.woomart-header-wrap,
.header-main,
.header-container,
.header-inner,
#site-header {
    background-color: var(--chs-surface) !important;
    border-bottom: 1px solid var(--chs-border) !important;
    color: var(--chs-text) !important;
}

/* Top bar */
.woomart-topbar,
.header-topbar,
.top-bar {
    background-color: var(--chs-surface) !important;
    border-bottom: 1px solid var(--chs-border) !important;
    color: var(--chs-text-muted) !important;
}

/* Sticky header */
.woomart-sticky-header,
.woomart-header.is-sticky,
.site-header.sticky-header {
    z-index: 99998 !important;
    top: var(--chs-bar-height, 60px) !important;
    background-color: var(--chs-surface) !important;
}

/* Nav links */
.main-navigation a,
.primary-navigation a,
.woomart-nav-menu > li > a,
.nav-menu > li > a,
.site-navigation a {
    color: var(--chs-text) !important;
}
.main-navigation a:hover,
.woomart-nav-menu > li > a:hover,
.woomart-nav-menu > li.current-menu-item > a {
    color: var(--chs-primary) !important;
}

/* Dropdown / Mega menu */
.sub-menu,
.dropdown-menu,
.woomart-mega-menu,
.woomart-dropdown {
    background-color: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.3) !important;
}
.sub-menu a,
.dropdown-menu a,
.woomart-mega-menu a {
    color: var(--chs-text) !important;
    border-bottom: 1px solid var(--chs-border) !important;
}
.sub-menu a:hover,
.dropdown-menu a:hover { color: var(--chs-primary) !important; background: var(--chs-bg) !important; }

/* Mobile menu */
.woomart-mobile-menu,
.mobile-nav,
#mobile-menu-wrap,
.woomart-offcanvas {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
}
.woomart-mobile-menu a,
.mobile-nav a { color: var(--chs-text) !important; border-bottom: 1px solid var(--chs-border) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §4  FOOTER
   ══════════════════════════════════════════════════════════════════════════ */
.site-footer,
#colophon,
.woomart-footer,
.footer-wrapper,
.footer-main {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text-muted) !important;
    border-top: 1px solid var(--chs-border) !important;
}
.footer-widgets,
.footer-widget-area,
.woomart-footer-widgets {
    background-color: var(--chs-surface) !important;
    border-bottom: 1px solid var(--chs-border) !important;
}
.footer-bottom,
.footer-bar,
.woomart-footer-bottom {
    background-color: var(--chs-bg) !important;
    border-top: 1px solid var(--chs-border) !important;
    color: var(--chs-text-muted) !important;
}
.site-footer a,
.woomart-footer a { color: var(--chs-link) !important; }
.site-footer h3,
.site-footer h4,
.footer-widgets h3,
.footer-widgets h4 { color: var(--chs-text) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §5  BREADCRUMBS & PAGINATION
   ══════════════════════════════════════════════════════════════════════════ */
.woocommerce-breadcrumb,
.breadcrumb,
.woomart-breadcrumb,
nav.woocommerce-breadcrumb {
    background: transparent !important;
    color: var(--chs-text-muted) !important;
}
.woocommerce-breadcrumb a,
.breadcrumb a { color: var(--chs-link) !important; }

.woocommerce-pagination ul,
.page-numbers,
nav.woocommerce-pagination {
    background: transparent !important;
}
.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span,
a.page-numbers,
span.page-numbers {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 6px;
}
.woocommerce-pagination ul li span.current,
span.page-numbers.current {
    background-color: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    border-color: var(--chs-primary) !important;
}
.woocommerce-pagination ul li a:hover,
a.page-numbers:hover {
    background-color: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    border-color: var(--chs-primary) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §6  BUTTONS
   ══════════════════════════════════════════════════════════════════════════ */
.button,
button:not(.chs-theme-trigger):not(.chs-panel-close):not(.search-submit),
input[type="submit"],
input[type="button"],
.btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
#place_order,
.wp-block-button__link,
.elementor-button,
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button,
.added_to_cart {
    background-color: var(--chs-btn-bg) !important;
    color: var(--chs-btn-text) !important;
    border-color: var(--chs-btn-bg) !important;
    transition: opacity .2s, transform .15s !important;
}
.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
#place_order:hover,
.wc-proceed-to-checkout a:hover {
    opacity: .88 !important;
    transform: translateY(-1px) !important;
}

/* Alt / outline buttons */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.checkout-button {
    background-color: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §7  FORMS & INPUTS
   ══════════════════════════════════════════════════════════════════════════ */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="date"],
textarea,
select,
.woocommerce-Input,
.wc-block-components-text-input input,
.wc-block-components-select select {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 6px !important;
}
input::placeholder,
textarea::placeholder { color: var(--chs-text-muted) !important; }
input:focus,
textarea:focus,
select:focus {
    border-color: var(--chs-primary) !important;
    box-shadow: 0 0 0 3px rgba(var(--chs-primary), .15) !important;
    outline: none !important;
}
label,
.woocommerce label,
.wc-block-components-form-step__description {
    color: var(--chs-text) !important;
}

/* Checkbox & Radio */
input[type="checkbox"],
input[type="radio"] { accent-color: var(--chs-primary) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §8  SIDEBAR & WIDGETS
   ══════════════════════════════════════════════════════════════════════════ */
#secondary,
.sidebar,
.widget-area,
aside.widget-area,
.woocommerce-sidebar,
.woomart-sidebar {
    background-color: transparent !important;
}
.widget,
.woocommerce-widget,
.wc-block-components-sidebar {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 8px;
    padding: 16px;
    margin-bottom: 16px;
}
.widget-title,
.widgettitle,
.widget .widget-title { color: var(--chs-text) !important; border-bottom: 2px solid var(--chs-primary) !important; }
.widget ul li { border-bottom: 1px solid var(--chs-border) !important; color: var(--chs-text) !important; }
.widget ul li a { color: var(--chs-link) !important; }
.widget ul li a:hover { color: var(--chs-primary) !important; }

/* Price filter widget */
.widget_price_filter .price_slider_wrapper .ui-widget-content,
.woocommerce-widget-layered-nav .woocommerce-widget-layered-nav-list {
    background: var(--chs-surface) !important;
}
.widget_price_filter .ui-slider .ui-slider-range { background: var(--chs-primary) !important; }
.widget_price_filter .ui-slider .ui-slider-handle { background: var(--chs-primary) !important; border-color: var(--chs-primary) !important; }

/* Layered nav */
.woocommerce-widget-layered-nav-list__item a { color: var(--chs-text) !important; }
.woocommerce-widget-layered-nav-list__item--chosen > a { color: var(--chs-primary) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §9  WOOCOMMERCE NOTICES
   ══════════════════════════════════════════════════════════════════════════ */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.wc-block-components-notice {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
    border-radius: 8px !important;
}
.woocommerce-message { border-top: 4px solid var(--chs-primary) !important; }
.woocommerce-info    { border-top: 4px solid var(--chs-accent) !important; }
.woocommerce-error   { border-top: 4px solid #ef4444 !important; }
.woocommerce-message a,
.woocommerce-info a { color: var(--chs-primary) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §10  SHOP ARCHIVE / PRODUCT GRID
   ══════════════════════════════════════════════════════════════════════════ */
.woocommerce-products-header,
.term-description,
.shop-header { color: var(--chs-text) !important; }

.woocommerce ul.products,
.wc-block-grid__products { background: transparent !important; }

/* Product card */
.woocommerce ul.products li.product,
.product-item,
.wc-block-grid__product,
.product-inner,
.product-wrapper {
    background-color: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    color: var(--chs-text) !important;
    transition: box-shadow .2s, transform .15s !important;
    overflow: hidden;
}
.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover {
    box-shadow: 0 8px 28px rgba(0,0,0,.2) !important;
    transform: translateY(-2px) !important;
    border-color: var(--chs-primary) !important;
}

/* Product title */
.woocommerce-loop-product__title,
.wc-block-grid__product-title,
.product-title {
    color: var(--chs-text) !important;
    font-weight: 700 !important;
}

/* Price */
.price,
.woocommerce-Price-amount,
ins .woocommerce-Price-amount,
.wc-block-grid__product-price {
    color: var(--chs-primary) !important;
}
del .woocommerce-Price-amount { color: var(--chs-text-muted) !important; opacity: .7; }

/* Sale badge */
.onsale,
.wc-block-grid__product-onsale {
    background-color: var(--chs-secondary) !important;
    color: #ffffff !important;
    border-radius: 4px !important;
}

/* Star ratings */
.star-rating span::before,
.wc-block-grid__product-rating .star-rating span::before { color: var(--chs-accent) !important; }
.star-rating::before { color: var(--chs-border) !important; }

/* Sorting / results */
.woocommerce-ordering select,
.woocommerce-result-count { color: var(--chs-text-muted) !important; }
.woocommerce-ordering select {
    background: var(--chs-surface) !important;
    border-color: var(--chs-border) !important;
    color: var(--chs-text) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §11  SINGLE PRODUCT
   ══════════════════════════════════════════════════════════════════════════ */
.single-product div.product,
.woocommerce div.product { color: var(--chs-text) !important; }

/* Gallery */
.woocommerce-product-gallery,
.woocommerce-product-gallery__wrapper,
.woocommerce-product-gallery__trigger {
    background: var(--chs-surface) !important;
    border-radius: 10px !important;
}
.woocommerce-product-gallery figure { border: 1px solid var(--chs-border) !important; }

/* Summary area */
.summary,
.entry-summary,
.woocommerce div.product .entry-summary {
    color: var(--chs-text) !important;
}
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--chs-primary) !important; font-size: 1.5em; }

/* Product meta */
.product_meta,
.woocommerce div.product .product_meta { color: var(--chs-text-muted) !important; }
.product_meta a { color: var(--chs-link) !important; }

/* Stock */
.in-stock  { color: var(--chs-primary) !important; }
.out-of-stock { color: #ef4444 !important; }

/* Quantity */
.quantity input.qty {
    background: var(--chs-surface) !important;
    border-color: var(--chs-border) !important;
    color: var(--chs-text) !important;
}

/* Product tabs */
.woocommerce-tabs,
.woocommerce div.product .woocommerce-tabs { background: transparent !important; }
.woocommerce-tabs ul.tabs {
    background: transparent !important;
    border-bottom: 2px solid var(--chs-border) !important;
}
.woocommerce-tabs ul.tabs li {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-bottom: none !important;
}
.woocommerce-tabs ul.tabs li a { color: var(--chs-text) !important; }
.woocommerce-tabs ul.tabs li.active {
    background: var(--chs-bg) !important;
    border-bottom: 2px solid var(--chs-primary) !important;
}
.woocommerce-tabs ul.tabs li.active a { color: var(--chs-primary) !important; }
.woocommerce-Tabs-panel,
.woocommerce-tabs .panel {
    background: var(--chs-bg) !important;
    color: var(--chs-text) !important;
    border: 1px solid var(--chs-border) !important;
    padding: 20px !important;
}

/* Reviews */
#reviews,
.woocommerce-Reviews { color: var(--chs-text) !important; }
.comment-list .comment,
#reviews .comment { border-bottom: 1px solid var(--chs-border) !important; }
.comment-list .comment .comment-text {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 8px !important;
    color: var(--chs-text) !important;
}
.woocommerce-review__author { color: var(--chs-text) !important; font-weight: 700; }
.woocommerce-review__dash,
.woocommerce-review__published-date { color: var(--chs-text-muted) !important; }
#review_form .comment-form { background: var(--chs-surface) !important; border-radius: 8px; padding: 16px; }

/* Related / Upsells */
.related.products h2,
.upsells.products h2,
.cross-sells h2 { color: var(--chs-text) !important; border-bottom: 2px solid var(--chs-primary) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §12  CART
   ══════════════════════════════════════════════════════════════════════════ */
.woocommerce-cart-form,
.cart-collaterals,
.woocommerce-cart .woocommerce { color: var(--chs-text) !important; }

/* Cart table */
table.shop_table,
table.woocommerce-cart-form__contents,
.wc-block-cart table {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    overflow: hidden;
    color: var(--chs-text) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
}
table.shop_table thead,
table.shop_table thead tr { background: var(--chs-bg) !important; }
table.shop_table thead th {
    color: var(--chs-text) !important;
    border-bottom: 2px solid var(--chs-border) !important;
    font-weight: 700 !important;
}
table.shop_table tbody tr { background: var(--chs-surface) !important; }
table.shop_table tbody tr:nth-child(even) { background: var(--chs-bg) !important; }
table.shop_table td {
    border-top: 1px solid var(--chs-border) !important;
    color: var(--chs-text) !important;
}
.product-name a { color: var(--chs-link) !important; }
.product-remove a { color: #ef4444 !important; }

/* Cart totals */
.cart_totals,
.wc-block-cart__totals {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    padding: 20px !important;
    color: var(--chs-text) !important;
}
.cart_totals h2 { color: var(--chs-text) !important; }
.cart_totals table { background: transparent !important; border: none !important; }
.cart_totals table th,
.cart_totals table td { border-top: 1px solid var(--chs-border) !important; color: var(--chs-text) !important; }
.order-total .woocommerce-Price-amount { color: var(--chs-primary) !important; font-size: 1.3em; font-weight: 800; }

/* Coupon */
.coupon input[type="text"] { background: var(--chs-bg) !important; border-color: var(--chs-border) !important; color: var(--chs-text) !important; }

/* Proceed to checkout */
.wc-proceed-to-checkout { background: transparent !important; }
.wc-proceed-to-checkout a.checkout-button {
    background: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
    font-size: 1.1em !important;
    padding: 14px 24px !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §13  CHECKOUT
   ══════════════════════════════════════════════════════════════════════════ */
.woocommerce-checkout,
.woocommerce-checkout .woocommerce { color: var(--chs-text) !important; }

/* Section headings */
.woocommerce-checkout h3,
#order_review_heading,
.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3 {
    color: var(--chs-text) !important;
    border-bottom: 2px solid var(--chs-primary) !important;
    padding-bottom: 8px;
}

/* Billing / Shipping fields */
#billing_fields,
#shipping_fields,
.woocommerce-billing-fields,
.woocommerce-shipping-fields,
.woocommerce-additional-fields {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    padding: 20px !important;
    color: var(--chs-text) !important;
}

/* Order review */
#order_review,
.woocommerce-checkout-review-order {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    padding: 20px !important;
}
#order_review table,
.shop_table.woocommerce-checkout-review-order-table {
    background: transparent !important;
    border: none !important;
}
#order_review table td,
#order_review table th { border-top: 1px solid var(--chs-border) !important; color: var(--chs-text) !important; }
#order_review .order-total td { color: var(--chs-primary) !important; font-weight: 800; font-size: 1.15em; }

/* Payment box */
#payment,
.woocommerce-checkout-payment,
.wc-block-components-checkout-step--payment {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    overflow: hidden;
}
.payment_methods { background: transparent !important; }
.payment_methods li,
.wc_payment_method {
    background: var(--chs-bg) !important;
    border-bottom: 1px solid var(--chs-border) !important;
    color: var(--chs-text) !important;
}
.payment_methods li label { color: var(--chs-text) !important; }
.payment_methods li:last-child { border-bottom: none !important; }
.payment_box { background: var(--chs-surface) !important; color: var(--chs-text-muted) !important; }

/* Place order */
#place_order {
    background: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    border-color: var(--chs-primary) !important;
    width: 100% !important;
    padding: 16px !important;
    font-size: 1.1em !important;
    font-weight: 800 !important;
    border-radius: 8px !important;
    letter-spacing: .5px;
}

/* ══════════════════════════════════════════════════════════════════════════
   §14  MY ACCOUNT — ALL PAGES
   ══════════════════════════════════════════════════════════════════════════ */
.woocommerce-account,
.woocommerce-account .woocommerce { color: var(--chs-text) !important; }
.woocommerce-account h2,
.woocommerce-account h3 { color: var(--chs-text) !important; }

/* Account navigation */
.woocommerce-MyAccount-navigation,
.wc-block-components-sidebar {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    overflow: hidden;
}
.woocommerce-MyAccount-navigation ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.woocommerce-MyAccount-navigation ul li {
    border-bottom: 1px solid var(--chs-border) !important;
    background: transparent !important;
}
.woocommerce-MyAccount-navigation ul li:last-child { border-bottom: none !important; }
.woocommerce-MyAccount-navigation ul li a {
    color: var(--chs-text) !important;
    display: block;
    padding: 12px 16px !important;
    transition: background .15s, color .15s;
}
.woocommerce-MyAccount-navigation ul li a:hover {
    background: var(--chs-bg) !important;
    color: var(--chs-primary) !important;
}
.woocommerce-MyAccount-navigation ul li.is-active a,
.woocommerce-MyAccount-navigation ul li.woocommerce-MyAccount-navigation-link--active a {
    background: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    font-weight: 700 !important;
}

/* Account content */
.woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-MyAccount-content {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    padding: 24px !important;
    color: var(--chs-text) !important;
}
.woocommerce-MyAccount-content p { color: var(--chs-text) !important; }
.woocommerce-MyAccount-content a { color: var(--chs-link) !important; }
.woocommerce-MyAccount-content strong { color: var(--chs-text) !important; }

/* Dashboard welcome */
.woocommerce-account .woocommerce-MyAccount-content p:first-child { color: var(--chs-text-muted) !important; }

/* Orders table */
.woocommerce-orders-table,
.woocommerce-table--order-details,
.woocommerce-MyAccount-content table {
    background: var(--chs-bg) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 8px !important;
    overflow: hidden;
    width: 100% !important;
}
.woocommerce-orders-table thead th,
.woocommerce-table thead th {
    background: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    border: none !important;
    padding: 12px 16px !important;
    font-weight: 700 !important;
}
.woocommerce-orders-table tbody tr,
.woocommerce-table tbody tr { background: var(--chs-surface) !important; }
.woocommerce-orders-table tbody tr:nth-child(even),
.woocommerce-table tbody tr:nth-child(even) { background: var(--chs-bg) !important; }
.woocommerce-orders-table tbody td,
.woocommerce-table tbody td {
    border-top: 1px solid var(--chs-border) !important;
    color: var(--chs-text) !important;
    padding: 12px 16px !important;
}
.woocommerce-orders-table__cell-order-status .woocommerce-order-status {
    color: var(--chs-primary) !important;
    font-weight: 700;
}

/* Order status badges */
.order-status,
mark.order-status {
    background: transparent !important;
    color: var(--chs-primary) !important;
    border: 1px solid var(--chs-primary) !important;
    border-radius: 20px !important;
    padding: 2px 10px !important;
    font-size: 12px !important;
}

/* Downloads table */
.woocommerce-table--order-downloads td,
.woocommerce-table--order-downloads th { color: var(--chs-text) !important; border-color: var(--chs-border) !important; }
.woocommerce-table--order-downloads a { color: var(--chs-primary) !important; }

/* Addresses */
.woocommerce-Addresses,
.woocommerce-Address,
.woocommerce-address-fields {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    padding: 20px !important;
    color: var(--chs-text) !important;
}
.woocommerce-Address-title h3 { color: var(--chs-text) !important; border-bottom: 1px solid var(--chs-border) !important; }
address { color: var(--chs-text-muted) !important; }

/* Account details form */
.woocommerce-EditAccountForm { color: var(--chs-text) !important; }
.woocommerce-EditAccountForm fieldset {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    padding: 16px !important;
}
.woocommerce-EditAccountForm fieldset legend { color: var(--chs-text) !important; font-weight: 700; }

/* ══════════════════════════════════════════════════════════════════════════
   §15  WPS WALLET
   ══════════════════════════════════════════════════════════════════════════ */
.wps-wallet-page,
.wps_wallet_page,
[class*="wps-wallet"],
[class*="wps_wallet"] {
    color: var(--chs-text) !important;
}
.wps-wallet-content,
.wps_wallet_content,
.wps-wallet-wrapper,
.wps-wallet-section {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 10px !important;
    padding: 20px !important;
    color: var(--chs-text) !important;
}
/* Wallet balance display */
.wps-wallet-balance,
.wps_wallet_balance,
.wps-wallet-amount-display {
    color: var(--chs-primary) !important;
    font-weight: 800 !important;
    font-size: 1.5em !important;
}
/* Transaction table */
.wps-wallet-transaction-table,
.wps_wallet_transaction_table,
table.wps-wallet-table {
    background: var(--chs-bg) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 8px !important;
    overflow: hidden;
    width: 100% !important;
}
.wps-wallet-transaction-table thead th,
table.wps-wallet-table thead th {
    background: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    border: none !important;
    padding: 12px !important;
    font-weight: 700 !important;
}
.wps-wallet-transaction-table tbody tr { background: var(--chs-surface) !important; }
.wps-wallet-transaction-table tbody tr:nth-child(even) { background: var(--chs-bg) !important; }
.wps-wallet-transaction-table tbody td {
    border-top: 1px solid var(--chs-border) !important;
    color: var(--chs-text) !important;
    padding: 12px !important;
}
/* Credit / Debit colors */
.wps-wallet-credit,
.wps_wallet_credit { color: var(--chs-primary) !important; font-weight: 700; }
.wps-wallet-debit,
.wps_wallet_debit  { color: #ef4444 !important; font-weight: 700; }

/* ══════════════════════════════════════════════════════════════════════════
   §16  STATIC PAGES (Privacy, T&C, About, etc.)
   ══════════════════════════════════════════════════════════════════════════ */
.entry-content,
.page-content,
.post-content,
.wp-content,
article.page,
article.post {
    color: var(--chs-text) !important;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 { color: var(--chs-text) !important; }
.entry-content a { color: var(--chs-link) !important; }
.entry-content blockquote {
    background: var(--chs-surface) !important;
    border-left: 4px solid var(--chs-primary) !important;
    color: var(--chs-text-muted) !important;
    padding: 16px 20px !important;
    border-radius: 0 8px 8px 0 !important;
}
.entry-content ul li,
.entry-content ol li { color: var(--chs-text) !important; }
.entry-content table {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 8px !important;
    overflow: hidden;
    width: 100%;
}
.entry-content table th {
    background: var(--chs-primary) !important;
    color: var(--chs-btn-text) !important;
    padding: 10px 14px !important;
}
.entry-content table td {
    border-top: 1px solid var(--chs-border) !important;
    color: var(--chs-text) !important;
    padding: 10px 14px !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §17  GENERIC TABLES
   ══════════════════════════════════════════════════════════════════════════ */
table:not(.chs-skip) {
    border-collapse: collapse;
    width: 100%;
}
table:not(.chs-skip) th {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
    border: 1px solid var(--chs-border) !important;
}
table:not(.chs-skip) td {
    color: var(--chs-text) !important;
    border: 1px solid var(--chs-border) !important;
}
table:not(.chs-skip) tr:nth-child(even) td { background-color: var(--chs-bg) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §18  THEME SWITCHER — TRIGGER BUTTON
   ══════════════════════════════════════════════════════════════════════════ */
.chs-theme-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: rgba(255,255,255,0.1);
    border: 1.5px solid rgba(255,255,255,0.28);
    border-radius: 50px;
    padding: 6px 9px;
    color: var(--chs-header-text, #fff) !important;
    cursor: pointer;
    white-space: nowrap;
    transition: background .2s, border-color .2s, transform .15s, box-shadow .2s;
    flex-shrink: 0;
    line-height: 1;
    box-shadow: 0 1px 6px rgba(0,0,0,.25);
}
.chs-theme-trigger:hover,
.chs-theme-trigger:focus-visible {
    background: rgba(255,255,255,0.2);
    border-color: rgba(255,255,255,0.5);
    outline: none;
    transform: translateY(-1px);
}
.chs-theme-trigger[aria-expanded="true"] {
    background: rgba(255,255,255,0.22);
    border-color: rgba(255,255,255,0.55);
}
.chs-caret { transition: transform .2s; flex-shrink: 0; opacity: .8; }
.chs-theme-trigger[aria-expanded="true"] .chs-caret { transform: rotate(180deg); }

/* ══════════════════════════════════════════════════════════════════════════
   §19  THEME PANEL — beats every mobile menu (max z-index)
   ══════════════════════════════════════════════════════════════════════════ */
.chs-theme-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 2147483645;
    background: rgba(0,0,0,.35);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}
.chs-theme-overlay--visible { display: block; animation: chs-fade-in .2s ease; }

.chs-theme-panel {
    position: fixed;
    top: var(--chs-bar-height, 60px);
    right: 8px;
    left: auto;
    z-index: 2147483646;
    width: 310px;
    max-width: calc(100vw - 16px);
    background: #13121e;
    border: 1px solid rgba(255,255,255,.12);
    border-top: 2px solid var(--chs-primary, #7C3AED);
    border-radius: 14px 0 14px 14px;
    box-shadow: 0 24px 64px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.06);
    transform: translateY(-8px) scale(0.97);
    opacity: 0;
    pointer-events: none;
    transition: transform .22s cubic-bezier(.34,1.56,.64,1), opacity .18s ease;
    overflow: hidden;
}
.chs-theme-panel--open { transform: translateY(0) scale(1); opacity: 1; pointer-events: auto; }
.chs-theme-panel__inner { padding: 14px; }
.chs-theme-panel__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.chs-theme-panel__title { font-size: 12px; font-weight: 700; color: #e0d8ff; letter-spacing: .5px; text-transform: uppercase; }
.chs-panel-close {
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.1);
    color: #888;
    width: 24px; height: 24px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 11px;
    display: flex; align-items: center; justify-content: center;
    padding: 0; line-height: 1;
    transition: background .15s, color .15s;
}
.chs-panel-close:hover { background: rgba(255,255,255,.15); color: #fff; }
.chs-theme-panel__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; }
.chs-theme-panel__note { text-align: center; font-size: 11px; color: #666; margin: 12px 0 0; }

/* Swatches */
.chs-swatch {
    position: relative; cursor: pointer; border-radius: 10px; overflow: hidden;
    border: 2px solid rgba(255,255,255,.07); background: var(--sw-bg,#111); padding: 0;
    transition: border-color .2s, transform .15s, box-shadow .2s; text-align: left;
}
.chs-swatch:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.55); border-color: rgba(255,255,255,.2); }
.chs-swatch:focus-visible { outline: 2px solid var(--sw-primary,#7C3AED); outline-offset: 2px; }
.chs-swatch--active { border-color: var(--sw-primary,#7C3AED) !important; box-shadow: 0 0 0 1px var(--sw-primary,#7C3AED), 0 4px 14px rgba(0,0,0,.45); }
.chs-swatch--chosen { transform: scale(0.92); }
.chs-swatch__preview { display: block; height: 48px; background: var(--sw-bg,#111); overflow: hidden; }
.chs-swatch__bar { display: block; height: 12px; background: var(--sw-primary,#7C3AED); }
.chs-swatch__body { display: flex; flex-direction: column; gap: 3px; padding: 4px; background: var(--sw-bg,#111); }
.chs-swatch__line { display: block; height: 3px; border-radius: 2px; }
.chs-swatch__line--a { width: 80%; background: var(--sw-accent,#ccc); opacity: .65; }
.chs-swatch__line--b { width: 50%; background: var(--sw-accent,#ccc); opacity: .3; }
.chs-swatch__btn { display: block; height: 5px; width: 24px; border-radius: 3px; background: var(--sw-primary,#7C3AED); margin-top: 2px; }
.chs-swatch__label { display: block; padding: 5px 4px 6px; font-size: 10px; font-weight: 600; color: #c8c0e8; line-height: 1.25; text-align: center; background: var(--sw-bg,#111); border-top: 1px solid rgba(255,255,255,.06); }
.chs-swatch__check { position: absolute; top: 3px; right: 3px; color: var(--sw-primary,#7C3AED); opacity: 0; transition: opacity .2s; filter: drop-shadow(0 1px 3px rgba(0,0,0,.8)); }
.chs-swatch--active .chs-swatch__check { opacity: 1; }

/* ══════════════════════════════════════════════════════════════════════════
   §20  RESPONSIVE
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
    #chs-header-bar { padding: 0 10px; gap: 6px; }
    .chs-zone--left  { flex: 0.7; }
    .chs-zone--right { flex: 0.7; }
    .chs-site-name { letter-spacing: 1px; font-size: 13px; }
    .chs-wallet-badge { padding: 4px 10px 4px 8px; font-size: 12px; gap: 5px; }
    .chs-wallet-icon svg { width: 15px; height: 15px; }
    .chs-theme-panel__grid { grid-template-columns: repeat(4,1fr); }
}
@media (max-width: 400px) {
    .chs-theme-panel__grid { grid-template-columns: repeat(3,1fr); }
    .chs-logo-img { max-width: 110px; }
}

/* Animations */
@keyframes chs-fade-in { from { opacity: 0; } to { opacity: 1; } }

/* WooMart sticky pushed down below our bar */
.woomart-sticky-header,
.woomart-header.is-sticky,
.site-header.sticky-header {
    z-index: 99998 !important;
    top: var(--chs-bar-height, 60px) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §21  WOOMART PAGE TITLE / HERO BANNER  (Issue #1)
   ══════════════════════════════════════════════════════════════════════════ */
.woomart-page-title,
.page-title-bar,
.page-title-wrap,
.page-header,
.woomart-page-header,
.page-hero,
.hero-section,
.page-banner,
.entry-header,
.shop-page-title,
.woocommerce-products-header,
.term-description-header,
.archive-header,
.woomart-archive-header,
.site-page-header,
.page-title-section {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
    border-bottom: 1px solid var(--chs-border) !important;
}
.woomart-page-title h1,
.page-title-bar h1,
.page-header h1,
.entry-header h1,
.page-title-section h1,
.woomart-page-title .page-title,
.page-header .page-title {
    color: var(--chs-text) !important;
}

/* ── Section label strip (MY ACCOUNT, SHOP etc.) ── */
.woomart-section-label,
.section-title-wrap,
.woocommerce-account > h2,
.woocommerce-account .page-title,
.woomart-section-header,
#woocommerce-account-section-title,
.account-section-heading {
    background-color: var(--chs-surface) !important;
    color: var(--chs-text) !important;
    border-bottom: 2px solid var(--chs-primary) !important;
    padding: 10px 16px !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §22  WOOMART MOBILE BOTTOM NAVIGATION  (Issue #3)
   ══════════════════════════════════════════════════════════════════════════ */
.woomart-mobile-nav,
.woomart-sticky-bottom,
.woomart-bottom-bar,
.woomart-bottom-navigation,
.mobile-bottom-nav,
.site-mobile-footer,
.mobile-footer-nav,
.woomart-mobile-bottom,
#woomart-mobile-nav,
.mobile-nav-bar,
.sticky-mobile-nav,
.woomart-app-nav,
[class*="mobile-bottom"],
[class*="bottom-nav"] {
    background-color: var(--chs-surface) !important;
    border-top: 1px solid var(--chs-border) !important;
}
.woomart-mobile-nav a,
.mobile-bottom-nav a,
.woomart-bottom-bar a,
[class*="bottom-nav"] a {
    color: var(--chs-text-muted) !important;
}
.woomart-mobile-nav a.active,
.woomart-mobile-nav a:hover,
.mobile-bottom-nav a.active,
.mobile-bottom-nav .active,
[class*="bottom-nav"] .active {
    color: var(--chs-primary) !important;
}
.woomart-mobile-nav svg,
.mobile-bottom-nav svg,
[class*="bottom-nav"] svg {
    fill: currentColor !important;
    color: inherit !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §23  FLASH SALE PRO  (Issue #5)
   Bridge --wcfs-* vars → --chs-* so theme switch auto-updates everything
   ══════════════════════════════════════════════════════════════════════════ */
#wcfs-root {
    --wcfs-accent:    var(--chs-primary)   !important;
    --wcfs-bg:        var(--chs-surface)   !important;
    --wcfs-text:      var(--chs-text)      !important;
    --wcfs-badge-bg:  var(--chs-primary)   !important;
    --wcfs-badge-txt: var(--chs-btn-text)  !important;
}
.wcfs-header-block {
    background: var(--chs-surface) !important;
    border-bottom: 1px solid var(--chs-border) !important;
    border-radius: 12px 12px 0 0 !important;
}
.wcfs-sale-title    { color: var(--chs-text) !important; }
.wcfs-sale-subtitle { color: var(--chs-text-muted) !important; }

.wcfs-cd-unit {
    background:   var(--chs-bg)     !important;
    border-color: var(--chs-border) !important;
}
.wcfs-cd-num   { color: var(--chs-primary)    !important; }
.wcfs-cd-label { color: var(--chs-text-muted) !important; }

.wcfs-marquee-wrapper {
    background:   var(--chs-surface) !important;
    border-color: var(--chs-border)  !important;
}
.wcfs-marquee-name  { color: var(--chs-text)      !important; }
.wcfs-marquee-price { color: var(--chs-primary)   !important; }
.wcfs-marquee-price del { color: var(--chs-text-muted) !important; }
.wcfs-marquee-badge {
    background: var(--chs-primary)  !important;
    color:      var(--chs-btn-text) !important;
}
.wcfs-marquee-sep { color: var(--chs-border) !important; }
.wcfs-marquee-img { border-color: var(--chs-border) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §24  LIVE PURCHASE FEED PRO  (Issue #6)
   Uses dynamic #lpf-XXXX IDs — target with attribute selector + !important
   ══════════════════════════════════════════════════════════════════════════ */
[id^="lpf-"] {
    background: var(--chs-surface) !important;
    border-radius: var(--chs-radius, 12px);
}
[id^="lpf-"] .lpf-head {
    background:    var(--chs-surface) !important;
    border-bottom: 1px solid var(--chs-border) !important;
    padding: 10px 14px !important;
}
[id^="lpf-"] .lpf-title { color: var(--chs-text) !important; font-weight: 700 !important; }
[id^="lpf-"] .lpf-live  { color: var(--chs-primary) !important; }
[id^="lpf-"] .lpf-dot   { background: var(--chs-primary) !important; box-shadow: 0 0 6px var(--chs-primary) !important; }
[id^="lpf-"] .lpf-row {
    background:    var(--chs-surface) !important;
    border-bottom: 1px solid var(--chs-border) !important;
}
[id^="lpf-"] .lpf-row:nth-child(even) { background: var(--chs-bg) !important; }
[id^="lpf-"] .lpf-name  { color: var(--chs-text)       !important; }
[id^="lpf-"] .lpf-meta  { color: var(--chs-text-muted) !important; }
[id^="lpf-"] .lpf-price { color: var(--chs-primary)    !important; }
[id^="lpf-"] .lpf-icon  { background: color-mix(in srgb, var(--chs-primary) 15%, transparent) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §25  LIANA STORE — ACCOUNT VERIFICATION  (Issue #7)
   ══════════════════════════════════════════════════════════════════════════ */
.liana-verification-section {
    background: var(--chs-surface) !important;
    border:     1px solid var(--chs-border) !important;
    color:      var(--chs-text) !important;
    border-radius: 10px !important;
}
.liana-verification-section h3 { color: var(--chs-primary) !important; }
.liana-field label { color: var(--chs-text) !important; font-weight: 600 !important; }
.liana-field input {
    background:   var(--chs-bg)     !important;
    border-color: var(--chs-border) !important;
    color:        var(--chs-text)   !important;
    border-radius: 6px !important;
}
.liana-field input:focus { border-color: var(--chs-primary) !important; }

.liana-verify-btn {
    background:   var(--chs-primary)  !important;
    border-color: var(--chs-primary)  !important;
    color:        var(--chs-btn-text) !important;
    border-radius: 8px !important;
    font-weight: 700 !important;
}
.liana-verify-btn:hover { opacity: .88 !important; transform: translateY(-1px) !important; }

.liana-result { border-radius: 8px !important; }
.liana-success {
    background:   color-mix(in srgb, var(--chs-primary) 12%, transparent) !important;
    border-color: color-mix(in srgb, var(--chs-primary) 35%, transparent) !important;
    color:        var(--chs-text) !important;
}
.liana-error {
    background:   rgba(239,68,68,.12) !important;
    border-color: rgba(239,68,68,.3)  !important;
    color:        var(--chs-text)     !important;
}
.liana-verified-ign  { color: var(--chs-primary) !important; }
.liana-verified-details {
    background:        var(--chs-bg)       !important;
    border-left-color: var(--chs-primary)  !important;
    border-radius: 4px !important;
}

/* Liana popup */
.liana-popup-overlay  { z-index: 2147483644 !important; }
.liana-popup-container {
    background: var(--chs-surface) !important;
    color:      var(--chs-text)    !important;
    border: 1px solid var(--chs-border) !important;
}
.liana-popup-header h2,
.liana-popup-header h3,
.liana-verified-ign-large { color: var(--chs-text) !important; }
.liana-verified-badge {
    background: var(--chs-primary)  !important;
    color:      var(--chs-btn-text) !important;
}
.liana-popup-details {
    background:        var(--chs-bg)      !important;
    border-left-color: var(--chs-primary) !important;
}
.liana-popup-details p,
.liana-popup-details strong { color: var(--chs-text) !important; }
.liana-popup-btn-continue {
    background: var(--chs-primary)  !important;
    color:      var(--chs-btn-text) !important;
    border-color: var(--chs-primary) !important;
}
.liana-popup-btn-cancel {
    background:   var(--chs-surface)   !important;
    color:        var(--chs-text-muted)!important;
    border-color: var(--chs-border)    !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §26  WOOVR GAME PACK CARDS  (Issue #8)
   Replaces the wp_head CSS snippet — fully theme-aware
   ══════════════════════════════════════════════════════════════════════════ */
.woovr-variations[class*="woovr-variations-grid"] {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0,1fr)) !important;
    gap: 6px !important;
    padding: 6px !important;
}
@media (min-width: 768px) {
    .woovr-variations[class*="woovr-variations-grid"] {
        grid-template-columns: repeat(4, minmax(0,1fr)) !important;
    }
}
@media (min-width: 1100px) {
    .woovr-variations[class*="woovr-variations-grid"] {
        grid-template-columns: repeat(5, minmax(0,1fr)) !important;
    }
}

.woovr-variation {
    width: 100% !important;
    margin: 0 !important;
    max-width: none !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    background:    var(--chs-surface) !important;
    border:        1px solid var(--chs-border) !important;
    border-radius: 14px !important;
    padding:       14px 8px !important;
    aspect-ratio:  1 / 1.25;
    box-sizing:    border-box;
    transition:    .25s ease;
}
.woovr-variation:hover {
    transform:    translateY(-2px) !important;
    border-color: var(--chs-primary) !important;
    box-shadow:   0 4px 16px rgba(0,0,0,.25) !important;
}
.woovr-variation.woovr-variation-active {
    border-color: var(--chs-primary) !important;
    box-shadow:
        0 0 0 2px color-mix(in srgb, var(--chs-primary) 40%, transparent),
        0 0 20px color-mix(in srgb, var(--chs-primary) 25%, transparent) !important;
}

.woovr-variation img {
    width:       42px !important;
    height:      42px !important;
    object-fit:  contain;
    margin:      0 auto;
    filter:      drop-shadow(0 0 10px color-mix(in srgb, var(--chs-primary) 70%, transparent));
}

.woovr-variation-name {
    font-size:   13px !important;
    font-weight: 600 !important;
    color:       var(--chs-text) !important;
    text-align:  center;
}
.woovr-variation .price,
.woovr-variation .woocommerce-Price-amount {
    font-size:   15px !important;
    font-weight: 800 !important;
    color:       var(--chs-accent) !important;
}
.woovr-variation.woovr-variation-active .price,
.woovr-variation.woovr-variation-active .woocommerce-Price-amount {
    color: var(--chs-primary) !important;
}
.woovr-variation-description {
    font-size: 10px !important;
    color:     var(--chs-text-muted) !important;
}

/* Discount badge */
.tpkg-discount {
    font-size:   10px;
    font-weight: 700;
    color:        #ef4444;
    background:   rgba(239,68,68,.15);
    padding:      4px 8px;
    border-radius: 6px;
}

/* Summary bar */
#tpkg-summary {
    margin:        12px 6px;
    padding:       14px;
    border-radius: 12px;
    background:    var(--chs-bg)     !important;
    border:        1px solid var(--chs-border) !important;
    display:       none;
    flex-direction: column;
    gap:           4px;
}
#tpkg-summary.show      { display: flex; }
#tpkg-summary-name      { color: var(--chs-text)    !important; font-weight: 700; font-size: 14px; }
#tpkg-summary-price     { color: var(--chs-primary) !important; font-weight: 800; font-size: 18px; }

@media (max-width: 480px) {
    .woovr-variations[class*="woovr-variations-grid"] { gap: 5px !important; }
    .woovr-variation { padding: 12px 6px !important; }
    .woovr-variation img { width: 42px !important; height: 42px !important; }
    .woovr-variation-name { font-size: 12px !important; }
    .woovr-variation .price { font-size: 14px !important; }
}

/* ══════════════════════════════════════════════════════════════════════════
   §27  LOGIN PAGE  (Issue #9)
   ══════════════════════════════════════════════════════════════════════════ */
/* Black strip between page title and login form */
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account:not(.logged-in) .woocommerce > .woocommerce-notices-wrapper + *,
.woocommerce-account .u-column1,
.woocommerce-account .u-column2,
.woocommerce-page .col2-set,
.login-page-wrap,
.woocommerce-form-row {
    background: var(--chs-bg) !important;
    color: var(--chs-text) !important;
}
/* Form container */
.woocommerce-form-login,
.woocommerce-form-register,
.woocommerce-ResetPassword,
form.login,
form.register {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 12px !important;
    padding: 28px !important;
    color: var(--chs-text) !important;
}
.woocommerce-form-login label,
.woocommerce-form-register label,
form.login label { color: var(--chs-text) !important; }

/* "OR LOGIN WITH" divider */
.woocommerce-form-login .woocommerce-privacy-policy-text,
.woocommerce-account .woocommerce > p,
.woocommerce-account p { color: var(--chs-text-muted) !important; }

/* Lost password / links */
.woocommerce-LostPassword a,
.woocommerce-form-login a { color: var(--chs-link) !important; }

/* Google / Social login buttons */
.woocommerce-account .button.google-login-button,
[class*="google-login"],
[class*="social-login"],
.wpgsi-button,
.woocommerce-account .woocommerce-form-row .button {
    border-radius: 8px !important;
    font-weight: 700 !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §28  ELEMENTOR — PRODUCT PAGE SECTIONS  (Issue #10)
   ══════════════════════════════════════════════════════════════════════════ */
.single-product .elementor-section,
.single-product .e-con,
.single-product .e-container {
    background-color: var(--chs-bg) !important;
}
.single-product .elementor-widget-wrap,
.single-product .elementor-column-wrap {
    background-color: transparent !important;
}
/* Product image widget */
.single-product .elementor-widget-image .elementor-widget-container,
.single-product .elementor-widget-woocommerce-product-images .elementor-widget-container {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 12px !important;
    overflow: hidden;
}
/* Social icons widget */
.single-product .elementor-widget-social-icons .elementor-widget-container,
.elementor-social-icons-wrapper {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 12px !important;
    padding: 12px !important;
}
.elementor-social-icon {
    background: var(--chs-bg) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 50% !important;
    transition: border-color .2s, transform .15s !important;
}
.elementor-social-icon:hover {
    border-color: var(--chs-primary) !important;
    transform: translateY(-2px) !important;
}
/* Text sections with white bg */
.single-product .elementor-text-editor,
.single-product .elementor-widget-text-editor .elementor-widget-container {
    color: var(--chs-text) !important;
    background: transparent !important;
}
/* "One time purchase" info banner */
.single-product .elementor-widget-heading .elementor-heading-title,
.single-product h2.elementor-heading-title,
.single-product h3.elementor-heading-title {
    color: var(--chs-text) !important;
}
.single-product .elementor-widget-image-box .elementor-image-box-content {
    background: var(--chs-surface) !important;
    color: var(--chs-text) !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   §29  PREMIUM SIDEBAR MENU  (Issue #13)
   Bridge --psm3-* to --chs-* vars. Footer injection handles the rest.
   ══════════════════════════════════════════════════════════════════════════ */
.psm3-trigger {
    background: var(--chs-surface) !important;
    border: 1px solid var(--chs-border) !important;
    border-radius: 12px !important;
}
.psm3-sidebar {
    background: var(--chs-surface) !important;
    border-right: 1px solid var(--chs-border) !important;
}
.psm3-overlay { background: rgba(0,0,0,.5) !important; }
.psm3-nav-link { color: var(--chs-text) !important; }
.psm3-nav-link:hover {
    color: var(--chs-primary) !important;
    background: var(--chs-bg) !important;
    border-color: var(--chs-border) !important;
}
.psm3-feat-btn {
    background: var(--chs-bg) !important;
    border-color: var(--chs-border) !important;
    color: var(--chs-text) !important;
}
.psm3-greeting { color: var(--chs-text-muted) !important; }
.psm3-username { color: var(--chs-text) !important; font-weight: 800 !important; }
.psm3-footer { color: var(--chs-text-muted) !important; border-top-color: var(--chs-border) !important; }
.psm3-user-hd { border-bottom-color: var(--chs-border) !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §30  THEME TRIGGER — CIRCULAR  (Issue #11)
   ══════════════════════════════════════════════════════════════════════════ */
.chs-theme-trigger {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: rgba(255,255,255,0.12) !important;
    border: 1.5px solid rgba(255,255,255,0.28) !important;
    color: var(--chs-header-text, #fff) !important;
    cursor: pointer;
    flex-shrink: 0;
    transition: background .2s, border-color .2s, transform .15s, box-shadow .2s;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
}
.chs-theme-trigger:hover,
.chs-theme-trigger:focus-visible {
    background: rgba(255,255,255,0.22) !important;
    border-color: rgba(255,255,255,0.5) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,.3);
    outline: none;
}
.chs-theme-trigger[aria-expanded="true"] {
    background: rgba(255,255,255,0.25) !important;
    border-color: rgba(255,255,255,0.6) !important;
    box-shadow: 0 0 0 3px rgba(255,255,255,0.1);
}
/* Remove old caret styles */
.chs-caret { display: none !important; }

/* ══════════════════════════════════════════════════════════════════════════
   §31  THEME PANEL — VERTICAL LIST  (Issue #12)
   ══════════════════════════════════════════════════════════════════════════ */
.chs-theme-panel {
    position: fixed;
    top: calc(var(--chs-bar-height, 60px) + 8px);
    right: 8px;
    left: auto;
    z-index: 2147483646;
    width: 260px;
    max-width: calc(100vw - 16px);
    background: #13121e;
    border: 1.5px solid rgba(255,255,255,0.14);
    border-radius: 16px;
    box-shadow:
        0 0 0 1px rgba(255,255,255,0.04),
        0 24px 64px rgba(0,0,0,0.75),
        0 8px 24px rgba(0,0,0,0.4);
    transform: translateY(-6px) scale(0.97);
    opacity: 0;
    pointer-events: none;
    transition: transform .22s cubic-bezier(.34,1.56,.64,1), opacity .18s ease;
    overflow: hidden;
}
.chs-theme-panel--open {
    transform: translateY(0) scale(1);
    opacity: 1;
    pointer-events: auto;
}
.chs-theme-panel__inner { padding: 14px; }
.chs-theme-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.chs-theme-panel__title {
    font-size: 11px;
    font-weight: 800;
    color: rgba(255,255,255,0.6);
    letter-spacing: 1px;
    text-transform: uppercase;
}
.chs-panel-close {
    background: rgba(255,255,255,0.07);
    border: 1px solid rgba(255,255,255,0.1);
    color: #888;
    width: 22px; height: 22px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 10px;
    display: flex; align-items: center; justify-content: center;
    padding: 0; line-height: 1;
    transition: background .15s, color .15s;
}
.chs-panel-close:hover { background: rgba(255,255,255,0.15); color: #fff; }

/* Vertical theme list */
.chs-theme-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.chs-theme-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 9px 12px;
    border-radius: 10px;
    border: 1.5px solid rgba(255,255,255,0.06);
    background: rgba(255,255,255,0.03);
    cursor: pointer;
    transition: background .18s, border-color .18s, transform .12s;
    width: 100%;
    text-align: left;
    color: #e0d8ff;
    box-sizing: border-box;
}
.chs-theme-row:hover {
    background: rgba(255,255,255,0.07);
    border-color: rgba(255,255,255,0.14);
    transform: translateX(2px);
}
.chs-theme-row:focus-visible { outline: 2px solid var(--sw-primary,#7C3AED); outline-offset: 2px; }
.chs-theme-row--active {
    border-color: var(--sw-primary, #7C3AED) !important;
    background: color-mix(in srgb, var(--sw-primary, #7C3AED) 14%, transparent) !important;
}
/* Color swatch circle */
.chs-theme-row__swatch {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--sw-bg, #111) 0%, var(--sw-primary, #7C3AED) 100%);
    flex-shrink: 0;
    border: 1.5px solid rgba(255,255,255,0.14);
    box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
/* Theme name */
.chs-theme-row__name {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    color: #e0d8ff;
    line-height: 1.2;
}
/* Active checkmark */
.chs-theme-row__check {
    color: var(--sw-primary, #7C3AED);
    opacity: 0;
    transition: opacity .2s;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}
.chs-theme-row--active .chs-theme-row__check { opacity: 1; }

.chs-theme-panel__note {
    text-align: center;
    font-size: 11px;
    color: rgba(255,255,255,0.3);
    margin: 10px 0 0;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.06);
}
