/* =========================================================
   ENTERPRISE PREMIUM UI LAYER (NON-INVASIVE)
   Scope: Visual consistency, accessibility, motion, responsive polish
   No business logic / workflow changes
   ========================================================= */

:root {
  --ep-primary: #0f70fd;
  --ep-secondary: #ffd832;
  --ep-accent: #aee1f9;
  --ep-base: #fdfdfb;

  --ep-bg: var(--ep-base);
  --ep-surface: color-mix(in srgb, var(--ep-base) 88%, var(--ep-accent) 12%);
  --ep-surface-strong: color-mix(in srgb, var(--ep-base) 94%, var(--ep-accent) 6%);
  --ep-border: color-mix(in srgb, var(--ep-primary) 18%, var(--ep-base) 82%);
  --ep-border-soft: color-mix(in srgb, var(--ep-primary) 10%, var(--ep-base) 90%);

  --ep-text: color-mix(in srgb, var(--ep-primary) 86%, var(--ep-base) 14%);
  --ep-text-muted: color-mix(in srgb, var(--ep-primary) 62%, var(--ep-accent) 38%);

  --ep-primary-hover: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-secondary) 16%);
  --ep-danger: var(--ep-secondary);

  --ep-radius-sm: 10px;
  --ep-radius-md: 14px;
  --ep-radius-lg: 18px;
  --ep-radius-xl: 24px;

  --ep-shadow-1: 0 4px 16px color-mix(in srgb, var(--ep-primary) 18%, transparent);
  --ep-shadow-2: 0 10px 30px color-mix(in srgb, var(--ep-primary) 24%, transparent);
  --ep-shadow-3: 0 16px 44px color-mix(in srgb, var(--ep-primary) 30%, transparent);

  --ep-blur-sm: blur(10px);
  --ep-blur-md: blur(18px);
  --ep-blur-lg: blur(26px);

  --ep-ease: cubic-bezier(0.2, 0.75, 0.2, 1);
  --ep-fast: 140ms;
  --ep-med: 240ms;
}

body {
  color: var(--ep-text);
  text-rendering: optimizeLegibility;
}

/* Typography rhythm */
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  letter-spacing: -0.02em;
  line-height: 1.2;
}

p, li, .form-text {
  color: var(--ep-text-muted);
}

/* -----------------------------------------
   Focus system (accessible + coherent)
   ----------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
.navbar-icon:focus-visible,
.product-card:focus-within,
.product-card__wishlist-btn:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ep-primary) 70%, white 30%);
  outline-offset: 2px;
}

/* -----------------------------------------
   Navbar + icon coherence
   ----------------------------------------- */
.navbar-liquid-glass {
  border-bottom-color: color-mix(in srgb, var(--ep-primary) 10%, transparent);
  box-shadow: var(--ep-shadow-1);
}

.navbar-liquid-glass .navbar-icon,
.navbar-liquid-glass .mini-cart-toggle {
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 12%, transparent);
  background: linear-gradient(145deg, color-mix(in srgb, var(--ep-base) 92%, var(--ep-accent) 8%), color-mix(in srgb, var(--ep-base) 70%, var(--ep-accent) 30%));
  backdrop-filter: var(--ep-blur-sm) saturate(130%);
  -webkit-backdrop-filter: var(--ep-blur-sm) saturate(130%);
  transition: transform var(--ep-fast) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease), border-color var(--ep-med) var(--ep-ease), background var(--ep-med) var(--ep-ease);
}

.navbar-liquid-glass .navbar-icon:hover,
.navbar-liquid-glass .mini-cart-toggle:hover {
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--ep-primary) 28%, transparent);
  box-shadow: 0 8px 22px rgba(47, 91, 255, 0.20);
}

/* -----------------------------------------
   Account dropdown polish (overrides inline style safely)
   ----------------------------------------- */
#account-dropdown {
  border-radius: var(--ep-radius-md) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 14%, transparent) !important;
  background: linear-gradient(145deg, rgba(255,255,255,0.92), rgba(255,255,255,0.82)) !important;
  backdrop-filter: var(--ep-blur-md) saturate(135%);
  -webkit-backdrop-filter: var(--ep-blur-md) saturate(135%);
  box-shadow: var(--ep-shadow-2) !important;
  overflow: hidden;
}

#account-dropdown a {
  font-weight: 520;
}

/* -----------------------------------------
   Buttons, forms, badges
   ----------------------------------------- */
.btn {
  border-radius: var(--ep-radius-sm);
  font-weight: 600;
  transition: transform var(--ep-fast) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease), background-color var(--ep-med) var(--ep-ease), border-color var(--ep-med) var(--ep-ease);
}

.btn:hover {
  transform: translateY(-1px);
}

.btn-primary {
  background: linear-gradient(145deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 74%, var(--ep-accent) 26%));
  border-color: transparent;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--ep-primary) 34%, transparent);
}

.btn-primary:hover,
.btn-primary:focus {
  background: linear-gradient(145deg, var(--ep-primary-hover), var(--ep-primary));
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ep-primary) 40%, transparent);
}

.form-control,
.form-select {
  border-radius: var(--ep-radius-sm);
  border-color: var(--ep-border);
  background: color-mix(in srgb, var(--ep-base) 88%, var(--ep-accent) 12%);
  transition: border-color var(--ep-med) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease), background var(--ep-med) var(--ep-ease);
}

.form-control:focus,
.form-select:focus {
  border-color: color-mix(in srgb, var(--ep-primary) 45%, white 55%);
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ep-primary) 18%, transparent);
}

.badge,
.cart-badge,
.navbar-liquid-glass .badge {
  border-radius: 999px;
  font-weight: 700;
  letter-spacing: 0.01em;
}

/* -----------------------------------------
   Product cards consistency
   ----------------------------------------- */
.product-card {
  border-radius: var(--ep-radius-xl);
  border-color: color-mix(in srgb, var(--ep-primary) 12%, transparent);
  box-shadow: var(--ep-shadow-1);
  transition: transform var(--ep-med) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease), border-color var(--ep-med) var(--ep-ease), backdrop-filter var(--ep-med) var(--ep-ease);
}

.product-card:hover {
  transform: translateY(-8px);
  border-color: color-mix(in srgb, var(--ep-primary) 24%, transparent);
  box-shadow: var(--ep-shadow-3);
}

.product-card__title a {
  text-decoration: none;
}

.product-card__title a:hover {
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

.product-card__wishlist-btn {
  border-radius: 999px;
}

/* -----------------------------------------
   Mini-cart premium system
   ----------------------------------------- */
.mini-cart-dropdown {
  border-radius: var(--ep-radius-lg);
  border: 1px solid color-mix(in srgb, var(--ep-primary) 14%, transparent);
  box-shadow: var(--ep-shadow-3);
  backdrop-filter: var(--ep-blur-lg) saturate(140%);
  -webkit-backdrop-filter: var(--ep-blur-lg) saturate(140%);
}

.mini-cart-item {
  transition: background-color var(--ep-fast) var(--ep-ease), transform var(--ep-fast) var(--ep-ease);
}

.mini-cart-item:hover {
  transform: translateX(2px);
}

.mini-cart-actions .btn {
  min-height: 42px;
}

/* -----------------------------------------
   Cards/layout cross-page consistency
   ----------------------------------------- */
.card,
.account-card,
.address-box,
.order-item,
.stat-item,
.download-item {
  border-radius: var(--ep-radius-md);
}

.card,
.account-card {
  border: 1px solid var(--ep-border-soft);
}

/* -----------------------------------------
   Motion system (lightweight, GPU-friendly)
   ----------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  .btn,
  .navbar-icon,
  .product-card,
  .mini-cart-dropdown,
  .quick-action-btn,
  .account-card {
    will-change: transform, opacity;
  }

  [data-shop-grid] > [class*="col-"] {
    animation: ep-fade-up 360ms var(--ep-ease) both;
  }

  [data-shop-grid] > [class*="col-"]:nth-child(2n) { animation-delay: 30ms; }
  [data-shop-grid] > [class*="col-"]:nth-child(3n) { animation-delay: 60ms; }
}

@keyframes ep-fade-up {
  from {
    opacity: 0;
    transform: translate3d(0, 8px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* -----------------------------------------
   Responsive premium tuning
   ----------------------------------------- */
@media (max-width: 991.98px) {
  .product-card {
    border-radius: var(--ep-radius-lg);
  }

  .mini-cart-dropdown {
    max-height: calc(100dvh - 84px);
  }
}

@media (max-width: 575.98px) {
  .product-card {
    border-radius: var(--ep-radius-md);
  }

  .product-card__content {
    padding: 16px;
  }

  .navbar-liquid-glass .navbar-icon,
  .navbar-liquid-glass .mini-cart-toggle {
    width: 42px;
    height: 42px;
  }
}

/* -----------------------------------------
   Dark scheme balancing
   ----------------------------------------- */
@media (prefers-color-scheme: dark) {
  :root {
    --ep-surface: color-mix(in srgb, var(--ep-primary) 24%, var(--ep-base) 76%);
    --ep-surface-strong: color-mix(in srgb, var(--ep-primary) 30%, var(--ep-base) 70%);
    --ep-border: color-mix(in srgb, var(--ep-accent) 42%, var(--ep-primary) 58%);
    --ep-text: color-mix(in srgb, var(--ep-base) 78%, var(--ep-accent) 22%);
    --ep-text-muted: color-mix(in srgb, var(--ep-base) 54%, var(--ep-accent) 46%);
  }

  #account-dropdown {
    background: linear-gradient(145deg, color-mix(in srgb, var(--ep-primary) 34%, var(--ep-base) 66%), color-mix(in srgb, var(--ep-primary) 50%, var(--ep-accent) 50%)) !important;
  }
}

/* -----------------------------------------
   Page-level premium harmonization
   ----------------------------------------- */

/* My Account + Wishlist hero sections */
.my-account-header,
.wishlist-header {
  border-radius: 0 0 var(--ep-radius-xl) var(--ep-radius-xl);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.24);
}

.my-account-header .lead,
.wishlist-header .lead {
  max-width: 70ch;
}

/* Harmonize cards with inline styles in templates */
.my-account-main .card,
.wishlist-header + .container .card,
.wishlist-header + .container .account-card {
  border-radius: var(--ep-radius-lg) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 12%, transparent) !important;
  box-shadow: var(--ep-shadow-1) !important;
}

/* Order status badges readability */
.status-badge {
  border: 1px solid color-mix(in srgb, currentColor 25%, transparent);
  font-weight: 650;
  letter-spacing: 0.01em;
}

/* Wishlist/My-account CTA consistency even when inline styles are present */
.my-account-main .btn-primary,
.wishlist-header + .container .btn-primary {
  border-radius: var(--ep-radius-sm) !important;
  box-shadow: 0 8px 18px rgba(47, 91, 255, 0.28) !important;
}

.my-account-main .btn-outline-primary,
.wishlist-header + .container .btn-outline-primary {
  border-radius: var(--ep-radius-sm) !important;
}

/* Shop page hierarchy */
.shop-page .woocommerce-breadcrumb,
.shop-page nav.woocommerce-breadcrumb {
  font-size: 0.875rem;
  color: var(--ep-text-muted);
  margin-bottom: 1.25rem;
}

.shop-page .woocommerce-breadcrumb a,
.shop-page nav.woocommerce-breadcrumb a {
  color: color-mix(in srgb, var(--ep-primary) 78%, var(--ep-base) 22%);
  text-decoration: none;
}

