/* ==========================================================================
   Vibe Checkout — Front-end UI Modes (V122)
   --------------------------------------------------------------------------
   Modes:  .vibe-ui-glass  (Glassmorphism)
           .vibe-ui-neon   (Dark neon)
           .vibe-ui-soft   (Neumorphism / Soft UI)
   The mode class is added to <html> and <body>. "Classic" adds no class and
   this file is not even loaded, so the original design is untouched.

   Each mode only defines tokens (--vm-*); the shared component layer below
   consumes them. Per-mode specials (blur, glow, dual shadows) follow.
   The accent comes from --vm-accent, which defaults to the store's primary
   colour (or the "Mode accent" colour set in Appearance → UI Mode).
   ========================================================================== */

/* ---------- 1. Tokens ---------------------------------------------------- */

.vibe-ui-glass {
    --vm-accent: var(--vibe-mode-accent, var(--vibe-primary, #6366F1));
    --vm-accent-2: var(--vibe-mode-accent-2, #EC4899);
    --vm-overlay: radial-gradient(120% 80% at 10% 0%, color-mix(in srgb, var(--vm-accent) 55%, transparent) 0%, transparent 60%),
                  radial-gradient(90% 70% at 100% 100%, color-mix(in srgb, var(--vm-accent-2) 45%, transparent) 0%, transparent 60%),
                  rgba(30, 27, 75, 0.45);
    --vm-surface: linear-gradient(160deg, rgba(255, 255, 255, 0.72) 0%, rgba(255, 255, 255, 0.42) 100%);
    --vm-surface-border: rgba(255, 255, 255, 0.7);
    --vm-card: rgba(255, 255, 255, 0.42);
    --vm-card-hover: rgba(255, 255, 255, 0.6);
    --vm-card-border: rgba(255, 255, 255, 0.75);
    --vm-card-shadow: 0 8px 24px rgba(31, 27, 90, 0.10);
    --vm-text: #1E1B4B;
    --vm-muted: rgba(30, 27, 75, 0.62);
    --vm-input-bg: rgba(255, 255, 255, 0.55);
    --vm-input-border: rgba(255, 255, 255, 0.9);
    --vm-input-shadow: inset 0 1px 2px rgba(31, 27, 90, 0.06);
    --vm-label-bg: rgba(255, 255, 255, 0.92);
    --vm-selected-bg: rgba(255, 255, 255, 0.78);
    --vm-selected-ring: 0 0 0 2px var(--vm-accent), 0 10px 28px color-mix(in srgb, var(--vm-accent) 25%, transparent);
    --vm-btn-bg: linear-gradient(135deg, var(--vm-accent) 0%, color-mix(in srgb, var(--vm-accent) 60%, var(--vm-accent-2)) 100%);
    --vm-btn-text: #fff;
    --vm-btn-shadow: 0 10px 30px color-mix(in srgb, var(--vm-accent) 40%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.35);
    --vm-chip-bg: rgba(255, 255, 255, 0.6);
    --vm-track: rgba(255, 255, 255, 0.55);
    --vm-radius: 18px;
    --vm-radius-sm: 12px;
    --vm-blur: blur(22px) saturate(160%);
}

.vibe-ui-neon {
    --vm-accent: var(--vibe-mode-accent, #A855F7);
    --vm-accent-2: var(--vibe-mode-accent-2, #22D3EE);
    --vm-overlay: rgba(3, 3, 10, 0.72);
    --vm-surface: #0E0E16;
    --vm-surface-border: rgba(255, 255, 255, 0.06);
    --vm-card: #15151F;
    --vm-card-hover: #1B1B28;
    --vm-card-border: rgba(255, 255, 255, 0.07);
    --vm-card-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
    --vm-text: #ECECF4;
    --vm-muted: #8B8BA3;
    --vm-input-bg: #12121B;
    --vm-input-border: rgba(255, 255, 255, 0.09);
    --vm-input-shadow: none;
    --vm-label-bg: #0E0E16;
    --vm-selected-bg: color-mix(in srgb, var(--vm-accent) 14%, #15151F);
    --vm-selected-ring: 0 0 0 1px color-mix(in srgb, var(--vm-accent) 70%, transparent), 0 0 22px color-mix(in srgb, var(--vm-accent) 35%, transparent);
    --vm-btn-bg: linear-gradient(135deg, var(--vm-accent) 0%, color-mix(in srgb, var(--vm-accent) 70%, #6D28D9) 100%);
    --vm-btn-text: #fff;
    --vm-btn-shadow: 0 0 0 1px color-mix(in srgb, var(--vm-accent) 60%, transparent), 0 0 28px color-mix(in srgb, var(--vm-accent) 55%, transparent);
    --vm-chip-bg: color-mix(in srgb, var(--vm-accent) 16%, transparent);
    --vm-track: rgba(255, 255, 255, 0.07);
    --vm-radius: 14px;
    --vm-radius-sm: 10px;
    --vm-blur: none;
    color-scheme: dark;
}

.vibe-ui-soft {
    --vm-accent: var(--vibe-mode-accent, var(--vibe-primary, #4F6EF7));
    --vm-accent-2: var(--vibe-mode-accent-2, #EC4899);
    --vm-base: #E8EBF1;
    --vm-light: rgba(255, 255, 255, 0.95);
    --vm-dark: rgba(163, 177, 198, 0.65);
    --vm-overlay: rgba(200, 206, 218, 0.55);
    --vm-surface: var(--vm-base);
    --vm-surface-border: transparent;
    --vm-card: var(--vm-base);
    --vm-card-hover: var(--vm-base);
    --vm-card-border: transparent;
    --vm-card-shadow: 6px 6px 14px var(--vm-dark), -6px -6px 14px var(--vm-light);
    --vm-raised-sm: 3px 3px 7px var(--vm-dark), -3px -3px 7px var(--vm-light);
    --vm-inset: inset 4px 4px 9px var(--vm-dark), inset -4px -4px 9px var(--vm-light);
    --vm-inset-sm: inset 2px 2px 5px var(--vm-dark), inset -2px -2px 5px var(--vm-light);
    --vm-text: #3B4252;
    --vm-muted: #7A8396;
    --vm-input-bg: var(--vm-base);
    --vm-input-border: transparent;
    --vm-input-shadow: var(--vm-inset);
    --vm-label-bg: var(--vm-base);
    --vm-selected-bg: var(--vm-base);
    --vm-selected-ring: var(--vm-inset);
    --vm-btn-bg: var(--vm-base);
    --vm-btn-text: var(--vm-accent);
    --vm-btn-shadow: var(--vm-card-shadow);
    --vm-chip-bg: var(--vm-base);
    --vm-track: var(--vm-base);
    --vm-radius: 18px;
    --vm-radius-sm: 12px;
    --vm-blur: none;
}

/* ---------- 2. Shared component layer ----------------------------------- */

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-overlay {
    background: var(--vm-overlay) !important;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider {
    background: var(--vm-surface) !important;
    color: var(--vm-text) !important;
    border: 1px solid var(--vm-surface-border) !important;
    border-bottom: 0 !important;
    --vibe-primary: var(--vm-accent);
    --vibe-form-text-color: var(--vm-text);
    --vibe-input-bg: var(--vm-input-bg);
    --vibe-input-border: var(--vm-input-border);
}

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-slider-header {
    background: transparent !important;
    border-bottom: 1px solid var(--vm-card-border) !important;
}

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-slider-content,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-container {
    background: transparent !important;
    color: var(--vm-text) !important;
}

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-drag-handle {
    background: var(--vm-muted) !important;
    opacity: .45;
}

/* Header controls */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-close-btn,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-wishlist-btn,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-wl-toggle {
    background: var(--vm-card) !important;
    border: 1px solid var(--vm-card-border) !important;
    color: var(--vm-text) !important;
    box-shadow: var(--vm-card-shadow) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-wl-toggle-svg { stroke: currentColor; }

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-header-total {
    background: var(--vm-card) !important;
    border: 1px solid var(--vm-card-border) !important;
    box-shadow: var(--vm-card-shadow) !important;
    border-radius: var(--vm-radius) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-header-price,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-header-price * {
    color: var(--vm-text) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-header-cod-badge {
    background: var(--vm-btn-bg) !important;
    color: var(--vm-btn-text) !important;
    box-shadow: none !important;
    border-radius: 999px !important;
}

/* Text */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(label, .vibe-product-title, .vibe-cart-item-name, .vibe-ship-label, .vibe-mini-cart-summary, .vibe-mini-cart-title, .vibe-tier-title, .vibe-form-title, .vibe-upsell-header, .vibe-upsell-card-title, h1, h2, h3, h4) {
    color: var(--vm-text) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-cart-item-var, .vibe-ship-provider, .vibe-tier-dot-label, .vibe-input-icon, .vibe-mini-cart-toggle, .vibe-badge-unit) {
    color: var(--vm-muted) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-product-price, .vibe-cart-item-price, .vibe-ship-price, .vibe-upsell-card-price),
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-product-price, .vibe-cart-item-price, .vibe-ship-price, .vibe-upsell-card-price) * {
    color: var(--vm-accent) !important;
}

/* Inputs */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-input, #vibe-coupon-code, select, textarea, input[type="text"], input[type="tel"], input[type="email"]):not([type="checkbox"]):not([type="radio"]) {
    background-color: var(--vm-input-bg) !important;
    border: 1px solid var(--vm-input-border) !important;
    box-shadow: var(--vm-input-shadow) !important;
    color: var(--vm-text) !important;
    border-radius: var(--vm-radius-sm) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-input, #vibe-coupon-code):focus {
    border-color: var(--vm-accent) !important;
    box-shadow: var(--vm-input-shadow), 0 0 0 3px color-mix(in srgb, var(--vm-accent) 22%, transparent) !important;
    outline: none !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-input:disabled { opacity: .6; }
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-input::placeholder { color: var(--vm-muted) !important; }
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-form-group:is(.vibe-float, .vibe-float-always) label {
    background: var(--vm-label-bg) !important;
    background-color: var(--vm-label-bg) !important;
    border-radius: 6px;
    padding: 0 .4rem !important;
    color: var(--vm-muted) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-form-group:is(.vibe-float, .vibe-float-always) .vibe-input-icon {
    background: var(--vm-label-bg) !important;
    color: var(--vm-accent) !important;
    border-radius: 6px;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-input.vibe-valid {
    border-color: var(--vibe-success, #10B981) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-form-group:has(.vibe-input.vibe-valid) .vibe-input-icon {
    color: var(--vibe-success, #10B981) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-input.vibe-error,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-input.vibe-invalid {
    border-color: var(--vibe-danger, #EF4444) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-form-group label .required { color: var(--vibe-danger, #EF4444) !important; }

/* Cards & panels */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-product-card, .vibe-mini-cart, .vibe-shipping-card, .vibe-user-info-card, .vibe-upsell-card, .vibe-qty-tier-indicator, .vibe-variations-inline .vibe-radio-label, .vibe-attr-pill) {
    background: var(--vm-card) !important;
    border: 1px solid var(--vm-card-border) !important;
    box-shadow: var(--vm-card-shadow) !important;
    border-radius: var(--vm-radius) !important;
    color: var(--vm-text) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-shipping-card, .vibe-upsell-card, .vibe-attr-pill):hover {
    background: var(--vm-card-hover) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-shipping-card.selected, .vibe-attr-pill.active, .vibe-attr-pill.selected, .vibe-variations-inline .vibe-radio-input:checked + .vibe-radio-label) {
    background: var(--vm-selected-bg) !important;
    box-shadow: var(--vm-selected-ring) !important;
    border-color: transparent !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-ship-icon {
    background: var(--vm-chip-bg) !important;
    color: var(--vm-accent) !important;
    border-radius: var(--vm-radius-sm) !important;
}

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-mini-cart-header,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-mini-cart-items,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-cart-item {
    background: transparent !important;
    border-color: var(--vm-card-border) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-cart-item-thumb {
    border-radius: var(--vm-radius-sm) !important;
    border: 1px solid var(--vm-card-border) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-mini-cart-count-badge, .vibe-wl-toggle-badge) {
    background: var(--vm-accent) !important;
    color: #fff !important;
}

/* Quantity steppers */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-quantity-selector, .vibe-cart-item-qty) {
    background: var(--vm-input-bg) !important;
    border: 1px solid var(--vm-input-border) !important;
    box-shadow: var(--vm-input-shadow) !important;
    border-radius: 999px !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-quantity-selector, .vibe-cart-item-qty) :is(button, input) {
    background: transparent !important;
    color: var(--vm-text) !important;
    border: 0 !important;
    box-shadow: none !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-cart-item-remove-text, .vibe-cart-save-btn, .vibe-slider-save-btn) {
    background: transparent !important;
    color: var(--vm-muted) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-cart-item-remove-text:hover { color: var(--vibe-danger, #EF4444) !important; }

/* Promotion banners */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-first-order-banner, .vibe-free-shipping-bar, .vibe-flash-deal-banner, .vibe-bundle-deal-item, .vibe-milestones-progress, .vibe-bulk-calculator) {
    background: var(--vm-card) !important;
    border: 1px solid var(--vm-card-border) !important;
    box-shadow: var(--vm-card-shadow) !important;
    border-radius: var(--vm-radius) !important;
    color: var(--vm-text) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-fo-message, .vibe-fs-msg, .flash-message, .bundle-text, .milestones-message, .bulk-message, .vibe-tier-message) {
    color: var(--vm-text) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-fo-percent, .vibe-fo-savings, .highlight, .savings, .bundle-discount) {
    color: var(--vm-accent) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-progress-track, .vibe-tier-track, .milestones-track) {
    background: var(--vm-track) !important;
    border-radius: 999px !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-progress-fill, .vibe-tier-fill, .milestones-fill) {
    background: linear-gradient(90deg, var(--vm-accent), var(--vm-accent-2)) !important;
    border-radius: 999px !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-tier-dot {
    background: var(--vm-card) !important;
    border-color: var(--vm-card-border) !important;
    color: var(--vm-muted) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-tier-dot.reached {
    background: var(--vm-accent) !important;
    color: #fff !important;
    border-color: var(--vm-accent) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider .vibe-tier-current-savings {
    background: var(--vm-chip-bg) !important;
    color: var(--vm-accent) !important;
    border-radius: 999px !important;
}

/* Note / coupon links */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(.vibe-toggle-note, .vibe-coupon-toggle) {
    background: transparent !important;
    border-color: var(--vm-card-border) !important;
    color: var(--vm-accent) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider #vibe-apply-coupon {
    background: var(--vm-btn-bg) !important;
    color: var(--vm-btn-text) !important;
    border: 0 !important;
    border-radius: var(--vm-radius-sm) !important;
    box-shadow: var(--vm-btn-shadow) !important;
}

/* Primary buttons */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-submit-btn,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-open-checkout-btn,
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-success-btn-primary {
    background: var(--vm-btn-bg) !important;
    color: var(--vm-btn-text) !important;
    border: 0 !important;
    border-radius: var(--vm-radius) !important;
    box-shadow: var(--vm-btn-shadow) !important;
    transition: transform .2s ease, box-shadow .25s ease, filter .25s ease !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) :is(#vibe-submit-btn, #vibe-open-checkout-btn) * { color: var(--vm-btn-text) !important; }
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) :is(#vibe-submit-btn, #vibe-open-checkout-btn):hover:not(:disabled) { transform: translateY(-1px); filter: brightness(1.06); }
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) :is(#vibe-submit-btn, #vibe-open-checkout-btn):active:not(:disabled) { transform: translateY(0) scale(.99); }

:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-floating-cart-btn {
    background: var(--vm-btn-bg) !important;
    color: var(--vm-btn-text) !important;
    box-shadow: var(--vm-btn-shadow) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) .vibe-floating-cart-btn .material-icons-round { color: var(--vm-btn-text) !important; }

/* Popups & wishlist panel */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) :is(.vibe-success-popup, .vibe-provider-popup, #vibe-wishlist-panel) {
    background: var(--vm-surface) !important;
    color: var(--vm-text) !important;
    border: 1px solid var(--vm-surface-border) !important;
    border-radius: var(--vm-radius) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) :is(.vibe-success-popup, .vibe-provider-popup, #vibe-wishlist-panel) :is(h2, h3, h4, .vibe-success-title, .vibe-wl-panel-title, .vibe-success-row, .vibe-provider-card) {
    color: var(--vm-text) !important;
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) :is(.vibe-success-details, .vibe-provider-card) {
    background: var(--vm-card) !important;
    border: 1px solid var(--vm-card-border) !important;
    box-shadow: var(--vm-card-shadow) !important;
}

/* Custom scrollbar inside the drawer */
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-slider-content { scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--vm-accent) 45%, transparent) transparent; }

/* ---------- 3. Glass specials ------------------------------------------- */

.vibe-ui-glass #vibe-checkout-slider {
    backdrop-filter: var(--vm-blur) !important;
    -webkit-backdrop-filter: var(--vm-blur) !important;
    box-shadow: 0 -20px 60px rgba(31, 27, 90, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}
.vibe-ui-glass #vibe-checkout-slider :is(.vibe-product-card, .vibe-mini-cart, .vibe-shipping-card, .vibe-header-total, .vibe-qty-tier-indicator, .vibe-first-order-banner, .vibe-free-shipping-bar, .vibe-upsell-card) {
    backdrop-filter: blur(14px) saturate(150%);
    -webkit-backdrop-filter: blur(14px) saturate(150%);
}
.vibe-ui-glass :is(#vibe-open-checkout-btn, .vibe-floating-cart-btn) {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
}
.vibe-ui-glass :is(.vibe-success-popup, .vibe-provider-popup, #vibe-wishlist-panel) {
    backdrop-filter: var(--vm-blur) !important;
    -webkit-backdrop-filter: var(--vm-blur) !important;
}
/* Browsers without backdrop-filter: keep text readable */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .vibe-ui-glass #vibe-checkout-slider { background: rgba(255, 255, 255, 0.94) !important; }
}

/* ---------- 4. Neon specials -------------------------------------------- */

.vibe-ui-neon #vibe-checkout-slider {
    box-shadow: 0 -1px 0 color-mix(in srgb, var(--vm-accent) 55%, transparent), 0 -24px 70px color-mix(in srgb, var(--vm-accent) 22%, transparent) !important;
}
/* Glowing accent rail on selected items (like the reference sidebar) */
.vibe-ui-neon #vibe-checkout-slider :is(.vibe-shipping-card.selected, .vibe-attr-pill.active, .vibe-attr-pill.selected) { position: relative; overflow: visible !important; }
.vibe-ui-neon #vibe-checkout-slider .vibe-shipping-card.selected::before {
    content: "";
    position: absolute;
    top: 18%;
    bottom: 18%;
    inset-inline-start: -2px;
    width: 3px;
    border-radius: 3px;
    background: var(--vm-accent);
    box-shadow: 0 0 12px var(--vm-accent), 0 0 24px var(--vm-accent);
}
.vibe-ui-neon #vibe-checkout-slider .vibe-ship-icon,
.vibe-ui-neon #vibe-checkout-slider .vibe-tier-dot.reached,
.vibe-ui-neon #vibe-checkout-slider :is(.vibe-mini-cart-count-badge, .vibe-wl-toggle-badge) {
    box-shadow: 0 0 14px color-mix(in srgb, var(--vm-accent) 55%, transparent) !important;
}
.vibe-ui-neon #vibe-checkout-slider :is(.vibe-progress-fill, .vibe-tier-fill, .milestones-fill) {
    box-shadow: 0 0 12px color-mix(in srgb, var(--vm-accent) 70%, transparent);
}
.vibe-ui-neon #vibe-checkout-slider :is(.vibe-product-price, .vibe-cart-item-price, .vibe-ship-price, .vibe-fo-percent) {
    text-shadow: 0 0 12px color-mix(in srgb, var(--vm-accent) 55%, transparent);
}
.vibe-ui-neon #vibe-checkout-slider :is(.vibe-shipping-card, .vibe-upsell-card, .vibe-attr-pill):hover {
    border-color: color-mix(in srgb, var(--vm-accent) 40%, transparent) !important;
    box-shadow: 0 0 18px color-mix(in srgb, var(--vm-accent) 18%, transparent) !important;
}
.vibe-ui-neon :is(#vibe-submit-btn, #vibe-open-checkout-btn):hover:not(:disabled) {
    box-shadow: 0 0 0 1px var(--vm-accent), 0 0 38px color-mix(in srgb, var(--vm-accent) 75%, transparent) !important;
}
.vibe-ui-neon #vibe-checkout-slider .vibe-cart-item-thumb,
.vibe-ui-neon #vibe-checkout-slider .vibe-product-image img { filter: saturate(1.1); }
.vibe-ui-neon #vibe-checkout-slider select.vibe-input option { background: #12121B; color: #ECECF4; }
.vibe-ui-neon #vibe-checkout-slider .vibe-header-cod-badge { box-shadow: 0 0 16px color-mix(in srgb, var(--vm-accent) 45%, transparent) !important; }
/* The ⭐/time badges keep their own colours but get a subtle glow */
.vibe-ui-neon #vibe-checkout-slider .vibe-ship-time-badge { box-shadow: 0 0 12px rgba(16, 185, 129, .45); }

@keyframes vibe-neon-pulse {
    0%, 100% { box-shadow: 0 0 0 1px color-mix(in srgb, var(--vm-accent) 60%, transparent), 0 0 24px color-mix(in srgb, var(--vm-accent) 45%, transparent); }
    50%      { box-shadow: 0 0 0 1px var(--vm-accent), 0 0 40px color-mix(in srgb, var(--vm-accent) 75%, transparent); }
}
.vibe-ui-neon #vibe-open-checkout-btn { animation: vibe-neon-pulse 2.8s ease-in-out infinite; }

/* ---------- 5. Soft (neumorphism) specials ------------------------------ */

.vibe-ui-soft #vibe-checkout-slider {
    box-shadow: 0 -12px 40px rgba(163, 177, 198, 0.55) !important;
}
.vibe-ui-soft #vibe-checkout-slider :is(#vibe-close-btn, #vibe-wishlist-btn, .vibe-header-total) {
    box-shadow: var(--vm-raised-sm) !important;
}
.vibe-ui-soft #vibe-checkout-slider :is(.vibe-ship-icon, .vibe-tier-current-savings) {
    box-shadow: var(--vm-inset-sm) !important;
}
.vibe-ui-soft #vibe-checkout-slider :is(.vibe-quantity-selector, .vibe-cart-item-qty) :is(button) {
    box-shadow: var(--vm-raised-sm) !important;
    border-radius: 50% !important;
    margin: 3px;
    color: var(--vm-accent) !important;
}
.vibe-ui-soft #vibe-checkout-slider .vibe-header-cod-badge {
    background: var(--vm-base) !important;
    color: #10B981 !important;
    box-shadow: var(--vm-inset-sm) !important;
}
.vibe-ui-soft #vibe-checkout-slider .vibe-header-cod-badge * { color: #10B981 !important; }
.vibe-ui-soft #vibe-checkout-slider :is(.vibe-progress-track, .vibe-tier-track, .milestones-track) { box-shadow: var(--vm-inset-sm) !important; }
.vibe-ui-soft #vibe-checkout-slider .vibe-tier-dot { box-shadow: var(--vm-raised-sm) !important; border: 0 !important; }
.vibe-ui-soft :is(#vibe-submit-btn, #vibe-open-checkout-btn, .vibe-floating-cart-btn, .vibe-success-btn-primary) {
    font-weight: 700 !important;
}
.vibe-ui-soft :is(#vibe-submit-btn, #vibe-open-checkout-btn):active:not(:disabled) {
    box-shadow: var(--vm-inset) !important;
}
.vibe-ui-soft #vibe-checkout-slider .vibe-mini-cart .vibe-cart-item + .vibe-cart-item { border-top: 1px solid rgba(163, 177, 198, .35) !important; }
.vibe-ui-soft #vibe-checkout-slider .vibe-cart-item-thumb { border: 0 !important; box-shadow: var(--vm-raised-sm); }
.vibe-ui-soft #vibe-checkout-slider #vibe-apply-coupon { color: var(--vm-accent) !important; }

/* ---------- 6. Accessibility --------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
    .vibe-ui-neon #vibe-open-checkout-btn { animation: none; }
    :is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) :is(#vibe-submit-btn, #vibe-open-checkout-btn) { transition: none !important; }
}
:is(.vibe-ui-glass, .vibe-ui-neon, .vibe-ui-soft) #vibe-checkout-slider :is(button, a, input, select):focus-visible {
    outline: 2px solid var(--vm-accent) !important;
    outline-offset: 2px;
}