/**
 * Single Product Page - Premium Styles
 * 
 * Shopify-level design for WooCommerce
 * Universal for ANY e-commerce business
 * 
 * @package TaatiStudio
 * @since 1.0.1
 */

.ts-atc-wrap { display:flex; flex-direction:column; gap:0.75rem; margin-top:1rem; }
.ts-atc-wrap .ts-qty-atc, .ts-qty-atc { display:flex; align-items:stretch; gap:0.75rem; }
.ts-qty, .ts-qty-controls, .ts-qty-atc .quantity { display:inline-flex; align-items:center; gap:0.25rem; padding:0 0.25rem; border:1px solid var(--ts-border, #e5e7eb); border-radius:999px; background:#fff; height:42px; }
.ts-qty-display { min-width:1.5rem; text-align:center; font-variant-numeric:tabular-nums; }
.ts-qty-btn, .ts-qty-button { appearance:none; -webkit-appearance:none; width:40px; height:40px; border:0; border-radius:999px; background:transparent; color:#111827; line-height:1; font-size:1rem; cursor:pointer; display:inline-flex !important; align-items:center; justify-content:center; opacity:1 !important; visibility:visible !important; }
.ts-qty-btn:hover, .ts-qty-button:hover { background:#0e172a; color:#fff; }
.ts-qty-btn:focus-visible, .ts-qty-button:focus-visible { outline:2px solid var(--ts-accent-gold); outline-offset:2px; }
.ts-qty-atc .quantity .ts-qty-button, .ts-qty-atc .quantity .ts-qty-btn { display:inline-flex !important; }
.ts-qty-atc .quantity .input-text.qty, .ts-qty-atc .quantity input.qty { height:40px; line-height:40px; border:0; box-shadow:none; padding:0 0.5rem; width:3.2rem; text-align:center; }
.ts-qty-atc .quantity label.screen-reader-text { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap; }
.ts-atc-btn-slot .single_add_to_cart_button, .ts-qty-atc .single_add_to_cart_button { height:42px; padding:0 1.1rem; border-radius:999px; }
/* ATC icon override: remove white circular background inside primary CTA */
.ts-qty-atc .single_add_to_cart_button .ts-btn-icon,
.single_add_to_cart_button .ts-btn-icon { background: transparent !important; border: 0 !important; width: auto; height: auto; border-radius: 0; padding: 0; display: inline-flex; align-items: center; justify-content: center; margin-left: .5rem; }
.single_add_to_cart_button .ts-btn-icon svg { display:block; }
.single_add_to_cart_button.ts-btn.ts-btn-primary { color:#fff; }

/* Remove extra top margin from Woo default cart form inside premium ATC block */
.ts-premium-atc-block form.cart,
.ts-premium-atc-block .cart { margin-top: 0; }
.ts-preorder-toggle { align-self:flex-start; font-size:0.9rem; }
/* ==========================================================================
   ROOT VARIABLES - Taati Studio Design System
.ts-product-rating { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; margin-top:0.5rem; }
.ts-product-rating .star-rating span { text-indent:-999em; overflow:hidden; }
.ts-product-rating .star-rating span:before { text-indent:0; }
.ts-rating-compact { display:flex; align-items:center; gap:0.5rem; color:var(--ts-muted, #6b7280); }
.ts-rating-sep { color:var(--ts-muted, #9ca3af); }
   ========================================================================== */

.ts-microcopy { display:flex; flex-wrap:wrap; gap:0.5rem 0.75rem; margin-top:0.75rem; color:#374151; }
.ts-microcopy > span { line-height:1.4; }
.ts-micro-social { margin-top:0.4rem; display:flex; gap:0.75rem; color:#6b7280; font-size:0.95rem; }
/* Inline meta row styling */
.ts-meta-inline { display:flex; flex-wrap:wrap; gap:0.75rem 1rem; align-items:baseline; margin-top:0.75rem; font-size:0.95rem; line-height:1.4; }
.ts-meta-inline .ts-meta-label { color:#6b7280; margin-right:0.25rem; }
:root {
    /* Colors - Warm, elegant palette */
.ts-modal-type-size-guide + .ts-modal-backdrop, .ts-modal-root .ts-modal-backdrop { backdrop-filter:none; background:rgba(20,20,25,0.55); }
    --ts-bg-primary: #F6F3EE;
    --ts-bg-secondary: #E3DED6;
    --ts-bg-card: #FFFFFF;
    --ts-text-primary: #1B1B1A;
    --ts-text-secondary: #8D8D8D;
    --ts-text-muted: #C3A46A;
    --ts-accent-primary: #141433;
    --ts-accent-secondary: #A3583B;
    --ts-accent-gold: #C3A46A;
    --ts-border-light: rgba(195, 164, 106, 0.3);
    --ts-border-medium: rgba(195, 164, 106, 0.6);
    
    /* Typography */
    --ts-font-serif: 'Playfair Display', Georgia, serif;
    --ts-font-sans: 'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --ts-font-mono: 'SF Mono', 'Monaco', 'Inconsolata', monospace;
    
    /* Spacing */
    --ts-spacing-xs: 0.5rem;
    --ts-spacing-sm: 1rem;
    --ts-spacing-md: 1.5rem;
    --ts-spacing-lg: 2rem;
    --ts-spacing-xl: 3rem;
    --ts-spacing-2xl: 4rem;
    
    /* Border radius */
    --ts-radius-sm: 0.5rem;
    --ts-radius-md: 0.75rem;
    --ts-radius-lg: 1rem;
    --ts-radius-xl: 1.5rem;
    --ts-radius-full: 9999px;
    
    /* Shadows */
    --ts-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --ts-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --ts-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --ts-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    
    /* Transitions */
    --ts-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   PDP TRUST / SHARE / ETA ROWS (Buy Box Enhancements)
   ========================================================================== */

.ts-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    margin-top: 0.5rem;
    font-size: 0.62rem;
    line-height: 1.2;
    color: var(--ts-text-secondary);
}

.ts-trust-pill {
    padding: 0.35rem 0.7rem;
    border-radius: var(--ts-radius-full);
    background: rgba(195,164,106,0.18);
    backdrop-filter: blur(6px);
    border: 1px solid rgba(195,164,106,0.35);
    font-weight: 500;
    letter-spacing: 0.04em;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transition: var(--ts-transition);
}

.ts-trust-pill:hover { background: rgba(195,164,106,0.28); }
.ts-trust-pill:focus-visible { outline: 2px solid var(--ts-accent-gold); outline-offset: 2px; }

.ts-share-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 0.65rem;
    font-size: 0.62rem;
    letter-spacing: 0.05em;
}

.ts-share-row .ts-share {
    text-decoration: none;
    padding: 0.4rem 0.75rem;
    border-radius: var(--ts-radius-full);
    background: var(--ts-bg-secondary);
    color: var(--ts-text-primary);
    border: 1px solid var(--ts-border-light);
    transition: var(--ts-transition);
}

.ts-share-row .ts-share:hover { background: var(--ts-bg-card); }
.ts-share-row .ts-share:focus-visible { outline: 2px solid var(--ts-accent-primary); outline-offset: 2px; }

.ts-shipping-eta {
    margin-top: 0.55rem;
    font-size: 0.66rem;
    font-weight: 500;
    color: var(--ts-accent-primary);
    letter-spacing: 0.03em;
}

/* ==========================================================================
   STICKY MINI BUY BAR (Mobile)
   ========================================================================== */

.ts-mini-bar {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.55rem 0.85rem;
    background: rgba(246,243,238,0.96);
    backdrop-filter: blur(16px);
    border-top: 1px solid var(--ts-border-light);
    box-shadow: 0 -10px 30px rgba(0,0,0,0.12);
    font-size: 0.72rem;
    z-index: 60;
    transform: translateY(0);
    transition: transform .35s cubic-bezier(.4,0,.2,1);
}

.ts-mini-bar[data-hidden] { transform: translateY(100%); }

.ts-mini-bar-title {
    flex: 1;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ts-mini-bar-price {
    font-weight: 600;
    color: var(--ts-accent-primary);
}

.ts-mini-btn {
    padding: 0.55rem 1rem;
    border-radius: var(--ts-radius-full);
    background: var(--ts-accent-primary);
    color: var(--ts-bg-primary);
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    border: 1px solid var(--ts-accent-primary);
    cursor: pointer;
    transition: var(--ts-transition);
}

.ts-mini-btn:hover { background: #1f1f4a; }
.ts-mini-btn:focus-visible { outline: 2px solid var(--ts-accent-gold); outline-offset: 2px; }

@media (min-width: 900px) {
    .ts-mini-bar { display: none; }
}

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
    /* Disable transitions globally where we use the token */
    :root { --ts-transition: none; }
    .ts-mini-bar,
    .ts-trust-pill,
    .ts-share-row .ts-share,
    .ts-gallery-lightbox-trigger,
    .ts-gallery__sticky-thumbs .ts-gallery__thumb,
    .ts-gallery__hero-thumbs .ts-gallery__thumb,
    .ts-lightbox-close,
    .ts-lightbox-prev,
    .ts-lightbox-next,
    .ts-lightbox-thumb { transition: none !important; }
    /* Disable hover transforms */
    .ts-gallery-lightbox-trigger:hover,
    .ts-gallery__sticky-thumbs .ts-gallery__thumb:hover,
    .ts-gallery__hero-thumbs .ts-gallery__thumb:hover,
    .ts-lightbox-close:hover,
    .ts-lightbox-prev:hover,
    .ts-lightbox-next:hover,
    .ts-lightbox-thumb:hover { transform: none !important; }
}

/* ==========================================================================
   STICKY BUY BOX (Desktop) - CLS safe
   ==========================================================================
*/

#ts-sticky-buybox-reserve { height: 0; }

.ts-sticky-buybox {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 70;
    background: rgba(253,251,247,0.98);
    backdrop-filter: blur(16px);
    border-top: 1px solid var(--ts-border-light);
    box-shadow: 0 -14px 40px rgba(0,0,0,0.08);
    transform: translateY(100%);
    transition: transform .32s cubic-bezier(.4,0,.2,1), opacity .2s ease;
    opacity: 0;
}

.ts-sticky-buybox .ts-sticky-inner{
    max-width: 1200px;
    margin: 0 auto;
    padding: 0.6rem 1rem;
    display: grid;
    grid-template-columns: 2.2fr auto 1.8fr auto;
    gap: 0.6rem;
    align-items: center;
}

.ts-sticky-title{ 
    font-family: var(--ts-font-serif);
    font-size: 0.95rem; 
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ts-sticky-price{ font-weight: 600; color: var(--ts-accent-primary); }

.ts-sticky-meta-row{ display:flex; gap:.6rem; align-items:center; font-size:.75rem; color: var(--ts-text-secondary); }
.ts-sticky-brand a{ color: inherit; text-decoration: none; border-bottom: 1px dotted var(--ts-border-light); }
.ts-sticky-tax{ color: var(--ts-text-tertiary); font-size: .72rem; }

.ts-sticky-qty{ display: inline-flex; align-items: center; gap: .35rem; border: 1px solid var(--ts-border-light); border-radius: var(--ts-radius-full); padding: .25rem .45rem; }
.ts-sticky-qty-btn{ background:none;border:none;cursor:pointer;font-size:1rem;line-height:1; padding: .15rem .35rem; }
.ts-sticky-qty-input{ width: 2.75rem; text-align:center; border:none; background:transparent; font-size:.85rem; }

.ts-sticky-cta{ 
    padding: .6rem 1.1rem; border-radius: var(--ts-radius-full); border: none; 
    background: var(--ts-accent-primary); color: var(--ts-bg-primary); font-weight: 600; cursor: pointer; 
}
.ts-sticky-cta[aria-disabled="true"]{ opacity: .5; cursor: not-allowed; }

/* Visibility states */
.ts-sticky-buybox[data-state="entering"],
.ts-sticky-buybox[data-state="visible"]{ transform: translateY(0); opacity: 1; }

/* Hide on small viewports; desktop only */
@media (max-width: 959.98px){
    .ts-premium-side{ flex-direction: row; overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-snap-type:x mandatory; padding-bottom:.4rem; }
    .ts-premium-side .ts-premium-thumb{ min-width: 92px; flex:0 0 92px; scroll-snap-align:start; }
    .ts-premium-side .ts-premium-thumb:focus-visible{ outline:2px solid var(--ts-accent-gold); outline-offset:2px; }
    .ts-premium-bottom{ grid-template-columns: 1fr; }
    .ts-premium-bottom-item{ min-height: 132px; }
    .ts-sticky-buybox{ transition: none; }
}

/* ==========================================================================
   GALLERY THUMB FILTERING (Variation sub-gallery)
   ========================================================================== */
.ts-gallery__thumb.is-hidden{ display: none !important; }

/* ==========================================================================
    PLAY OVERLAY
    ========================================================================= */
.ts-play-overlay{ position:absolute; inset:auto auto 8px 8px; display:inline-grid; place-items:center; width:48px; height:48px; border-radius:999px; background:transparent; border:none; cursor:pointer; }
.ts-premium-hero-video-wrapper{ position:relative; }
.ts-play-overlay--hero{ inset:50% auto auto 50%; transform:translate(-50%,-50%); width:72px; height:72px; }
.ts-play-icon{ width:100%; height:100%; filter: drop-shadow(0 8px 16px rgba(0,0,0,0.25)); }
.ts-premium-thumb .ts-play-overlay{ inset: auto 8px 8px auto; }
.ts-premium-bottom-item .ts-play-overlay{ inset: auto 8px 8px auto; }
.ts-play-overlay:focus-visible{ outline:2px solid var(--ts-accent-gold); outline-offset: 2px; }

/* ==========================================================================
    SUMMARY PREMIUM SPACING & META INLINE ROW
    ========================================================================= */
.ts-premium-summary .ts-product-title{ margin-bottom: .25rem; }
.ts-premium-summary .ts-product-tags{ margin-bottom: .5rem; color: var(--ts-text-tertiary); font-size: .58rem; letter-spacing: .18em; text-transform: uppercase; }
.ts-premium-summary .ts-premium-price-row{ display:flex; gap:.5rem; align-items:baseline; margin-top:.25rem; }
.ts-premium-summary .ts-tax-notice{ font-size:.82rem; color: var(--ts-text-tertiary); }
.ts-premium-summary .ts-product-rating{ margin-top:.35rem; }
.ts-premium-summary .ts-meta-inline{ display:flex; flex-wrap:wrap; gap:.6rem .9rem; margin-top:.5rem; font-size:.88rem; color: var(--ts-text-secondary); }
.ts-premium-summary .ts-meta-label{ color: var(--ts-text-tertiary); margin-right:.25rem; font-size:.82rem; }
.ts-premium-summary .ts-tagged-as{ margin-top:.25rem; font-size:.85rem; color: var(--ts-text-tertiary); }

/* ==========================================================================
     VARIATION HINT + RESET LINK STYLES
     ========================================================================== */
.ts-variation-footer{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin-top:.5rem; }
.ts-variation-hint{ flex:1; font-size:.68rem; line-height:1.3; color: var(--ts-text-secondary); background: var(--ts-bg-secondary); padding:.45rem .65rem; border-radius: var(--ts-radius-full); letter-spacing:.02em; }
.ts-reset-link{ font-size:.62rem; text-decoration:none; background: var(--ts-accent-primary); color: var(--ts-bg-primary); padding:.4rem .7rem; border-radius: var(--ts-radius-full); line-height:1; display:inline-flex; align-items:center; gap:.35rem; }
.ts-reset-link:focus-visible{ outline:2px solid var(--ts-accent-gold); outline-offset:2px; }
.ts-reset-link:hover{ background:#24244d; }

@media (prefers-reduced-motion: reduce){
    .ts-reset-link, .ts-variation-hint{ transition:none; }
}

/* ==========================================================================
     SIZE GUIDE MODAL (Fallback) - Accessible
     ========================================================================== */
.ts-guide-modal{ position:fixed; inset:0; display:flex; align-items:flex-start; justify-content:center; padding:5vh 1rem; background:rgba(20,20,25,0.72); backdrop-filter:none; z-index:1000; }
.ts-guide-modal-inner{ width:100%; max-width:680px; background:var(--ts-bg-primary); border:1px solid var(--ts-border-light); border-radius: var(--ts-radius-lg); box-shadow:0 24px 48px rgba(0,0,0,0.25); padding:1.25rem 1.5rem 1.6rem; position:relative; }
.ts-guide-close{ position:absolute; top:.6rem; right:.6rem; width:34px; height:34px; border:none; background:var(--ts-bg-secondary); border-radius:var(--ts-radius-full); cursor:pointer; font-size:1.2rem; line-height:1; display:flex; align-items:center; justify-content:center; }
.ts-guide-close:hover{ background:#fff; }
.ts-guide-close:focus-visible{ outline:2px solid var(--ts-accent-gold); outline-offset:2px; }
#ts-size-guide-title{ font-family: var(--ts-font-serif); font-size:1.2rem; margin:0 0 1rem; }
.ts-guide-modal-content{ max-height:60vh; overflow:auto; font-size:.78rem; line-height:1.5; }
.ts-guide-modal-content table{ width:100%; border-collapse:collapse; margin-bottom:1rem; font-size:.72rem; }
.ts-guide-modal-content th, .ts-guide-modal-content td{ padding:.4rem .55rem; border:1px solid var(--ts-border-light); text-align:left; }
.ts-guide-modal-content thead th{ background:var(--ts-bg-secondary); font-weight:600; }
.ts-guide-modal-content caption{ text-align:left; font-weight:600; margin-bottom:.4rem; }
.ts-guide-modal-content a{ color:var(--ts-accent-primary); }
.ts-guide-modal-content a:focus-visible{ outline:2px solid var(--ts-accent-gold); outline-offset:2px; }
@media (max-width: 599.98px){
    .ts-guide-modal-inner{ padding:1rem 1.1rem 1.25rem; }
    #ts-size-guide-title{ font-size:1.05rem; }
    .ts-guide-modal-content{ max-height:65vh; }
}

/* ==========================================================================
   MAIN PRODUCT PAGE LAYOUT - Mobile First
   ========================================================================== */

/* Base wrapper - Mobile */
.ts-single-product-wrapper {
    background-color: var(--ts-bg-primary);
    font-family: var(--ts-font-sans);
    color: var(--ts-text-primary);
    padding-top: 2rem;
    padding-bottom: 3rem;
}

/* Tablet - More spacing */
@media (min-width: 768px) {
    .ts-single-product-wrapper {
        padding-top: 2.5rem;
        padding-bottom: 3.5rem;
    }
}

/* Desktop - Premium spacing */
@media (min-width: 1024px) {
    .ts-single-product-wrapper {
        padding-top: 3rem;
        padding-bottom: 4rem;
    }
}

/* Container - Mobile First */
.ts-product-container {
    max-width: 1280px; /* Match site container width */
    margin: 0 auto;
    padding: 0 var(--ts-spacing-md, 1.5rem);
}

/* Notices alignment within product page container */
.ts-single-product-wrapper .woocommerce-notices-wrapper {
    margin: 0 auto var(--ts-spacing-lg, 2rem) auto;
}

.ts-single-product-wrapper .woocommerce-notices-wrapper:empty {
    display: none;
}

@media (min-width: 768px) {
    .ts-product-container {
        padding: 0 var(--ts-spacing-lg, 2rem);
    }
}

@media (min-width: 1024px) {
    .ts-product-container {
        padding: 0 var(--ts-spacing-xl, 3rem);
    }
}

/* Breadcrumb styles moved to components.css for unified implementation */

/* Main Grid - Mobile First (Single column) */
.ts-single-product-wrapper .ts-product-main {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.75rem;
    margin-bottom: 1.75rem;
}

/* Tablet - 2 columns */
/* Desktop split at 900px to match spec */
@media (min-width: 900px) {
    .ts-single-product-wrapper .ts-product-main {
        grid-template-columns: minmax(0, 6.5fr) minmax(0, 5.5fr);
        align-items: flex-start;
        gap: 2.5rem;
        margin-bottom: 2.5rem;
    }
}

/* Desktop - Optimized spacing */
@media (min-width: 1024px) {
    .ts-single-product-wrapper .ts-product-main {
        gap: var(--ts-spacing-2xl, 3rem);
        margin-bottom: var(--ts-spacing-2xl, 3rem);
    }
}

/* Gallery wrapper - Mobile */
.ts-product-gallery-wrapper {
    position: relative;
    width: 100%;
    min-width: 0; /* prevent grid overflow in Firefox */
}

/* Summary wrapper - Mobile (no sticky) */
.ts-product-summary-wrapper {
    position: relative;
    width: 100%;
    min-width: 0; /* prevent grid overflow in Firefox */
}

/* Desktop - Sticky Summary */
@media (min-width: 900px) {
    .ts-product-summary-wrapper {
        position: sticky;
        top: var(--ts-sp-sticky-offset, calc(var(--header-height, 80px) + 1.5rem));
        align-self: flex-start;
        height: -moz-fit-content; height: fit-content;
        max-width: min(var(--ts-sp-max-summary, 560px), 100%);
    }
}

/* ==========================================================================
   GALLERY LAYOUTS
   ========================================================================== */

.ts-product-gallery {
    position: relative;
    border-radius: var(--ts-radius-xl);
    overflow: hidden;
}

.ts-product-gallery img { width: 100%; height: auto; display: block; border-radius: var(--ts-radius-lg); }

/* Lightbox trigger button */
.ts-gallery-lightbox-trigger {
    position: absolute;
    top: var(--ts-spacing-md);
    right: var(--ts-spacing-md);
    width: 44px;
    height: 44px;
    border-radius: var(--ts-radius-full);
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border: 1px solid var(--ts-border-light);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: var(--ts-transition);
    z-index: 10;
}

.ts-gallery-lightbox-trigger:hover {
    background: white;
    transform: scale(1.05);
}

/* Limited edition badge */
.ts-limited-badge {
    position: absolute;
    bottom: var(--ts-spacing-md);
    left: var(--ts-spacing-md);
    padding: var(--ts-spacing-xs) var(--ts-spacing-sm);
    border-radius: var(--ts-radius-full);
    background: rgba(20, 20, 51, 0.85);
    backdrop-filter: blur(10px);
    color: var(--ts-bg-primary);
    font-size: 0.625rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    z-index: 5;
}

.ts-badge-details {
    margin-left: var(--ts-spacing-xs);
    opacity: 0.8;
}

/* ========================================================================== 
    GALLERY LAYOUT: SHOPIFY GRID (Canonical BEM only)
    ========================================================================== */

/* Container */
/* NOTE: legacy alias .ts-gallery-shopify-grid removed to avoid unintended layout inheritance */
.ts-gallery__layout--shopify-grid {
    display: grid;
    grid-template-columns: 80px 1fr;
    gap: var(--ts-spacing-sm);
}

/* Horizontal thumbs variant */
.ts-gallery__layout--shopify-grid.ts-grid-thumbs-bottom {
    /* Override vertical rail columns when bottom variant active */
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto;
}
.ts-gallery__layout--shopify-grid.ts-grid-thumbs-bottom .ts-gallery__main { order: 1; }
.ts-gallery__layout--shopify-grid.ts-grid-thumbs-bottom .ts-gallery__thumbs {
    order: 2;
    flex-direction: row;
    gap: var(--ts-spacing-sm);
    overflow-x: auto;
    padding: var(--ts-spacing-xs) 2px;
    scroll-snap-type: x mandatory;
    
}
.ts-gallery__layout--shopify-grid.ts-grid-thumbs-bottom .ts-gallery__thumb {
    flex: 0 0 auto;
    width: 72px; /* uniform squares */
    aspect-ratio: 1;
    scroll-snap-align: start;
}

/* Single image (no thumbs) state */
.ts-gallery__layout--shopify-grid.ts-has-thumbs { grid-template-columns: 80px 1fr; }
/* Ensure bottom variant wins over generic has-thumbs rule */
.ts-gallery__layout--shopify-grid.ts-grid-thumbs-bottom.ts-has-thumbs { grid-template-columns: 1fr !important; }
.ts-gallery__layout--shopify-grid:not(.ts-has-thumbs) { grid-template-columns: 1fr; }
.ts-gallery__layout--shopify-grid:not(.ts-has-thumbs) .ts-gallery__main { aspect-ratio: auto; }
.ts-gallery__layout--shopify-grid:not(.ts-has-thumbs) .ts-gallery__image--primary { width: 100%; height: auto; object-fit: contain; }

/* Thumbnails rail */
.ts-gallery__thumbs {
    display: flex;
    flex-direction: column;
    gap: var(--ts-spacing-sm);
}

/* Thumbnail item */
.ts-gallery__thumb {
    aspect-ratio: 1;
    border-radius: var(--ts-radius-md);
    overflow: hidden;
    cursor: pointer;
    border: 2px solid rgba(0,0,0,0);
    transition: var(--ts-transition);
    box-shadow: var(--ts-shadow-sm);
}

.ts-gallery__thumb:hover,
.ts-gallery__thumb.active {
    border-color: var(--ts-accent-gold);
    box-shadow: var(--ts-shadow-md);
    transform: translateY(-1px);
}

.ts-gallery__thumb:focus-visible {
    outline: 2px solid var(--ts-accent-primary);
    outline-offset: 2px;
}

/* Main image area */
.ts-gallery__main {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: var(--ts-radius-xl);
    overflow: hidden;
    background: var(--ts-bg-secondary);
}

.ts-gallery__main img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Ensure single primary image uses contain for arbitrary aspect ratios when no thumbs */
.ts-gallery__image--primary { object-fit: cover; }
.ts-gallery__layout--shopify-grid:not(.ts-has-thumbs) .ts-gallery__image--primary { object-fit: contain; background: #fff; }

@media (max-width: 768px) {
    .ts-gallery__layout--shopify-grid {
        grid-template-columns: 1fr;
    }
    
    .ts-gallery__thumbs {
        flex-direction: row;
        order: 2;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
    }
}

/* Very small phones: make thumbs a bit smaller */
@media (max-width: 360px) {
  .ts-gallery__layout--shopify-grid.ts-grid-thumbs-bottom .ts-gallery__thumb,
  .ts-gallery__thumbs .ts-gallery__thumb { width: 56px; }
}

/* ========================================================================== 
   GALLERY LAYOUT: SINGLE COLUMN
   ========================================================================== */

.ts-gallery__layout--single-column {
    display: flex;
    flex-direction: column;
    gap: var(--ts-spacing-md);
}

.ts-gallery__layout--single-column .ts-gallery__item {
    aspect-ratio: 4 / 3;
    border-radius: var(--ts-radius-xl);
    overflow: hidden;
    background: var(--ts-bg-secondary);
}

/* ========================================================================== 
   GALLERY LAYOUT: CAROUSEL
   ========================================================================== */

.ts-gallery__layout--carousel {
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: var(--ts-radius-xl);
    overflow: hidden;
    background: var(--ts-bg-secondary);
}

.ts-gallery__track {
    display: flex;
    width: 100%;
    height: 100%;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.ts-gallery__slide {
    min-width: 100%;
    height: 100%;
}

.ts-gallery__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ts-gallery__control--prev,
.ts-gallery__control--next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: var(--ts-radius-full);
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border: 1px solid var(--ts-border-light);
    cursor: pointer;
    font-size: 1.25rem;
    color: var(--ts-text-primary);
    transition: var(--ts-transition);
    z-index: 10;
}

.ts-gallery__control--prev { left: var(--ts-spacing-md); }
.ts-gallery__control--next { right: var(--ts-spacing-md); }

.ts-gallery__control--prev:hover,
.ts-gallery__control--next:hover {
    background: white;
    transform: translateY(-50%) scale(1.05);
}

.ts-gallery__dots {
    position: absolute;
    bottom: var(--ts-spacing-md);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: var(--ts-spacing-xs);
    z-index: 10;
}

.ts-gallery__dots .ts-gallery__dot {
    width: 8px;
    height: 8px;
    border-radius: var(--ts-radius-full);
    background: rgba(255, 255, 255, 0.5);
    border: none;
    cursor: pointer;
    transition: var(--ts-transition);
}

.ts-gallery__dots .ts-gallery__dot.active,
.ts-gallery__dots .ts-gallery__dot:hover {
    background: white;
    width: 24px;
}

/* ========================================================================== 
   GALLERY LAYOUT: STICKY SCROLL
   ========================================================================== */

.ts-gallery__layout--sticky-scroll {
    display: flex;
    flex-direction: column;
    gap: var(--ts-spacing-md);
}

.ts-gallery__sticky-main {
    position: sticky;
    top: var(--ts-spacing-lg);
    aspect-ratio: 4 / 3;
    border-radius: var(--ts-radius-xl);
    overflow: hidden;
    background: var(--ts-bg-secondary);
    margin-bottom: var(--ts-spacing-md);
}

.ts-gallery__sticky-thumbs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--ts-spacing-md);
}

.ts-gallery__sticky-thumbs .ts-gallery__thumb {
    aspect-ratio: 4 / 3;
    border-radius: var(--ts-radius-lg);
    overflow: hidden;
    cursor: pointer;
    transition: var(--ts-transition);
}

.ts-gallery__sticky-thumbs .ts-gallery__thumb:hover {
    transform: scale(1.02);
}

/* ========================================================================== 
   GALLERY LAYOUT: GRID MASONRY
   ========================================================================== */

.ts-gallery__layout--grid-masonry { /* revamped responsive dense masonry */
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: var(--ts-spacing-sm);
    grid-auto-flow: dense;
}
.ts-gallery__layout--grid-masonry .ts-gallery__item { border-radius: var(--ts-radius-lg); overflow: hidden; background: var(--ts-bg-secondary); position: relative; }
.ts-gallery__layout--grid-masonry .ts-gallery__item--large { grid-column: span 8; grid-row: span 6; aspect-ratio: 4 / 3; }
.ts-gallery__layout--grid-masonry .ts-gallery__item--small { grid-column: span 4; grid-row: span 4; aspect-ratio: 1; }
@media (max-width: 992px) {
    .ts-gallery__layout--grid-masonry { grid-template-columns: repeat(8, 1fr); }
    .ts-gallery__layout--grid-masonry .ts-gallery__item--large { grid-column: span 8; grid-row: span 5; }
    .ts-gallery__layout--grid-masonry .ts-gallery__item--small { grid-column: span 4; grid-row: span 4; }
}
@media (max-width: 768px) {
    .ts-gallery__layout--grid-masonry { grid-template-columns: repeat(6, 1fr); }
    .ts-gallery__layout--grid-masonry .ts-gallery__item--large { grid-column: span 6; grid-row: span 4; }
    .ts-gallery__layout--grid-masonry .ts-gallery__item--small { grid-column: span 3; grid-row: span 3; }
}

/* ========================================================================== 
   GALLERY LAYOUT: FULL WIDTH HERO
   ========================================================================== */

.ts-gallery__layout--fullwidth {
    display: flex;
    flex-direction: column;
    gap: var(--ts-spacing-md);
}

.ts-gallery__hero {
    width: 100%;
    max-height: 70vh;
    border-radius: var(--ts-radius-xl);
    overflow: hidden;
    background: var(--ts-bg-secondary);
}

.ts-gallery__hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ts-gallery__hero-thumbs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: var(--ts-spacing-sm);
}

.ts-gallery__hero-thumbs .ts-gallery__thumb {
    aspect-ratio: 1;
    border-radius: var(--ts-radius-md);
    overflow: hidden;
    cursor: pointer;
    border: 2px solid transparent;
    transition: var(--ts-transition);
}

.ts-gallery__hero-thumbs .ts-gallery__thumb:hover,
.ts-gallery__hero-thumbs .ts-gallery__thumb.active {
    border-color: var(--ts-accent-gold);
    transform: scale(1.02);
}

/* Hide Woo default lightbox trigger to avoid duplicate icons */
.woocommerce-product-gallery__trigger { display: none !important; }

/* Safety: if Woo PhotoSwipe shell is present, hide it (we run a custom lightbox) */
.pswp { display: none !important; }

/* Remove default borders on Woo images within our gallery */
.ts-product-gallery .woocommerce-product-gallery__image img { border: 0; border-radius: var(--ts-radius-lg); }

/* Loader overlay for variation image swaps */
.ts-gallery-loading {
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.6);
    backdrop-filter: blur(2px);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 15;
}
.ts-gallery-loading::after {
    content: "";
    width: 32px; height: 32px;
    border-radius: 50%;
    border: 3px solid rgba(20,20,51,0.2);
    border-top-color: var(--ts-accent-primary);
    animation: ts-spin 1s linear infinite;
}
.ts-gallery-loading.active { display: flex; }

@keyframes ts-spin { to { transform: rotate(360deg); } }

/* Zoom state for main image (mobile double-tap, desktop click) */
.ts-main-image.ts-zoom-active,
.ts-hero-image.ts-zoom-active {
    will-change: transform;
    transition: transform 0.15s ease;
    cursor: move;
}

/* ==========================================================================
   PRODUCT SUMMARY (Right Column)
   ========================================================================== */

.ts-product-summary {
    display: flex;
    flex-direction: column;
    /* gap: var(--ts-spacing-md); */
    gap:8px;
}

/* Premium wrapper (card-like) */
.ts-premium-summary{
    padding: 1.3rem 1.2rem 1.3rem;
    border-radius: var(--ts-radius-xl);
    background: rgba(253,251,247,0.98);
    border: 1px solid rgba(195,164,106,0.32);
    box-shadow: var(--ts-shadow-soft, var(--ts-shadow-lg));
}
@media (min-width: 900px){ .ts-premium-summary{ padding: 1.4rem 1.3rem 1.6rem; } }

.ts-premium-title{ letter-spacing: -0.01em; }
.ts-premium-price-row{ display:flex; align-items: baseline; gap: .5rem; margin: .4rem 0; }
.ts-premium-rating-row{ margin-top: -0.25rem; }
.ts-premium-atc-block{ margin-top: 0; }
.ts-premium-btn-ghost{ width: 100%; border: 1px solid var(--ts-accent-gold); background: transparent; color: var(--ts-text-primary); text-transform: uppercase; letter-spacing: 0.14em; padding: .55rem 1rem; border-radius: var(--ts-radius-full); }
.ts-premium-btn-ghost:hover{ background: #fff; }
.ts-premium-share-row{ margin-top: .4rem; }

/* ==========================================================================
   PREMIUM GRID GALLERY (Hero + Side + Bottom)
   ========================================================================== */

.ts-gallery__layout--premium-grid{
    display: grid;
    grid-template-areas:
        'hero'
        'side'
        'bottom';
    gap: 0.6rem;
}

@media (min-width: 900px){
    .ts-gallery__layout--premium-grid{
        grid-template-columns: 3fr 1fr;
        grid-template-areas:
            'hero side'
            'bottom bottom';
        gap: 0.8rem;
    }
}

/* Mobile premium gallery tweaks: side thumbs row below hero */
@media (max-width: 899px){
  .ts-gallery__layout--premium-grid{ grid-template-areas: 'hero' 'side' 'bottom'; }
  .ts-premium-side{ flex-direction: row; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .ts-premium-side .ts-premium-thumb{ min-width: 88px; flex:0 0 88px; }
  .ts-premium-bottom{ grid-template-columns: 1fr; }
  .ts-premium-bottom-item{ min-height: 120px; }
}

.ts-premium-hero{ grid-area: hero; position: relative; }
.ts-premium-hero .ts-premium-hero-media{
    width: 100%; height: auto; display: block;
    border-radius: var(--ts-radius-xl);
    background: var(--ts-bg-secondary);
    box-shadow: var(--ts-shadow-xl);
}

.ts-premium-side{ grid-area: side; display: flex; flex-direction: column; gap: 0.6rem; }
.ts-premium-thumb{
    border-radius: 14px; overflow: hidden; cursor: pointer; position: relative;
    background: var(--ts-bg-secondary);
}
.ts-premium-thumb img{ width: 100%; height: auto; object-fit: cover; display: block; }
.ts-premium-thumb button.ts-premium-thumb-link{ cursor:pointer; display:block; width:100%; height:100%; padding:0; margin:0; background:none; border:0; }
.ts-premium-thumb button.ts-premium-thumb-link img{ width:100%; height:auto; object-fit:cover; }
.ts-premium-thumb:focus-visible{ outline: 2px solid var(--ts-accent-gold); outline-offset: 2px; }

.ts-premium-bottom{ grid-area: bottom; display: grid; gap: 0.6rem; margin-top: 0.6rem; }
@media (min-width: 800px){ .ts-premium-bottom{ grid-template-columns: repeat(3, minmax(0,1fr)); } }

.ts-premium-bottom-item{ border-radius: 14px; overflow: hidden; background: var(--ts-bg-secondary); }
.ts-premium-bottom-item img{ width: 100%; height: 100%; object-fit: cover; display: block; }

/* Legacy dark card class fallback (ensure readable contrast) */
.ts-gallery-card-dark{ background:#141433; color:#F6F3EE; padding:.7rem; border-radius:14px; display:flex; flex-direction:column; justify-content:space-between; }
.ts-gallery-card-dark h3, .ts-gallery-card-dark h4{ color:#F6F3EE; font-family: var(--ts-font-serif); margin:.1rem 0 .25rem; }
.ts-gallery-card-dark p{ color:#E8E3DB; font-size:.7rem; margin:0; }

/* Review avatar fix */
.ts-review-item img.avatar{ width:48px; height:48px; object-fit:cover; border-radius:50%; }

/* Sticky buy box simplified row adjustments */
.ts-sticky-buybox .ts-sticky-inner{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem; }
.ts-sticky-buybox .ts-sticky-title{ flex:2 1 160px; font-size:1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;font-weight: 700; }
.ts-sticky-buybox .ts-sticky-price{ flex:0 0 auto; font-size:.8rem; font-weight:600; }
.ts-sticky-buybox .ts-sticky-variants{ flex:1 1 140px; font-size:.6rem; }
.ts-sticky-buybox .ts-sticky-qty{ display:inline-flex; align-items:center; gap:.35rem; }
.ts-sticky-buybox .ts-sticky-qty-input{ width:40px; text-align:center; padding:.25rem .35rem; border:1px solid var(--ts-border-medium); border-radius:999px; font-size:.65rem; }
.ts-sticky-buybox .ts-sticky-qty-btn{ background:none; border:1px solid var(--ts-border-medium); width:24px; height:24px; border-radius:999px; font-size:.85rem; cursor:pointer; line-height:1; }
.ts-sticky-buybox .ts-sticky-cta{ flex:0 0 auto; padding:.55rem .95rem; font-size:.65rem; border-radius:999px; background:#141433; color:#F6F3EE; border:none; cursor:pointer; }
.ts-sticky-buybox .ts-sticky-cta[aria-disabled="true"]{ opacity:.5; cursor:not-allowed; }

/* Dark text cards (if media fewer than 3) */
.ts-premium-text-card{ background: #141433; color: #F6F3EE; padding: 0.8rem; display: flex; flex-direction: column; justify-content: space-between; }
.ts-premium-text-eyebrow{ font-size: .55rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(232,227,219,0.85); }
.ts-premium-text-title{ margin: .15rem 0 .25rem; font-family: var(--ts-font-serif); font-size: 1.05rem; }
.ts-premium-text-body{ margin: 0; font-size: .74rem; color: #E8E3DB; }

/* Premium fallback wrapper spacing when not enough media */
.ts-gallery__layout--shopify-grid.ts-premium-fallback{ gap: 0.6rem; }

/* Product title */
.ts-product-title {
    font-family: var(--ts-font-serif);
    font-size: 1.875rem;
    font-weight: 500;
    line-height: 1.2;
    margin: 0;
    color: var(--ts-text-primary);
}

@media (max-width: 768px) {
    .ts-product-title {
        font-size: 1.5rem;
    }
}

/* Product tags */
.ts-product-tags {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: var(--ts-text-secondary);
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .65rem;
    margin: .2rem 0 .75rem;
}

/* Product price */
.ts-product-price {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .55rem .8rem;
    font-size: 1.22rem;
    font-weight: 500;
    margin: .4rem 0 .35rem;
}

.ts-product-price .price {
    font-size: 1.5rem;
    color: var(--ts-text-primary);
}

.ts-product-price .price del {
    opacity: 0.5;
    font-size: 1.125rem;
    margin-right: var(--ts-spacing-xs);
}

.ts-tax-notice {
    font-size: 0.75rem;
    color: var(--ts-text-secondary);
}

/* Rating */
.ts-product-rating {
    display: flex;
    align-items: center;
    gap: .4rem;
    font-size: 0.7rem;
    color: var(--ts-text-secondary);
    margin: .35rem 0 .2rem;
}

.ts-product-rating .star-rating {
    color: var(--ts-accent-gold);
    
}
.ts-product-rating .star-rating span {
    /* Hide verbose text but keep width for star fill */
    text-indent:-9999px; overflow:hidden; white-space:nowrap;
}
.ts-product-rating .star-rating span:before { text-indent:0; }
#reviews .comment-text .star-rating span{
    width: 100% !important;
}

.ts-read-reviews {
    text-decoration: underline;
    text-underline-offset: 2px;
    color: var(--ts-text-secondary);
    transition: var(--ts-transition);
}

.ts-read-reviews:hover {
    color: var(--ts-text-primary);
}

/* Stock notice */
.ts-stock-notice {
    padding: var(--ts-spacing-xs) var(--ts-spacing-sm);
    border-radius: var(--ts-radius-sm);
    font-size: 0.75rem;
    background: var(--ts-bg-secondary);
}

.ts-limited-stock {
    color: var(--ts-accent-secondary);
    font-weight: 500;
}

/* Shipping info */
.ts-shipping-info {
    font-size: 0.72rem;
    color: var(--ts-text-secondary);
    line-height: 1.55;
    margin-top: .5rem;
}

/* Add to cart form */
.cart {
    margin: var(--ts-spacing-md) 0;
}

.cart .quantity {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--ts-border-medium);
    border-radius: var(--ts-radius-full);
    padding: var(--ts-spacing-xs) var(--ts-spacing-sm);
    gap: var(--ts-spacing-sm);
}

.cart .quantity input {
    width: 40px;
    text-align: center;
    border: none;
    font-size: 0.875rem;
}

.cart button[type="submit"],
.single_add_to_cart_button {
    width: 100%;
    padding: var(--ts-spacing-sm) var(--ts-spacing-md);
    border-radius: var(--ts-radius-full);
    background: var(--ts-accent-primary);
    color: var(--ts-bg-primary);
    font-size: 0.875rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: none;
    cursor: pointer;
    transition: var(--ts-transition);
}

.cart button[type="submit"]:hover,
.single_add_to_cart_button:hover {
    background: rgba(20, 20, 51, 0.9);
    transform: translateY(-1px);
}

/* Gift option button */
.ts-gift-option-btn {
    width: 100%;
    padding: .55rem 1rem;
    border-radius: var(--ts-radius-full);
    background: linear-gradient(145deg, rgba(227,212,178,0.18), rgba(227,212,178,0.28));
    border: 1px solid var(--ts-accent-gold);
    color: var(--ts-text-primary);
    font-size: 0.65rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    cursor: pointer;
    transition: var(--ts-transition);
}

.ts-gift-option-btn:hover {
    background: rgba(255,255,255,0.9);
}

/* Trust badges */
.ts-trust-badges {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem .75rem;
    font-size: 0.6rem;
    color: var(--ts-text-secondary);
    margin-top: .65rem;
}

.ts-trust-badges .ts-badge {
    white-space: nowrap;
}

/* Product meta */
.ts-product-summary .ts-sku-wrapper,
.ts-product-summary .ts-posted-in,
.ts-product-summary .ts-tagged-as {
    font-size: 0.75rem;
    color: var(--ts-text-secondary);
    display: block;
    margin-top: var(--ts-spacing-xs);
}

.ts-meta-label {
    font-weight: 600;
    color: var(--ts-text-primary);
}

/* Social sharing */
.ts-product-share {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding-top: .9rem;
    border-top: 1px solid var(--ts-border-light);
    font-size: 0.68rem;
}

.ts-share-label {
    color: var(--ts-text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* ==========================================================================
   LIGHTBOX MODAL
   ========================================================================== */

.ts-lightbox-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.95);
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn 0.2s ease-in-out;
    cursor: zoom-out; /* hint user they can click outside to close */
}

.ts-lightbox-container {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ts-lightbox-image {
    max-width: 100%;
    max-height: 90vh;
    object-fit: contain;
    border-radius: var(--ts-radius-lg);
    touch-action: none;
}

/* Unified media container for image/video */
.ts-lightbox-media {
    max-width: 100%;
    max-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ts-lightbox-media video {
    max-width: 100%;
    max-height: 90vh;
    object-fit: contain;
    border-radius: var(--ts-radius-lg);
}

.ts-lightbox-close,
.ts-lightbox-prev,
.ts-lightbox-next {
    position: absolute;
    width: 50px;
    height: 50px;
    border-radius: var(--ts-radius-full);
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    transition: var(--ts-transition);
    display: flex;
    align-items: center;
    justify-content: center;
}

.ts-lightbox-close:hover,
.ts-lightbox-prev:hover,
.ts-lightbox-next:hover {
    background: rgba(255, 255, 255, 0.2);
    transform: scale(1.05);
}

.ts-lightbox-close {
    top: 20px;
    right: 20px;
}

.ts-lightbox-prev {
    left: 20px;
}

.ts-lightbox-next {
    right: 20px;
}

.ts-lightbox-counter {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    padding: var(--ts-spacing-xs) var(--ts-spacing-md);
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
    border-radius: var(--ts-radius-full);
    color: white;
    font-size: 0.875rem;
}

/* Thumbnails strip inside lightbox */
.ts-lightbox-thumbs {
    position: absolute;
    bottom: 70px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 0.5rem;
    max-width: 90vw;
    overflow-x: auto;
    padding: 0.4rem 0.6rem;
    background: rgba(0,0,0,0.35);
    backdrop-filter: blur(8px);
    border-radius: var(--ts-radius-full);
}
.ts-lightbox-thumb {
    width: 58px;
    height: 58px;
    border-radius: 12px;
    background: #222 center/cover no-repeat;
    border: 1px solid rgba(255,255,255,0.28);
    cursor: pointer;
    position: relative;
    flex: 0 0 auto;
    transition: transform .2s ease, border-color .2s ease;
}
.ts-lightbox-thumb:hover { transform: scale(1.05); }
.ts-lightbox-thumb.active { border-color: var(--ts-accent-gold); outline: 2px solid var(--ts-accent-gold); outline-offset: 2px; }
.ts-lightbox-thumb-play {
    position: absolute;
    bottom: 4px;
    right: 4px;
    background: rgba(0,0,0,0.55);
    color: #fff;
    font-size: 0.55rem;
    padding: 2px 6px;
    border-radius: 8px;
    letter-spacing: 0.05em;
}

body.ts-lightbox-open {
    overflow: hidden;
}

/* ==========================================================================
   GIFT OPTIONS MODAL
   ========================================================================== */

.ts-gift-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: center;
}

.ts-gift-modal-content {
    background: var(--ts-bg-card);
    padding: var(--ts-spacing-xl);
    border-radius: var(--ts-radius-xl);
    max-width: 500px;
    width: 90%;
    position: relative;
}

.ts-gift-close {
    position: absolute;
    top: var(--ts-spacing-md);
    right: var(--ts-spacing-md);
    background: transparent;
    border: none;
    font-size: 1.5rem;
    cursor: pointer;
    color: var(--ts-text-secondary);
}

.ts-gift-modal-content h3 {
    font-family: var(--ts-font-serif);
    margin-bottom: var(--ts-spacing-md);
}

.ts-gift-modal-content label {
    display: block;
    margin-bottom: var(--ts-spacing-md);
    font-size: 0.875rem;
}

.ts-gift-modal-content textarea {
    width: 100%;
    padding: var(--ts-spacing-sm);
    border: 1px solid var(--ts-border-medium);
    border-radius: var(--ts-radius-md);
    font-family: var(--ts-font-sans);
    margin-top: var(--ts-spacing-xs);
}

.ts-gift-save {
    width: 100%;
    padding: var(--ts-spacing-sm) var(--ts-spacing-md);
    border-radius: var(--ts-radius-full);
    background: var(--ts-accent-primary);
    color: var(--ts-bg-primary);
    border: none;
    cursor: pointer;
    font-weight: 500;
    transition: var(--ts-transition);
}

.ts-gift-save:hover {
    background: rgba(20, 20, 51, 0.9);
}

/* ========================================================================== 
   REVIEWS / HISTOGRAM
   ========================================================================== */
.ts-review-histogram { margin-top: 2.5rem; padding-top: 1.3rem; border-top: 1px solid var(--ts-border-light); }
.ts-review-histogram-summary { display:flex; align-items:flex-end; gap:1rem; margin-bottom:0.9rem; }
.ts-review-histogram-score { font-size:2rem; font-weight:600; font-family: var(--ts-font-serif); line-height:1; }
.ts-review-histogram-count { font-size:0.66rem; letter-spacing:0.05em; text-transform:uppercase; color: var(--ts-text-secondary); }
.ts-review-histogram-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:0.35rem; }
.ts-review-hist-row { display:flex; align-items:center; gap:0.55rem; font-size:0.62rem; }
.ts-review-hist-label { width:2.2rem; text-align:right; color: var(--ts-text-secondary); font-weight:500; }
.ts-review-hist-bar { flex:1; height:6px; background: rgba(195,164,106,0.25); border-radius: var(--ts-radius-full); overflow:hidden; position:relative; }
.ts-review-hist-fill { height:100%; background: var(--ts-accent-gold); width:0%; transition: width .9s cubic-bezier(.4,0,.2,1); }
.ts-review-hist-count { width:2.2rem; text-align:left; font-weight:500; color: var(--ts-text-secondary); }
@media (prefers-reduced-motion: reduce){ .ts-review-hist-fill { transition:none; } }
/* Histogram action links */
.ts-review-histogram-actions { display:flex; gap:0.5rem; margin-top:0.4rem; flex-wrap:wrap; }
.ts-review-histogram-actions a { font-size:0.66rem; letter-spacing:0.05em; text-transform:uppercase; color: var(--ts-text-secondary); text-decoration:none; padding:0.35rem 0.7rem; border:1px solid var(--ts-border-light); border-radius:var(--ts-radius-full); transition: var(--ts-transition); line-height:1.2; }
.ts-review-histogram-actions a:hover, .ts-review-histogram-actions a:focus-visible { background: var(--ts-bg-secondary); outline:2px solid var(--ts-accent-gold); outline-offset:2px; }
@media (prefers-reduced-motion: reduce) { .ts-review-histogram-actions a { transition:none; } }
/* Reviews header summary (above list) */
.ts-reviews-header{ display:flex; flex-wrap:wrap; gap:.5rem .75rem; align-items:baseline; margin:.5rem 0 .3rem; font-size:.9rem; color: var(--ts-text-primary); }
.ts-reviews-header a.ts-write-review{ font-size:.8rem; text-decoration:underline; text-underline-offset:2px; color: var(--ts-accent-primary); }

/* ========================================================================== 
    REVIEWS – Filters & Helpful Voting (client-only)
    ========================================================================== */
.ts-review-filters{ display:flex; flex-wrap:wrap; gap:.4rem; margin:.8rem 0; align-items:center; }
.ts-filter-chip{ padding:.3rem .6rem; border-radius:999px; border:1px solid var(--ts-border-light); background:#fff; font-size:.66rem; cursor:pointer; }
.ts-filter-chip[aria-pressed="true"]{ background: var(--ts-accent-primary); color: #fff; border-color: var(--ts-accent-primary); }
.ts-review-item .ts-helpful{ display:flex; align-items:center; gap:.35rem; font-size:.66rem; color: var(--ts-text-secondary); margin-top:.35rem; }
.ts-review-item .ts-helpful button{ border:none; background:#fff; border:1px solid var(--ts-border-light); border-radius:999px; padding:.2rem .5rem; cursor:pointer; }
.ts-review-item .ts-helpful button[aria-pressed="true"]{ background: var(--ts-accent-gold); color:#1b1b1a; border-color: var(--ts-accent-gold); }

/* ========================================================================== 
    CURATED CROSS-SELLS – Scroll Snap Rows
    ========================================================================== */
.ts-curated-cross-sells{ margin-top: 2.5rem; padding-top: 1.4rem; border-top: 1px solid var(--ts-border-light); }
.ts-cross-snap-section{ margin-top: 1.1rem; }
.ts-cross-snap-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:.6rem; }
.ts-cross-snap-title{ margin:0; font-family: var(--ts-font-serif); font-size:1.1rem; }
.ts-cross-snap-viewall{ border:none; background:none; color: var(--ts-text-secondary); text-decoration: underline; font-size:.7rem; cursor:pointer; }
.ts-cross-snap-row{ display:flex; gap:.8rem; overflow-x:auto; scroll-snap-type: x mandatory; padding:.6rem .2rem; }
.ts-cross-snap-row:focus{ outline: none; }
.ts-cross-snap-item{ min-width: 46%; max-width: 46%; scroll-snap-align: start; }
@media (min-width: 700px){ .ts-cross-snap-item{ min-width: 22%; max-width:22%; } }
.ts-cross-snap-image img{ width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: 14px; background: var(--ts-bg-secondary); }
.ts-cross-snap-name{ margin-top:.35rem; font-size:.8rem; }
.ts-cross-snap-price{ font-size:.72rem; color: var(--ts-text-secondary); }
.ts-btn-mini{ display:inline-block; margin-top:.3rem; padding:.35rem .7rem; border-radius:999px; background: var(--ts-accent-primary); color:#fff; font-size:.7rem; text-decoration:none; }