.shop-page .woocommerce-breadcrumb a:hover,
.shop-page nav.woocommerce-breadcrumb a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* Better spacing rhythm for ecommerce content blocks */
.site-main .container > .row.g-4,
.site-main .container .row.g-4 {
  --bs-gutter-x: clamp(0.9rem, 2vw, 1.5rem);
  --bs-gutter-y: clamp(0.9rem, 2vw, 1.5rem);
}

/* Premium empty-state visual language */
.empty-state {
  background: linear-gradient(145deg, rgba(255,255,255,0.55), rgba(255,255,255,0.38));
  border: 1px solid color-mix(in srgb, var(--ep-primary) 10%, transparent);
  border-radius: var(--ep-radius-md);
}

/* Mini-cart actions: avoid cramped labels */
.mini-cart-actions .btn,
.mini-cart-actions .btn-cart,
.mini-cart-actions .btn-checkout {
  font-size: 0.82rem;
  letter-spacing: 0.02em;
}

/* -----------------------------------------
   Fine responsive tuning
   ----------------------------------------- */
@media (max-width: 767.98px) {
  .my-account-header,
  .wishlist-header {
    border-radius: 0 0 var(--ep-radius-lg) var(--ep-radius-lg);
  }

  .my-account-header h1,
  .wishlist-header h1 {
    font-size: clamp(1.45rem, 6vw, 2.1rem) !important;
    line-height: 1.15;
  }

  .my-account-main .account-card,
  .wishlist-header + .container .card,
  .product-card {
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.10) !important;
  }

  .product-card__actions .btn {
    min-height: 40px;
    font-size: 0.9rem;
  }
}

@media (min-width: 1440px) {
  .shop-page .container,
  .my-account-main .container,
  .wishlist-header + .container {
    max-width: min(1360px, 92vw);
  }
}

/* -----------------------------------------
   Semantic classes extracted from templates
   ----------------------------------------- */

/* Header account dropdown */
.account-menu-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

#account-dropdown,
.account-dropdown {
  display: none;
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  min-width: 260px;
  width: max-content;
  max-width: min(92vw, 340px);
  z-index: 2000;
}

.account-dropdown-user {
  padding: 12px 16px;
  border-bottom: 1px solid color-mix(in srgb, var(--ep-primary) 10%, transparent);
}

.account-dropdown-name {
  margin: 0;
  font-weight: 650;
  color: var(--ep-text);
}

.account-dropdown-email {
  margin: 4px 0 0;
  font-size: 0.85rem;
  color: var(--ep-text-muted);
}

.account-dropdown-link {
  display: block;
  padding: 10px 16px;
  color: var(--ep-text);
  text-decoration: none;
  transition: background-color var(--ep-fast) var(--ep-ease), color var(--ep-fast) var(--ep-ease);
  border: 0;
  background: transparent;
  width: 100%;
  text-align: left;
}

.account-dropdown-link:hover {
  background: color-mix(in srgb, var(--ep-primary) 8%, transparent);
  color: color-mix(in srgb, var(--ep-primary) 78%, var(--ep-base) 22%);
}

.account-dropdown-footer {
  padding: 8px 16px;
  border-top: 1px solid color-mix(in srgb, var(--ep-primary) 10%, transparent);
}

@media (max-width: 991.98px) {
  #account-dropdown,
  .account-dropdown {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    min-width: 240px;
    max-width: min(94vw, 320px);
  }
}

.account-dropdown-link-danger {
  color: var(--ep-danger);
  margin: -10px -16px;
}

.account-dropdown-link-danger:hover {
  background: color-mix(in srgb, var(--ep-danger) 10%, transparent);
  color: color-mix(in srgb, var(--ep-primary) 68%, var(--ep-secondary) 32%);
}

/* Wishlist guest/auth + hero */
.wishlist-auth-card {
  background: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.85) 100%);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  border: 1.5px solid rgba(255,255,255,0.6);
  border-radius: 28px;
  padding: 60px 40px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15);
}

.wishlist-auth-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--ep-text);
  margin-bottom: 16px;
}

.wishlist-auth-text {
  color: var(--ep-text-muted);
  font-size: 0.95rem;
  margin-bottom: 30px;
}

.wishlist-auth-btn {
  background: linear-gradient(135deg, var(--ep-primary) 0%, color-mix(in srgb, var(--ep-primary) 72%, var(--ep-accent) 28%) 100%);
  color: var(--ep-base);
  border: 0;
  padding: 14px 32px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
  transition: transform var(--ep-fast) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease);
  box-shadow: 0 4px 15px color-mix(in srgb, var(--ep-primary) 34%, transparent);
}

.wishlist-auth-btn:hover {
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ep-primary) 40%, transparent);
  transform: translateY(-2px);
}

.wishlist-hero {
  background: linear-gradient(135deg, var(--ep-primary) 0%, color-mix(in srgb, var(--ep-primary) 58%, var(--ep-secondary) 42%) 55%, var(--ep-secondary) 100%);
  padding: 60px 20px;
  position: relative;
  overflow: hidden;
}

.wishlist-hero-overlay {
  position: absolute;
  inset: 0;
  backdrop-filter: blur(10px);
  opacity: 0.1;
}

.wishlist-hero-logo-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
}

.wishlist-hero-logo {
  max-width: 300px;
  height: auto;
  opacity: 0.9;
  filter: drop-shadow(0 4px 15px rgba(0, 0, 0, 0.2));
}

.wishlist-hero-content {
  position: relative;
  z-index: 1;
}

.wishlist-hero-title {
  font-size: 3rem;
  font-weight: 700;
  color: var(--ep-base);
  letter-spacing: -1px;
}

.wishlist-hero-subtitle {
  color: color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%);
  font-size: 1.125rem;
}

.wishlist-empty-card {
  background: rgba(255,255,255,0.5);
  backdrop-filter: blur(30px);
  border-radius: 24px;
  padding: 60px;
  text-align: center;
  box-shadow: 0 8px 32px rgba(31,38,135,0.1);
}

.wishlist-empty-icon {
  font-size: 4rem;
  margin-bottom: 20px;
}

.wishlist-empty-cta {
  border-radius: 12px !important;
  padding: 12px 32px;
  font-weight: 600;
}

.wishlist-stats-card {
  background: rgba(255,255,255,0.7);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  border: 1.5px solid rgba(255,255,255,0.6);
  border-radius: 20px;
  box-shadow: 0 8px 32px rgba(31,38,135,0.08);
}

.wishlist-stats-body {
  padding: 24px;
}

.wishlist-stats-title {
  font-weight: 700;
  color: var(--ep-text);
}

.wishlist-stats-label {
  font-size: 0.875rem;
  color: var(--ep-text-muted);
}

.wishlist-stats-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--ep-primary) !important;
}

.wishlist-stats-cta {
  border-radius: 12px !important;
  font-weight: 600;
}

/* My Account guest/auth + hero */
.account-auth-card {
  background: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(255,255,255,0.85) 100%);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  border: 1.5px solid rgba(255,255,255,0.6);
  border-radius: 28px;
  padding: 60px 40px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15);
}

.account-auth-title {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--ep-text);
  margin-bottom: 16px;
}

.account-auth-text {
  color: var(--ep-text-muted);
  font-size: 0.95rem;
  margin-bottom: 30px;
}

.account-auth-btn {
  background: linear-gradient(135deg, var(--ep-primary) 0%, color-mix(in srgb, var(--ep-primary) 76%, var(--ep-accent) 24%) 100%);
  color: var(--ep-base);
  border: 0;
  padding: 14px 32px;
  border-radius: 12px;
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
  transition: transform var(--ep-fast) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease);
  box-shadow: 0 4px 15px color-mix(in srgb, var(--ep-primary) 34%, transparent);
}

.account-auth-btn:hover {
  box-shadow: 0 8px 24px color-mix(in srgb, var(--ep-primary) 40%, transparent);
  transform: translateY(-2px);
}

.my-account-hero {
  background: linear-gradient(135deg, var(--ep-primary) 0%, color-mix(in srgb, var(--ep-primary) 58%, var(--ep-secondary) 42%) 55%, var(--ep-secondary) 100%);
  padding: 60px 20px;
  position: relative;
  overflow: hidden;
}

.my-account-hero-overlay {
  position: absolute;
  inset: 0;
  backdrop-filter: blur(10px);
  opacity: 0.1;
}

.my-account-hero-logo-wrap {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 0;
}

.my-account-hero-logo {
  max-width: 200px;
  height: auto;
  opacity: 0.9;
  filter: drop-shadow(0 4px 15px rgba(0,0,0,0.2));
}

.my-account-hero-content {
  position: relative;
  z-index: 1;
}

.my-account-hero-title {
  font-size: 3rem;
  font-weight: 700;
  color: var(--ep-base);
  letter-spacing: -1px;
}

.my-account-hero-subtitle {
  color: color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%);
  font-size: 1.125rem;
}

@media (max-width: 767.98px) {
  .wishlist-auth-card,
  .account-auth-card {
    padding: 36px 22px;
    border-radius: 20px;
  }

  .wishlist-hero-logo,
  .my-account-hero-logo {
    max-width: 160px;
  }

  .wishlist-hero-title,
  .my-account-hero-title {
    font-size: clamp(1.45rem, 6vw, 2.1rem);
  }

  .wishlist-empty-card {
    padding: 34px 18px;
  }
}

/* -----------------------------------------
   My Account extracted template styles
   ----------------------------------------- */

/* ===== MY ACCOUNT CARD STYLING ===== */
.my-account-main .account-card {
  background: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(30px) saturate(180%);
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  border: 1.5px solid rgba(255, 255, 255, 0.6);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(31, 38, 135, 0.08);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.my-account-main .account-card:hover {
  box-shadow: 0 12px 48px rgba(31, 38, 135, 0.12);
  transform: translateY(-2px);
  backdrop-filter: blur(35px) saturate(185%);
  -webkit-backdrop-filter: blur(35px) saturate(185%);
}

.my-account-main .account-card .card-header {
  background: rgba(12, 99, 228, 0.05);
  border-bottom: 1px solid rgba(12, 99, 228, 0.1);
  padding: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.my-account-main .account-card .card-header h2,
.my-account-main .account-card .card-header h3 {
  color: var(--ep-text);
  font-weight: 700;
  font-size: 1.25rem;
  display: flex;
  align-items: center;
  gap: 12px;
}

.my-account-main .account-card .card-header span.material-symbols-outlined {
  color: var(--ep-primary);
  font-size: 1.75rem;
}

.my-account-main .account-card .card-body {
  padding: 24px;
}

/* ===== PROFILE FIELDS ===== */
.my-account-main .profile-field {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 12px;
  border: 1px solid rgba(12, 99, 228, 0.1);
  transition: all 0.3s ease;
}

.my-account-main .profile-field:hover {
  background: rgba(12, 99, 228, 0.05);
  border-color: rgba(12, 99, 228, 0.2);
}

.my-account-main .profile-field span.material-symbols-outlined {
  color: var(--ep-primary);
  font-size: 1.25rem;
}

.my-account-main .profile-field span {
  font-size: 0.95rem;
  color: var(--ep-text);
}

/* ===== ORDER ITEMS ===== */
.my-account-main .orders-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.my-account-main .order-item {
  padding: 16px;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(12, 99, 228, 0.1);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.my-account-main .order-item:hover {
  background: rgba(12, 99, 228, 0.05);
  border-color: rgba(12, 99, 228, 0.2);
  transform: translateX(4px);
}

.my-account-main .order-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 16px;
  gap: 16px;
}

.my-account-main .order-info {
  flex: 1;
}

.my-account-main .order-number {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--ep-text);
  margin: 0;
}

.my-account-main .order-date {
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 4px;
}

.my-account-main .order-date span.material-symbols-outlined {
  font-size: 1rem;
}

.my-account-main .order-status {
  text-align: right;
}

.my-account-main .status-badge {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 0.825rem;
  font-weight: 600;
  text-transform: capitalize;
}

.my-account-main .order-details {
  display: flex;
  gap: 20px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(12, 99, 228, 0.1);
}

.my-account-main .order-details .detail {
  display: flex;
  flex-direction: column;
}

.my-account-main .order-details .detail .label {
  font-size: 0.75rem;
  text-transform: uppercase;
  color: var(--ep-text-muted);
  font-weight: 600;
}

.my-account-main .order-details .detail .value {
  font-size: 1rem;
  font-weight: 600;
  color: var(--ep-text);
  margin-top: 4px;
}

/* ===== ADDRESS BOX ===== */
.my-account-main .address-box {
  padding: 16px;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(12, 99, 228, 0.1);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.my-account-main .address-box:hover {
  background: rgba(12, 99, 228, 0.05);
  border-color: rgba(12, 99, 228, 0.2);
}

.my-account-main .address-box p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--ep-text);
  margin-bottom: 12px;
}

/* ===== STATS ITEMS ===== */
.my-account-main .stat-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 12px;
  border: 1px solid rgba(12, 99, 228, 0.1);
  margin-bottom: 16px;
  transition: all 0.3s ease;
}

.my-account-main .stat-item:hover {
  background: rgba(12, 99, 228, 0.05);
  border-color: rgba(12, 99, 228, 0.2);
}

.my-account-main .stat-item:last-child {
  margin-bottom: 0;
}

.my-account-main .stat-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: rgba(12, 99, 228, 0.1);
  border-radius: 12px;
}

.my-account-main .stat-icon span.material-symbols-outlined {
  color: var(--ep-primary);
  font-size: 1.5rem;
}

.my-account-main .stat-content {
  flex: 1;
}

.my-account-main .stat-label {
  font-size: 0.75rem;
  text-transform: uppercase;
  color: var(--ep-text-muted);
  font-weight: 600;
  margin-bottom: 4px;
}

.my-account-main .stat-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--ep-primary);
  margin: 0;
}

/* ===== QUICK ACTION BUTTONS ===== */
.my-account-main .quick-action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 12px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.my-account-main .quick-action-btn span.material-symbols-outlined {
  font-size: 1.25rem;
}

.my-account-main .quick-action-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px color-mix(in srgb, var(--ep-primary) 34%, transparent);
}

/* ===== DOWNLOADS LIST ===== */
.my-account-main .downloads-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.my-account-main .download-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(12, 99, 228, 0.1);
  border-radius: 12px;
  transition: all 0.3s ease;
  gap: 16px;
}

.my-account-main .download-item:hover {
  background: rgba(12, 99, 228, 0.05);
  border-color: rgba(12, 99, 228, 0.2);
}

.my-account-main .download-info {
  flex: 1;
}

.my-account-main .download-info h5 {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--ep-text);
  margin-bottom: 4px;
}

.my-account-main .download-info p {
  font-size: 0.825rem;
  color: var(--ep-text-muted);
  margin: 0;
}

.my-account-main .download-action .btn {
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ===== EMPTY STATE ===== */
.my-account-main .empty-state {
  text-align: center;
  padding: 40px 20px;
}

.my-account-main .empty-state span.material-symbols-outlined {
  font-size: 3rem;
  color: var(--ep-primary);
  margin-bottom: 16px;
  display: block;
}

.my-account-main .empty-state p {
  color: var(--ep-text-muted);
  margin-bottom: 20px;
  font-size: 0.95rem;
}

/* ===== BUTTONS STYLING ===== */
.my-account-main .btn-primary {
  background-color: var(--ep-primary) !important;
  border-color: var(--ep-primary) !important;
  color: var(--ep-base) !important;
  font-weight: 600;
  transition: all 0.3s ease;
}

.my-account-main .btn-primary:hover {
  background-color: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-secondary) 16%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-secondary) 16%) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px color-mix(in srgb, var(--ep-primary) 34%, transparent) !important;
}

.my-account-main .btn-outline-primary {
  border-color: var(--ep-primary) !important;
  color: var(--ep-primary) !important;
  background-color: transparent;
  font-weight: 600;
  transition: all 0.3s ease;
}

.my-account-main .btn-outline-primary:hover {
  background-color: color-mix(in srgb, var(--ep-accent) 42%, var(--ep-base) 58%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-secondary) 16%) !important;
  color: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-secondary) 16%) !important;
}

.my-account-main .btn-outline-danger {
  border-color: color-mix(in srgb, var(--ep-secondary) 78%, var(--ep-primary) 22%) !important;
  color: color-mix(in srgb, var(--ep-primary) 58%, var(--ep-secondary) 42%) !important;
  background-color: transparent;
  font-weight: 600;
  transition: all 0.3s ease;
}

.my-account-main .btn-outline-danger:hover {
  background-color: color-mix(in srgb, var(--ep-secondary) 32%, var(--ep-base) 68%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 64%, var(--ep-secondary) 36%) !important;
  color: color-mix(in srgb, var(--ep-primary) 68%, var(--ep-secondary) 32%) !important;
}

.my-account-main .form-label {
  font-weight: 600;
  color: var(--ep-text);
  margin-bottom: 8px;
  font-size: 0.875rem;
  text-transform: uppercase;
}

/* ===== RESPONSIVE - TABLET ===== */
@media (max-width: 991px) {
  .my-account-header {
    padding: 40px 20px;
  }

  .my-account-header h1 {
    font-size: 2rem !important;
  }

  .my-account-main .account-card .card-header h2,
  .my-account-main .account-card .card-header h3 {
    font-size: 1.1rem;
  }

  .my-account-main .order-header {
    flex-direction: column;
  }

  .my-account-main .order-status {
    text-align: left;
  }

  .my-account-main .row.g-4 > [class*='col-'] {
    margin-bottom: 8px;
  }
}

/* ===== RESPONSIVE - MOBILE ===== */
@media (max-width: 575px) {
  .my-account-header {
    padding: 30px 16px;
  }

  .my-account-header h1 {
    font-size: 1.5rem !important;
    margin-bottom: 8px !important;
  }

  .my-account-header .lead {
    font-size: 0.95rem !important;
  }

  .my-account-main .account-card {
    border-radius: 16px;
  }

  .my-account-main .account-card .card-header {
    padding: 16px;
  }

  .my-account-main .account-card .card-header h2,
  .my-account-main .account-card .card-header h3 {
    font-size: 1rem;
  }

  .my-account-main .account-card .card-header span.material-symbols-outlined {
    font-size: 1.5rem;
  }

  .my-account-main .account-card .card-body {
    padding: 16px;
  }

  .my-account-main .profile-field {
    padding: 10px 12px;
    font-size: 0.9rem;
  }

  .my-account-main .order-details {
    flex-direction: column;
    gap: 12px;
  }

  .my-account-main .stat-item {
    padding: 12px;
  }

  .my-account-main .stat-icon {
    width: 40px;
    height: 40px;
  }

  .my-account-main .stat-icon span.material-symbols-outlined {
    font-size: 1.25rem;
  }

  .my-account-main .stat-value {
    font-size: 1.25rem;
  }

  .my-account-main .form-label {
    font-size: 0.8rem;
  }

  .my-account-main .quick-action-btn {
    padding: 10px 14px;
    font-size: 0.9rem;
  }

  .my-account-main .quick-action-btn span.material-symbols-outlined {
    font-size: 1rem;
  }

  .my-account-main .address-box,
  .my-account-main .download-item,
  .my-account-main .order-item,
  .my-account-main .profile-field {
    border-radius: 10px;
  }

  /* Stack downloads and addresses on mobile */
  .my-account-main .row.g-4 {
    row-gap: 16px !important;
  }

  .my-account-main .row > .col-md-6 {
    width: 100% !important;
  }
}

/* ===== EXTRA SMALL PHONES ===== */
@media (max-width: 360px) {
  .my-account-header h1 {
    font-size: 1.25rem !important;
  }

  .my-account-main .account-card .card-header h2,
  .my-account-main .account-card .card-header h3 {
    font-size: 0.95rem;
  }

  .my-account-main .stat-value {
    font-size: 1.1rem;
  }

  .my-account-main .quick-action-btn {
    flex-direction: column;
    gap: 4px;
  }
}

/* ===== MODAL STYLES ===== */
.my-account-modal {
  display: none !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 99999 !important;
  padding: 20px !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
}

.my-account-modal.show {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.my-account-modal .modal-backdrop {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.5) !important;
  backdrop-filter: blur(5px) !important;
  z-index: 1 !important;
  box-sizing: border-box !important;
}

.my-account-modal .modal-content {
  position: relative !important;
  z-index: 10 !important;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(30px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(180%) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.6) !important;
  border-radius: 20px !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2) !important;
  max-width: 500px !important;
  width: 100% !important;
  max-height: calc(100dvh - 40px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  animation: modalSlideIn 0.3s ease-out !important;
  box-sizing: border-box !important;
  margin: auto !important;
  overscroll-behavior: contain;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

/* prevent pseudo decorative layers from extending scroll area in account modals */
.my-account-modal .modal-content::before,
.my-account-modal .modal-content::after {
  content: none !important;
}

.my-account-modal .modal-content::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
}

.my-account-modal .modal-content.modal-lg {
  max-width: 700px;
}

@keyframes modalSlideIn {
  from {
    opacity: 0;
    transform: translateY(-50px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.my-account-modal .modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px;
  border-bottom: 1px solid color-mix(in srgb, var(--ep-primary) 18%, var(--ep-base) 82%);
  background: color-mix(in srgb, var(--ep-primary) 8%, var(--ep-base) 92%);
}

.my-account-modal .modal-title {
  color: var(--ep-text);
  font-weight: 700;
  font-size: 1.25rem;
  margin: 0;
}

.my-account-modal .modal-close {
  background: none;
  border: none;
  color: var(--ep-text-muted);
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  transition: all 0.2s ease;
}

.my-account-modal .modal-close:hover {
  background: color-mix(in srgb, var(--ep-primary) 14%, var(--ep-base) 86%);
  color: var(--ep-primary);
}

.my-account-modal .modal-body {
  padding: 24px;
  overflow-x: hidden;
  overflow-y: visible;
}

.my-account-modal form,
.my-account-modal .row,
.my-account-modal [class*='col-'] {
  max-width: 100%;
}

.my-account-modal .form-group {
  margin-bottom: 1rem;
}

.my-account-modal .form-label {
  display: block;
  font-weight: 600;
  color: var(--ep-text);
  font-size: 0.9rem;
  margin-bottom: 8px;
}

.my-account-modal .form-control {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 10px 14px;
  border: 1.5px solid color-mix(in srgb, var(--ep-primary) 24%, var(--ep-base) 76%);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.7);
  color: var(--ep-text);
  font-size: 0.95rem;
  transition: all 0.2s ease;
  box-sizing: border-box;
  font-family: inherit;
}

.my-account-modal .form-control:focus {
  outline: none;
  border-color: var(--ep-primary);
  background: var(--ep-base);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ep-accent) 52%, transparent);
}

.my-account-modal .btn {
  padding: 12px 24px;
  font-weight: 600;
  border-radius: 10px;
  transition: all 0.2s ease;
}

.my-account-modal .form-text {
  display: block;
  font-size: 0.8rem;
  color: var(--ep-text-muted);
  margin-top: 4px;
}

/* ===== PASSWORD ERROR MESSAGE ===== */
.password-error-message {
  display: none;
  padding: 12px;
  margin-top: 8px;
  background: color-mix(in srgb, var(--ep-secondary) 30%, var(--ep-base) 70%);
  border: 1px solid color-mix(in srgb, var(--ep-secondary) 64%, var(--ep-primary) 36%);
  border-radius: 8px;
  color: color-mix(in srgb, var(--ep-primary) 72%, var(--ep-secondary) 28%);
  font-size: 0.85rem;
  font-weight: 500;
}

.password-error-message.show {
  display: block;
}

/* ===== RESPONSIVE MODALS ===== */
@media (max-width: 576px) {
  .my-account-modal {
    padding: 10px;
  }

  .my-account-modal .modal-content {
    max-width: 100%;
    max-height: calc(100dvh - 20px) !important;
    border-radius: 16px;
  }

  .my-account-modal .modal-header,
  .my-account-modal .modal-body {
    padding: 16px;
  }
}

/* -----------------------------------------
   PALETTE LOCK — Global ecommerce coherence
   Allowed palette only:
   #0f70fd, #ffd832, #aee1f9, #fdfdfb
   ----------------------------------------- */

body,
.site,
.site-main {
  background: var(--ep-bg) !important;
  color: var(--ep-text);
}

a {
  color: var(--ep-primary);
}

a:hover {
  color: color-mix(in srgb, var(--ep-primary) 72%, var(--ep-secondary) 28%);
}

.navbar-liquid-glass {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-base) 84%, var(--ep-accent) 16%), color-mix(in srgb, var(--ep-base) 74%, var(--ep-accent) 26%)) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ep-primary) 24%, var(--ep-base) 76%) !important;
}

.btn-primary,
.my-account-main .btn-primary,
.wishlist-header + .container .btn-primary {
  background: linear-gradient(135deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 78%, var(--ep-accent) 22%)) !important;
  border-color: var(--ep-primary) !important;
  color: var(--ep-base) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.my-account-main .btn-primary:hover,
.wishlist-header + .container .btn-primary:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-primary) 80%, var(--ep-secondary) 20%), var(--ep-primary)) !important;
  border-color: var(--ep-primary) !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ep-primary) 38%, transparent) !important;
}

.btn-outline-primary,
.my-account-main .btn-outline-primary {
  border-color: var(--ep-primary) !important;
  color: var(--ep-primary) !important;
  background: color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%) !important;
}

.btn-outline-primary:hover,
.my-account-main .btn-outline-primary:hover {
  background: color-mix(in srgb, var(--ep-accent) 56%, var(--ep-base) 44%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 85%, var(--ep-secondary) 15%) !important;
  color: color-mix(in srgb, var(--ep-primary) 82%, var(--ep-secondary) 18%) !important;
}

.btn-outline-danger,
.my-account-main .btn-outline-danger,
.account-dropdown-link-danger {
  border-color: color-mix(in srgb, var(--ep-secondary) 78%, var(--ep-primary) 22%) !important;
  color: color-mix(in srgb, var(--ep-primary) 58%, var(--ep-secondary) 42%) !important;
}

.btn-outline-danger:hover,
.my-account-main .btn-outline-danger:hover,
.account-dropdown-link-danger:hover {
  background: color-mix(in srgb, var(--ep-secondary) 38%, var(--ep-base) 62%) !important;
  color: color-mix(in srgb, var(--ep-primary) 70%, var(--ep-secondary) 30%) !important;
}

.card,
.account-card,
.wishlist-auth-card,
.wishlist-stats-card,
.my-account-main .account-card,
.my-account-modal .modal-content,
.mini-cart-dropdown {
  background: linear-gradient(145deg, color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%), color-mix(in srgb, var(--ep-base) 78%, var(--ep-accent) 22%)) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 20%, var(--ep-base) 80%) !important;
  box-shadow: var(--ep-shadow-2) !important;
}

.my-account-hero,
.wishlist-hero,
.my-account-header,
.wishlist-header {
  background: linear-gradient(135deg, var(--ep-primary) 0%, color-mix(in srgb, var(--ep-primary) 58%, var(--ep-secondary) 42%) 55%, var(--ep-secondary) 100%) !important;
}

.my-account-hero-title,
.wishlist-hero-title,
.my-account-hero-subtitle,
.wishlist-hero-subtitle {
  color: var(--ep-base) !important;
}

.form-control,
.form-select,
.my-account-modal .form-control {
  background: color-mix(in srgb, var(--ep-base) 86%, var(--ep-accent) 14%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 26%, var(--ep-base) 74%) !important;
  color: var(--ep-text) !important;
}

.form-control:focus,
.form-select:focus,
.my-account-modal .form-control:focus {
  border-color: var(--ep-primary) !important;
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ep-accent) 52%, transparent) !important;
}

.badge,
.cart-badge,
.navbar-liquid-glass .badge,
.wishlist-stats-value,
.my-account-main .stat-value {
  background: linear-gradient(135deg, var(--ep-secondary), color-mix(in srgb, var(--ep-secondary) 70%, var(--ep-accent) 30%)) !important;
  color: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-base) 16%) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 22%, var(--ep-secondary) 78%) !important;
}

.empty-state,
.my-account-main .empty-state,
.wishlist-empty-card {
  background: linear-gradient(145deg, color-mix(in srgb, var(--ep-base) 86%, var(--ep-accent) 14%), color-mix(in srgb, var(--ep-base) 74%, var(--ep-accent) 26%)) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 18%, var(--ep-base) 82%) !important;
}

.password-error-message {
  background: color-mix(in srgb, var(--ep-secondary) 30%, var(--ep-base) 70%) !important;
  border-color: color-mix(in srgb, var(--ep-secondary) 64%, var(--ep-primary) 36%) !important;
  color: color-mix(in srgb, var(--ep-primary) 72%, var(--ep-secondary) 28%) !important;
}

/* -----------------------------------------
   Bootstrap + Woo global token remap
   ----------------------------------------- */
:root {
  --bs-primary: #0f70fd;
  --bs-primary-rgb: 15, 112, 253;
  --bs-secondary: #aee1f9;
  --bs-secondary-rgb: 174, 225, 249;
  --bs-info: #aee1f9;
  --bs-info-rgb: 174, 225, 249;
  --bs-warning: #ffd832;
  --bs-warning-rgb: 255, 216, 50;
  --bs-danger: #ffd832;
  --bs-danger-rgb: 255, 216, 50;
  --bs-light: #fdfdfb;
  --bs-light-rgb: 253, 253, 251;
  --bs-dark: #0f70fd;
  --bs-dark-rgb: 15, 112, 253;
  --bs-body-bg: #fdfdfb;
  --bs-body-color: color-mix(in srgb, #0f70fd 86%, #fdfdfb 14%);
  --bs-border-color: color-mix(in srgb, #0f70fd 18%, #fdfdfb 82%);
  --bs-link-color: #0f70fd;
  --bs-link-hover-color: color-mix(in srgb, #0f70fd 78%, #ffd832 22%);
  --bs-focus-ring-color: color-mix(in srgb, #aee1f9 68%, transparent);
}

/* Header/menu/nav */
.navbar,
.navbar-liquid-glass,
.nav-menu,
.nav-menu a,
.navbar .dropdown-menu,
.offcanvas,
.offcanvas-header,
.offcanvas-body,
.mobile-menu,
.mobile-menu-btn {
  color: var(--ep-text);
}

.nav-menu a:hover,
.nav-menu .current-menu-item > a,
.nav-menu .current_page_item > a,
.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: var(--ep-primary) !important;
}

.navbar .dropdown-item:hover,
.navbar .dropdown-item:focus,
.account-dropdown-link:hover {
  background: color-mix(in srgb, var(--ep-accent) 52%, var(--ep-base) 48%) !important;
  color: var(--ep-primary) !important;
}

/* Footer */
footer,
.site-footer,
#colophon,
footer a,
.site-footer a,
#colophon a {
  color: var(--ep-text);
}

footer,
.site-footer,
#colophon {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-base) 82%, var(--ep-accent) 18%), color-mix(in srgb, var(--ep-base) 68%, var(--ep-accent) 32%)) !important;
  border-top: 1px solid color-mix(in srgb, var(--ep-primary) 20%, var(--ep-base) 80%) !important;
}

footer a:hover,
.site-footer a:hover,
#colophon a:hover {
  color: var(--ep-primary) !important;
}

/* Popups / modals / notices */
.modal-content,
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.alert,
.toast,
.popover {
  border-color: color-mix(in srgb, var(--ep-primary) 22%, var(--ep-base) 78%) !important;
  box-shadow: var(--ep-shadow-2) !important;
}

.woocommerce-message,
.woocommerce-info,
.alert-info,
.alert-success {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-base) 82%, var(--ep-accent) 18%), color-mix(in srgb, var(--ep-base) 68%, var(--ep-accent) 32%)) !important;
  color: var(--ep-text) !important;
}

.woocommerce-error,
.alert-danger,
.alert-warning {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-base) 74%, var(--ep-secondary) 26%), color-mix(in srgb, var(--ep-base) 62%, var(--ep-secondary) 38%)) !important;
  color: color-mix(in srgb, var(--ep-primary) 72%, var(--ep-secondary) 28%) !important;
}

/* Woo ecommerce surfaces */
.woocommerce div.product,
.woocommerce .woocommerce-tabs,
.woocommerce-cart .cart_totals,
.woocommerce-checkout .woocommerce-checkout-review-order,
.woocommerce table.shop_table,
.widget,
.select2-dropdown,
.select2-container .select2-selection--single {
  background: linear-gradient(145deg, color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%), color-mix(in srgb, var(--ep-base) 78%, var(--ep-accent) 22%)) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 20%, var(--ep-base) 80%) !important;
}

.woocommerce .price,
.woocommerce-Price-amount,
.amount {
  color: var(--ep-primary) !important;
}

.onsale,
.woocommerce span.onsale,
.badge,
.cart-badge {
  background: linear-gradient(135deg, var(--ep-secondary), color-mix(in srgb, var(--ep-secondary) 70%, var(--ep-accent) 30%)) !important;
  color: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-base) 16%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 22%, var(--ep-secondary) 78%) !important;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span,
.page-link {
  background: color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 20%, var(--ep-base) 80%) !important;
  color: var(--ep-primary) !important;
}

.woocommerce nav.woocommerce-pagination ul li span.current,
.page-item.active .page-link {
  background: linear-gradient(135deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 78%, var(--ep-accent) 22%)) !important;
  border-color: var(--ep-primary) !important;
  color: var(--ep-base) !important;
}

/* Explicit order status classes */
.status-badge.status-pending,
.status-pending {
  background: color-mix(in srgb, var(--ep-secondary) 34%, var(--ep-base) 66%) !important;
  color: color-mix(in srgb, var(--ep-primary) 76%, var(--ep-secondary) 24%) !important;
}

.status-badge.status-processing,
.status-processing {
  background: linear-gradient(135deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 82%, var(--ep-accent) 18%)) !important;
  color: var(--ep-base) !important;
}

.status-badge.status-on-hold,
.status-on-hold {
  background: color-mix(in srgb, var(--ep-accent) 64%, var(--ep-base) 36%) !important;
  color: color-mix(in srgb, var(--ep-primary) 84%, var(--ep-base) 16%) !important;
}

.status-badge.status-completed,
.status-completed {
  background: linear-gradient(135deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 78%, var(--ep-accent) 22%)) !important;
  color: var(--ep-base) !important;
}

.status-badge.status-cancelled,
.status-cancelled {
  background: color-mix(in srgb, var(--ep-secondary) 42%, var(--ep-base) 58%) !important;
  color: color-mix(in srgb, var(--ep-primary) 72%, var(--ep-secondary) 28%) !important;
}

.status-badge.status-refunded,
.status-refunded {
  background: color-mix(in srgb, var(--ep-accent) 68%, var(--ep-base) 32%) !important;
  color: color-mix(in srgb, var(--ep-primary) 82%, var(--ep-base) 18%) !important;
}

/* Extended form controls coherence */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--ep-primary);
}

.form-check-input {
  border-color: color-mix(in srgb, var(--ep-primary) 26%, var(--ep-base) 74%) !important;
  background-color: color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%) !important;
}

.form-check-input:checked {
  background-color: var(--ep-primary) !important;
  border-color: var(--ep-primary) !important;
}

.form-check-input:focus {
  border-color: var(--ep-primary) !important;
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ep-accent) 58%, transparent) !important;
}

.form-switch .form-check-input:checked {
  background-color: var(--ep-primary) !important;
  border-color: var(--ep-primary) !important;
}

.is-valid,
.was-validated .form-control:valid,
.was-validated .form-select:valid {
  border-color: color-mix(in srgb, var(--ep-primary) 74%, var(--ep-accent) 26%) !important;
}

.is-invalid,
.was-validated .form-control:invalid,
.was-validated .form-select:invalid {
  border-color: color-mix(in srgb, var(--ep-primary) 56%, var(--ep-secondary) 44%) !important;
}

.invalid-feedback {
  color: color-mix(in srgb, var(--ep-primary) 66%, var(--ep-secondary) 34%) !important;
}

.valid-feedback {
  color: color-mix(in srgb, var(--ep-primary) 78%, var(--ep-accent) 22%) !important;
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
  background: color-mix(in srgb, var(--ep-base) 86%, var(--ep-accent) 14%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 26%, var(--ep-base) 74%) !important;
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
  border-color: var(--ep-primary) !important;
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ep-accent) 52%, transparent) !important;
}

/* Search UI */
.navbar-search .search-input,
input[type="search"],
.search-field,
.woocommerce-product-search .search-field {
  background: color-mix(in srgb, var(--ep-base) 88%, var(--ep-accent) 12%) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 24%, var(--ep-base) 76%) !important;
  color: var(--ep-text) !important;
}

.navbar-search .search-input:focus,
input[type="search"]:focus,
.search-field:focus {
  border-color: var(--ep-primary) !important;
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ep-accent) 56%, transparent) !important;
}

/* Filters & widgets */
.widget_price_filter,
.woocommerce-widget-layered-nav,
.woocommerce-widget-layered-nav-list,
.woocommerce .widget_layered_nav,
.woocommerce .widget_price_filter {
  background: color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 20%, var(--ep-base) 80%) !important;
  border-radius: var(--ep-radius-md);
}

.widget_price_filter .ui-slider .ui-slider-range,
.widget_price_filter .ui-slider .ui-slider-handle {
  background: var(--ep-primary) !important;
  border-color: var(--ep-primary) !important;
}

/* Bootstrap key components */
.accordion-button:not(.collapsed) {
  color: var(--ep-primary) !important;
  background: color-mix(in srgb, var(--ep-accent) 46%, var(--ep-base) 54%) !important;
}

.accordion-button:focus,
.nav-tabs .nav-link:focus,
.page-link:focus,
.dropdown-item:focus {
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ep-accent) 58%, transparent) !important;
}

.nav-tabs .nav-link.active,
.nav-pills .nav-link.active {
  color: var(--ep-base) !important;
  background: linear-gradient(135deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 78%, var(--ep-accent) 22%)) !important;
  border-color: var(--ep-primary) !important;
}

.tooltip-inner,
.popover-header {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-primary) 88%, var(--ep-accent) 12%), var(--ep-primary)) !important;
  color: var(--ep-base) !important;
}

/* Disabled states */
.btn:disabled,
.btn.disabled,
button[disabled],
input[disabled],
select[disabled],
textarea[disabled] {
  opacity: 0.68;
  border-color: color-mix(in srgb, var(--ep-primary) 16%, var(--ep-base) 84%) !important;
}

/* System/Woo semantic messages */
.alert-success,
.woocommerce-message {
  border-left: 4px solid color-mix(in srgb, var(--ep-primary) 72%, var(--ep-accent) 28%) !important;
}

.alert-info,
.woocommerce-info {
  border-left: 4px solid color-mix(in srgb, var(--ep-primary) 62%, var(--ep-accent) 38%) !important;
}

.alert-warning {
  border-left: 4px solid var(--ep-secondary) !important;
}

.alert-danger,
.woocommerce-error {
  border-left: 4px solid color-mix(in srgb, var(--ep-primary) 58%, var(--ep-secondary) 42%) !important;
}

/* Popup + hover coherence layer */
#bootscore-auth-modal .modal-content,
.modal-content,
.offcanvas,
.popover,
.toast,
.material-snackbar {
  background: linear-gradient(145deg, color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%), color-mix(in srgb, var(--ep-base) 78%, var(--ep-accent) 22%)) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 20%, var(--ep-base) 80%) !important;
  color: var(--ep-text) !important;
}

#bootscore-auth-modal .auth-tab-btn,
#bootscore-auth-modal button[type="submit"],
#bootscore-auth-modal .social-login-btn,
.modal .btn,
.offcanvas .btn,
.dropdown-menu .dropdown-item {
  transition: transform var(--ep-fast) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease), background-color var(--ep-med) var(--ep-ease), color var(--ep-fast) var(--ep-ease), border-color var(--ep-med) var(--ep-ease);
}

#bootscore-auth-modal .auth-tab-btn:hover,
#bootscore-auth-modal button[type="submit"]:hover,
#bootscore-auth-modal .social-login-btn:hover,
.modal .btn:hover,
.offcanvas .btn:hover,
.dropdown-menu .dropdown-item:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 20px color-mix(in srgb, var(--ep-primary) 28%, transparent) !important;
}

#bootscore-auth-modal .auth-tab-btn.active,
#bootscore-auth-modal button[type="submit"],
.material-snackbar {
  background: linear-gradient(135deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 78%, var(--ep-accent) 22%)) !important;
  color: var(--ep-base) !important;
}

#bootscore-auth-modal .social-login-btn {
  background: color-mix(in srgb, var(--ep-base) 92%, var(--ep-accent) 8%) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 18%, var(--ep-base) 82%) !important;
  color: var(--ep-text) !important;
}

#bootscore-auth-modal .social-login-btn:hover {
  background: color-mix(in srgb, var(--ep-base) 84%, var(--ep-accent) 16%) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 34%, var(--ep-base) 66%) !important;
}

#bootscore-auth-modal .btn-close,
.modal .btn-close {
  background: color-mix(in srgb, var(--ep-primary) 12%, var(--ep-base) 88%) !important;
  border-radius: 10px;
}

#bootscore-auth-modal .btn-close:hover,
.modal .btn-close:hover {
  background: color-mix(in srgb, var(--ep-primary) 20%, var(--ep-base) 80%) !important;
}

.toast:hover,
.popover:hover,
.material-snackbar:hover {
  box-shadow: 0 10px 24px color-mix(in srgb, var(--ep-primary) 30%, transparent) !important;
}

/* Spectacular premium popup details (visual only) */
#bootscore-auth-modal .modal-content,
.modal-content,
.offcanvas,
.popover,
.toast,
.material-snackbar,
.dropdown-menu {
  position: relative;
  overflow: visible;
  isolation: isolate;
}

#bootscore-auth-modal .modal-content::before,
.modal-content::before,
.offcanvas::before,
.popover::before,
.toast::before,
.material-snackbar::before,
.dropdown-menu::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    radial-gradient(110% 90% at 0% 0%, color-mix(in srgb, var(--ep-accent) 26%, transparent) 0%, transparent 65%),
    radial-gradient(90% 80% at 100% 0%, color-mix(in srgb, var(--ep-secondary) 22%, transparent) 0%, transparent 70%),
    linear-gradient(125deg, color-mix(in srgb, var(--ep-base) 88%, transparent), color-mix(in srgb, var(--ep-accent) 15%, transparent));
  opacity: 0.16;
}

#bootscore-auth-modal .modal-content::after,
.modal-content::after,
.offcanvas::after,
.popover::after,
.toast::after,
.material-snackbar::after,
.dropdown-menu::after {
  content: "";
  position: absolute;
  top: -130%;
  left: -45%;
  width: 50%;
  height: 360%;
  pointer-events: none;
  z-index: 1;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--ep-base) 52%, transparent), transparent);
  transform: rotate(20deg) translate3d(0, 0, 0);
  transition: transform 900ms var(--ep-ease), opacity 400ms var(--ep-ease);
  opacity: 0.1;
}

#bootscore-auth-modal .modal-content:hover::after,
.modal-content:hover::after,
.offcanvas:hover::after,
.popover:hover::after,
.toast:hover::after,
.material-snackbar:hover::after,
.dropdown-menu:hover::after {
  transform: rotate(20deg) translate3d(310%, 0, 0);
  opacity: 0.18;
}

#bootscore-auth-modal .modal-content > *,
.modal-content > *,
.offcanvas > *,
.popover > *,
.toast > *,
.material-snackbar > *,
.dropdown-menu > * {
  position: relative;
  z-index: 2;
}

#bootscore-auth-modal .auth-tab-btn,
#bootscore-auth-modal button[type="submit"],
#bootscore-auth-modal .social-login-btn,
.modal .btn,
.offcanvas .btn,
.dropdown-menu .dropdown-item,
.my-account-modal .modal-close {
  transform: translateZ(0);
}

#bootscore-auth-modal .auth-tab-btn:hover,
#bootscore-auth-modal button[type="submit"]:hover,
#bootscore-auth-modal .social-login-btn:hover,
.modal .btn:hover,
.offcanvas .btn:hover,
.dropdown-menu .dropdown-item:hover,
.my-account-modal .modal-close:hover {
  transform: translateY(-2px) scale(1.01);
  box-shadow:
    0 10px 22px color-mix(in srgb, var(--ep-primary) 26%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ep-primary) 18%, transparent) inset !important;
}

#bootscore-auth-modal .auth-tab-btn.active,
#bootscore-auth-modal button[type="submit"],
.material-snackbar,
.toast.show {
  box-shadow:
    0 12px 28px color-mix(in srgb, var(--ep-primary) 32%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ep-base) 22%, transparent) inset !important;
}

.dropdown-menu .dropdown-item {
  position: relative;
}

.dropdown-menu .dropdown-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 16%;
  bottom: 16%;
  width: 3px;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 70%, var(--ep-accent) 30%));
  opacity: 0;
  transform: scaleY(0.5);
  transition: opacity var(--ep-fast) var(--ep-ease), transform var(--ep-med) var(--ep-ease);
}

.dropdown-menu .dropdown-item:hover::before,
.dropdown-menu .dropdown-item:focus-visible::before {
  opacity: 1;
  transform: scaleY(1);
}

.modal-backdrop.show,
.offcanvas-backdrop.show {
  background: radial-gradient(ellipse at center, color-mix(in srgb, var(--ep-primary) 14%, transparent), color-mix(in srgb, var(--ep-primary) 36%, transparent)) !important;
}

@media (prefers-reduced-motion: no-preference) {
  #bootscore-auth-modal .modal-content,
  .modal-content,
  .offcanvas,
  .popover,
  .toast,
  .material-snackbar,
  .dropdown-menu {
    animation: ep-popup-float-in 360ms var(--ep-ease) both;
  }
}

@keyframes ep-popup-float-in {
  from {
    opacity: 0;
    transform: translate3d(0, 8px, 0) scale(0.985);
    filter: saturate(94%);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
    filter: saturate(100%);
  }
}

/* Popup UX readability boost (palette-first, high legibility) */
:root {
  --ep-popup-title: color-mix(in srgb, var(--ep-primary) 94%, var(--ep-base) 6%);
  --ep-popup-text: color-mix(in srgb, var(--ep-primary) 90%, var(--ep-base) 10%);
  --ep-popup-muted: color-mix(in srgb, var(--ep-primary) 74%, var(--ep-accent) 26%);
  --ep-popup-link: var(--ep-primary);
  --ep-popup-accent: #ffd832;
}

#bootscore-auth-modal .modal-title,
.modal .modal-title,
.offcanvas-title,
.popover-header,
.toast-header {
  color: var(--ep-popup-title) !important;
  letter-spacing: -0.015em;
  text-wrap: balance;
}

#bootscore-auth-modal .modal-header,
.modal .modal-header,
.offcanvas-header,
.popover-header,
.toast-header {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-base) 78%, var(--ep-popup-accent) 22%), color-mix(in srgb, var(--ep-base) 84%, var(--ep-accent) 16%)) !important;
  border-bottom: 1px solid color-mix(in srgb, var(--ep-popup-accent) 52%, var(--ep-primary) 48%) !important;
}

#bootscore-auth-modal .modal-body,
#bootscore-auth-modal .modal-body p,
#bootscore-auth-modal label,
#bootscore-auth-modal .form-text,
#bootscore-auth-modal .form-check-label,
.modal .modal-body,
.modal .modal-body p,
.offcanvas-body,
.popover,
.popover-body,
.toast,
.toast-body,
.alert,
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  color: var(--ep-popup-text) !important;
}

#bootscore-auth-modal .modal-body,
.modal .modal-body,
.offcanvas-body,
.popover-body,
.toast-body {
  text-shadow: 0 1px 0 color-mix(in srgb, var(--ep-base) 55%, transparent);
}

#bootscore-auth-modal .modal-body p,
#bootscore-auth-modal .form-text,
#bootscore-auth-modal .form-check-label,
.popover-body small,
.toast-body small,
.alert small {
  color: var(--ep-popup-muted) !important;
}

#bootscore-auth-modal .modal-title,
.modal .modal-title,
.offcanvas-title {
  position: relative;
  padding-left: 12px;
}

#bootscore-auth-modal .modal-title::before,
.modal .modal-title::before,
.offcanvas-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 12%;
  bottom: 12%;
  width: 4px;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--ep-popup-accent), color-mix(in srgb, var(--ep-popup-accent) 62%, var(--ep-primary) 38%));
}

#bootscore-auth-modal a,
.modal a,
.offcanvas a,
.popover a,
.toast a,
.alert a {
  color: var(--ep-popup-link) !important;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
}

#bootscore-auth-modal a:hover,
.modal a:hover,
.offcanvas a:hover,
.popover a:hover,
.toast a:hover,
.alert a:hover {
  color: color-mix(in srgb, var(--ep-primary) 76%, var(--ep-secondary) 24%) !important;
}

#bootscore-auth-modal .form-check-input:checked,
.modal .form-check-input:checked,
.offcanvas .form-check-input:checked {
  background-color: var(--ep-popup-accent) !important;
  border-color: color-mix(in srgb, var(--ep-popup-accent) 60%, var(--ep-primary) 40%) !important;
}

#bootscore-auth-modal .form-check-input:checked[type="checkbox"],
.modal .form-check-input:checked[type="checkbox"],
.offcanvas .form-check-input:checked[type="checkbox"] {
  --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%230f70fd' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e") !important;
}

#bootscore-auth-modal input[type="text"],
#bootscore-auth-modal input[type="email"],
#bootscore-auth-modal input[type="password"],
.modal .form-control,
.offcanvas .form-control,
.popover .form-control {
  background: color-mix(in srgb, var(--ep-base) 94%, var(--ep-accent) 6%) !important;
  border: 1.5px solid color-mix(in srgb, var(--ep-popup-accent) 48%, var(--ep-primary) 52%) !important;
  color: var(--ep-popup-text) !important;
  font-weight: 500;
}

#bootscore-auth-modal input::placeholder,
.modal .form-control::placeholder,
.offcanvas .form-control::placeholder,
.popover .form-control::placeholder {
  color: color-mix(in srgb, var(--ep-primary) 56%, var(--ep-accent) 44%) !important;
  opacity: 1;
}

#bootscore-auth-modal input:hover,
.modal .form-control:hover,
.offcanvas .form-control:hover,
.popover .form-control:hover {
  border-color: color-mix(in srgb, var(--ep-popup-accent) 58%, var(--ep-primary) 42%) !important;
  box-shadow: 0 4px 14px color-mix(in srgb, var(--ep-popup-accent) 26%, transparent) !important;
}

#bootscore-auth-modal input:focus,
.modal .form-control:focus,
.offcanvas .form-control:focus,
.popover .form-control:focus {
  border-color: color-mix(in srgb, var(--ep-popup-accent) 62%, var(--ep-primary) 38%) !important;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--ep-popup-accent) 42%, transparent),
    0 8px 18px color-mix(in srgb, var(--ep-primary) 24%, transparent) !important;
}

#bootscore-auth-modal .auth-tab-btn:not(.active),
.modal .btn-outline-primary,
.offcanvas .btn-outline-primary {
  color: var(--ep-popup-text) !important;
}

#bootscore-auth-modal .auth-tab-btn:not(.active),
.modal .btn-outline-primary,
.offcanvas .btn-outline-primary {
  border-color: color-mix(in srgb, var(--ep-popup-accent) 52%, var(--ep-primary) 48%) !important;
}

#bootscore-auth-modal .auth-tab-btn:not(.active):hover {
  background: color-mix(in srgb, var(--ep-popup-accent) 30%, var(--ep-base) 70%) !important;
  color: var(--ep-primary) !important;
}

#bootscore-auth-modal button[type="submit"],
.modal .btn-primary,
.offcanvas .btn-primary,
.toast .btn-primary {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-popup-accent) 58%, var(--ep-primary) 42%), var(--ep-popup-accent)) !important;
  border-color: color-mix(in srgb, var(--ep-popup-accent) 65%, var(--ep-primary) 35%) !important;
  color: color-mix(in srgb, var(--ep-primary) 90%, var(--ep-base) 10%) !important;
  text-shadow: none;
}

#bootscore-auth-modal button[type="submit"]:hover,
.modal .btn-primary:hover,
.offcanvas .btn-primary:hover,
.toast .btn-primary:hover {
  background: linear-gradient(135deg, var(--ep-popup-accent), color-mix(in srgb, var(--ep-popup-accent) 72%, var(--ep-secondary) 28%)) !important;
  color: color-mix(in srgb, var(--ep-primary) 94%, var(--ep-base) 6%) !important;
}

#bootscore-auth-modal .social-login-btn,
#bootscore-auth-modal .btn-close,
.modal .btn-close,
.my-account-modal .modal-close {
  border: 1px solid color-mix(in srgb, var(--ep-primary) 16%, var(--ep-base) 84%) !important;
}

.toast,
.material-snackbar,
.popover,
.dropdown-menu,
.modal-content,
.offcanvas {
  backdrop-filter: blur(10px) saturate(112%);
  -webkit-backdrop-filter: blur(10px) saturate(112%);
}

/* Readability-first override: disable decorative veil specifically on auth popup */
#bootscore-auth-modal .modal-content::before,
#bootscore-auth-modal .modal-content::after {
  content: none !important;
}

/* Stronger opaque surfaces for clearer text/button rendering */
#bootscore-auth-modal .modal-content,
.modal-content,
.offcanvas,
.popover,
.toast,
.material-snackbar {
  background: linear-gradient(145deg, color-mix(in srgb, var(--ep-base) 97%, var(--ep-accent) 3%), color-mix(in srgb, var(--ep-base) 94%, var(--ep-accent) 6%)) !important;
}

/* Ensure content layers always render above decorative effects */
#bootscore-auth-modal .modal-content *,
.modal-content *,
.offcanvas *,
.popover *,
.toast *,
.material-snackbar *,
.dropdown-menu * {
  position: relative;
  z-index: 3;
}

/* Higher contrast labels and CTA text inside popups */
#bootscore-auth-modal label,
#bootscore-auth-modal .form-check-label,
.modal label,
.offcanvas label,
.popover-body,
.toast-body {
  color: color-mix(in srgb, var(--ep-primary) 92%, var(--ep-base) 8%) !important;
}

#bootscore-auth-modal button,
.modal .btn,
.offcanvas .btn,
.toast .btn {
  font-weight: 700;
}

.modal-content,
.offcanvas,
.popover,
.toast,
.material-snackbar,
.dropdown-menu {
  border: 1px solid color-mix(in srgb, var(--ep-popup-accent) 42%, var(--ep-primary) 58%) !important;
  box-shadow:
    0 14px 34px color-mix(in srgb, var(--ep-primary) 24%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ep-popup-accent) 26%, transparent) inset !important;
}

@media (max-width: 575.98px) {
  #bootscore-auth-modal .modal-title,
  .modal .modal-title,
  .offcanvas-title {
    font-size: clamp(1.15rem, 4vw, 1.4rem) !important;
    line-height: 1.25;
  }

  #bootscore-auth-modal .modal-body,
  .modal .modal-body,
  .offcanvas-body,
  .toast-body,
  .popover-body {
    font-size: 0.95rem;
    line-height: 1.5;
  }
}

/* =========================================================
   GLOBAL HOVER NORMALIZATION (popup-coherent palette)
   ========================================================= */
:root {
  --ep-hover-bg: color-mix(in srgb, var(--ep-secondary) 24%, var(--ep-base) 76%);
  --ep-hover-bg-strong: color-mix(in srgb, var(--ep-secondary) 36%, var(--ep-base) 64%);
  --ep-hover-border: color-mix(in srgb, var(--ep-secondary) 54%, var(--ep-primary) 46%);
  --ep-hover-text: color-mix(in srgb, var(--ep-primary) 92%, var(--ep-base) 8%);
  --ep-hover-shadow: 0 10px 24px color-mix(in srgb, var(--ep-primary) 24%, transparent);
}

/* generic interactive transitions */
a,
button,
.btn,
.nav-link,
.dropdown-item,
.card,
.product-card,
.mini-cart-item,
.account-card,
.order-item,
.address-box,
.stat-item,
.download-item,
.form-control,
.form-select,
.form-check-input,
.page-link,
.list-group-item-action {
  transition: background-color var(--ep-med) var(--ep-ease), color var(--ep-fast) var(--ep-ease), border-color var(--ep-med) var(--ep-ease), box-shadow var(--ep-med) var(--ep-ease), transform var(--ep-fast) var(--ep-ease), text-decoration-color var(--ep-med) var(--ep-ease);
}

/* links and nav */
a:hover,
.nav-link:hover,
.navbar .nav-link:hover,
.navbar-brand:hover,
.mini-cart-item-title a:hover,
.product-card__title a:hover,
.woocommerce-breadcrumb a:hover,
.shop-page nav.woocommerce-breadcrumb a:hover {
  color: var(--ep-hover-text) !important;
  text-decoration-color: color-mix(in srgb, var(--ep-primary) 76%, var(--ep-secondary) 24%) !important;
}

/* buttons */
.btn:hover,
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.button:hover,
.button-primary:hover,
.button-secondary:hover,
.btn-close:hover,
.quick-action-btn:hover,
.btn-cart:hover,
.btn-checkout:hover,
.btn-add-to-cart:hover,
.btn-wishlist:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-secondary) 30%, var(--ep-base) 70%), color-mix(in srgb, var(--ep-secondary) 44%, var(--ep-accent) 56%)) !important;
  border-color: var(--ep-hover-border) !important;
  color: var(--ep-hover-text) !important;
  box-shadow: var(--ep-hover-shadow) !important;
  transform: translateY(-2px);
}

/* preserve primary CTA personality while aligning palette */
.btn-primary:hover,
.my-account-main .btn-primary:hover,
.wishlist-header + .container .btn-primary:hover,
.product-card__actions .btn-primary:hover,
.toast .btn-primary:hover,
.modal .btn-primary:hover,
.offcanvas .btn-primary:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-secondary) 58%, var(--ep-primary) 42%), var(--ep-secondary)) !important;
  border-color: color-mix(in srgb, var(--ep-secondary) 64%, var(--ep-primary) 36%) !important;
  color: color-mix(in srgb, var(--ep-primary) 94%, var(--ep-base) 6%) !important;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--ep-primary) 28%, transparent) !important;
}

/* outline/secondary hover normalization */
.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.my-account-main .btn-outline-primary:hover,
.product-card__actions .btn-outline-secondary:hover,
.page-link:hover,
.list-group-item-action:not(.active):hover,
.dropdown-item:hover,
.navbar .dropdown-item:hover,
.account-dropdown-link:hover {
  background: var(--ep-hover-bg) !important;
  border-color: var(--ep-hover-border) !important;
  color: var(--ep-hover-text) !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--ep-primary) 18%, transparent) !important;
}

/* danger actions still palette-safe */
.btn-outline-danger:hover,
.my-account-main .btn-outline-danger:hover,
.account-dropdown-link-danger:hover {
  background: color-mix(in srgb, var(--ep-secondary) 42%, var(--ep-base) 58%) !important;
  border-color: color-mix(in srgb, var(--ep-secondary) 66%, var(--ep-primary) 34%) !important;
  color: color-mix(in srgb, var(--ep-primary) 86%, var(--ep-secondary) 14%) !important;
}

/* cards and blocks */
.card:hover,
.account-card:hover,
.postbox:hover,
.product-card:hover,
.order-item:hover,
.address-box:hover,
.stat-item:hover,
.download-item:hover,
.mini-cart-item:hover,
.profile-field:hover {
  border-color: #ffd832!important;
  box-shadow: 0 14px 30px color-mix(in srgb, var(--ep-primary) 22%, transparent) !important;
}

/* form controls hover/focus visual coherence */
.form-control:hover,
.form-select:hover,
input:hover,
textarea:hover,
select:hover {
  border-color: color-mix(in srgb, var(--ep-secondary) 56%, var(--ep-primary) 44%) !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--ep-secondary) 24%, transparent) !important;
}

/* table hover rows */
.table-hover > tbody > tr:hover > *,
.wp-list-table tr:hover > * {
  background: color-mix(in srgb, var(--ep-secondary) 22%, var(--ep-base) 78%) !important;
  color: var(--ep-hover-text) !important;
}

/* extended coverage for utility/link classes */
.btn-link:hover,
.link-primary:hover,
.link-secondary:hover,
.link-success:hover,
.link-info:hover,
.link-warning:hover,
.link-danger:hover,
.link-light:hover,
.link-dark:hover,
.link-body-emphasis:hover,
[class*="link-opacity-"]:hover,
[class*="link-offset-"]:hover,
[class*="link-underline-opacity-"]:hover {
  color: var(--ep-hover-text) !important;
  text-decoration-color: color-mix(in srgb, var(--ep-primary) 76%, var(--ep-secondary) 24%) !important;
}

/* bootstrap navigation and interactive surfaces */
.accordion-button:hover,
.nav-tabs .nav-link:hover,
.nav-pills .nav-link:hover,
.nav-underline .nav-link:hover,
.navbar-toggler:hover,
.carousel-control-prev:hover,
.carousel-control-next:hover,
.icon-link-hover:hover > .bi,
.dropdown-menu .dropdown-item:hover,
.page-item .page-link:hover {
  background: var(--ep-hover-bg) !important;
  color: var(--ep-hover-text) !important;
  border-color: var(--ep-hover-border) !important;
}

/* mini-cart + product-card ecosystem */
.mini-cart-link:hover,
.close-mini-cart:hover,
.mini-cart-item-qty button:hover,
.mini-cart-item-remove:hover,
.mini-cart-remove-item:hover,
.product-card__wishlist-btn:hover,
.product-card__actions .btn:hover,
.product-card .product-image:hover img,
.material-product-gallery .thumbnails img:hover {
  border-color: var(--ep-hover-border) !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ep-primary) 24%, transparent) !important;
}

.product-card__wishlist-btn:hover,
.mini-cart-item-qty button:hover,
.close-mini-cart:hover,
.mini-cart-item-remove:hover,
.mini-cart-remove-item:hover {
  background: var(--ep-hover-bg-strong) !important;
  color: var(--ep-hover-text) !important;
}

/* inline JS hover hardening: override non-palette inline styles */
[onmouseenter]:hover,
[onmouseover]:hover {
  border-color: var(--ep-hover-border) !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--ep-primary) 20%, transparent) !important;
}

/* WooCommerce explicit hover lock (non-.btn controls) */
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.added_to_cart:hover,
.woocommerce .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce div.product form.cart .button:hover,
.woocommerce .shop_table a.button:hover,
.woocommerce .shop_table a.woocommerce-MyAccount-downloads-file.button.alt:hover,
.woocommerce-cart table.cart td.actions .coupon button:hover,
.woocommerce form.checkout_coupon .form-row-last button:hover,
.woocommerce-grouped-product-list a.button:hover,
.single_add_to_cart_button:hover,
.ajax_add_to_cart:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-secondary) 58%, var(--ep-primary) 42%), var(--ep-secondary)) !important;
  border-color: color-mix(in srgb, var(--ep-secondary) 66%, var(--ep-primary) 34%) !important;
  color: color-mix(in srgb, var(--ep-primary) 94%, var(--ep-base) 6%) !important;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--ep-primary) 28%, transparent) !important;
  transform: translateY(-2px);
}

.woocommerce-mini-cart-item a.remove.remove_from_cart_button:hover {
  background: var(--ep-hover-bg-strong) !important;
  border-color: var(--ep-hover-border) !important;
  color: var(--ep-hover-text) !important;
}

.woocommerce a.button:focus-visible,
.woocommerce button.button:focus-visible,
.woocommerce input.button:focus-visible,
.woocommerce #respond input#submit:focus-visible,
.woocommerce a.added_to_cart:focus-visible,
.woocommerce .wc-proceed-to-checkout a.checkout-button:focus-visible,
.single_add_to_cart_button:focus-visible,
.ajax_add_to_cart:focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ep-primary) 70%, white 30%);
  outline-offset: 2px;
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ep-accent) 58%, transparent) !important;
}

/* =========================================================
   MENU HOVER STRICT PALETTE LOCK
   ========================================================= */
.navbar-liquid-glass .nav-link:hover,
.navbar-liquid-glass .nav-link:focus,
.navbar-liquid-glass .nav-link:active,
.navbar-liquid-glass .nav-link.active,
.navbar-liquid-glass .nav-menu li.menu-item > a:hover,
.navbar-liquid-glass .nav-menu li.current-menu-item > a,
.navbar-liquid-glass .nav-menu li.current_page_item > a {
  color: var(--ep-hover-text) !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-secondary) 26%, var(--ep-base) 74%), color-mix(in srgb, var(--ep-secondary) 38%, var(--ep-accent) 62%)) !important;
  border-color: var(--ep-hover-border) !important;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--ep-primary) 22%, transparent) !important;
}

.navbar-liquid-glass .nav-menu li.menu-item > a:hover::after,
.navbar-liquid-glass .nav-link:hover::after,
.navbar-liquid-glass .nav-link.active::after {
  background: linear-gradient(90deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 72%, var(--ep-secondary) 28%)) !important;
}

.navbar-liquid-glass .dropdown-item:hover,
.navbar-liquid-glass .dropdown-item:focus,
.navbar-liquid-glass .nav-menu li.menu-item.menu-item-has-children > ul.sub-menu li a:hover,
.navbar-liquid-glass .nav-menu li.menu-item.menu-item-has-children > ul.sub-menu li a:focus {
  color: var(--ep-hover-text) !important;
  background: var(--ep-hover-bg) !important;
  border-color: var(--ep-hover-border) !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--ep-primary) 18%, transparent) !important;
}

.navbar-liquid-glass .nav-menu li.menu-item.menu-item-has-children > ul.sub-menu li a:hover::before,
.navbar-liquid-glass .dropdown-item:hover::before {
  background: linear-gradient(180deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 72%, var(--ep-secondary) 28%)) !important;
}

.navbar-liquid-glass .nav-item.dropdown:hover > .dropdown-menu,
.navbar-liquid-glass .nav-menu li.menu-item.menu-item-has-children:hover > ul.sub-menu {
  border-color: color-mix(in srgb, var(--ep-secondary) 46%, var(--ep-primary) 54%) !important;
  box-shadow: 0 16px 34px color-mix(in srgb, var(--ep-primary) 24%, transparent) !important;
}

/* mobile menu button and bars */
.navbar-liquid-glass .mobile-menu-btn:hover,
.navbar-liquid-glass .mobile-menu-btn:focus,
.navbar-liquid-glass .mobile-menu-btn.active {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-secondary) 28%, var(--ep-base) 72%), color-mix(in srgb, var(--ep-secondary) 42%, var(--ep-accent) 58%)) !important;
  border-color: var(--ep-hover-border) !important;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--ep-primary) 24%, transparent) !important;
}

.navbar-liquid-glass .mobile-menu-btn:hover span,
.navbar-liquid-glass .mobile-menu-btn:focus span,
.navbar-liquid-glass .mobile-menu-btn.active span {
  background: var(--ep-hover-text) !important;
}

/* offcanvas/mobile nav links */
.offcanvas .nav-link:hover,
.offcanvas .nav-link:focus,
.offcanvas .dropdown-item:hover,
.offcanvas .dropdown-item:focus,
.mobile-menu a:hover,
.mobile-menu .nav-link:hover {
  color: var(--ep-hover-text) !important;
  background: var(--ep-hover-bg) !important;
  border-color: var(--ep-hover-border) !important;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--ep-primary) 16%, transparent) !important;
}

/* icon coherence on menu hover/focus */
.navbar-liquid-glass .nav-link:hover .material-symbols-outlined,
.navbar-liquid-glass .nav-link:focus .material-symbols-outlined,
.navbar-liquid-glass .nav-link.active .material-symbols-outlined,
.navbar-liquid-glass .nav-menu li.menu-item > a:hover .material-symbols-outlined,
.navbar-liquid-glass .nav-menu li.current-menu-item > a .material-symbols-outlined,
.navbar-liquid-glass .nav-menu li.current_page_item > a .material-symbols-outlined,
.navbar-liquid-glass .dropdown-item:hover .material-symbols-outlined,
.navbar-liquid-glass .dropdown-item:focus .material-symbols-outlined,
.offcanvas .nav-link:hover .material-symbols-outlined,
.offcanvas .nav-link:focus .material-symbols-outlined,
.offcanvas .dropdown-item:hover .material-symbols-outlined,
.offcanvas .dropdown-item:focus .material-symbols-outlined,
.mobile-menu a:hover .material-symbols-outlined,
.mobile-menu .nav-link:hover .material-symbols-outlined {
  color: var(--ep-hover-text) !important;
  font-variation-settings: 'FILL' 1, 'wght' 650, 'GRAD' 0, 'opsz' 24;
}

.navbar-liquid-glass .nav-link:hover svg,
.navbar-liquid-glass .nav-link:focus svg,
.navbar-liquid-glass .nav-link.active svg,
.navbar-liquid-glass .nav-menu li.menu-item > a:hover svg,
.navbar-liquid-glass .dropdown-item:hover svg,
.navbar-liquid-glass .dropdown-item:focus svg,
.offcanvas .nav-link:hover svg,
.offcanvas .nav-link:focus svg,
.offcanvas .dropdown-item:hover svg,
.offcanvas .dropdown-item:focus svg,
.mobile-menu a:hover svg,
.mobile-menu .nav-link:hover svg,
.navbar-liquid-glass .nav-link:hover i,
.navbar-liquid-glass .dropdown-item:hover i,
.offcanvas .nav-link:hover i,
.offcanvas .dropdown-item:hover i {
  color: var(--ep-hover-text) !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

.navbar-liquid-glass .navbar-icon:hover .material-symbols-outlined,
.navbar-liquid-glass .navbar-icon:focus-visible .material-symbols-outlined,
.navbar-liquid-glass .mini-cart-toggle:hover .material-symbols-outlined,
.navbar-liquid-glass .mini-cart-toggle:focus-visible .material-symbols-outlined {
  color: var(--ep-hover-text) !important;
  font-variation-settings: 'FILL' 1, 'wght' 650, 'GRAD' 0, 'opsz' 24;
}

/* hard lock: account + favorites header icons (avoid violet visited/legacy hover) */
.navbar-liquid-glass a.navbar-icon,
.navbar-liquid-glass a.navbar-icon:link,
.navbar-liquid-glass a.navbar-icon:visited,
.navbar-liquid-glass a.navbar-icon.account-menu-toggle,
.navbar-liquid-glass a.navbar-icon[data-auth-modal-trigger],
.navbar-liquid-glass a.navbar-icon[href*="/wishlist"] {
  color: var(--ep-text) !important;
  text-decoration: none !important;
}

.navbar-liquid-glass a.navbar-icon:hover,
.navbar-liquid-glass a.navbar-icon:focus,
.navbar-liquid-glass a.navbar-icon:active,
.navbar-liquid-glass a.navbar-icon:focus-visible,
.navbar-liquid-glass a.navbar-icon.account-menu-toggle:hover,
.navbar-liquid-glass a.navbar-icon.account-menu-toggle:focus-visible,
.navbar-liquid-glass a.navbar-icon[data-auth-modal-trigger]:hover,
.navbar-liquid-glass a.navbar-icon[data-auth-modal-trigger]:focus-visible,
.navbar-liquid-glass a.navbar-icon[href*="/wishlist"]:hover,
.navbar-liquid-glass a.navbar-icon[href*="/wishlist"]:focus-visible {
  color: var(--ep-hover-text) !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-secondary) 28%, var(--ep-base) 72%), color-mix(in srgb, var(--ep-secondary) 42%, var(--ep-accent) 58%)) !important;
  border-color: var(--ep-hover-border) !important;
  box-shadow: 0 8px 20px color-mix(in srgb, var(--ep-primary) 24%, transparent) !important;
}

.navbar-liquid-glass a.navbar-icon .material-symbols-outlined,
.navbar-liquid-glass a.navbar-icon:visited .material-symbols-outlined {
  color: currentColor !important;
}

.navbar-liquid-glass a.navbar-icon:hover .material-symbols-outlined,
.navbar-liquid-glass a.navbar-icon:focus-visible .material-symbols-outlined,
.navbar-liquid-glass a.navbar-icon[href*="/wishlist"]:hover .material-symbols-outlined,
.navbar-liquid-glass a.navbar-icon.account-menu-toggle:hover .material-symbols-outlined,
.navbar-liquid-glass a.navbar-icon[data-auth-modal-trigger]:hover .material-symbols-outlined {
  color: var(--ep-hover-text) !important;
  font-variation-settings: 'FILL' 1, 'wght' 650, 'GRAD' 0, 'opsz' 24;
}

/* =========================================================
   MINI-CART STRICT PALETTE LOCK
   Approved colors only: #0f70fd, #ffd832, #aee1f9, #fdfdfb
   ========================================================= */
.mini-cart-dropdown,
.mini-cart-inner,
.mini-cart-header,
.mini-cart-footer,
.mini-cart-items-wrapper,
.mini-cart-items,
.mini-cart-item,
.mini-cart-empty,
.mini-cart-total,
.mini-cart-summary {
  color: var(--ep-text) !important;
}

.mini-cart-dropdown {
  background: linear-gradient(145deg, color-mix(in srgb, var(--ep-base) 90%, var(--ep-accent) 10%), color-mix(in srgb, var(--ep-base) 78%, var(--ep-accent) 22%)) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 22%, var(--ep-base) 78%) !important;
  box-shadow: 0 18px 42px color-mix(in srgb, var(--ep-primary) 22%, transparent) !important;
  backdrop-filter: blur(20px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
}

.mini-cart-header,
.mini-cart-footer {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-base) 86%, var(--ep-accent) 14%), color-mix(in srgb, var(--ep-base) 76%, var(--ep-accent) 24%)) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 18%, var(--ep-base) 82%) !important;
}

.mini-cart-header h3,
.mini-cart-header h4,
.mini-cart-header .h3,
.mini-cart-header .h4,
.mini-cart-total,
.mini-cart-summary .summary-value,
.mini-cart-item-title,
.mini-cart-item-title a,
.mini-cart-item-price,
.mini-cart-total-amount {
  color: var(--ep-text) !important;
}

.mini-cart-item {
  border-bottom-color: color-mix(in srgb, var(--ep-primary) 14%, var(--ep-base) 86%) !important;
}

.mini-cart-item:hover {
  background: color-mix(in srgb, var(--ep-secondary) 22%, var(--ep-base) 78%) !important;
}

.mini-cart-item-title a:hover {
  color: var(--ep-hover-text) !important;
  text-decoration-color: color-mix(in srgb, var(--ep-primary) 74%, var(--ep-secondary) 26%) !important;
}

.mini-cart-item-meta,
.mini-cart-empty p,
.mini-cart-summary .summary-label {
  color: var(--ep-text-muted) !important;
}

.mini-cart-item-qty,
.mini-cart-item-qty-control {
  background: color-mix(in srgb, var(--ep-accent) 42%, var(--ep-base) 58%) !important;
  color: var(--ep-hover-text) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 22%, var(--ep-base) 78%) !important;
}

.mini-cart-item-qty-control .qty-minus,
.mini-cart-item-qty-control .qty-plus,
.mini-cart-item-qty button {
  background: color-mix(in srgb, var(--ep-base) 76%, var(--ep-accent) 24%) !important;
  color: var(--ep-primary) !important;
  border-color: color-mix(in srgb, var(--ep-primary) 26%, var(--ep-base) 74%) !important;
}

.mini-cart-item-qty-control .qty-minus:hover,
.mini-cart-item-qty-control .qty-plus:hover,
.mini-cart-item-qty button:hover {
  background: color-mix(in srgb, var(--ep-secondary) 28%, var(--ep-base) 72%) !important;
  color: var(--ep-hover-text) !important;
  box-shadow: 0 8px 18px color-mix(in srgb, var(--ep-primary) 20%, transparent) !important;
}

.close-mini-cart,
.mini-cart-item-remove,
.mini-cart-remove-item,
.close-mini-cart .material-symbols-outlined,
.mini-cart-item-remove .material-symbols-outlined,
.mini-cart-remove-item .material-symbols-outlined {
  color: var(--ep-primary) !important;
}

.close-mini-cart:hover,
.mini-cart-item-remove:hover,
.mini-cart-remove-item:hover {
  background: color-mix(in srgb, var(--ep-secondary) 32%, var(--ep-base) 68%) !important;
  color: var(--ep-hover-text) !important;
  border-color: color-mix(in srgb, var(--ep-secondary) 58%, var(--ep-primary) 42%) !important;
}

.mini-cart-empty .empty-icon,
.mini-cart-empty .material-symbols-outlined {
  color: color-mix(in srgb, var(--ep-primary) 62%, var(--ep-accent) 38%) !important;
}

.mini-cart-loading .spinner {
  border-color: color-mix(in srgb, var(--ep-primary) 18%, transparent) !important;
  border-top-color: var(--ep-primary) !important;
}

.mini-cart-actions .btn,
.mini-cart-btn,
.btn-cart,
.btn-checkout,
.mini-cart-btn.btn-view-cart,
.mini-cart-btn.btn-checkout {
  border-radius: 12px !important;
  font-weight: 650 !important;
}

.mini-cart-actions .btn,
.mini-cart-btn.btn-view-cart,
.btn-cart {
  background: color-mix(in srgb, var(--ep-base) 84%, var(--ep-accent) 16%) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 26%, var(--ep-base) 74%) !important;
  color: var(--ep-primary) !important;
}

.mini-cart-actions .btn:hover,
.mini-cart-btn.btn-view-cart:hover,
.btn-cart:hover {
  background: color-mix(in srgb, var(--ep-secondary) 28%, var(--ep-base) 72%) !important;
  border-color: color-mix(in srgb, var(--ep-secondary) 60%, var(--ep-primary) 40%) !important;
  color: var(--ep-hover-text) !important;
}

.btn-checkout,
.mini-cart-btn.btn-checkout {
  background: linear-gradient(135deg, var(--ep-primary), color-mix(in srgb, var(--ep-primary) 76%, var(--ep-accent) 24%)) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 64%, var(--ep-accent) 36%) !important;
  color: var(--ep-base) !important;
  box-shadow: 0 10px 22px color-mix(in srgb, var(--ep-primary) 30%, transparent) !important;
}

.btn-checkout:hover,
.mini-cart-btn.btn-checkout:hover {
  background: linear-gradient(135deg, color-mix(in srgb, var(--ep-secondary) 52%, var(--ep-primary) 48%), var(--ep-secondary)) !important;
  border-color: color-mix(in srgb, var(--ep-secondary) 62%, var(--ep-primary) 38%) !important;
  color: color-mix(in srgb, var(--ep-primary) 92%, var(--ep-base) 8%) !important;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--ep-primary) 30%, transparent) !important;
}

.cart-badge,
[data-cart-badge],
.mini-cart .badge {
  background: linear-gradient(135deg, var(--ep-secondary), color-mix(in srgb, var(--ep-secondary) 72%, var(--ep-accent) 28%)) !important;
  color: color-mix(in srgb, var(--ep-primary) 88%, var(--ep-base) 12%) !important;
  border: 1px solid color-mix(in srgb, var(--ep-primary) 24%, var(--ep-secondary) 76%) !important;
}

.mini-cart-items::-webkit-scrollbar-thumb,
.mini-cart-items-wrapper::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--ep-primary) 38%, var(--ep-accent) 62%) !important;
}

.mini-cart-items::-webkit-scrollbar-thumb:hover,
.mini-cart-items-wrapper::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--ep-primary) 52%, var(--ep-secondary) 48%) !important;
}

.mini-cart-backdrop,
.mini-cart-container.active .mini-cart-backdrop {
  background: color-mix(in srgb, var(--ep-primary) 24%, transparent) !important;
}
