/* ============================================================
   GymOS Theme System — Premium Edition
   gym.ui.theme = glassmorphism | material | apple
                | material-light | nordic | sunset
   ============================================================ */

/* ─── Glassmorphism (Default) — Vibrant Neon Dark ─── */
:root,
[data-theme="glassmorphism"] {
  --bg-primary: #06080f;
  --bg-card: rgba(12,17,29,0.85);
  --bg-glass: rgba(255,255,255,0.06);
  --bg-glass-soft: rgba(255,255,255,0.04);
  --bg-input: rgba(10,15,28,0.9);
  --bg-hover: rgba(255,255,255,0.08);
  --border-glass: rgba(255,255,255,0.07);
  --border-subtle: rgba(255,255,255,0.04);
  --text-primary: #f0f4ff;
  --text-secondary: rgba(180,200,230,0.85);
  --text-muted: rgba(130,155,195,0.8);
  --accent: #00e5ff;
  --accent-rgb: 0,229,255;
  --accent-hover: #00b8d4;
  --accent-glow: rgba(0,229,255,0.25);
  --accent-secondary: #d946ef;
  --accent-secondary-rgb: 217,70,239;
  --gradient-accent: linear-gradient(135deg, #00e5ff 0%, #7c3aed 50%, #d946ef 100%);
  --gradient-accent-soft: linear-gradient(135deg, rgba(0,229,255,0.15) 0%, rgba(124,58,237,0.1) 50%, rgba(217,70,239,0.08) 100%);
  --gradient-card: linear-gradient(145deg, rgba(15,23,42,0.9), rgba(8,12,25,0.95));
  --radius-sm: 0.5rem;
  --radius-md: 0.875rem;
  --radius-lg: 1.25rem;
  --radius-xl: 1.75rem;
  --blur: 24px;
  --shadow-card: 0 20px 40px rgba(0,0,0,0.4), 0 0 1px rgba(0,229,255,0.1);
  --shadow-button: 0 8px 24px rgba(0,0,0,0.35);
  --shadow-glow: 0 0 30px rgba(0,229,255,0.15), 0 0 60px rgba(124,58,237,0.08);
  --nav-bg: rgba(6,8,15,0.88);
  --sidebar-bg: rgba(10,14,26,0.7);
  --modal-overlay: rgba(0,0,0,0.7);
  --modal-bg: rgba(12,17,30,0.97);
  --toast-bg: rgba(12,17,30,0.97);
  --transition-fast: 0.2s cubic-bezier(0.4,0,0.2,1);
  --transition-normal: 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* ─── Material Design Dark ─── */
[data-theme="material"] {
  --bg-primary: #121212;
  --bg-card: #1e1e1e;
  --bg-glass: #2d2d2d;
  --bg-glass-soft: #252525;
  --bg-input: #2d2d2d;
  --bg-hover: rgba(255,255,255,0.08);
  --border-glass: rgba(255,255,255,0.12);
  --border-subtle: rgba(255,255,255,0.06);
  --text-primary: #e0e0e0;
  --text-secondary: #b0b0b0;
  --text-muted: #888888;
  --accent: #bb86fc;
  --accent-rgb: 187,134,252;
  --accent-hover: #9b59f0;
  --accent-glow: rgba(187,134,252,0.15);
  --accent-secondary: #03dac6;
  --accent-secondary-rgb: 3,218,198;
  --gradient-accent: linear-gradient(135deg, #bb86fc, #03dac6);
  --gradient-accent-soft: linear-gradient(135deg, rgba(187,134,252,0.12), rgba(3,218,198,0.08));
  --gradient-card: #1e1e1e;
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;
  --blur: 0px;
  --shadow-card: 0 8px 24px rgba(0,0,0,0.4);
  --shadow-button: 0 4px 12px rgba(0,0,0,0.3);
  --shadow-glow: none;
  --nav-bg: #1e1e1e;
  --sidebar-bg: #1a1a1a;
  --modal-overlay: rgba(0,0,0,0.7);
  --modal-bg: #2d2d2d;
  --toast-bg: #333;
  --transition-fast: 0.15s cubic-bezier(0.4,0,0.2,1);
  --transition-normal: 0.25s cubic-bezier(0.4,0,0.2,1);
}

/* ─── Apple / Cupertino Dark ─── */
[data-theme="apple"] {
  --bg-primary: #000000;
  --bg-card: rgba(28,28,30,0.85);
  --bg-glass: rgba(44,44,46,0.6);
  --bg-glass-soft: rgba(44,44,46,0.4);
  --bg-input: rgba(44,44,46,0.8);
  --bg-hover: rgba(255,255,255,0.06);
  --border-glass: rgba(255,255,255,0.08);
  --border-subtle: rgba(255,255,255,0.04);
  --text-primary: #f5f5f7;
  --text-secondary: #a1a1a6;
  --text-muted: #86868b;
  --accent: #0a84ff;
  --accent-rgb: 10,132,255;
  --accent-hover: #0071e3;
  --accent-glow: rgba(10,132,255,0.15);
  --accent-secondary: #bf5af2;
  --accent-secondary-rgb: 191,90,242;
  --gradient-accent: linear-gradient(135deg, #0a84ff, #5e5ce6);
  --gradient-accent-soft: linear-gradient(135deg, rgba(10,132,255,0.1), rgba(94,92,230,0.08));
  --gradient-card: rgba(28,28,30,0.85);
  --radius-sm: 0.625rem;
  --radius-md: 0.875rem;
  --radius-lg: 1.25rem;
  --radius-xl: 1.5rem;
  --blur: 40px;
  --shadow-card: 0 16px 48px rgba(0,0,0,0.5);
  --shadow-button: 0 4px 16px rgba(0,0,0,0.4);
  --shadow-glow: none;
  --nav-bg: rgba(0,0,0,0.72);
  --sidebar-bg: rgba(28,28,30,0.6);
  --modal-overlay: rgba(0,0,0,0.55);
  --modal-bg: rgba(28,28,30,0.92);
  --toast-bg: rgba(28,28,30,0.95);
  --transition-fast: 0.2s cubic-bezier(0.25,0.1,0.25,1);
  --transition-normal: 0.35s cubic-bezier(0.25,0.1,0.25,1);
}

/* ─── Material Light — Material Design 3 Light ─── */
[data-theme="material-light"] {
  --bg-primary: #FEFBFF;
  --bg-card: #FFFFFF;
  --bg-glass: #F3EDF7;
  --bg-glass-soft: #F7F2FA;
  --bg-input: #FFFFFF;
  --bg-hover: rgba(103,80,164,0.06);
  --border-glass: rgba(103,80,164,0.12);
  --border-subtle: rgba(103,80,164,0.06);
  --text-primary: #1C1B1F;
  --text-secondary: #49454F;
  --text-muted: #79747E;
  --accent: #6750A4;
  --accent-rgb: 103,80,164;
  --accent-hover: #553894;
  --accent-glow: rgba(103,80,164,0.15);
  --accent-secondary: #00897B;
  --accent-secondary-rgb: 0,137,123;
  --gradient-accent: linear-gradient(135deg, #6750A4, #00897B);
  --gradient-accent-soft: linear-gradient(135deg, rgba(103,80,164,0.1), rgba(0,137,123,0.06));
  --gradient-card: #FFFFFF;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --blur: 0px;
  --shadow-card: 0 1px 3px rgba(0,0,0,0.08), 0 4px 12px rgba(103,80,164,0.06);
  --shadow-button: 0 2px 8px rgba(103,80,164,0.2);
  --shadow-glow: none;
  --nav-bg: #FEFBFF;
  --sidebar-bg: #F7F2FA;
  --modal-overlay: rgba(0,0,0,0.32);
  --modal-bg: #FFFFFF;
  --toast-bg: #FFFFFF;
  --transition-fast: 0.15s cubic-bezier(0.4,0,0.2,1);
  --transition-normal: 0.25s cubic-bezier(0.4,0,0.2,1);
}

/* ─── Nordic — Scandinavian Minimalist Light ─── */
[data-theme="nordic"] {
  --bg-primary: #FAFAF9;
  --bg-card: #FFFFFF;
  --bg-glass: #F5F5F0;
  --bg-glass-soft: #F8F8F5;
  --bg-input: #FFFFFF;
  --bg-hover: rgba(90,120,100,0.05);
  --border-glass: rgba(90,120,100,0.12);
  --border-subtle: rgba(90,120,100,0.06);
  --text-primary: #1A1A1A;
  --text-secondary: #4A4A48;
  --text-muted: #8A8A86;
  --accent: #5A7864;
  --accent-rgb: 90,120,100;
  --accent-hover: #4A6854;
  --accent-glow: rgba(90,120,100,0.12);
  --accent-secondary: #8B7355;
  --accent-secondary-rgb: 139,115,85;
  --gradient-accent: linear-gradient(135deg, #5A7864, #8B7355);
  --gradient-accent-soft: linear-gradient(135deg, rgba(90,120,100,0.08), rgba(139,115,85,0.05));
  --gradient-card: #FFFFFF;
  --radius-sm: 0.375rem;
  --radius-md: 0.625rem;
  --radius-lg: 0.875rem;
  --radius-xl: 1.25rem;
  --blur: 0px;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.04), 0 2px 8px rgba(0,0,0,0.04);
  --shadow-button: 0 1px 4px rgba(90,120,100,0.15);
  --shadow-glow: none;
  --nav-bg: #FAFAF9;
  --sidebar-bg: #F5F5F0;
  --modal-overlay: rgba(0,0,0,0.25);
  --modal-bg: #FFFFFF;
  --toast-bg: #FFFFFF;
  --transition-fast: 0.2s cubic-bezier(0.25,0.1,0.25,1);
  --transition-normal: 0.3s cubic-bezier(0.25,0.1,0.25,1);
}

/* ─── Sunset — Warm Light Theme ─── */
[data-theme="sunset"] {
  --bg-primary: #FFFBF5;
  --bg-card: #FFFFFF;
  --bg-glass: #FFF5EB;
  --bg-glass-soft: #FFF8F0;
  --bg-input: #FFFFFF;
  --bg-hover: rgba(224,122,95,0.06);
  --border-glass: rgba(224,122,95,0.12);
  --border-subtle: rgba(224,122,95,0.06);
  --text-primary: #2D2420;
  --text-secondary: #5C4F47;
  --text-muted: #9A8C82;
  --accent: #E07A5F;
  --accent-rgb: 224,122,95;
  --accent-hover: #C96A50;
  --accent-glow: rgba(224,122,95,0.15);
  --accent-secondary: #D4A857;
  --accent-secondary-rgb: 212,168,87;
  --gradient-accent: linear-gradient(135deg, #E07A5F, #D4A857);
  --gradient-accent-soft: linear-gradient(135deg, rgba(224,122,95,0.1), rgba(212,168,87,0.06));
  --gradient-card: #FFFFFF;
  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --blur: 0px;
  --shadow-card: 0 1px 3px rgba(45,36,32,0.06), 0 4px 12px rgba(224,122,95,0.06);
  --shadow-button: 0 2px 8px rgba(224,122,95,0.2);
  --shadow-glow: none;
  --nav-bg: #FFFBF5;
  --sidebar-bg: #FFF8F0;
  --modal-overlay: rgba(45,36,32,0.3);
  --modal-bg: #FFFFFF;
  --toast-bg: #FFFFFF;
  --transition-fast: 0.2s cubic-bezier(0.4,0,0.2,1);
  --transition-normal: 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* ═══════════════════════════════════════════════════════════
   PREMIUM VISUAL SYSTEM — Glassmorphism Default
   ═══════════════════════════════════════════════════════════ */

/* ─── Module Hero — Gradient overlay with glow ─── */
.module-hero {
  position: relative;
  background: var(--gradient-accent-soft) !important;
  border: 1px solid rgba(var(--accent-rgb),0.15) !important;
  border-radius: var(--radius-xl) !important;
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
  overflow: hidden;
}

.module-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.08) 0%, transparent 50%, rgba(var(--accent-secondary-rgb),0.06) 100%);
  pointer-events: none;
  border-radius: inherit;
}

.module-hero::after {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 60%;
  height: 200%;
  background: radial-gradient(ellipse, rgba(var(--accent-rgb),0.06), transparent 70%);
  pointer-events: none;
}

.module-hero-icon {
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.25), rgba(var(--accent-secondary-rgb),0.15)) !important;
  color: var(--accent) !important;
  box-shadow: 0 0 20px rgba(var(--accent-rgb),0.2);
  border: 1px solid rgba(var(--accent-rgb),0.2);
}

.module-hero-title {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 800 !important;
}

.module-hero-description {
  color: var(--text-secondary) !important;
}

/* ─── Module Info Cards — gradient border on hover ─── */
.module-info-card {
  position: relative;
  background: var(--bg-glass) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
  transition: all var(--transition-normal);
}

.module-info-card:hover {
  border-color: rgba(var(--accent-rgb),0.3) !important;
  box-shadow: 0 0 20px rgba(var(--accent-rgb),0.08);
  transform: translateY(-2px);
}

.module-info-icon {
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.15), rgba(var(--accent-secondary-rgb),0.1)) !important;
  color: var(--accent) !important;
}

/* ─── KPI / Stat Cards ─── */
.glass-soft {
  position: relative;
  background: var(--bg-glass-soft) !important;
  border: 1px solid var(--border-glass) !important;
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
  transition: all var(--transition-normal);
}

.glass-soft:hover {
  border-color: rgba(var(--accent-rgb),0.2) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}

/* ─── Premium Card with animated gradient border ─── */
.card-premium {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--gradient-card);
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
  border: 1px solid rgba(var(--accent-rgb),0.1);
  transition: all var(--transition-normal);
}

.card-premium::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--gradient-accent);
  opacity: 0;
  transition: opacity var(--transition-normal);
}

.card-premium:hover {
  border-color: rgba(var(--accent-rgb),0.2);
  box-shadow: var(--shadow-glow), var(--shadow-card);
  transform: translateY(-2px);
}

.card-premium:hover::before {
  opacity: 1;
}

/* ─── Glass Panel ─── */
.glass-panel {
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-glass);
  background: var(--bg-glass-soft);
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
}

/* ─── Generic Card ─── */
.card {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-lg);
  border: 1px solid var(--border-glass);
  background: var(--bg-glass);
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
  padding: 1.25rem;
  transition: all var(--transition-normal);
}

.card:hover {
  border-color: rgba(var(--accent-rgb),0.2);
  box-shadow: 0 12px 32px rgba(0,0,0,0.2);
}

/* ─── Chip with glow ─── */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.875rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 600;
  background: rgba(var(--accent-rgb),0.12);
  border: 1px solid rgba(var(--accent-rgb),0.3);
  color: var(--accent);
  box-shadow: 0 0 12px rgba(var(--accent-rgb),0.1);
  text-shadow: 0 0 8px rgba(var(--accent-rgb),0.3);
}

/* ─── Badges — vibrant colors ─── */
.badge-premium {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.75rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.025em;
  border: 1px solid transparent;
}

.badge-premium-success {
  background: linear-gradient(135deg, rgba(34,197,94,0.2), rgba(16,185,129,0.12));
  border-color: rgba(34,197,94,0.35);
  color: #4ade80;
  box-shadow: 0 0 12px rgba(34,197,94,0.12);
}

.badge-premium-warning {
  background: linear-gradient(135deg, rgba(250,204,21,0.2), rgba(245,158,11,0.12));
  border-color: rgba(250,204,21,0.35);
  color: #fbbf24;
  box-shadow: 0 0 12px rgba(250,204,21,0.12);
}

.badge-premium-danger {
  background: linear-gradient(135deg, rgba(239,68,68,0.2), rgba(220,38,38,0.12));
  border-color: rgba(239,68,68,0.35);
  color: #f87171;
  box-shadow: 0 0 12px rgba(239,68,68,0.12);
}

.badge-premium-info {
  background: linear-gradient(135deg, rgba(59,130,246,0.2), rgba(99,102,241,0.12));
  border-color: rgba(59,130,246,0.35);
  color: #60a5fa;
  box-shadow: 0 0 12px rgba(59,130,246,0.12);
}

/* ─── Buttons — gradient with glow ─── */
.btn-primary {
  background: var(--gradient-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--radius-md) !important;
  padding: 0.625rem 1.5rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
  transition: all var(--transition-fast) !important;
  box-shadow: 0 4px 15px rgba(var(--accent-rgb),0.3), 0 0 30px rgba(var(--accent-rgb),0.1) !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

.btn-primary:hover {
  transform: translateY(-2px) scale(1.02) !important;
  box-shadow: 0 8px 25px rgba(var(--accent-rgb),0.4), 0 0 50px rgba(var(--accent-rgb),0.15) !important;
  filter: brightness(1.1);
}

.btn-ghost {
  background: transparent !important;
  color: var(--text-secondary) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-md) !important;
  padding: 0.5rem 1rem !important;
  transition: all var(--transition-fast) !important;
}

.btn-ghost:hover {
  background: var(--bg-hover) !important;
  color: var(--text-primary) !important;
  border-color: rgba(var(--accent-rgb),0.2) !important;
}

/* Green action buttons (Vender, Cobrar) */
.bg-green-500, .bg-green-600, .bg-emerald-500, .bg-emerald-600 {
  background: linear-gradient(135deg, #10b981, #059669) !important;
  box-shadow: 0 4px 15px rgba(16,185,129,0.3) !important;
}

.bg-green-500:hover, .bg-green-600:hover, .bg-emerald-500:hover, .bg-emerald-600:hover {
  box-shadow: 0 6px 20px rgba(16,185,129,0.4) !important;
  filter: brightness(1.1);
}

/* Red action buttons (Delete) */
.bg-red-500, .bg-red-600 {
  background: linear-gradient(135deg, #ef4444, #dc2626) !important;
  box-shadow: 0 4px 15px rgba(239,68,68,0.25) !important;
}

/* Blue action buttons */
.bg-blue-500, .bg-blue-600 {
  background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
  box-shadow: 0 4px 15px rgba(59,130,246,0.25) !important;
}

/* ─── Inputs — focus glow ring ─── */
.input,
[data-theme] input[type="text"],
[data-theme] input[type="number"],
[data-theme] input[type="email"],
[data-theme] input[type="password"],
[data-theme] input[type="date"],
[data-theme] input[type="datetime-local"],
[data-theme] input[type="week"],
[data-theme] input[type="search"],
[data-theme] textarea,
[data-theme] select {
  color: var(--text-primary) !important;
  background: var(--bg-input) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-sm) !important;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast) !important;
}

.input:focus,
[data-theme] input:focus,
[data-theme] textarea:focus,
[data-theme] select:focus {
  outline: none !important;
  border-color: rgba(var(--accent-rgb),0.5) !important;
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb),0.12), 0 0 20px rgba(var(--accent-rgb),0.08) !important;
}

.label {
  display: block;
  font-size: 0.8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-muted);
  margin-bottom: 0.375rem;
}

/* ─── Tabs — gradient underline ─── */
.nav-link {
  transition: all var(--transition-fast);
}

.nav-link.active {
  color: var(--text-primary) !important;
  border-bottom: 2px solid transparent !important;
  border-image: var(--gradient-accent) 1 !important;
}

.nav-link:not(.active):hover {
  color: var(--text-primary) !important;
}

/* ─── Toast System ─── */
#toast-container {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 999999;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  pointer-events: none;
  max-width: 400px;
}

.toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.875rem 1.25rem;
  border-radius: var(--radius-md);
  background: var(--toast-bg);
  border: 1px solid rgba(255,255,255,0.08);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  color: var(--text-primary);
  font-size: 0.875rem;
  box-shadow: 0 16px 48px rgba(0,0,0,0.5);
  animation: toastSlideIn 0.35s cubic-bezier(0.21,1.02,0.73,1) forwards;
  max-width: 100%;
  word-break: break-word;
}

.toast.toast-exit { animation: toastSlideOut 0.25s ease-in forwards; }

.toast-icon {
  flex-shrink: 0; width: 1.75rem; height: 1.75rem;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%; font-size: 0.8rem;
}

.toast-success { border-left: 3px solid #2BA37E; }
.toast-error   { border-left: 3px solid #B83368; }
.toast-warning { border-left: 3px solid #B45309; }
.toast-info    { border-left: 3px solid #9580FF; }

.toast-success .toast-icon { background: rgba(43,163,126,0.18); color: #2BA37E; }
.toast-error .toast-icon   { background: rgba(184,51,104,0.18); color: #B83368; }
.toast-warning .toast-icon { background: rgba(180,83,9,0.18); color: #B45309; }
.toast-info .toast-icon    { background: rgba(149,128,255,0.18); color: #9580FF; }

.toast-close {
  flex-shrink: 0; margin-left: auto; padding: 0.25rem;
  border: none; background: transparent; color: rgba(255,255,255,0.3);
  cursor: pointer; font-size: 1rem; line-height: 1; transition: color 0.2s;
}
.toast-close:hover { color: #fff; }

@keyframes toastSlideIn {
  from { opacity: 0; transform: translateX(100%) scale(0.95); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}
@keyframes toastSlideOut {
  from { opacity: 1; transform: translateX(0) scale(1); }
  to   { opacity: 0; transform: translateX(100%) scale(0.95); }
}

/* ─── Modal System ─── */
.modal-backdrop {
  position: fixed; inset: 0; z-index: 9999;
  display: flex; align-items: center; justify-content: center;
  background: var(--modal-overlay);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  padding: 1rem; overflow-y: auto;
}

.modal-card {
  position: relative;
  background: var(--modal-bg);
  border: 1px solid rgba(var(--accent-rgb),0.1);
  backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px);
  border-radius: var(--radius-lg);
  padding: 1.5rem;
  box-shadow: 0 25px 60px rgba(0,0,0,0.6), 0 0 40px rgba(var(--accent-rgb),0.05);
  max-height: 90vh; overflow-y: auto; margin: auto;
}

/* Gradient top bar on modals */
.modal-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--gradient-accent);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

.modal-backdrop.hidden { display: none !important; }

/* ─── Notification Drawer ─── */
#notif-drawer {
  background: var(--modal-bg) !important;
  border-left: 1px solid rgba(var(--accent-rgb),0.1) !important;
  backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px);
}

/* ─── Alert ─── */
.alert-warn {
  background: linear-gradient(135deg, rgba(250,204,21,0.12), rgba(245,158,11,0.08));
  border: 1px solid rgba(250,204,21,0.3);
  color: #fef3c7;
  border-radius: var(--radius-md);
  padding: 0.875rem 1.25rem;
}

/* ─── Text helpers ─── */
[data-theme] .text-primary { color: var(--text-primary) !important; }
[data-theme] .text-secondary { color: var(--text-secondary) !important; }
.text-textsoft { color: var(--text-muted); }

/* ─── Focus ring ─── */
[data-theme] *:focus-visible { outline-color: var(--accent); }

/* ─── Table styling ─── */
[data-theme] table { border-color: var(--border-glass); }
[data-theme] th {
  background: rgba(var(--accent-rgb),0.04);
  color: var(--text-secondary);
  border-color: var(--border-glass);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
}
[data-theme] td { border-color: var(--border-subtle); }
[data-theme] tr:hover td { background: rgba(var(--accent-rgb),0.03); }

/* ─── Animations ─── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.animate-fadeInUp { animation: fadeInUp 0.5s cubic-bezier(0.21,1.02,0.73,1) forwards; }

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 15px rgba(var(--accent-rgb),0.1); }
  50% { box-shadow: 0 0 30px rgba(var(--accent-rgb),0.2); }
}

/* ═══════════════════════════════════════════════════════════
   MATERIAL DESIGN OVERRIDES — Flat, no glass
   ═══════════════════════════════════════════════════════════ */
[data-theme="material"] .glass-soft,
[data-theme="material"] .glass-card,
[data-theme="material"] .card,
[data-theme="material"] .card-premium,
[data-theme="material"] .glass-panel {
  background: var(--bg-glass) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="material"] .card-premium::before { display: none !important; }

[data-theme="material"] .nav-premium {
  background: var(--nav-bg) !important;
  backdrop-filter: none !important;
  border-bottom: 1px solid var(--border-glass) !important;
}
[data-theme="material"] .sidebar-premium {
  background: var(--sidebar-bg) !important;
  backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
}
[data-theme="material"] .sidebar-item-premium:hover,
[data-theme="material"] .sidebar-item-premium.active {
  background: rgba(var(--accent-rgb),0.15) !important;
  border-color: rgba(var(--accent-rgb),0.3) !important;
}
[data-theme="material"] .sidebar-item-premium:hover::before,
[data-theme="material"] .sidebar-item-premium.active::before {
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.2), transparent) !important;
}
[data-theme="material"] .sidebar-item-premium i { color: var(--text-secondary) !important; }
[data-theme="material"] .sidebar-item-premium:hover i,
[data-theme="material"] .sidebar-item-premium.active i { color: var(--accent) !important; }
[data-theme="material"] .main-content-premium {
  background: var(--bg-card) !important;
  backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="material"] .chip-premium {
  background: rgba(var(--accent-rgb),0.1) !important;
  border: 1px solid rgba(var(--accent-rgb),0.3) !important;
  color: var(--accent) !important;
}
[data-theme="material"] .client-card {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="material"] .client-card::before,
[data-theme="material"] .client-card::after { display: none !important; }
[data-theme="material"] .client-card:hover {
  border-color: rgba(var(--accent-rgb),0.4) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.3) !important;
}
[data-theme="material"] .client-card__detail {
  background: rgba(0,0,0,0.2) !important;
  backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-md) !important;
}
[data-theme="material"] .modal-card,
[data-theme="material"] .modal-backdrop {
  backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
}
[data-theme="material"] .modal-card {
  background: var(--modal-bg) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="material"] .modal-backdrop { background: var(--modal-overlay) !important; }
[data-theme="material"] .module-hero,
[data-theme="material"] .module-info-card {
  background: var(--bg-glass) !important;
  backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
}
[data-theme="material"] .module-hero::before,
[data-theme="material"] .module-hero::after { display: none !important; }
[data-theme="material"] .module-hero-title {
  background: none !important; -webkit-text-fill-color: var(--text-primary) !important;
}

/* ═══════════════════════════════════════════════════════════
   APPLE / CUPERTINO OVERRIDES — Heavy blur + saturate
   ═══════════════════════════════════════════════════════════ */
[data-theme="apple"] body,
body[data-theme="apple"] {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
}

[data-theme="apple"] .glass-soft,
[data-theme="apple"] .glass-card,
[data-theme="apple"] .card,
[data-theme="apple"] .card-premium,
[data-theme="apple"] .glass-panel {
  background: var(--bg-glass) !important;
  backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  -webkit-backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  border: 0.5px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="apple"] .card-premium::before { display: none !important; }

[data-theme="apple"] .nav-premium {
  background: var(--nav-bg) !important;
  backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  -webkit-backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  border-bottom: 0.5px solid rgba(255,255,255,0.06) !important;
}
[data-theme="apple"] .sidebar-premium {
  background: var(--sidebar-bg) !important;
  backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  -webkit-backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  border: 0.5px solid var(--border-glass) !important;
}
[data-theme="apple"] .sidebar-item-premium:hover,
[data-theme="apple"] .sidebar-item-premium.active {
  background: rgba(var(--accent-rgb),0.12) !important;
  border: none !important;
  border-radius: 0.625rem !important;
}
[data-theme="apple"] .sidebar-item-premium i { color: var(--text-muted) !important; }
[data-theme="apple"] .sidebar-item-premium:hover i,
[data-theme="apple"] .sidebar-item-premium.active i { color: var(--accent) !important; }
[data-theme="apple"] .main-content-premium {
  background: var(--bg-card) !important;
  backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  -webkit-backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  border: 0.5px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="apple"] .chip-premium {
  background: rgba(var(--accent-rgb),0.1) !important;
  border: none !important; color: var(--accent) !important;
  border-radius: 9999px !important;
}
[data-theme="apple"] .client-card {
  background: var(--bg-card) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
  border: 0.5px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="apple"] .client-card::before,
[data-theme="apple"] .client-card::after { display: none !important; }
[data-theme="apple"] .client-card:hover {
  border-color: rgba(var(--accent-rgb),0.3) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.4) !important;
  transform: translateY(-2px) !important;
}
[data-theme="apple"] .client-card__detail {
  background: rgba(0,0,0,0.25) !important;
  border: 0.5px solid var(--border-glass) !important;
  border-radius: var(--radius-md) !important;
}
[data-theme="apple"] .modal-card {
  background: var(--modal-bg) !important;
  backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  -webkit-backdrop-filter: blur(var(--blur)) saturate(180%) !important;
  border: 0.5px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}
[data-theme="apple"] .modal-backdrop {
  background: var(--modal-overlay) !important;
  backdrop-filter: blur(8px) !important;
}
[data-theme="apple"] .module-hero,
[data-theme="apple"] .module-info-card {
  background: var(--bg-glass) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
  border: 0.5px solid var(--border-glass) !important;
}
[data-theme="apple"] .module-hero::before,
[data-theme="apple"] .module-hero::after { display: none !important; }
[data-theme="apple"] .module-hero-title {
  background: none !important; -webkit-text-fill-color: var(--text-primary) !important;
}
[data-theme="apple"] .action-button {
  border-radius: var(--radius-md) !important;
  border: 0.5px solid var(--border-glass) !important;
}

/* ═══════════════════════════════════════════════════════════
   GLOBAL ELEMENT UPGRADES — Vibrant accents everywhere
   ═══════════════════════════════════════════════════════════ */

/* ─── Custom scrollbar ─── */
[data-theme] ::-webkit-scrollbar { width: 6px; height: 6px; }
[data-theme] ::-webkit-scrollbar-track { background: transparent; }
[data-theme] ::-webkit-scrollbar-thumb {
  background: rgba(var(--accent-rgb),0.25);
  border-radius: 3px;
}
[data-theme] ::-webkit-scrollbar-thumb:hover { background: rgba(var(--accent-rgb),0.4); }

/* ─── Chrome autofill fix (global) ─── */
[data-theme] input:-webkit-autofill,
[data-theme] input:-webkit-autofill:hover,
[data-theme] input:-webkit-autofill:focus,
[data-theme] select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  border-color: var(--border-glass) !important;
  transition: background-color 5000s ease-in-out 0s;
}

/* ─── Placeholder text ─── */
[data-theme] ::placeholder { color: var(--text-muted) !important; opacity: 0.6; }

/* ─── ALL Tailwind bg-* buttons → premium gradient + glow ─── */
[data-theme] .bg-green-500, [data-theme] .bg-green-600,
[data-theme] .bg-emerald-500, [data-theme] .bg-emerald-600 {
  background: linear-gradient(135deg, #2BA37E 0%, #1F8266 100%) !important;
  box-shadow: 0 4px 15px rgba(43,163,126,0.28), inset 0 1px 0 rgba(255,255,255,0.10) !important;
  border: none !important;
  transition: box-shadow 0.22s ease, transform 0.22s ease, filter 0.22s ease !important;
}
[data-theme] .bg-green-500:hover, [data-theme] .bg-green-600:hover,
[data-theme] .bg-emerald-500:hover, [data-theme] .bg-emerald-600:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 25px rgba(43,163,126,0.40), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  filter: brightness(1.06) !important;
}

[data-theme] .bg-red-500, [data-theme] .bg-red-600 {
  background: linear-gradient(135deg, #B83368 0%, #8E2750 100%) !important;
  box-shadow: 0 4px 15px rgba(184,51,104,0.25), inset 0 1px 0 rgba(255,255,255,0.1) !important;
  border: none !important;
  transition: box-shadow 0.22s ease, transform 0.22s ease, filter 0.22s ease !important;
}
[data-theme] .bg-red-500:hover, [data-theme] .bg-red-600:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 25px rgba(184,51,104,0.40), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  filter: brightness(1.06) !important;
}

[data-theme] .bg-blue-500, [data-theme] .bg-blue-600 {
  background: linear-gradient(135deg, #9580FF 0%, #7B6FE0 100%) !important;
  box-shadow: 0 4px 15px rgba(149,128,255,0.28), inset 0 1px 0 rgba(255,255,255,0.10) !important;
  border: none !important;
  transition: box-shadow 0.22s ease, transform 0.22s ease, filter 0.22s ease !important;
}
[data-theme] .bg-blue-500:hover, [data-theme] .bg-blue-600:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 25px rgba(149,128,255,0.40), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  filter: brightness(1.06) !important;
}

[data-theme] .bg-yellow-500, [data-theme] .bg-yellow-600,
[data-theme] .bg-amber-500, [data-theme] .bg-amber-600 {
  background: linear-gradient(135deg, #B45309 0%, #92400E 100%) !important;
  box-shadow: 0 4px 15px rgba(180,83,9,0.25), inset 0 1px 0 rgba(255,255,255,0.10) !important;
  border: none !important;
  transition: box-shadow 0.22s ease, transform 0.22s ease, filter 0.22s ease !important;
}
[data-theme] .bg-yellow-500:hover, [data-theme] .bg-yellow-600:hover,
[data-theme] .bg-amber-500:hover, [data-theme] .bg-amber-600:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 25px rgba(180,83,9,0.40), inset 0 1px 0 rgba(255,255,255,0.15) !important;
  filter: brightness(1.06) !important;
}

/* ─── Force white text on ALL colored gradient buttons ─── */
[data-theme] button.bg-red-500,
[data-theme] button.bg-amber-500,
[data-theme] button.bg-yellow-500,
[data-theme] button.bg-blue-500,
[data-theme] button.bg-green-500,
[data-theme] button.bg-emerald-500,
[data-theme] button.bg-purple-500,
[data-theme] button.bg-cyan-500 {
  color: #fff !important;
}

/* ─── Ensure consistent button rounding and min-padding ─── */
[data-theme] button[class*="bg-red-"],
[data-theme] button[class*="bg-amber-"],
[data-theme] button[class*="bg-green-"],
[data-theme] button[class*="bg-blue-"],
[data-theme] button[class*="bg-emerald-"] {
  border-radius: var(--radius-md) !important;
  min-height: 2.25rem;
  font-weight: 600;
}

[data-theme] .bg-purple-500, [data-theme] .bg-purple-600,
[data-theme] .bg-violet-500, [data-theme] .bg-violet-600 {
  background: linear-gradient(135deg, #9580FF 0%, #7B6FE0 100%) !important;
  box-shadow: 0 4px 15px rgba(149,128,255,0.30), inset 0 1px 0 rgba(255,255,255,0.10) !important;
  border: none !important;
}

[data-theme] .bg-cyan-500, [data-theme] .bg-cyan-600,
[data-theme] .bg-teal-500, [data-theme] .bg-teal-600 {
  background: linear-gradient(135deg, #9580FF 0%, #7B6FE0 100%) !important;
  box-shadow: 0 4px 15px rgba(149,128,255,0.25), inset 0 1px 0 rgba(255,255,255,0.1) !important;
  border: none !important;
}

/* ─── ALL rounded-xl, rounded-2xl cards → glass treatment ─── */
[data-theme] .main-content-premium .rounded-xl,
[data-theme] .main-content-premium .rounded-2xl {
  border-color: var(--border-glass) !important;
}

/* ─── Stat / KPI large numbers → gradient text ─── */
[data-theme] .glass-soft .text-2xl,
[data-theme] .glass-soft .text-3xl,
[data-theme] .glass-soft .text-4xl {
  background: var(--gradient-accent);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 800;
}

/* ─── "Cargar mas" / generic load-more buttons ─── */
[data-theme] button[class*="text-cyan"],
[data-theme] button.text-cyan-400 {
  color: var(--accent) !important;
  border-color: rgba(var(--accent-rgb),0.3) !important;
  transition: all 0.25s ease !important;
}
[data-theme] button[class*="text-cyan"]:hover {
  background: rgba(var(--accent-rgb),0.1) !important;
  box-shadow: 0 0 15px rgba(var(--accent-rgb),0.15) !important;
}

/* ─── Status badges — v2 semantic palette (light-readable) ─── */
[data-theme] .bg-red-500\/10, [data-theme] .bg-red-100 {
  background: rgba(184,51,104,0.10) !important;
  color: #B83368 !important;
}
[data-theme] .bg-green-500\/10, [data-theme] .bg-green-100 {
  background: rgba(43,163,126,0.10) !important;
  color: #2BA37E !important;
}
[data-theme] .bg-yellow-500\/10, [data-theme] .bg-yellow-100 {
  background: rgba(180,83,9,0.10) !important;
  color: #B45309 !important;
}

/* ─── Expiry / status chip on user cards ─── */
[data-theme] .text-red-400, [data-theme] .text-red-500 {
  color: #B83368 !important;
}
[data-theme] .text-green-400, [data-theme] .text-green-500 {
  color: #2BA37E !important;
}
[data-theme] .text-yellow-400, [data-theme] .text-yellow-500 {
  color: #B45309 !important;
}
[data-theme] .text-cyan-400, [data-theme] .text-cyan-300 {
  color: var(--accent) !important;
  text-shadow: 0 0 8px rgba(var(--accent-rgb),0.3);
}

/* ─── Hover rows / list items — subtle accent glow ─── */
[data-theme] .hover\:bg-gray-50:hover,
[data-theme] .hover\:bg-gray-100:hover,
[data-theme] .hover\:bg-gray-800:hover,
[data-theme] .hover\:bg-gray-700:hover,
[data-theme] .hover\:bg-gray-600:hover {
  background: rgba(var(--accent-rgb),0.06) !important;
}

/* ─── File inputs — premium styling ─── */
[data-theme] input[type="file"] {
  background: var(--bg-input) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-sm) !important;
  color: var(--text-primary) !important;
}
[data-theme] input[type="file"]::file-selector-button {
  background: var(--gradient-accent) !important;
  border: none !important;
  color: #fff !important;
  padding: 0.375rem 0.75rem;
  border-radius: var(--radius-sm);
  font-weight: 600;
  cursor: pointer;
  margin-right: 0.75rem;
}

/* ─── Cancel / neutral buttons (bg-gray-700 as button) ─── */
[data-theme] button.bg-gray-700,
[data-theme] button[class*="bg-gray-700"],
[data-theme] button[class*="bg-gray-600"] {
  background: rgba(255,255,255,0.08) !important;
  border: 1px solid var(--border-glass) !important;
  color: var(--text-secondary) !important;
  transition: all 0.25s ease !important;
}
[data-theme] button.bg-gray-700:hover,
[data-theme] button[class*="bg-gray-700"]:hover,
[data-theme] button[class*="bg-gray-600"]:hover {
  background: rgba(255,255,255,0.12) !important;
  color: var(--text-primary) !important;
  border-color: rgba(var(--accent-rgb),0.2) !important;
}

/* ─── Checkbox and radio premium ─── */
[data-theme] input[type="checkbox"],
[data-theme] input[type="radio"] {
  accent-color: var(--accent) !important;
}

/* ─── Code blocks ─── */
[data-theme] code {
  background: rgba(var(--accent-rgb),0.1) !important;
  color: var(--accent) !important;
  padding: 0.125rem 0.375rem;
  border-radius: 0.25rem;
  font-size: 0.85em;
}
[data-theme] pre {
  background: rgba(0,0,0,0.4) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-md) !important;
  color: var(--text-primary) !important;
}

/* ─── Dropdown / select menus ─── */
[data-theme] select option {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
}

/* ─── Progress bars ─── */
[data-theme] progress::-webkit-progress-bar {
  background: var(--bg-glass);
  border-radius: 4px;
}
[data-theme] progress::-webkit-progress-value {
  background: var(--gradient-accent);
  border-radius: 4px;
}

/* ─── Links in content area ─── */
[data-theme] .main-content-premium a:not([class]) {
  color: var(--accent);
  transition: color 0.2s, text-shadow 0.2s;
}
[data-theme] .main-content-premium a:not([class]):hover {
  color: var(--accent-hover);
  text-shadow: 0 0 10px rgba(var(--accent-rgb),0.3);
}

/* ─── Borders cleanup for dark mode ─── */
[data-theme] .border-gray-200, [data-theme] .border-gray-300,
[data-theme] .border-gray-700, [data-theme] .border-gray-800 {
  border-color: var(--border-glass) !important;
}
[data-theme] .divide-gray-200 > * + *,
[data-theme] .divide-gray-700 > * + * {
  border-color: var(--border-glass) !important;
}

/* ─── Background overrides for dark consistency ─── */
[data-theme] .bg-gray-50, [data-theme] .bg-gray-100 {
  background: var(--bg-glass-soft) !important;
}
[data-theme] .bg-gray-700 {
  background: rgba(255,255,255,0.06) !important;
}
[data-theme] .bg-gray-800, [data-theme] .bg-gray-900 {
  background: var(--bg-glass) !important;
}
/* Tailwind opacity variants (bg-gray-800/50, bg-gray-800/30, etc.) */
[data-theme] [class*="bg-gray-800\/"] {
  background: var(--bg-glass) !important;
}
[data-theme] [class*="bg-gray-700\/"] {
  background: rgba(255,255,255,0.05) !important;
}
[data-theme] [class*="bg-gray-900\/"] {
  background: var(--bg-glass-soft) !important;
}
[data-theme] .bg-white {
  background: var(--bg-card) !important;
}
[data-theme] [class*="bg-white\/"] {
  /* preserve Tailwind white/opacity as-is for glass effects */
}

/* ─── Border overrides including opacity variants ─── */
[data-theme] [class*="border-gray-600"],
[data-theme] [class*="border-gray-700"] {
  border-color: var(--border-glass) !important;
}

/* ─── Text color overrides for dark mode ─── */
[data-theme] .text-gray-500, [data-theme] .text-gray-400 {
  color: var(--text-muted) !important;
}
[data-theme] .text-gray-600, [data-theme] .text-gray-700 {
  color: var(--text-secondary) !important;
}
[data-theme] .text-gray-800, [data-theme] .text-gray-900 {
  color: var(--text-primary) !important;
}
[data-theme] .text-white {
  color: var(--text-primary) !important;
}

/* ─── Ring/outline overrides ─── */
[data-theme] .ring-1, [data-theme] .ring-2 {
  --tw-ring-color: var(--border-glass) !important;
}
[data-theme] .focus\:ring-blue-500:focus,
[data-theme] .focus\:ring-cyan-500:focus {
  --tw-ring-color: rgba(var(--accent-rgb),0.4) !important;
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb),0.15) !important;
}

/* ─── Shadow overrides ─── */
[data-theme] .shadow-lg, [data-theme] .shadow-xl {
  box-shadow: var(--shadow-card) !important;
}

/* ─── Tab active states — gradient underline for any tab system ─── */
[data-theme] [data-tab-target].text-blue-600,
[data-theme] [data-tab-target].border-blue-600,
[data-theme] .border-b-2.border-blue-600 {
  color: var(--text-primary) !important;
  border-color: transparent !important;
  border-image: var(--gradient-accent) 1 !important;
}

/* ─── Sidebar active icon highlight ─── */
[data-theme] .sidebar-item-premium.active i {
  color: var(--accent) !important;
  filter: drop-shadow(0 0 6px rgba(var(--accent-rgb),0.5));
}

/* ─── "Vender" / CTA button on product cards ─── */
[data-theme] button.bg-green-500.text-white,
[data-theme] button[class*="bg-green"][class*="text-white"] {
  border-radius: var(--radius-sm) !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
}

/* ─── Notification bell pulse when has unread ─── */
@keyframes bell-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.15); }
}
.notif-dot {
  animation: bell-pulse 2s ease-in-out infinite;
}

/* ─── Skeleton loading shimmer ─── */
.skeleton {
  background: linear-gradient(90deg, var(--bg-glass) 25%, var(--bg-glass-soft) 50%, var(--bg-glass) 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--radius-sm);
}

/* ─── Tooltip dark style ─── */
[data-theme] [title]:hover::after {
  background: var(--bg-card);
  color: var(--text-primary);
  border: 1px solid var(--border-glass);
}

/* ─── Disable Tailwind white bg on hover states ─── */
[data-theme] .hover\:bg-white:hover { background: var(--bg-hover) !important; }
[data-theme] .hover\:bg-gray-50:hover { background: var(--bg-hover) !important; }

/* ─── Dark hr / dividers ─── */
[data-theme] hr, [data-theme] .border-t, [data-theme] .border-b {
  border-color: var(--border-glass) !important;
}

/* ─── Workout/Bonuses tab button active states ─── */
[data-theme] button.border-b-2.border-cyan-400,
[data-theme] button[class*="border-cyan-400"].border-b-2 {
  color: var(--accent) !important;
  border-image: var(--gradient-accent) 1 !important;
}
[data-theme] button[class*="text-gray-400"]:hover {
  color: var(--text-primary) !important;
}

/* ─── Table headers from bonuses/workout templates ─── */
[data-theme] thead[class*="bg-gray-700"],
[data-theme] thead.bg-gray-700 {
  background: rgba(var(--accent-rgb),0.06) !important;
}
[data-theme] thead[class*="bg-gray-700"] th,
[data-theme] thead.bg-gray-700 th {
  color: var(--text-secondary) !important;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  font-weight: 700;
}

/* ─── Input fields with bg-gray-700 class ─── */
[data-theme] input[class*="bg-gray-700"],
[data-theme] select[class*="bg-gray-700"],
[data-theme] textarea[class*="bg-gray-700"] {
  background: var(--bg-input) !important;
  border-color: var(--border-glass) !important;
  color: var(--text-primary) !important;
}
[data-theme] input[class*="bg-gray-700"]:focus,
[data-theme] select[class*="bg-gray-700"]:focus,
[data-theme] textarea[class*="bg-gray-700"]:focus {
  border-color: rgba(var(--accent-rgb),0.5) !important;
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb),0.12) !important;
  outline: none !important;
}

/* ─── Placeholder colors in old-style inputs ─── */
[data-theme] input[class*="placeholder-gray-400"]::placeholder,
[data-theme] textarea[class*="placeholder-gray-400"]::placeholder {
  color: var(--text-muted) !important;
}

/* ─── Focus border from old templates ─── */
[data-theme] [class*="focus:border-cyan-500"]:focus,
[data-theme] [class*="focus:border-blue-500"]:focus {
  border-color: rgba(var(--accent-rgb),0.5) !important;
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb),0.12) !important;
}

/* ─── Rounded containers from old templates ─── */
[data-theme] .rounded-2xl[class*="border"][class*="border-gray"] {
  border-color: var(--border-glass) !important;
}

/* ─── Table modern — themed override ─── */
[data-theme] .table-wrap {
  border-color: var(--border-glass) !important;
  background: var(--bg-glass-soft) !important;
}
[data-theme] .table-modern thead tr {
  background: rgba(var(--accent-rgb),0.06) !important;
}
[data-theme] .table-modern thead th {
  border-color: var(--border-glass) !important;
  color: var(--text-muted) !important;
  text-transform: uppercase;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  font-weight: 700;
}
[data-theme] .table-modern tbody tr {
  border-color: var(--border-subtle) !important;
}
[data-theme] .table-modern tbody tr:hover {
  background: rgba(var(--accent-rgb),0.04) !important;
}

/* ─── Alert info — themed ─── */
[data-theme] .alert-info {
  background: rgba(var(--accent-rgb),0.08) !important;
  border-color: rgba(var(--accent-rgb),0.25) !important;
  color: var(--accent) !important;
}

/* ─── Consistent font weights for headings ─── */
[data-theme] h1, [data-theme] h2, [data-theme] h3 {
  color: var(--text-primary);
}

/* ─── Pulsing dot for live/active indicators ─── */
@keyframes live-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(52,211,153,0.4); }
  50% { opacity: 0.8; box-shadow: 0 0 0 6px rgba(52,211,153,0); }
}
.live-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #34d399;
  animation: live-pulse 2s infinite;
}

/* ═══════════════════════════════════════════════════════════
   LIGHT THEME OVERRIDES — material-light, nordic, sunset
   ═══════════════════════════════════════════════════════════ */

/* ─── Force dark text on body for light themes ─── */
[data-theme="material-light"] body,
[data-theme="nordic"] body,
[data-theme="sunset"] body,
[data-theme="material-light"],
[data-theme="nordic"],
[data-theme="sunset"] {
  color: var(--text-primary) !important;
}

/* ─── Override .text-white for light themes ─── */
[data-theme="material-light"] .text-white,
[data-theme="nordic"] .text-white,
[data-theme="sunset"] .text-white {
  color: var(--text-primary) !important;
}

/* ─── Override .text-textsoft for light themes ─── */
[data-theme="material-light"] .text-textsoft,
[data-theme="nordic"] .text-textsoft,
[data-theme="sunset"] .text-textsoft {
  color: var(--text-muted) !important;
}

/* ─── Body background — replace dark gradients with light solid ─── */
body[data-theme="material-light"],
[data-theme="material-light"] body {
  background-color: #FEFBFF !important;
  background-image: radial-gradient(900px 500px at 10% 10%, rgba(103,80,164,0.04), transparent 60%), radial-gradient(800px 400px at 90% 80%, rgba(0,137,123,0.03), transparent 60%) !important;
}
body[data-theme="nordic"],
[data-theme="nordic"] body {
  background-color: #FAFAF9 !important;
  background-image: radial-gradient(900px 500px at 10% 10%, rgba(90,120,100,0.03), transparent 60%), radial-gradient(800px 400px at 90% 80%, rgba(139,115,85,0.02), transparent 60%) !important;
}
body[data-theme="sunset"],
[data-theme="sunset"] body {
  background-color: #FFFBF5 !important;
  background-image: radial-gradient(900px 500px at 10% 10%, rgba(224,122,95,0.05), transparent 60%), radial-gradient(800px 400px at 90% 80%, rgba(212,168,87,0.04), transparent 60%) !important;
}

/* ─── Nav and sidebar text for light themes ─── */
[data-theme="material-light"] .nav-premium,
[data-theme="nordic"] .nav-premium,
[data-theme="sunset"] .nav-premium {
  background: var(--nav-bg) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid var(--border-glass) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

[data-theme="material-light"] .sidebar-premium,
[data-theme="nordic"] .sidebar-premium,
[data-theme="sunset"] .sidebar-premium {
  background: var(--sidebar-bg) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
}

/* ─── Sidebar text colors ─── */
[data-theme="material-light"] .sidebar-label-premium,
[data-theme="nordic"] .sidebar-label-premium,
[data-theme="sunset"] .sidebar-label-premium {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .sidebar-item-premium i,
[data-theme="nordic"] .sidebar-item-premium i,
[data-theme="sunset"] .sidebar-item-premium i {
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] .sidebar-item-premium:hover i,
[data-theme="material-light"] .sidebar-item-premium.active i,
[data-theme="nordic"] .sidebar-item-premium:hover i,
[data-theme="nordic"] .sidebar-item-premium.active i,
[data-theme="sunset"] .sidebar-item-premium:hover i,
[data-theme="sunset"] .sidebar-item-premium.active i {
  color: var(--accent) !important;
}

[data-theme="material-light"] .sidebar-item-premium:hover,
[data-theme="material-light"] .sidebar-item-premium.active,
[data-theme="nordic"] .sidebar-item-premium:hover,
[data-theme="nordic"] .sidebar-item-premium.active,
[data-theme="sunset"] .sidebar-item-premium:hover,
[data-theme="sunset"] .sidebar-item-premium.active {
  background: rgba(var(--accent-rgb),0.1) !important;
  border-color: rgba(var(--accent-rgb),0.2) !important;
}

[data-theme="material-light"] .sidebar-item-premium:hover::before,
[data-theme="material-light"] .sidebar-item-premium.active::before,
[data-theme="nordic"] .sidebar-item-premium:hover::before,
[data-theme="nordic"] .sidebar-item-premium.active::before,
[data-theme="sunset"] .sidebar-item-premium:hover::before,
[data-theme="sunset"] .sidebar-item-premium.active::before {
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.12), transparent) !important;
}

/* ─── Sidebar group toggles for light themes ─── */
[data-theme="material-light"] .sidebar-group-toggle span,
[data-theme="nordic"] .sidebar-group-toggle span,
[data-theme="sunset"] .sidebar-group-toggle span {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .sidebar-group-toggle.open span,
[data-theme="nordic"] .sidebar-group-toggle.open span,
[data-theme="sunset"] .sidebar-group-toggle.open span {
  color: var(--accent) !important;
}

[data-theme="material-light"] .sidebar-group-toggle i.chevron,
[data-theme="nordic"] .sidebar-group-toggle i.chevron,
[data-theme="sunset"] .sidebar-group-toggle i.chevron {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .sidebar-group-toggle:hover,
[data-theme="nordic"] .sidebar-group-toggle:hover,
[data-theme="sunset"] .sidebar-group-toggle:hover {
  background: rgba(var(--accent-rgb),0.05) !important;
}

/* ─── Main content area ─── */
[data-theme="material-light"] .main-content-premium,
[data-theme="nordic"] .main-content-premium,
[data-theme="sunset"] .main-content-premium {
  background: var(--bg-card) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-card);
}

/* ─── Cards, glass panels — flat for light themes ─── */
[data-theme="material-light"] .glass-soft,
[data-theme="material-light"] .glass-card,
[data-theme="material-light"] .card,
[data-theme="material-light"] .card-premium,
[data-theme="material-light"] .glass-panel,
[data-theme="nordic"] .glass-soft,
[data-theme="nordic"] .glass-card,
[data-theme="nordic"] .card,
[data-theme="nordic"] .card-premium,
[data-theme="nordic"] .glass-panel,
[data-theme="sunset"] .glass-soft,
[data-theme="sunset"] .glass-card,
[data-theme="sunset"] .card,
[data-theme="sunset"] .card-premium,
[data-theme="sunset"] .glass-panel {
  background: var(--bg-glass) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}

[data-theme="material-light"] .card-premium::before,
[data-theme="nordic"] .card-premium::before,
[data-theme="sunset"] .card-premium::before {
  display: none !important;
}

/* ─── Module hero — remove dark glows, clean for light ─── */
[data-theme="material-light"] .module-hero,
[data-theme="material-light"] .module-info-card,
[data-theme="nordic"] .module-hero,
[data-theme="nordic"] .module-info-card,
[data-theme="sunset"] .module-hero,
[data-theme="sunset"] .module-info-card {
  background: var(--bg-glass) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
}

[data-theme="material-light"] .module-hero::before,
[data-theme="material-light"] .module-hero::after,
[data-theme="nordic"] .module-hero::before,
[data-theme="nordic"] .module-hero::after,
[data-theme="sunset"] .module-hero::before,
[data-theme="sunset"] .module-hero::after {
  display: none !important;
}

[data-theme="material-light"] .module-hero-title,
[data-theme="nordic"] .module-hero-title,
[data-theme="sunset"] .module-hero-title {
  background: none !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}

/* ─── Module hero description ─── */
[data-theme="material-light"] .module-hero-description,
[data-theme="nordic"] .module-hero-description,
[data-theme="sunset"] .module-hero-description {
  color: var(--text-secondary) !important;
}

/* ─── Module info cards text & icon — critical for light themes ─── */
[data-theme="material-light"] .module-info-title,
[data-theme="nordic"] .module-info-title,
[data-theme="sunset"] .module-info-title {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .module-info-text,
[data-theme="nordic"] .module-info-text,
[data-theme="sunset"] .module-info-text {
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] .module-info-icon,
[data-theme="nordic"] .module-info-icon,
[data-theme="sunset"] .module-info-icon {
  color: var(--accent) !important;
  background: rgba(var(--accent-rgb),0.1) !important;
}

/* ─── Chip premium — light theme version ─── */
[data-theme="material-light"] .chip-premium,
[data-theme="nordic"] .chip-premium,
[data-theme="sunset"] .chip-premium {
  background: rgba(var(--accent-rgb),0.08) !important;
  border: 1px solid rgba(var(--accent-rgb),0.2) !important;
  color: var(--accent) !important;
}

/* ─── Modal — light background ─── */
[data-theme="material-light"] .modal-card,
[data-theme="nordic"] .modal-card,
[data-theme="sunset"] .modal-card {
  background: var(--modal-bg) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.12);
}

[data-theme="material-light"] .modal-backdrop,
[data-theme="nordic"] .modal-backdrop,
[data-theme="sunset"] .modal-backdrop {
  background: var(--modal-overlay) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
}

/* ─── Toast — light ─── */
[data-theme="material-light"] .toast,
[data-theme="nordic"] .toast,
[data-theme="sunset"] .toast {
  background: var(--toast-bg) !important;
  border: 1px solid var(--border-glass) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1);
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .toast-close,
[data-theme="nordic"] .toast-close,
[data-theme="sunset"] .toast-close {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .toast-close:hover,
[data-theme="nordic"] .toast-close:hover,
[data-theme="sunset"] .toast-close:hover {
  color: var(--text-primary) !important;
}

/* ─── Client cards for light themes ─── */
[data-theme="material-light"] .client-card,
[data-theme="nordic"] .client-card,
[data-theme="sunset"] .client-card {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-lg) !important;
}

[data-theme="material-light"] .client-card::before,
[data-theme="material-light"] .client-card::after,
[data-theme="nordic"] .client-card::before,
[data-theme="nordic"] .client-card::after,
[data-theme="sunset"] .client-card::before,
[data-theme="sunset"] .client-card::after {
  display: none !important;
}

[data-theme="material-light"] .client-card:hover,
[data-theme="nordic"] .client-card:hover,
[data-theme="sunset"] .client-card:hover {
  border-color: rgba(var(--accent-rgb),0.3) !important;
  box-shadow: var(--shadow-card) !important;
}

[data-theme="material-light"] .client-card__detail,
[data-theme="nordic"] .client-card__detail,
[data-theme="sunset"] .client-card__detail {
  background: var(--bg-glass-soft) !important;
  backdrop-filter: none !important;
  border: 1px solid var(--border-glass) !important;
  border-radius: var(--radius-md) !important;
}

/* ─── Notification drawer — light ─── */
[data-theme="material-light"] #notif-drawer,
[data-theme="nordic"] #notif-drawer,
[data-theme="sunset"] #notif-drawer {
  background: var(--modal-bg) !important;
  border-left: 1px solid var(--border-glass) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: -4px 0 16px rgba(0,0,0,0.08);
}

/* ─── Scrollbar — light colors ─── */
[data-theme="material-light"] ::-webkit-scrollbar-track,
[data-theme="nordic"] ::-webkit-scrollbar-track,
[data-theme="sunset"] ::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.02) !important;
}

[data-theme="material-light"] ::-webkit-scrollbar-thumb,
[data-theme="nordic"] ::-webkit-scrollbar-thumb,
[data-theme="sunset"] ::-webkit-scrollbar-thumb {
  background: rgba(var(--accent-rgb),0.2) !important;
}

[data-theme="material-light"] ::-webkit-scrollbar-thumb:hover,
[data-theme="nordic"] ::-webkit-scrollbar-thumb:hover,
[data-theme="sunset"] ::-webkit-scrollbar-thumb:hover {
  background: rgba(var(--accent-rgb),0.35) !important;
}

/* ─── Input fields — light border/bg ─── */
[data-theme="material-light"] .input,
[data-theme="material-light"] input[type="text"],
[data-theme="material-light"] input[type="number"],
[data-theme="material-light"] input[type="email"],
[data-theme="material-light"] input[type="password"],
[data-theme="material-light"] input[type="date"],
[data-theme="material-light"] input[type="datetime-local"],
[data-theme="material-light"] input[type="search"],
[data-theme="material-light"] textarea,
[data-theme="material-light"] select,
[data-theme="nordic"] .input,
[data-theme="nordic"] input[type="text"],
[data-theme="nordic"] input[type="number"],
[data-theme="nordic"] input[type="email"],
[data-theme="nordic"] input[type="password"],
[data-theme="nordic"] input[type="date"],
[data-theme="nordic"] input[type="datetime-local"],
[data-theme="nordic"] input[type="search"],
[data-theme="nordic"] textarea,
[data-theme="nordic"] select,
[data-theme="sunset"] .input,
[data-theme="sunset"] input[type="text"],
[data-theme="sunset"] input[type="number"],
[data-theme="sunset"] input[type="email"],
[data-theme="sunset"] input[type="password"],
[data-theme="sunset"] input[type="date"],
[data-theme="sunset"] input[type="datetime-local"],
[data-theme="sunset"] input[type="search"],
[data-theme="sunset"] textarea,
[data-theme="sunset"] select {
  background: var(--bg-input) !important;
  border: 1px solid var(--border-glass) !important;
  color: var(--text-primary) !important;
}

/* ─── Select option backgrounds ─── */
[data-theme="material-light"] select option,
[data-theme="nordic"] select option,
[data-theme="sunset"] select option {
  background: #FFFFFF !important;
  color: var(--text-primary) !important;
}

/* ─── Autofill fix for light themes ─── */
[data-theme="material-light"] input:-webkit-autofill,
[data-theme="material-light"] input:-webkit-autofill:hover,
[data-theme="material-light"] input:-webkit-autofill:focus,
[data-theme="nordic"] input:-webkit-autofill,
[data-theme="nordic"] input:-webkit-autofill:hover,
[data-theme="nordic"] input:-webkit-autofill:focus,
[data-theme="sunset"] input:-webkit-autofill,
[data-theme="sunset"] input:-webkit-autofill:hover,
[data-theme="sunset"] input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  border-color: var(--border-glass) !important;
}

/* ─── Gray background overrides for light themes ─── */
[data-theme="material-light"] .bg-gray-50,
[data-theme="material-light"] .bg-gray-100,
[data-theme="nordic"] .bg-gray-50,
[data-theme="nordic"] .bg-gray-100,
[data-theme="sunset"] .bg-gray-50,
[data-theme="sunset"] .bg-gray-100 {
  background: var(--bg-glass-soft) !important;
}

[data-theme="material-light"] .bg-gray-700,
[data-theme="material-light"] .bg-gray-800,
[data-theme="material-light"] .bg-gray-900,
[data-theme="nordic"] .bg-gray-700,
[data-theme="nordic"] .bg-gray-800,
[data-theme="nordic"] .bg-gray-900,
[data-theme="sunset"] .bg-gray-700,
[data-theme="sunset"] .bg-gray-800,
[data-theme="sunset"] .bg-gray-900 {
  background: var(--bg-glass) !important;
}

[data-theme="material-light"] .bg-white,
[data-theme="nordic"] .bg-white,
[data-theme="sunset"] .bg-white {
  background: var(--bg-card) !important;
}

/* ─── White/opacity patterns used as hover/soft backgrounds ─── */
[data-theme="material-light"] [class*="bg-white\\/"],
[data-theme="nordic"] [class*="bg-white\\/"],
[data-theme="sunset"] [class*="bg-white\\/"] {
  background: rgba(var(--accent-rgb),0.04) !important;
}

[data-theme="material-light"] .hover\:bg-white\/10:hover,
[data-theme="nordic"] .hover\:bg-white\/10:hover,
[data-theme="sunset"] .hover\:bg-white\/10:hover {
  background: rgba(var(--accent-rgb),0.06) !important;
}

/* ─── Cancel / neutral buttons for light ─── */
[data-theme="material-light"] button.bg-gray-700,
[data-theme="material-light"] button[class*="bg-gray-700"],
[data-theme="material-light"] button[class*="bg-gray-600"],
[data-theme="nordic"] button.bg-gray-700,
[data-theme="nordic"] button[class*="bg-gray-700"],
[data-theme="nordic"] button[class*="bg-gray-600"],
[data-theme="sunset"] button.bg-gray-700,
[data-theme="sunset"] button[class*="bg-gray-700"],
[data-theme="sunset"] button[class*="bg-gray-600"] {
  background: var(--bg-glass) !important;
  border: 1px solid var(--border-glass) !important;
  color: var(--text-secondary) !important;
}

/* ─── Stat / KPI numbers — use gradient for light themes ─── */
[data-theme="material-light"] .glass-soft .text-2xl,
[data-theme="material-light"] .glass-soft .text-3xl,
[data-theme="material-light"] .glass-soft .text-4xl,
[data-theme="nordic"] .glass-soft .text-2xl,
[data-theme="nordic"] .glass-soft .text-3xl,
[data-theme="nordic"] .glass-soft .text-4xl,
[data-theme="sunset"] .glass-soft .text-2xl,
[data-theme="sunset"] .glass-soft .text-3xl,
[data-theme="sunset"] .glass-soft .text-4xl {
  -webkit-text-fill-color: unset !important;
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  color: var(--accent) !important;
  font-weight: 800;
}

/* ─── Skeleton for light themes ─── */
[data-theme="material-light"] .skeleton,
[data-theme="nordic"] .skeleton,
[data-theme="sunset"] .skeleton {
  background: linear-gradient(90deg, var(--bg-glass) 25%, var(--bg-glass-soft) 50%, var(--bg-glass) 75%) !important;
  background-size: 200% 100%;
}

/* ─── Code blocks for light themes ─── */
[data-theme="material-light"] pre,
[data-theme="nordic"] pre,
[data-theme="sunset"] pre {
  background: var(--bg-glass) !important;
  border: 1px solid var(--border-glass) !important;
  color: var(--text-primary) !important;
}

/* ─── User profile text in sidebar ─── */
[data-theme="material-light"] .text-white\/90,
[data-theme="nordic"] .text-white\/90,
[data-theme="sunset"] .text-white\/90 {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .text-white\/40,
[data-theme="nordic"] .text-white\/40,
[data-theme="sunset"] .text-white\/40 {
  color: var(--text-muted) !important;
}

/* ─── Ring colors for light themes ─── */
[data-theme="material-light"] .ring-white\/20,
[data-theme="nordic"] .ring-white\/20,
[data-theme="sunset"] .ring-white\/20 {
  --tw-ring-color: var(--border-glass) !important;
}

/* ─── Border divider inside sidebar ─── */
[data-theme="material-light"] .border-white\/5,
[data-theme="nordic"] .border-white\/5,
[data-theme="sunset"] .border-white\/5 {
  border-color: var(--border-glass) !important;
}

/* ─── Theme card preview backgrounds in admin-configs ─── */
[data-theme="material-light"] .theme-card .border-white\/10,
[data-theme="nordic"] .theme-card .border-white\/10,
[data-theme="sunset"] .theme-card .border-white\/10 {
  border-color: var(--border-glass) !important;
}

/* ─── Notification badge for light themes ─── */
[data-theme="material-light"] .fas.fa-bell,
[data-theme="nordic"] .fas.fa-bell,
[data-theme="sunset"] .fas.fa-bell {
  color: var(--text-secondary) !important;
}

/* ─── Sidebar text-white/50 for logout icon ─── */
[data-theme="material-light"] .text-white\/50,
[data-theme="nordic"] .text-white\/50,
[data-theme="sunset"] .text-white\/50 {
  color: var(--text-muted) !important;
}

/* ─── Sidebar chevron icon — override hardcoded white ─── */
[data-theme="material-light"] .sidebar-group-toggle i.chevron,
[data-theme="nordic"] .sidebar-group-toggle i.chevron,
[data-theme="sunset"] .sidebar-group-toggle i.chevron {
  color: var(--text-muted) !important;
}

/* ─── Sidebar group-icon opacity for light ─── */
[data-theme="material-light"] .sidebar-group-toggle i.group-icon,
[data-theme="nordic"] .sidebar-group-toggle i.group-icon,
[data-theme="sunset"] .sidebar-group-toggle i.group-icon {
  color: var(--accent) !important;
  opacity: 0.8;
}

/* ─── Sidebar group toggle hover — override hardcoded rgba(255,255,255,0.05) ─── */
[data-theme="material-light"] .sidebar-group-toggle:hover,
[data-theme="nordic"] .sidebar-group-toggle:hover,
[data-theme="sunset"] .sidebar-group-toggle:hover {
  background: rgba(var(--accent-rgb),0.06) !important;
}

/* ─── Nav dropdown / select text ─── */
[data-theme="material-light"] .nav-premium select,
[data-theme="material-light"] .nav-premium .text-cyan-400,
[data-theme="nordic"] .nav-premium select,
[data-theme="nordic"] .nav-premium .text-cyan-400,
[data-theme="sunset"] .nav-premium select,
[data-theme="sunset"] .nav-premium .text-cyan-400 {
  color: var(--accent) !important;
}

/* ─── Bell icon inline style override ─── */
[data-theme="material-light"] .nav-premium .fas.fa-bell,
[data-theme="nordic"] .nav-premium .fas.fa-bell,
[data-theme="sunset"] .nav-premium .fas.fa-bell {
  color: var(--text-secondary) !important;
}

/* ─── Hover bg-white/10 override ─── */
[data-theme="material-light"] .hover\:bg-white\/10:hover,
[data-theme="nordic"] .hover\:bg-white\/10:hover,
[data-theme="sunset"] .hover\:bg-white\/10:hover {
  background: rgba(var(--accent-rgb),0.08) !important;
}

/* ─── All remaining white text in sidebar ─── */
[data-theme="material-light"] .sidebar-premium p,
[data-theme="material-light"] .sidebar-premium span,
[data-theme="material-light"] .sidebar-premium a,
[data-theme="nordic"] .sidebar-premium p,
[data-theme="nordic"] .sidebar-premium span,
[data-theme="nordic"] .sidebar-premium a,
[data-theme="sunset"] .sidebar-premium p,
[data-theme="sunset"] .sidebar-premium span,
[data-theme="sunset"] .sidebar-premium a {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .sidebar-premium .sidebar-label-premium,
[data-theme="nordic"] .sidebar-premium .sidebar-label-premium,
[data-theme="sunset"] .sidebar-premium .sidebar-label-premium {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .sidebar-premium .sidebar-group-toggle span,
[data-theme="nordic"] .sidebar-premium .sidebar-group-toggle span,
[data-theme="sunset"] .sidebar-premium .sidebar-group-toggle span {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .sidebar-premium .sidebar-group-toggle.open span,
[data-theme="nordic"] .sidebar-premium .sidebar-group-toggle.open span,
[data-theme="sunset"] .sidebar-premium .sidebar-group-toggle.open span {
  color: var(--accent) !important;
}

/* ─── Table headers for light themes ─── */
[data-theme="material-light"] th,
[data-theme="material-light"] .table-modern th,
[data-theme="nordic"] th,
[data-theme="nordic"] .table-modern th,
[data-theme="sunset"] th,
[data-theme="sunset"] .table-modern th {
  color: var(--text-secondary) !important;
  background: var(--bg-glass) !important;
}

[data-theme="material-light"] td,
[data-theme="material-light"] .table-modern td,
[data-theme="nordic"] td,
[data-theme="nordic"] .table-modern td,
[data-theme="sunset"] td,
[data-theme="sunset"] .table-modern td {
  color: var(--text-primary) !important;
  border-color: var(--border-glass) !important;
}

/* ─── Tab items for light themes ─── */
[data-theme="material-light"] [role="tab"],
[data-theme="nordic"] [role="tab"],
[data-theme="sunset"] [role="tab"] {
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] [role="tab"][aria-selected="true"],
[data-theme="nordic"] [role="tab"][aria-selected="true"],
[data-theme="sunset"] [role="tab"][aria-selected="true"] {
  color: var(--accent) !important;
}

/* ─── Heading text in card bodies ─── */
[data-theme="material-light"] h2, [data-theme="material-light"] h3,
[data-theme="material-light"] h4, [data-theme="material-light"] h5,
[data-theme="nordic"] h2, [data-theme="nordic"] h3,
[data-theme="nordic"] h4, [data-theme="nordic"] h5,
[data-theme="sunset"] h2, [data-theme="sunset"] h3,
[data-theme="sunset"] h4, [data-theme="sunset"] h5 {
  color: var(--text-primary) !important;
}

/* ─── Definition list terms ─── */
[data-theme="material-light"] dt,
[data-theme="nordic"] dt,
[data-theme="sunset"] dt {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] dd,
[data-theme="nordic"] dd,
[data-theme="sunset"] dd {
  color: var(--text-primary) !important;
}

/* ─── Labels and small text ─── */
[data-theme="material-light"] label,
[data-theme="nordic"] label,
[data-theme="sunset"] label {
  color: var(--text-secondary) !important;
}

/* ─── Paragraph text in content ─── */
[data-theme="material-light"] .main-content-premium p,
[data-theme="nordic"] .main-content-premium p,
[data-theme="sunset"] .main-content-premium p {
  color: var(--text-secondary) !important;
}

/* ─── Text shadow removal for light themes ─── */
[data-theme="material-light"] [data-theme] .text-red-400,
[data-theme="material-light"] [data-theme] .text-green-400,
[data-theme="material-light"] [data-theme] .text-yellow-400,
[data-theme="material-light"] [data-theme] .text-cyan-400,
[data-theme="nordic"] [data-theme] .text-red-400,
[data-theme="nordic"] [data-theme] .text-green-400,
[data-theme="nordic"] [data-theme] .text-yellow-400,
[data-theme="nordic"] [data-theme] .text-cyan-400,
[data-theme="sunset"] [data-theme] .text-red-400,
[data-theme="sunset"] [data-theme] .text-green-400,
[data-theme="sunset"] [data-theme] .text-yellow-400,
[data-theme="sunset"] [data-theme] .text-cyan-400 {
  text-shadow: none !important;
}

/* ═══════════════════════════════════════════════════════════
   COMPREHENSIVE LIGHT THEME TEXT FIX — catch ALL white text
   across all modules: reportes, ventas, clientes, equipamiento,
   nutricion, marketing, coaches, kiosko, membresias, etc.
   ═══════════════════════════════════════════════════════════ */

/* ─── Master text color override for ALL elements ─── */
[data-theme="material-light"] .main-content-premium,
[data-theme="nordic"] .main-content-premium,
[data-theme="sunset"] .main-content-premium {
  color: var(--text-primary) !important;
}

/* ─── ALL white text classes used in modules ─── */
[data-theme="material-light"] .text-white,
[data-theme="material-light"] .text-white\/90,
[data-theme="material-light"] .text-white\/80,
[data-theme="material-light"] .text-white\/70,
[data-theme="material-light"] .text-white\/60,
[data-theme="material-light"] .text-white\/50,
[data-theme="material-light"] .text-white\/40,
[data-theme="material-light"] .text-white\/30,
[data-theme="nordic"] .text-white,
[data-theme="nordic"] .text-white\/90,
[data-theme="nordic"] .text-white\/80,
[data-theme="nordic"] .text-white\/70,
[data-theme="nordic"] .text-white\/60,
[data-theme="nordic"] .text-white\/50,
[data-theme="nordic"] .text-white\/40,
[data-theme="nordic"] .text-white\/30,
[data-theme="sunset"] .text-white,
[data-theme="sunset"] .text-white\/90,
[data-theme="sunset"] .text-white\/80,
[data-theme="sunset"] .text-white\/70,
[data-theme="sunset"] .text-white\/60,
[data-theme="sunset"] .text-white\/50,
[data-theme="sunset"] .text-white\/40,
[data-theme="sunset"] .text-white\/30 {
  color: var(--text-primary) !important;
}

/* ─── Override gray text for better contrast on light bg ─── */
[data-theme="material-light"] .text-gray-100,
[data-theme="material-light"] .text-gray-200,
[data-theme="material-light"] .text-gray-300,
[data-theme="material-light"] .text-gray-400,
[data-theme="nordic"] .text-gray-100,
[data-theme="nordic"] .text-gray-200,
[data-theme="nordic"] .text-gray-300,
[data-theme="nordic"] .text-gray-400,
[data-theme="sunset"] .text-gray-100,
[data-theme="sunset"] .text-gray-200,
[data-theme="sunset"] .text-gray-300,
[data-theme="sunset"] .text-gray-400 {
  color: var(--text-secondary) !important;
}

/* ─── All span, p, div, a inside main content ─── */
[data-theme="material-light"] .main-content-premium span:not(.badge):not(.chip):not(.chip-premium):not([class*="bg-"]),
[data-theme="nordic"] .main-content-premium span:not(.badge):not(.chip):not(.chip-premium):not([class*="bg-"]),
[data-theme="sunset"] .main-content-premium span:not(.badge):not(.chip):not(.chip-premium):not([class*="bg-"]) {
  color: inherit;
}

/* ─── Tab buttons (.tab-btn) used in expenses, reportes, etc ─── */
[data-theme="material-light"] .tab-btn,
[data-theme="nordic"] .tab-btn,
[data-theme="sunset"] .tab-btn {
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] .tab-btn.border-blue-500,
[data-theme="material-light"] .tab-btn.text-blue-500,
[data-theme="material-light"] .tab-btn.active,
[data-theme="nordic"] .tab-btn.border-blue-500,
[data-theme="nordic"] .tab-btn.text-blue-500,
[data-theme="nordic"] .tab-btn.active,
[data-theme="sunset"] .tab-btn.border-blue-500,
[data-theme="sunset"] .tab-btn.text-blue-500,
[data-theme="sunset"] .tab-btn.active {
  color: var(--accent) !important;
  border-color: var(--accent) !important;
}

/* ─── Border white/10 and white/20 used as table/section dividers ─── */
[data-theme="material-light"] .border-white\/10,
[data-theme="material-light"] .border-white\/20,
[data-theme="material-light"] .border-white\/5,
[data-theme="nordic"] .border-white\/10,
[data-theme="nordic"] .border-white\/20,
[data-theme="nordic"] .border-white\/5,
[data-theme="sunset"] .border-white\/10,
[data-theme="sunset"] .border-white\/20,
[data-theme="sunset"] .border-white\/5 {
  border-color: var(--border-glass) !important;
}

/* ─── Table with bg-white/10 header rows ─── */
[data-theme="material-light"] tr.bg-white\/10,
[data-theme="material-light"] .bg-white\/10,
[data-theme="nordic"] tr.bg-white\/10,
[data-theme="nordic"] .bg-white\/10,
[data-theme="sunset"] tr.bg-white\/10,
[data-theme="sunset"] .bg-white\/10 {
  background: var(--bg-glass) !important;
}

/* ─── Arqueo de Ventas alert styling ─── */
[data-theme="material-light"] .alert,
[data-theme="nordic"] .alert,
[data-theme="sunset"] .alert {
  color: var(--text-primary) !important;
  background: var(--bg-glass) !important;
  border: 1px solid var(--border-glass) !important;
}

/* ─── Badge and status indicators ─── */
[data-theme="material-light"] .badge,
[data-theme="nordic"] .badge,
[data-theme="sunset"] .badge {
  color: #fff !important; /* badges should stay white text on colored bg */
}

/* ─── Chip (non-premium) ─── */
[data-theme="material-light"] .chip:not(.chip-premium),
[data-theme="nordic"] .chip:not(.chip-premium),
[data-theme="sunset"] .chip:not(.chip-premium) {
  color: var(--accent) !important;
  background: rgba(var(--accent-rgb),0.08) !important;
  border: 1px solid rgba(var(--accent-rgb),0.2) !important;
}

/* ─── Text-textsoft in card bodies (nutricion, marketing, etc) ─── */
[data-theme="material-light"] .card .text-textsoft,
[data-theme="material-light"] .glass-soft .text-textsoft,
[data-theme="material-light"] .glass-card .text-textsoft,
[data-theme="nordic"] .card .text-textsoft,
[data-theme="nordic"] .glass-soft .text-textsoft,
[data-theme="nordic"] .glass-card .text-textsoft,
[data-theme="sunset"] .card .text-textsoft,
[data-theme="sunset"] .glass-soft .text-textsoft,
[data-theme="sunset"] .glass-card .text-textsoft {
  color: var(--text-muted) !important;
}

/* ─── Font-medium / font-semibold headings inside cards ─── */
[data-theme="material-light"] .font-medium,
[data-theme="material-light"] .font-semibold,
[data-theme="nordic"] .font-medium,
[data-theme="nordic"] .font-semibold,
[data-theme="sunset"] .font-medium,
[data-theme="sunset"] .font-semibold {
  color: var(--text-primary);
}

/* ─── Specific module text overrides ─── */

/* Reportes KPI cards */
[data-theme="material-light"] .card .text-sm,
[data-theme="nordic"] .card .text-sm,
[data-theme="sunset"] .card .text-sm {
  color: var(--text-secondary);
}

[data-theme="material-light"] .card .text-lg,
[data-theme="material-light"] .card .text-xl,
[data-theme="nordic"] .card .text-lg,
[data-theme="nordic"] .card .text-xl,
[data-theme="sunset"] .card .text-lg,
[data-theme="sunset"] .card .text-xl {
  color: var(--text-primary);
}

/* ─── Nutrition module — meal cards, macros text ─── */
[data-theme="material-light"] .glass-soft p,
[data-theme="material-light"] .glass-soft span,
[data-theme="material-light"] .glass-soft li,
[data-theme="nordic"] .glass-soft p,
[data-theme="nordic"] .glass-soft span,
[data-theme="nordic"] .glass-soft li,
[data-theme="sunset"] .glass-soft p,
[data-theme="sunset"] .glass-soft span,
[data-theme="sunset"] .glass-soft li {
  color: var(--text-secondary);
}

[data-theme="material-light"] .glass-soft h2,
[data-theme="material-light"] .glass-soft h3,
[data-theme="material-light"] .glass-soft h4,
[data-theme="material-light"] .glass-soft h5,
[data-theme="material-light"] .glass-soft h6,
[data-theme="material-light"] .glass-soft .font-medium,
[data-theme="material-light"] .glass-soft .font-semibold,
[data-theme="material-light"] .glass-soft .font-bold,
[data-theme="nordic"] .glass-soft h2,
[data-theme="nordic"] .glass-soft h3,
[data-theme="nordic"] .glass-soft h4,
[data-theme="nordic"] .glass-soft h5,
[data-theme="nordic"] .glass-soft h6,
[data-theme="nordic"] .glass-soft .font-medium,
[data-theme="nordic"] .glass-soft .font-semibold,
[data-theme="nordic"] .glass-soft .font-bold,
[data-theme="sunset"] .glass-soft h2,
[data-theme="sunset"] .glass-soft h3,
[data-theme="sunset"] .glass-soft h4,
[data-theme="sunset"] .glass-soft h5,
[data-theme="sunset"] .glass-soft h6,
[data-theme="sunset"] .glass-soft .font-medium,
[data-theme="sunset"] .glass-soft .font-semibold,
[data-theme="sunset"] .glass-soft .font-bold {
  color: var(--text-primary) !important;
}

/* ─── Marketing automation — status text, trigger labels ─── */
[data-theme="material-light"] .glass-card p,
[data-theme="material-light"] .glass-card span,
[data-theme="material-light"] .glass-card li,
[data-theme="material-light"] .glass-card label,
[data-theme="nordic"] .glass-card p,
[data-theme="nordic"] .glass-card span,
[data-theme="nordic"] .glass-card li,
[data-theme="nordic"] .glass-card label,
[data-theme="sunset"] .glass-card p,
[data-theme="sunset"] .glass-card span,
[data-theme="sunset"] .glass-card li,
[data-theme="sunset"] .glass-card label {
  color: var(--text-secondary);
}

/* ─── Coach module — chat, coach cards ─── */
[data-theme="material-light"] .card p,
[data-theme="material-light"] .card span,
[data-theme="material-light"] .card label,
[data-theme="nordic"] .card p,
[data-theme="nordic"] .card span,
[data-theme="nordic"] .card label,
[data-theme="sunset"] .card p,
[data-theme="sunset"] .card span,
[data-theme="sunset"] .card label {
  color: var(--text-secondary);
}

[data-theme="material-light"] .card h3,
[data-theme="material-light"] .card h4,
[data-theme="material-light"] .card h5,
[data-theme="nordic"] .card h3,
[data-theme="nordic"] .card h4,
[data-theme="nordic"] .card h5,
[data-theme="sunset"] .card h3,
[data-theme="sunset"] .card h4,
[data-theme="sunset"] .card h5 {
  color: var(--text-primary) !important;
}

/* ─── Membresias — plan cards, price text ─── */
[data-theme="material-light"] .card-premium p,
[data-theme="material-light"] .card-premium span,
[data-theme="material-light"] .card-premium li,
[data-theme="nordic"] .card-premium p,
[data-theme="nordic"] .card-premium span,
[data-theme="nordic"] .card-premium li,
[data-theme="sunset"] .card-premium p,
[data-theme="sunset"] .card-premium span,
[data-theme="sunset"] .card-premium li {
  color: var(--text-secondary);
}

[data-theme="material-light"] .card-premium h3,
[data-theme="material-light"] .card-premium h4,
[data-theme="material-light"] .card-premium h5,
[data-theme="nordic"] .card-premium h3,
[data-theme="nordic"] .card-premium h4,
[data-theme="nordic"] .card-premium h5,
[data-theme="sunset"] .card-premium h3,
[data-theme="sunset"] .card-premium h4,
[data-theme="sunset"] .card-premium h5 {
  color: var(--text-primary) !important;
}

/* ─── Kiosk module — step text, routine info ─── */
[data-theme="material-light"] .glass-panel p,
[data-theme="material-light"] .glass-panel span,
[data-theme="material-light"] .glass-panel li,
[data-theme="nordic"] .glass-panel p,
[data-theme="nordic"] .glass-panel span,
[data-theme="nordic"] .glass-panel li,
[data-theme="sunset"] .glass-panel p,
[data-theme="sunset"] .glass-panel span,
[data-theme="sunset"] .glass-panel li {
  color: var(--text-secondary);
}

[data-theme="material-light"] .glass-panel h2,
[data-theme="material-light"] .glass-panel h3,
[data-theme="material-light"] .glass-panel h4,
[data-theme="nordic"] .glass-panel h2,
[data-theme="nordic"] .glass-panel h3,
[data-theme="nordic"] .glass-panel h4,
[data-theme="sunset"] .glass-panel h2,
[data-theme="sunset"] .glass-panel h3,
[data-theme="sunset"] .glass-panel h4 {
  color: var(--text-primary) !important;
}

/* ─── Equipamiento — equipment cards ─── */
[data-theme="material-light"] .card .text-xs,
[data-theme="nordic"] .card .text-xs,
[data-theme="sunset"] .card .text-xs {
  color: var(--text-muted);
}

/* ─── All text-sm and text-xs in main content ─── */
[data-theme="material-light"] .main-content-premium .text-sm,
[data-theme="material-light"] .main-content-premium .text-xs,
[data-theme="nordic"] .main-content-premium .text-sm,
[data-theme="nordic"] .main-content-premium .text-xs,
[data-theme="sunset"] .main-content-premium .text-sm,
[data-theme="sunset"] .main-content-premium .text-xs {
  color: var(--text-secondary);
}

[data-theme="material-light"] .main-content-premium .text-lg,
[data-theme="material-light"] .main-content-premium .text-xl,
[data-theme="material-light"] .main-content-premium .text-2xl,
[data-theme="nordic"] .main-content-premium .text-lg,
[data-theme="nordic"] .main-content-premium .text-xl,
[data-theme="nordic"] .main-content-premium .text-2xl,
[data-theme="sunset"] .main-content-premium .text-lg,
[data-theme="sunset"] .main-content-premium .text-xl,
[data-theme="sunset"] .main-content-premium .text-2xl {
  color: var(--text-primary);
}

/* ─── btn-ghost and text buttons ─── */
[data-theme="material-light"] .btn-ghost,
[data-theme="nordic"] .btn-ghost,
[data-theme="sunset"] .btn-ghost {
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] .btn-ghost:hover,
[data-theme="nordic"] .btn-ghost:hover,
[data-theme="sunset"] .btn-ghost:hover {
  color: var(--text-primary) !important;
  background: rgba(var(--accent-rgb),0.06) !important;
}

/* ─── Placeholder text ─── */
[data-theme="material-light"] ::placeholder,
[data-theme="nordic"] ::placeholder,
[data-theme="sunset"] ::placeholder {
  color: var(--text-muted) !important;
  opacity: 0.7;
}

/* ─── Chart / canvas container labels ─── */
[data-theme="material-light"] .chart-container,
[data-theme="nordic"] .chart-container,
[data-theme="sunset"] .chart-container {
  color: var(--text-secondary) !important;
}

/* ─── Strong / bold in content ─── */
[data-theme="material-light"] strong,
[data-theme="material-light"] b,
[data-theme="nordic"] strong,
[data-theme="nordic"] b,
[data-theme="sunset"] strong,
[data-theme="sunset"] b {
  color: var(--text-primary);
}

/* ─── Dismiss button on info panels ─── */
[data-theme="material-light"] .dismissible-panel button,
[data-theme="nordic"] .dismissible-panel button,
[data-theme="sunset"] .dismissible-panel button {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .dismissible-panel button:hover,
[data-theme="nordic"] .dismissible-panel button:hover,
[data-theme="sunset"] .dismissible-panel button:hover {
  color: var(--text-primary) !important;
  background: rgba(0,0,0,0.05) !important;
}

/* ─── Nav text and icons ─── */
[data-theme="material-light"] .nav-premium *,
[data-theme="nordic"] .nav-premium *,
[data-theme="sunset"] .nav-premium * {
  color: var(--text-primary);
}

[data-theme="material-light"] .nav-premium select,
[data-theme="nordic"] .nav-premium select,
[data-theme="sunset"] .nav-premium select {
  color: var(--accent) !important;
  background: var(--bg-input) !important;
}

/* ─── Table-wrap and table-modern full override ─── */
[data-theme="material-light"] .table-wrap,
[data-theme="nordic"] .table-wrap,
[data-theme="sunset"] .table-wrap {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .table-modern,
[data-theme="nordic"] .table-modern,
[data-theme="sunset"] .table-modern {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .table-modern tr,
[data-theme="nordic"] .table-modern tr,
[data-theme="sunset"] .table-modern tr {
  border-color: var(--border-glass) !important;
}

/* ─── Inline style color overrides (for elements with style="color: white" etc.) ─── */
[data-theme="material-light"] .main-content-premium [style*="color: white"],
[data-theme="material-light"] .main-content-premium [style*="color: #fff"],
[data-theme="material-light"] .main-content-premium [style*="color:#fff"],
[data-theme="material-light"] .main-content-premium [style*="color: rgb(255"],
[data-theme="nordic"] .main-content-premium [style*="color: white"],
[data-theme="nordic"] .main-content-premium [style*="color: #fff"],
[data-theme="nordic"] .main-content-premium [style*="color:#fff"],
[data-theme="nordic"] .main-content-premium [style*="color: rgb(255"],
[data-theme="sunset"] .main-content-premium [style*="color: white"],
[data-theme="sunset"] .main-content-premium [style*="color: #fff"],
[data-theme="sunset"] .main-content-premium [style*="color:#fff"],
[data-theme="sunset"] .main-content-premium [style*="color: rgb(255"] {
  color: var(--text-primary) !important;
}

/* ─── Ensure buttons with colored backgrounds keep white text ─── */
[data-theme="material-light"] .btn-primary,
[data-theme="material-light"] [class*="bg-blue-"] button,
[data-theme="material-light"] [class*="bg-green-"] button,
[data-theme="material-light"] [class*="bg-red-"] button,
[data-theme="material-light"] [class*="bg-yellow-"] button,
[data-theme="material-light"] button[class*="bg-blue-"],
[data-theme="material-light"] button[class*="bg-green-"],
[data-theme="material-light"] button[class*="bg-red-"],
[data-theme="material-light"] button[class*="bg-yellow-"],
[data-theme="material-light"] button[class*="bg-cyan-"],
[data-theme="material-light"] button[class*="bg-purple-"],
[data-theme="material-light"] button[class*="bg-indigo-"],
[data-theme="material-light"] a.btn-primary,
[data-theme="nordic"] .btn-primary,
[data-theme="nordic"] button[class*="bg-blue-"],
[data-theme="nordic"] button[class*="bg-green-"],
[data-theme="nordic"] button[class*="bg-red-"],
[data-theme="nordic"] button[class*="bg-yellow-"],
[data-theme="nordic"] button[class*="bg-cyan-"],
[data-theme="nordic"] button[class*="bg-purple-"],
[data-theme="nordic"] button[class*="bg-indigo-"],
[data-theme="nordic"] a.btn-primary,
[data-theme="sunset"] .btn-primary,
[data-theme="sunset"] button[class*="bg-blue-"],
[data-theme="sunset"] button[class*="bg-green-"],
[data-theme="sunset"] button[class*="bg-red-"],
[data-theme="sunset"] button[class*="bg-yellow-"],
[data-theme="sunset"] button[class*="bg-cyan-"],
[data-theme="sunset"] button[class*="bg-purple-"],
[data-theme="sunset"] button[class*="bg-indigo-"],
[data-theme="sunset"] a.btn-primary {
  color: #fff !important;
}

/* ─── Notification drawer text for light themes ─── */
[data-theme="material-light"] #notif-drawer p,
[data-theme="material-light"] #notif-drawer span,
[data-theme="material-light"] #notif-drawer h3,
[data-theme="nordic"] #notif-drawer p,
[data-theme="nordic"] #notif-drawer span,
[data-theme="nordic"] #notif-drawer h3,
[data-theme="sunset"] #notif-drawer p,
[data-theme="sunset"] #notif-drawer span,
[data-theme="sunset"] #notif-drawer h3 {
  color: var(--text-primary) !important;
}

/* ─── Gradient text used in KPI / stat numbers ─── */
[data-theme="material-light"] [style*="-webkit-text-fill-color"],
[data-theme="material-light"] [style*="background-clip: text"],
[data-theme="nordic"] [style*="-webkit-text-fill-color"],
[data-theme="nordic"] [style*="background-clip: text"],
[data-theme="sunset"] [style*="-webkit-text-fill-color"],
[data-theme="sunset"] [style*="background-clip: text"] {
  -webkit-text-fill-color: var(--text-primary) !important;
  background: none !important;
  color: var(--accent) !important;
}

/* ─── Hover text-white override ─── */
[data-theme="material-light"] .hover\:text-white:hover,
[data-theme="nordic"] .hover\:text-white:hover,
[data-theme="sunset"] .hover\:text-white:hover {
  color: var(--text-primary) !important;
}

/* ─── Focus ring colors ─── */
[data-theme="material-light"] .focus\:ring-white:focus,
[data-theme="nordic"] .focus\:ring-white:focus,
[data-theme="sunset"] .focus\:ring-white:focus {
  --tw-ring-color: var(--accent) !important;
}

/* ─── Text color for list items in sidebar and main ─── */
[data-theme="material-light"] li,
[data-theme="nordic"] li,
[data-theme="sunset"] li {
  color: var(--text-secondary);
}

/* ─── Icon colors inside modules ─── */
[data-theme="material-light"] .main-content-premium i.fas,
[data-theme="material-light"] .main-content-premium i.far,
[data-theme="material-light"] .main-content-premium i.fab,
[data-theme="nordic"] .main-content-premium i.fas,
[data-theme="nordic"] .main-content-premium i.far,
[data-theme="nordic"] .main-content-premium i.fab,
[data-theme="sunset"] .main-content-premium i.fas,
[data-theme="sunset"] .main-content-premium i.far,
[data-theme="sunset"] .main-content-premium i.fab {
  color: inherit;
}

/* ─── Module hero icon ─── */
[data-theme="material-light"] .module-hero-icon,
[data-theme="nordic"] .module-hero-icon,
[data-theme="sunset"] .module-hero-icon {
  color: var(--accent) !important;
  background: rgba(var(--accent-rgb),0.1) !important;
}

/* ─── Background dark panels inside light theme ─── */
[data-theme="material-light"] .bg-black\/20,
[data-theme="material-light"] .bg-black\/10,
[data-theme="material-light"] .bg-black\/5,
[data-theme="nordic"] .bg-black\/20,
[data-theme="nordic"] .bg-black\/10,
[data-theme="nordic"] .bg-black\/5,
[data-theme="sunset"] .bg-black\/20,
[data-theme="sunset"] .bg-black\/10,
[data-theme="sunset"] .bg-black\/5 {
  background: rgba(0,0,0,0.03) !important;
}

/* ─── Select / dropdown arrows ─── */
[data-theme="material-light"] .select,
[data-theme="nordic"] .select,
[data-theme="sunset"] .select {
  background: var(--bg-input) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-glass) !important;
}

/* ─── Summary / details elements ─── */
[data-theme="material-light"] summary,
[data-theme="material-light"] details,
[data-theme="nordic"] summary,
[data-theme="nordic"] details,
[data-theme="sunset"] summary,
[data-theme="sunset"] details {
  color: var(--text-primary) !important;
}

/* ─── Ensure colored text utilities remain visible on light bg ─── */
[data-theme="material-light"] .text-cyan-400,
[data-theme="nordic"] .text-cyan-400,
[data-theme="sunset"] .text-cyan-400 {
  color: var(--accent) !important;
}

/* ═══════════════════════════════════════════════════════════
   MODULE-SPECIFIC LIGHT THEME OVERRIDES
   nutrition-health, marketing-automation, promotions
   ═══════════════════════════════════════════════════════════ */

/* ─── Nutrition & Health (.nh-scope) — override dark variables ─── */
[data-theme="material-light"] .nh-scope,
[data-theme="nordic"] .nh-scope,
[data-theme="sunset"] .nh-scope {
  --nh-card: var(--bg-glass) !important;
  --nh-border: var(--border-glass) !important;
  --nh-accent: var(--accent);
  --nh-accent-2: #059669;
}

[data-theme="material-light"] .nh-hero,
[data-theme="nordic"] .nh-hero,
[data-theme="sunset"] .nh-hero {
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-secondary-rgb),0.05)) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .nh-hero::after,
[data-theme="nordic"] .nh-hero::after,
[data-theme="sunset"] .nh-hero::after {
  display: none !important;
}

[data-theme="material-light"] .nh-card,
[data-theme="nordic"] .nh-card,
[data-theme="sunset"] .nh-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .nh-pill,
[data-theme="nordic"] .nh-pill,
[data-theme="sunset"] .nh-pill {
  background: var(--bg-glass) !important;
  border-color: var(--border-glass) !important;
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] .nh-body-card,
[data-theme="nordic"] .nh-body-card,
[data-theme="sunset"] .nh-body-card {
  background: var(--bg-glass) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .nh-figure-wrap,
[data-theme="nordic"] .nh-figure-wrap,
[data-theme="sunset"] .nh-figure-wrap {
  background: var(--bg-glass-soft) !important;
  border-color: var(--border-glass) !important;
}

/* ─── Marketing Automation (.mkt-*) — adapt to light themes ─── */
[data-theme="material-light"] .mkt-hero,
[data-theme="nordic"] .mkt-hero,
[data-theme="sunset"] .mkt-hero,
[data-theme="unthread"] .mkt-hero {
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.06), rgba(var(--accent-secondary-rgb),0.04)) !important;
  animation: none !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .mkt-hero::before,
[data-theme="nordic"] .mkt-hero::before,
[data-theme="sunset"] .mkt-hero::before,
[data-theme="unthread"] .mkt-hero::before {
  display: none !important;
}

[data-theme="material-light"] .mkt-hero-orb,
[data-theme="nordic"] .mkt-hero-orb,
[data-theme="sunset"] .mkt-hero-orb,
[data-theme="unthread"] .mkt-hero-orb {
  display: none !important;
}

[data-theme="material-light"] .mkt-badge,
[data-theme="nordic"] .mkt-badge,
[data-theme="sunset"] .mkt-badge,
[data-theme="unthread"] .mkt-badge {
  background: rgba(var(--accent-rgb),0.08) !important;
  border-color: rgba(var(--accent-rgb),0.25) !important;
  color: var(--accent) !important;
}

[data-theme="material-light"] .mkt-stat-card,
[data-theme="nordic"] .mkt-stat-card,
[data-theme="sunset"] .mkt-stat-card,
[data-theme="unthread"] .mkt-stat-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
  backdrop-filter: none !important;
}

[data-theme="material-light"] .mkt-stat-card::before,
[data-theme="nordic"] .mkt-stat-card::before,
[data-theme="sunset"] .mkt-stat-card::before,
[data-theme="unthread"] .mkt-stat-card::before {
  display: none !important;
}

[data-theme="material-light"] .mkt-stat-value,
[data-theme="nordic"] .mkt-stat-value,
[data-theme="sunset"] .mkt-stat-value,
[data-theme="unthread"] .mkt-stat-value {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .mkt-ai-center,
[data-theme="nordic"] .mkt-ai-center,
[data-theme="sunset"] .mkt-ai-center,
[data-theme="unthread"] .mkt-ai-center {
  background: var(--bg-glass) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .mkt-ai-input-wrap,
[data-theme="nordic"] .mkt-ai-input-wrap,
[data-theme="sunset"] .mkt-ai-input-wrap,
[data-theme="unthread"] .mkt-ai-input-wrap {
  background: var(--bg-input) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .mkt-ai-input,
[data-theme="nordic"] .mkt-ai-input,
[data-theme="sunset"] .mkt-ai-input,
[data-theme="unthread"] .mkt-ai-input {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .mkt-ai-input::placeholder,
[data-theme="nordic"] .mkt-ai-input::placeholder,
[data-theme="sunset"] .mkt-ai-input::placeholder,
[data-theme="unthread"] .mkt-ai-input::placeholder {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .mkt-tabs,
[data-theme="nordic"] .mkt-tabs,
[data-theme="sunset"] .mkt-tabs,
[data-theme="unthread"] .mkt-tabs {
  background: var(--bg-glass-soft) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .mkt-tab,
[data-theme="nordic"] .mkt-tab,
[data-theme="sunset"] .mkt-tab,
[data-theme="unthread"] .mkt-tab {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .mkt-tab:hover,
[data-theme="nordic"] .mkt-tab:hover,
[data-theme="sunset"] .mkt-tab:hover,
[data-theme="unthread"] .mkt-tab:hover {
  color: var(--text-primary) !important;
  background: rgba(var(--accent-rgb),0.05) !important;
}

[data-theme="material-light"] .mkt-tab.active,
[data-theme="nordic"] .mkt-tab.active,
[data-theme="sunset"] .mkt-tab.active,
[data-theme="unthread"] .mkt-tab.active {
  color: var(--text-primary) !important;
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .mkt-flow-card,
[data-theme="nordic"] .mkt-flow-card,
[data-theme="sunset"] .mkt-flow-card,
[data-theme="unthread"] .mkt-flow-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .mkt-flow-card:hover,
[data-theme="nordic"] .mkt-flow-card:hover,
[data-theme="sunset"] .mkt-flow-card:hover,
[data-theme="unthread"] .mkt-flow-card:hover {
  border-color: rgba(var(--accent-rgb),0.3) !important;
}

/* Toggle switch track — off state: light gray on light themes */
[data-theme="material-light"] .mkt-flow-card .bg-gray-700,
[data-theme="nordic"] .mkt-flow-card .bg-gray-700,
[data-theme="sunset"] .mkt-flow-card .bg-gray-700,
[data-theme="unthread"] .mkt-flow-card .bg-gray-700 {
  background-color: #D1D5DB !important;
}

/* Status dot — inactive gray needs contrast on light bg */
[data-theme="material-light"] .mkt-flow-card .bg-gray-600,
[data-theme="nordic"] .mkt-flow-card .bg-gray-600,
[data-theme="sunset"] .mkt-flow-card .bg-gray-600,
[data-theme="unthread"] .mkt-flow-card .bg-gray-600 {
  background-color: #D1D5DB !important;
}

/* Metric values and labels */
[data-theme="material-light"] .flow-metric-val.text-white,
[data-theme="nordic"] .flow-metric-val.text-white,
[data-theme="sunset"] .flow-metric-val.text-white,
[data-theme="unthread"] .flow-metric-val.text-white {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .flow-metric-label,
[data-theme="nordic"] .flow-metric-label,
[data-theme="sunset"] .flow-metric-label,
[data-theme="unthread"] .flow-metric-label {
  color: var(--text-muted) !important;
}

/* Flow card secondary text */
[data-theme="material-light"] .mkt-flow-card .text-white,
[data-theme="nordic"] .mkt-flow-card .text-white,
[data-theme="sunset"] .mkt-flow-card .text-white,
[data-theme="unthread"] .mkt-flow-card .text-white {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .mkt-flow-card .text-white\/30,
[data-theme="nordic"] .mkt-flow-card .text-white\/30,
[data-theme="sunset"] .mkt-flow-card .text-white\/30,
[data-theme="unthread"] .mkt-flow-card .text-white\/30 {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .mkt-flow-card .border-white\/4,
[data-theme="nordic"] .mkt-flow-card .border-white\/4,
[data-theme="sunset"] .mkt-flow-card .border-white\/4,
[data-theme="unthread"] .mkt-flow-card .border-white\/4 {
  border-color: var(--border-glass) !important;
}

/* Template card text */
[data-theme="material-light"] .mkt-tpl-card .text-white,
[data-theme="nordic"] .mkt-tpl-card .text-white,
[data-theme="sunset"] .mkt-tpl-card .text-white,
[data-theme="unthread"] .mkt-tpl-card .text-white {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .mkt-tpl-card .text-white\/25,
[data-theme="nordic"] .mkt-tpl-card .text-white\/25,
[data-theme="sunset"] .mkt-tpl-card .text-white\/25,
[data-theme="unthread"] .mkt-tpl-card .text-white\/25 {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .mkt-tpl-card .text-white\/30,
[data-theme="nordic"] .mkt-tpl-card .text-white\/30,
[data-theme="sunset"] .mkt-tpl-card .text-white\/30,
[data-theme="unthread"] .mkt-tpl-card .text-white\/30 {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .mkt-tpl-card .border-white\/4,
[data-theme="nordic"] .mkt-tpl-card .border-white\/4,
[data-theme="sunset"] .mkt-tpl-card .border-white\/4,
[data-theme="unthread"] .mkt-tpl-card .border-white\/4 {
  border-color: var(--border-glass) !important;
}

/* Stat card labels */
[data-theme="material-light"] .mkt-stat-card .text-white\/40,
[data-theme="nordic"] .mkt-stat-card .text-white\/40,
[data-theme="sunset"] .mkt-stat-card .text-white\/40,
[data-theme="unthread"] .mkt-stat-card .text-white\/40 {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .mkt-tpl-card,
[data-theme="nordic"] .mkt-tpl-card,
[data-theme="sunset"] .mkt-tpl-card,
[data-theme="unthread"] .mkt-tpl-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .mkt-chart-card,
[data-theme="nordic"] .mkt-chart-card,
[data-theme="sunset"] .mkt-chart-card,
[data-theme="unthread"] .mkt-chart-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
}

/* ─── Promotions module — override dark backgrounds & white text ─── */

/* Hero section: replace dark indigo gradient with light accent tint */
[data-theme="material-light"] .promotions-hero,
[data-theme="nordic"] .promotions-hero,
[data-theme="sunset"] .promotions-hero {
  background: linear-gradient(135deg, rgba(var(--accent-rgb),0.08), rgba(var(--accent-secondary-rgb),0.05)) !important;
  border-color: var(--border-glass) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
}

/* Remove decorative gradient pseudo-elements */
[data-theme="material-light"] .promotions-hero::before,
[data-theme="material-light"] .promotions-hero::after,
[data-theme="nordic"] .promotions-hero::before,
[data-theme="nordic"] .promotions-hero::after,
[data-theme="sunset"] .promotions-hero::before,
[data-theme="sunset"] .promotions-hero::after {
  display: none !important;
}

/* Hero icon */
[data-theme="material-light"] .promotions-hero__icon,
[data-theme="nordic"] .promotions-hero__icon,
[data-theme="sunset"] .promotions-hero__icon {
  background-color: rgba(var(--accent-rgb),0.12) !important;
  color: var(--accent) !important;
}

/* Hero eyebrow */
[data-theme="material-light"] .promotions-hero__eyebrow,
[data-theme="nordic"] .promotions-hero__eyebrow,
[data-theme="sunset"] .promotions-hero__eyebrow {
  color: var(--text-muted) !important;
}

/* Hero title */
[data-theme="material-light"] .promotions-hero__title,
[data-theme="nordic"] .promotions-hero__title,
[data-theme="sunset"] .promotions-hero__title {
  color: var(--text-primary) !important;
}

/* Hero description */
[data-theme="material-light"] .promotions-hero-description,
[data-theme="nordic"] .promotions-hero-description,
[data-theme="sunset"] .promotions-hero-description {
  color: var(--text-secondary) !important;
}

/* Highlight cards */
[data-theme="material-light"] .promotions-hero__highlight,
[data-theme="nordic"] .promotions-hero__highlight,
[data-theme="sunset"] .promotions-hero__highlight {
  background: var(--bg-glass-soft) !important;
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .promotions-hero__highlight-title,
[data-theme="nordic"] .promotions-hero__highlight-title,
[data-theme="sunset"] .promotions-hero__highlight-title {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .promotions-hero__highlight-text,
[data-theme="nordic"] .promotions-hero__highlight-text,
[data-theme="sunset"] .promotions-hero__highlight-text {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .promotions-hero__highlight i,
[data-theme="nordic"] .promotions-hero__highlight i,
[data-theme="sunset"] .promotions-hero__highlight i {
  color: var(--accent) !important;
}

/* Aside card */
[data-theme="material-light"] .promotions-hero__aside-card,
[data-theme="nordic"] .promotions-hero__aside-card,
[data-theme="sunset"] .promotions-hero__aside-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
}

[data-theme="material-light"] .promotions-hero__aside-title,
[data-theme="nordic"] .promotions-hero__aside-title,
[data-theme="sunset"] .promotions-hero__aside-title {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .promotions-hero__aside-text,
[data-theme="nordic"] .promotions-hero__aside-text,
[data-theme="sunset"] .promotions-hero__aside-text {
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] .promotions-hero__aside-footnote,
[data-theme="nordic"] .promotions-hero__aside-footnote,
[data-theme="sunset"] .promotions-hero__aside-footnote {
  color: var(--text-muted) !important;
}

/* Feature cards */
[data-theme="material-light"] .promotions-feature-card,
[data-theme="nordic"] .promotions-feature-card,
[data-theme="sunset"] .promotions-feature-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
}

[data-theme="material-light"] .promotions-feature-card:hover,
[data-theme="nordic"] .promotions-feature-card:hover,
[data-theme="sunset"] .promotions-feature-card:hover {
  border-color: rgba(var(--accent-rgb),0.4) !important;
}

[data-theme="material-light"] .promotions-feature-icon,
[data-theme="nordic"] .promotions-feature-icon,
[data-theme="sunset"] .promotions-feature-icon {
  background: rgba(var(--accent-rgb),0.1) !important;
  color: var(--accent) !important;
}

[data-theme="material-light"] .promotions-feature-title,
[data-theme="nordic"] .promotions-feature-title,
[data-theme="sunset"] .promotions-feature-title {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .promotions-feature-text,
[data-theme="nordic"] .promotions-feature-text,
[data-theme="sunset"] .promotions-feature-text {
  color: var(--text-muted) !important;
}

/* Empty state */
[data-theme="material-light"] .promotions-empty,
[data-theme="nordic"] .promotions-empty,
[data-theme="sunset"] .promotions-empty {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
}

/* Promotion cards (individual promos) */
[data-theme="material-light"] .promotions-card,
[data-theme="nordic"] .promotions-card,
[data-theme="sunset"] .promotions-card {
  background: var(--bg-card) !important;
  border-color: var(--border-glass) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.06) !important;
}

[data-theme="material-light"] .promotions-card:hover,
[data-theme="nordic"] .promotions-card:hover,
[data-theme="sunset"] .promotions-card:hover {
  border-color: rgba(var(--accent-rgb),0.4) !important;
}

[data-theme="material-light"] .promotions-card__icon,
[data-theme="nordic"] .promotions-card__icon,
[data-theme="sunset"] .promotions-card__icon {
  background: rgba(var(--accent-rgb),0.1) !important;
  color: var(--accent) !important;
}

[data-theme="material-light"] .promotions-card__title,
[data-theme="nordic"] .promotions-card__title,
[data-theme="sunset"] .promotions-card__title {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .promotions-card__subtitle,
[data-theme="nordic"] .promotions-card__subtitle,
[data-theme="sunset"] .promotions-card__subtitle {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .promotions-card__status,
[data-theme="nordic"] .promotions-card__status,
[data-theme="sunset"] .promotions-card__status {
  background-color: rgba(var(--accent-rgb),0.1) !important;
  color: var(--accent) !important;
}

[data-theme="material-light"] .promotions-card__details,
[data-theme="nordic"] .promotions-card__details,
[data-theme="sunset"] .promotions-card__details {
  color: var(--text-secondary) !important;
}

[data-theme="material-light"] .promotions-card__detail,
[data-theme="nordic"] .promotions-card__detail,
[data-theme="sunset"] .promotions-card__detail {
  border-color: var(--border-glass) !important;
}

[data-theme="material-light"] .promotions-card__detail dt,
[data-theme="nordic"] .promotions-card__detail dt,
[data-theme="sunset"] .promotions-card__detail dt {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .promotions-card__detail dd,
[data-theme="nordic"] .promotions-card__detail dd,
[data-theme="sunset"] .promotions-card__detail dd {
  color: var(--text-primary) !important;
}

/* ─── Catch-all: any element with hardcoded rgba dark bg inside light theme ─── */
[data-theme="material-light"] [style*="background: rgba(15"],
[data-theme="material-light"] [style*="background:rgba(15"],
[data-theme="material-light"] [style*="background: rgba(0, 0, 0"],
[data-theme="material-light"] [style*="background:rgba(0,0,0"],
[data-theme="nordic"] [style*="background: rgba(15"],
[data-theme="nordic"] [style*="background:rgba(15"],
[data-theme="nordic"] [style*="background: rgba(0, 0, 0"],
[data-theme="nordic"] [style*="background:rgba(0,0,0"],
[data-theme="sunset"] [style*="background: rgba(15"],
[data-theme="sunset"] [style*="background:rgba(15"],
[data-theme="sunset"] [style*="background: rgba(0, 0, 0"],
[data-theme="sunset"] [style*="background:rgba(0,0,0"] {
  background: var(--bg-glass) !important;
}

/* ─── bg-gradient-to-r dark gradients → light version ─── */
[data-theme="material-light"] [style*="background: linear-gradient"][style*="0f172a"],
[data-theme="material-light"] [style*="background:linear-gradient"][style*="0f172a"],
[data-theme="nordic"] [style*="background: linear-gradient"][style*="0f172a"],
[data-theme="nordic"] [style*="background:linear-gradient"][style*="0f172a"],
[data-theme="sunset"] [style*="background: linear-gradient"][style*="0f172a"],
[data-theme="sunset"] [style*="background:linear-gradient"][style*="0f172a"] {
  background: var(--bg-glass) !important;
}

/* ─── bg-gray-700 inputs used in nutrition modals ─── */
[data-theme="material-light"] .bg-gray-700,
[data-theme="material-light"] input.bg-gray-700,
[data-theme="material-light"] textarea.bg-gray-700,
[data-theme="material-light"] select.bg-gray-700,
[data-theme="nordic"] .bg-gray-700,
[data-theme="nordic"] input.bg-gray-700,
[data-theme="nordic"] textarea.bg-gray-700,
[data-theme="nordic"] select.bg-gray-700,
[data-theme="sunset"] .bg-gray-700,
[data-theme="sunset"] input.bg-gray-700,
[data-theme="sunset"] textarea.bg-gray-700,
[data-theme="sunset"] select.bg-gray-700 {
  background: var(--bg-input) !important;
  border-color: var(--border-glass) !important;
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .border-gray-600,
[data-theme="nordic"] .border-gray-600,
[data-theme="sunset"] .border-gray-600 {
  border-color: var(--border-glass) !important;
}

/* ─── bg-white/5 and bg-white/10 used in nutrition inputs ─── */
[data-theme="material-light"] .bg-white\/5,
[data-theme="nordic"] .bg-white\/5,
[data-theme="sunset"] .bg-white\/5 {
  background: var(--bg-glass-soft) !important;
}

/* ─── Module-specific scoped inline CSS overrides ─── */
/* Nutrition: override color:#fff in scoped <style> blocks */
[data-theme="material-light"] .nh-scope *,
[data-theme="nordic"] .nh-scope *,
[data-theme="sunset"] .nh-scope * {
  color: inherit;
}

[data-theme="material-light"] .nh-scope,
[data-theme="nordic"] .nh-scope,
[data-theme="sunset"] .nh-scope {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .nh-scope h2,
[data-theme="material-light"] .nh-scope h3,
[data-theme="material-light"] .nh-scope h4,
[data-theme="material-light"] .nh-scope .font-bold,
[data-theme="material-light"] .nh-scope .font-semibold,
[data-theme="nordic"] .nh-scope h2,
[data-theme="nordic"] .nh-scope h3,
[data-theme="nordic"] .nh-scope h4,
[data-theme="nordic"] .nh-scope .font-bold,
[data-theme="nordic"] .nh-scope .font-semibold,
[data-theme="sunset"] .nh-scope h2,
[data-theme="sunset"] .nh-scope h3,
[data-theme="sunset"] .nh-scope h4,
[data-theme="sunset"] .nh-scope .font-bold,
[data-theme="sunset"] .nh-scope .font-semibold {
  color: var(--text-primary) !important;
}

[data-theme="material-light"] .nh-scope .text-white\/60,
[data-theme="material-light"] .nh-scope .text-white\/50,
[data-theme="material-light"] .nh-scope .text-white\/40,
[data-theme="material-light"] .nh-scope .text-white\/30,
[data-theme="material-light"] .nh-scope .text-white\/70,
[data-theme="nordic"] .nh-scope .text-white\/60,
[data-theme="nordic"] .nh-scope .text-white\/50,
[data-theme="nordic"] .nh-scope .text-white\/40,
[data-theme="nordic"] .nh-scope .text-white\/30,
[data-theme="nordic"] .nh-scope .text-white\/70,
[data-theme="sunset"] .nh-scope .text-white\/60,
[data-theme="sunset"] .nh-scope .text-white\/50,
[data-theme="sunset"] .nh-scope .text-white\/40,
[data-theme="sunset"] .nh-scope .text-white\/30,
[data-theme="sunset"] .nh-scope .text-white\/70 {
  color: var(--text-muted) !important;
}

/* ─── Nutrition scoped toast — keep white on colored bg ─── */
[data-theme="material-light"] .nh-scope .bg-green-500,
[data-theme="material-light"] .nh-scope .bg-indigo-500,
[data-theme="nordic"] .nh-scope .bg-green-500,
[data-theme="nordic"] .nh-scope .bg-indigo-500,
[data-theme="sunset"] .nh-scope .bg-green-500,
[data-theme="sunset"] .nh-scope .bg-indigo-500 {
  color: #fff !important;
}

/* ─── Gray-400 text used as close button/inactive text ─── */
[data-theme="material-light"] .text-gray-400,
[data-theme="nordic"] .text-gray-400,
[data-theme="sunset"] .text-gray-400 {
  color: var(--text-muted) !important;
}

[data-theme="material-light"] .hover\:text-white:hover,
[data-theme="nordic"] .hover\:text-white:hover,
[data-theme="sunset"] .hover\:text-white:hover {
  color: var(--text-primary) !important;
}

/* ═══════════════════════════════════════════════════════════
   UNTHREAD — Clean Documentation-Style Light Theme
   Inspired by docs.unthread.io
   Red accent, Inter font, flat design, clean borders
   ═══════════════════════════════════════════════════════════ */

[data-theme="unthread"] {
  --bg-primary: #FFFFFF;
  --bg-card: #FFFFFF;
  --bg-glass: #F8F9FB;
  --bg-glass-soft: #F3F4F6;
  --bg-input: #FFFFFF;
  --bg-hover: rgba(149,128,255,0.04);
  --border-glass: #E5E7EB;
  --border-subtle: #F3F4F6;
  --text-primary: #111827;
  --text-secondary: #4B5563;
  --text-muted: #6B7280;
  --accent: #9580FF;
  --accent-rgb: 149,128,255;
  --accent-hover: #7B6FE0;
  --accent-glow: rgba(149,128,255,0.08);
  --accent-secondary: #7B6FE0;
  --accent-secondary-rgb: 123,111,224;
  --gradient-accent: linear-gradient(135deg, #9580FF 0%, #7B6FE0 100%);
  --gradient-accent-soft: linear-gradient(135deg, rgba(149,128,255,0.05) 0%, rgba(123,111,224,0.03) 100%);
  --gradient-card: #FFFFFF;
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.625rem;
  --radius-xl: 0.75rem;
  --blur: 0px;
  --shadow-card: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.06);
  --shadow-button: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-glow: none;
  --nav-bg: #FFFFFF;
  --sidebar-bg: #F8F9FB;
  --modal-overlay: rgba(17,24,39,0.45);
  --modal-bg: #FFFFFF;
  --toast-bg: #FFFFFF;
  --card-bg: #FFFFFF;
  --transition-fast: 0.15s ease;
  --transition-normal: 0.2s ease;
}

/* ─── Unthread: Font & Body ─── */
[data-theme="unthread"] body,
body[data-theme="unthread"],
[data-theme="unthread"] {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif !important;
  color: #111827 !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

body[data-theme="unthread"] {
  background-color: #F9FAFB !important;
  background-image: none !important;
}

/* ─── Unthread: Text overrides ─── */
[data-theme="unthread"] .text-white { color: #111827 !important; }
[data-theme="unthread"] .text-textsoft { color: #6B7280 !important; }
[data-theme="unthread"] .text-gray-400 { color: #6B7280 !important; }
[data-theme="unthread"] .text-gray-500 { color: #6B7280 !important; }
[data-theme="unthread"] .text-gray-600,
[data-theme="unthread"] .text-gray-700 { color: #4B5563 !important; }
[data-theme="unthread"] .text-gray-800,
[data-theme="unthread"] .text-gray-900 { color: #111827 !important; }

/* ─── Unthread: Navigation Bar ─── */
[data-theme="unthread"] .nav-premium {
  background: #FFFFFF !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-bottom: 1px solid #E5E7EB !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
}

/* ─── Unthread: Sidebar — Docs-style nav ─── */
[data-theme="unthread"] .sidebar-premium {
  background: #F8F9FB !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 0.625rem !important;
}

[data-theme="unthread"] .sidebar-label-premium {
  color: #374151 !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
}

[data-theme="unthread"] .sidebar-item-premium {
  border-radius: 0.375rem !important;
  border: 1px solid transparent !important;
}

[data-theme="unthread"] .sidebar-item-premium i {
  color: #9CA3AF !important;
  font-size: 0.8125rem !important;
}

[data-theme="unthread"] .sidebar-item-premium::before {
  display: none !important;
}

[data-theme="unthread"] .sidebar-item-premium:hover {
  background: #F3F4F6 !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

[data-theme="unthread"] .sidebar-item-premium:hover i { color: #9580FF !important; }
[data-theme="unthread"] .sidebar-item-premium:hover .sidebar-label-premium { color: #111827 !important; }

[data-theme="unthread"] .sidebar-item-premium.active {
  background: rgba(149,128,255,0.06) !important;
  border-color: transparent !important;
  border-left: 2.5px solid #9580FF !important;
  box-shadow: none !important;
}

[data-theme="unthread"] .sidebar-item-premium.active i {
  color: #9580FF !important;
  filter: none !important;
}

[data-theme="unthread"] .sidebar-item-premium.active .sidebar-label-premium {
  color: #9580FF !important;
  font-weight: 600 !important;
}

/* Sidebar group toggles */
[data-theme="unthread"] .sidebar-group-toggle span { color: #6B7280 !important; font-weight: 600 !important; }
[data-theme="unthread"] .sidebar-group-toggle.open span { color: #9580FF !important; }
[data-theme="unthread"] .sidebar-group-toggle i.group-icon { color: #D1D5DB !important; }
[data-theme="unthread"] .sidebar-group-toggle.open i.group-icon { color: #9580FF !important; }
[data-theme="unthread"] .sidebar-group-toggle i.chevron { color: #D1D5DB !important; }
[data-theme="unthread"] .sidebar-group-toggle:hover { background: #F3F4F6 !important; }

/* Sidebar profile area */
[data-theme="unthread"] .sidebar-premium .text-white\/90,
[data-theme="unthread"] .sidebar-premium p.text-white\/90 { color: #111827 !important; }
[data-theme="unthread"] .sidebar-premium .text-white\/40,
[data-theme="unthread"] .sidebar-premium .text-\[0\.6rem\] { color: #9CA3AF !important; }

/* ─── Unthread: Main Content Area ─── */
[data-theme="unthread"] .main-content-premium {
  background: #FFFFFF !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 0.625rem !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}

/* ─── Unthread: Cards & Panels — Clean flat ─── */
[data-theme="unthread"] .glass-soft,
[data-theme="unthread"] .glass-card,
[data-theme="unthread"] .card,
[data-theme="unthread"] .card-premium,
[data-theme="unthread"] .glass-panel {
  background: #FFFFFF !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 0.5rem !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.04) !important;
}

[data-theme="unthread"] .card-premium::before { display: none !important; }

[data-theme="unthread"] .card-premium:hover,
[data-theme="unthread"] .glass-soft:hover {
  border-color: #D1D5DB !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
  transform: none !important;
}

/* ─── Unthread: Module Hero ─── */
[data-theme="unthread"] .module-hero {
  background: linear-gradient(135deg, rgba(149,128,255,0.04), rgba(59,130,246,0.02)) !important;
  backdrop-filter: none !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 0.625rem !important;
}
[data-theme="unthread"] .module-hero::before,
[data-theme="unthread"] .module-hero::after { display: none !important; }
[data-theme="unthread"] .module-hero-title {
  background: none !important;
  -webkit-text-fill-color: #111827 !important;
  font-weight: 700 !important;
}
[data-theme="unthread"] .module-hero-description { color: #4B5563 !important; }
[data-theme="unthread"] .module-hero-icon {
  background: rgba(149,128,255,0.08) !important;
  color: #9580FF !important;
  border: 1px solid rgba(149,128,255,0.15) !important;
  box-shadow: none !important;
}

/* ─── Unthread: Module Info Cards ─── */
[data-theme="unthread"] .module-info-card {
  background: #FFFFFF !important;
  backdrop-filter: none !important;
  border: 1px solid #E5E7EB !important;
}
[data-theme="unthread"] .module-info-card:hover {
  border-color: rgba(149,128,255,0.3) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
  transform: none !important;
}
[data-theme="unthread"] .module-info-title { color: #111827 !important; }
[data-theme="unthread"] .module-info-text { color: #6B7280 !important; }
[data-theme="unthread"] .module-info-icon {
  background: rgba(149,128,255,0.08) !important;
  color: #9580FF !important;
}

/* ─── Unthread: Chips & Badges ─── */
[data-theme="unthread"] .chip-premium {
  background: rgba(149,128,255,0.06) !important;
  border: 1px solid rgba(149,128,255,0.2) !important;
  color: #9580FF !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
[data-theme="unthread"] .chip { box-shadow: none !important; text-shadow: none !important; }

[data-theme="unthread"] .badge-premium-success { background: #ECFDF5 !important; border-color: #A7F3D0 !important; color: #059669 !important; box-shadow: none !important; }
[data-theme="unthread"] .badge-premium-warning { background: #FFFBEB !important; border-color: #FDE68A !important; color: #D97706 !important; box-shadow: none !important; }
[data-theme="unthread"] .badge-premium-danger  { background: #FDF2F6 !important; border-color: #F3C7D5 !important; color: #B83368 !important; box-shadow: none !important; }
[data-theme="unthread"] .badge-premium-info    { background: #F3F0FF !important; border-color: #D8CEFF !important; color: #5B4FBF !important; box-shadow: none !important; }

/* ─── Unthread: Buttons — Flat, professional ─── */
[data-theme="unthread"] .btn-primary {
  background: #9580FF !important;
  color: #FFFFFF !important;
  border: none !important;
  border-radius: 0.375rem !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
  text-shadow: none !important;
}
[data-theme="unthread"] .btn-primary:hover {
  background: #7B6FE0 !important;
  transform: none !important;
  box-shadow: 0 2px 4px rgba(149,128,255,0.25) !important;
  filter: none !important;
}

[data-theme="unthread"] .btn-ghost {
  background: transparent !important;
  color: #4B5563 !important;
  border: 1px solid #E5E7EB !important;
}
[data-theme="unthread"] .btn-ghost:hover {
  background: #F9FAFB !important;
  color: #111827 !important;
  border-color: #D1D5DB !important;
}

/* Solid colored buttons — no gradients */
[data-theme="unthread"] .bg-green-500, [data-theme="unthread"] .bg-green-600,
[data-theme="unthread"] .bg-emerald-500, [data-theme="unthread"] .bg-emerald-600 {
  background: #059669 !important; box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
}
[data-theme="unthread"] .bg-red-500, [data-theme="unthread"] .bg-red-600 {
  background: #DC2626 !important; box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
}
[data-theme="unthread"] .bg-blue-500, [data-theme="unthread"] .bg-blue-600 {
  background: #2563EB !important; box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
}
[data-theme="unthread"] .bg-yellow-500, [data-theme="unthread"] .bg-yellow-600,
[data-theme="unthread"] .bg-amber-500, [data-theme="unthread"] .bg-amber-600 {
  background: #D97706 !important; box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
}
[data-theme="unthread"] .bg-purple-500, [data-theme="unthread"] .bg-purple-600 {
  background: #7B6FE0 !important; box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
}
[data-theme="unthread"] .bg-cyan-500, [data-theme="unthread"] .bg-cyan-600 {
  background: #7B6FE0 !important; box-shadow: 0 1px 2px rgba(0,0,0,0.08) !important;
}

/* No transform on hover for any button */
[data-theme="unthread"] button:hover { transform: none !important; }
[data-theme="unthread"] .bg-green-500:hover, [data-theme="unthread"] .bg-red-500:hover,
[data-theme="unthread"] .bg-blue-500:hover, [data-theme="unthread"] .bg-amber-500:hover {
  transform: none !important; filter: none !important;
}

/* Cancel/neutral buttons */
[data-theme="unthread"] button.bg-gray-700,
[data-theme="unthread"] button[class*="bg-gray-700"],
[data-theme="unthread"] button[class*="bg-gray-600"] {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  color: #4B5563 !important;
}
[data-theme="unthread"] button.bg-gray-700:hover,
[data-theme="unthread"] button[class*="bg-gray-700"]:hover {
  background: #F9FAFB !important; color: #111827 !important; border-color: #D1D5DB !important;
}

/* ─── Unthread: Inputs — Clean with light borders ─── */
[data-theme="unthread"] .input,
[data-theme="unthread"] input[type="text"],
[data-theme="unthread"] input[type="number"],
[data-theme="unthread"] input[type="email"],
[data-theme="unthread"] input[type="password"],
[data-theme="unthread"] input[type="date"],
[data-theme="unthread"] input[type="search"],
[data-theme="unthread"] textarea {
  background: #FFFFFF !important;
  color: #111827 !important;
  border: 1px solid #D1D5DB !important;
  border-radius: 0.375rem !important;
}
[data-theme="unthread"] .input:focus,
[data-theme="unthread"] input:focus,
[data-theme="unthread"] textarea:focus {
  border-color: #9580FF !important;
  box-shadow: 0 0 0 3px rgba(149,128,255,0.1) !important;
}

[data-theme="unthread"] select {
  background-color: #FFFFFF !important;
  color: #111827 !important;
  border: 1px solid #D1D5DB !important;
}
[data-theme="unthread"] select:focus {
  border-color: #9580FF !important;
  box-shadow: 0 0 0 3px rgba(149,128,255,0.1) !important;
}
[data-theme="unthread"] select option { background: #FFFFFF !important; color: #111827 !important; }
[data-theme="unthread"] select:not([multiple]) {
  background-image: linear-gradient(45deg, transparent 50%, #9CA3AF 50%), linear-gradient(135deg, #9CA3AF 50%, transparent 50%) !important;
  background-position: calc(100% - 18px) calc(50% - 3px), calc(100% - 13px) calc(50% - 3px) !important;
  background-size: 5px 5px, 5px 5px !important;
  background-repeat: no-repeat !important;
}
[data-theme="unthread"] ::placeholder { color: #9CA3AF !important; }
[data-theme="unthread"] input[type="date"]::-webkit-calendar-picker-indicator { filter: none !important; }

/* ─── Unthread: Tables ─── */
[data-theme="unthread"] th {
  background: #F9FAFB !important;
  color: #6B7280 !important;
  border-color: #E5E7EB !important;
}
[data-theme="unthread"] td { border-color: #F3F4F6 !important; color: #374151 !important; }
[data-theme="unthread"] tr:hover td { background: #F9FAFB !important; }
[data-theme="unthread"] .table-wrap { background: #FFFFFF !important; border-color: #E5E7EB !important; }
[data-theme="unthread"] .table-modern thead tr { background: #F9FAFB !important; }
[data-theme="unthread"] .table-stack tbody tr { background: #FFFFFF !important; border: 1px solid #E5E7EB !important; }

/* ─── Unthread: KPI — No gradient text ─── */
[data-theme="unthread"] .glass-soft .text-2xl,
[data-theme="unthread"] .glass-soft .text-3xl,
[data-theme="unthread"] .glass-soft .text-4xl {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #111827 !important;
  color: #111827 !important;
}

/* ─── Unthread: Client Cards ─── */
[data-theme="unthread"] .client-card {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 0.625rem !important;
}
[data-theme="unthread"] .client-card::before,
[data-theme="unthread"] .client-card::after { display: none !important; }
[data-theme="unthread"] .client-card:hover {
  border-color: rgba(149,128,255,0.3) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
  transform: none !important;
}
[data-theme="unthread"] .client-card__title { color: #111827 !important; }
[data-theme="unthread"] .client-card__subtitle { color: #6B7280 !important; }
[data-theme="unthread"] .client-card__meta { color: #6B7280 !important; }
[data-theme="unthread"] .client-card__photo { border-color: #E5E7EB !important; }
[data-theme="unthread"] .client-card__detail { background: #F9FAFB !important; }
[data-theme="unthread"] .client-card__detail dt { color: #6B7280 !important; }
[data-theme="unthread"] .client-card__detail dd { color: #111827 !important; }
[data-theme="unthread"] .client-card__details { background: #F3F4F6 !important; border: 1px solid #E5E7EB !important; }
[data-theme="unthread"] .client-card__badge { background: #F3F4F6 !important; border: 1px solid #E5E7EB !important; color: #4B5563 !important; }
[data-theme="unthread"] .client-card__badge--success { color: #059669 !important; border-color: #A7F3D0 !important; background: #ECFDF5 !important; }
[data-theme="unthread"] .client-card__badge--warning { color: #D97706 !important; border-color: #FDE68A !important; background: #FFFBEB !important; }
[data-theme="unthread"] .client-card__badge--danger  { color: #DC2626 !important; border-color: #FECACA !important; background: #FEF2F2 !important; }
[data-theme="unthread"] .client-card__actions { border-color: #F3F4F6 !important; }

/* Action buttons */
[data-theme="unthread"] .action-button {
  background: #FFFFFF !important; border: 1px solid #E5E7EB !important;
  color: #6B7280 !important; backdrop-filter: none !important; border-radius: 0.375rem !important;
}
[data-theme="unthread"] .action-button:hover { background: #F9FAFB !important; transform: none !important; }
[data-theme="unthread"] .action-button--success { color: #059669 !important; border-color: #A7F3D0 !important; background: #ECFDF5 !important; }
[data-theme="unthread"] .action-button--info    { color: #2563EB !important; border-color: #BFDBFE !important; background: #EFF6FF !important; }
[data-theme="unthread"] .action-button--warning { color: #D97706 !important; border-color: #FDE68A !important; background: #FFFBEB !important; }
[data-theme="unthread"] .action-button--danger  { color: #DC2626 !important; border-color: #FECACA !important; background: #FEF2F2 !important; }

/* ─── Unthread: Modals ─── */
[data-theme="unthread"] .modal-backdrop {
  background: rgba(17,24,39,0.45) !important;
  backdrop-filter: blur(4px) !important;
}
[data-theme="unthread"] .modal-card {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  backdrop-filter: none !important;
  border-radius: 0.625rem !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
}
[data-theme="unthread"] .modal-card::before {
  background: #9580FF !important;
  height: 3px !important;
}

/* ─── Unthread: Toast ─── */
[data-theme="unthread"] .toast {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  backdrop-filter: none !important;
  color: #111827 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}
[data-theme="unthread"] .toast-close { color: #9CA3AF !important; }
[data-theme="unthread"] .toast-close:hover { color: #4B5563 !important; }

/* ─── Unthread: Notification Drawer ─── */
[data-theme="unthread"] #notif-drawer {
  background: #FFFFFF !important;
  border-left: 1px solid #E5E7EB !important;
  backdrop-filter: none !important;
}

/* ─── Unthread: Alerts ─── */
[data-theme="unthread"] .alert-ok  { background: #ECFDF5 !important; color: #065F46 !important; border: 1px solid #A7F3D0 !important; }
[data-theme="unthread"] .alert-err { background: #FDF2F6 !important; color: #8B2A52 !important; border: 1px solid #F3C7D5 !important; }
[data-theme="unthread"] .alert-info { background: #F3F0FF !important; color: #3B2F8F !important; border: 1px solid #D8CEFF !important; }
[data-theme="unthread"] .alert-warn { background: #FFFBEB !important; color: #92400E !important; border: 1px solid #FDE68A !important; }

/* Layout alerts */
[data-theme="unthread"] .bg-red-500\/10 { background: #FEF2F2 !important; }
[data-theme="unthread"] .border-red-500\/30 { border-color: #FECACA !important; }
[data-theme="unthread"] .text-red-200 { color: #991B1B !important; }
[data-theme="unthread"] .bg-emerald-500\/10 { background: #ECFDF5 !important; }
[data-theme="unthread"] .border-emerald-500\/30 { border-color: #A7F3D0 !important; }
[data-theme="unthread"] .text-emerald-200 { color: #065F46 !important; }

/* ─── Unthread: Status colors — no glow ─── */
[data-theme="unthread"] .text-red-400, [data-theme="unthread"] .text-red-500 { color: #DC2626 !important; text-shadow: none !important; }
[data-theme="unthread"] .text-green-400, [data-theme="unthread"] .text-green-500 { color: #059669 !important; text-shadow: none !important; }
[data-theme="unthread"] .text-yellow-400, [data-theme="unthread"] .text-yellow-500 { color: #D97706 !important; text-shadow: none !important; }
[data-theme="unthread"] .text-cyan-400, [data-theme="unthread"] .text-cyan-300 { color: #9580FF !important; text-shadow: none !important; }

/* ─── Unthread: Background overrides ─── */
[data-theme="unthread"] .bg-gray-50, [data-theme="unthread"] .bg-gray-100 { background: #F9FAFB !important; }
[data-theme="unthread"] .bg-gray-700 { background: #F3F4F6 !important; }
[data-theme="unthread"] .bg-gray-800, [data-theme="unthread"] .bg-gray-900 { background: #F8F9FB !important; }
[data-theme="unthread"] .bg-white { background: #FFFFFF !important; }
[data-theme="unthread"] [class*="bg-white\\/"] { background: rgba(0,0,0,0.02) !important; }

/* ─── Unthread: Border overrides ─── */
[data-theme="unthread"] .border-gray-200, [data-theme="unthread"] .border-gray-300,
[data-theme="unthread"] .border-gray-700, [data-theme="unthread"] .border-gray-800 { border-color: #E5E7EB !important; }
[data-theme="unthread"] hr, [data-theme="unthread"] .border-t, [data-theme="unthread"] .border-b { border-color: #E5E7EB !important; }
[data-theme="unthread"] .border-white\/5, [data-theme="unthread"] .border-white\/10,
[data-theme="unthread"] [class*="border-white\\/"] { border-color: #E5E7EB !important; }

/* ─── Unthread: Hover states ─── */
[data-theme="unthread"] .hover\:bg-white:hover,
[data-theme="unthread"] .hover\:bg-gray-50:hover,
[data-theme="unthread"] .hover\:bg-white\/10:hover,
[data-theme="unthread"] .hover\:bg-white\/15:hover,
[data-theme="unthread"] .hover\:bg-white\/20:hover,
[data-theme="unthread"] .hover\:bg-gray-800:hover,
[data-theme="unthread"] .hover\:bg-gray-700:hover { background: #F3F4F6 !important; }

/* ─── Unthread: Ring overrides ─── */
[data-theme="unthread"] .ring-2 { --tw-ring-color: #E5E7EB !important; }

/* ─── Unthread: Scrollbar ─── */
[data-theme="unthread"] ::-webkit-scrollbar { width: 6px !important; height: 6px !important; }
[data-theme="unthread"] ::-webkit-scrollbar-track { background: transparent !important; }
[data-theme="unthread"] ::-webkit-scrollbar-thumb { background: #D1D5DB !important; border-radius: 3px !important; }
[data-theme="unthread"] ::-webkit-scrollbar-thumb:hover { background: #9CA3AF !important; }

/* ─── Unthread: SweetAlert ─── */
[data-theme="unthread"] .swal-modal {
  background: #FFFFFF !important; color: #111827 !important;
  border: 1px solid #E5E7EB !important; border-radius: 0.625rem !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
}
[data-theme="unthread"] .swal-title { color: #111827 !important; }
[data-theme="unthread"] .swal-text { color: #4B5563 !important; }
[data-theme="unthread"] .swal-button--cancel { background: transparent !important; color: #4B5563 !important; border: 1px solid #E5E7EB !important; }
[data-theme="unthread"] .swal-overlay { background-color: rgba(17,24,39,0.45) !important; }

/* ─── Unthread: Focus, Links, Tabs ─── */
[data-theme="unthread"] *:focus-visible { outline-color: #9580FF !important; }
[data-theme="unthread"] .main-content-premium a:not([class]) { color: #9580FF !important; text-shadow: none !important; }
[data-theme="unthread"] .main-content-premium a:not([class]):hover { color: #7B6FE0 !important; }
[data-theme="unthread"] .nav-link.active { color: #9580FF !important; border-image: none !important; border-bottom: 2px solid #9580FF !important; }
[data-theme="unthread"] button.border-b-2.border-cyan-400 { color: #9580FF !important; border-color: #9580FF !important; border-image: none !important; }
[data-theme="unthread"] [data-tab-target].text-blue-600 { color: #9580FF !important; border-image: none !important; }
[data-theme="unthread"] input[type="checkbox"], [data-theme="unthread"] input[type="radio"] { accent-color: #9580FF !important; }
[data-theme="unthread"] input[type="file"]::file-selector-button { background: #9580FF !important; color: #FFFFFF !important; border: none !important; }
[data-theme="unthread"] progress::-webkit-progress-value { background: #9580FF !important; }
[data-theme="unthread"] progress::-webkit-progress-bar { background: #F3F4F6 !important; }

/* ─── Unthread: Headings ─── */
[data-theme="unthread"] h1, [data-theme="unthread"] h2, [data-theme="unthread"] h3 { color: #111827 !important; }

/* ─── Unthread: Chrome autofill ─── */
[data-theme="unthread"] input:-webkit-autofill,
[data-theme="unthread"] input:-webkit-autofill:hover,
[data-theme="unthread"] input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #FFFFFF inset !important;
  -webkit-text-fill-color: #111827 !important;
  border-color: #D1D5DB !important;
}

/* ─── Unthread: Skeleton shimmer ─── */
[data-theme="unthread"] .skeleton {
  background: linear-gradient(90deg, #F3F4F6 25%, #E5E7EB 50%, #F3F4F6 75%) !important;
}

/* ─── Unthread: Code blocks ─── */
[data-theme="unthread"] code { background: #FEF2F2 !important; color: #9580FF !important; }
[data-theme="unthread"] pre { background: #F9FAFB !important; border: 1px solid #E5E7EB !important; color: #111827 !important; }

/* ─── Unthread: Gym select & bell ─── */
[data-theme="unthread"] #gymSelect {
  background: #F3F4F6 !important; color: #111827 !important;
  border: 1px solid #E5E7EB !important; border-radius: 0.375rem !important;
}
[data-theme="unthread"] #gymlist svg { color: #9CA3AF !important; }
[data-theme="unthread"] .fa-bell { color: #6B7280 !important; }
[data-theme="unthread"] #notif-badge { background: #9580FF !important; }

/* ─── Unthread: Promotions hero ─── */
[data-theme="unthread"] .promotions-hero {
  background: linear-gradient(135deg, #FEF2F2, #EFF6FF) !important;
  border: 1px solid #E5E7EB !important;
}
[data-theme="unthread"] .promotions-hero::before, [data-theme="unthread"] .promotions-hero::after { display: none !important; }
[data-theme="unthread"] .promotions-feature-card { background: #FFFFFF !important; border: 1px solid #E5E7EB !important; backdrop-filter: none !important; }

/* ─── Unthread: Sidebar logout ─── */
[data-theme="unthread"] .sidebar-item-premium.group:hover .group-hover\:text-red-400 { color: #DC2626 !important; }
[data-theme="unthread"] .hover\:text-white:hover { color: #111827 !important; }

/* ─── Unthread: Text-white opacity variants (global) ─── */
[data-theme="unthread"] .text-white\/90 { color: #111827 !important; }
[data-theme="unthread"] .text-white\/80 { color: #1F2937 !important; }
[data-theme="unthread"] .text-white\/70 { color: #374151 !important; }
[data-theme="unthread"] .text-white\/60 { color: #4B5563 !important; }
[data-theme="unthread"] .text-white\/50 { color: #6B7280 !important; }
[data-theme="unthread"] .text-white\/40 { color: #9CA3AF !important; }
[data-theme="unthread"] .text-white\/30 { color: #9CA3AF !important; }
[data-theme="unthread"] .text-white\/25 { color: #D1D5DB !important; }
[data-theme="unthread"] .text-white\/20 { color: #D1D5DB !important; }
[data-theme="unthread"] .text-white\/15 { color: #D1D5DB !important; }

/* ─── Unthread: Bg-white opacity variants ─── */
[data-theme="unthread"] .bg-white\/5,
[data-theme="unthread"] .bg-white\/10,
[data-theme="unthread"] .bg-white\/15,
[data-theme="unthread"] .bg-white\/20 { background: rgba(0,0,0,0.03) !important; }

/* ─── Unthread: Remaining hover text ─── */
[data-theme="unthread"] .hover\:text-white\/80:hover { color: #1F2937 !important; }
[data-theme="unthread"] .hover\:text-white\/90:hover { color: #111827 !important; }

/* ─── Unthread: Inline var() fallback overrides ─── */
[data-theme="unthread"] [style*="color:var(--text-primary"] { color: #111827 !important; }
[data-theme="unthread"] [style*="color: var(--text-primary"] { color: #111827 !important; }
[data-theme="unthread"] [style*="color:var(--text-muted"] { color: #6B7280 !important; }
[data-theme="unthread"] [style*="color: var(--text-muted"] { color: #6B7280 !important; }
[data-theme="unthread"] [style*="color:var(--text-secondary"] { color: #4B5563 !important; }
[data-theme="unthread"] [style*="color: var(--text-secondary"] { color: #4B5563 !important; }

/* ═══════════════════════════════════════════════════════════════════════
   COACH AI BUBBLE — theme-aware styles (all light themes)
   ═══════════════════════════════════════════════════════════════════════ */
.coach-ai-bubble {
  background: #1a1c2e;
  border-color: rgba(255,255,255,0.05);
  color: #f3f4f6;
}
[data-theme="material-light"] .coach-ai-bubble,
[data-theme="nordic"] .coach-ai-bubble,
[data-theme="sunset"] .coach-ai-bubble,
[data-theme="unthread"] .coach-ai-bubble {
  background: var(--bg-card, #FFFFFF) !important;
  border-color: var(--border-glass, #E5E7EB) !important;
  color: var(--text-primary, #1F2937) !important;
}
[data-theme="unthread"] .coach-ai-bubble {
  background: #F9FAFB !important;
  border-color: #E5E7EB !important;
  color: #111827 !important;
}
/* Coach AI bold accents in light themes */
[data-theme="material-light"] .coach-ai-bubble b,
[data-theme="nordic"] .coach-ai-bubble b,
[data-theme="sunset"] .coach-ai-bubble b,
[data-theme="unthread"] .coach-ai-bubble b {
  color: var(--accent, #9580FF) !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   MI MEMBRESIA — credential card light theme overrides
   ═══════════════════════════════════════════════════════════════════════ */
[data-theme="material-light"] .membership-credential,
[data-theme="nordic"] .membership-credential,
[data-theme="sunset"] .membership-credential,
[data-theme="unthread"] .membership-credential {
  background: linear-gradient(145deg, var(--bg-card, #FFFFFF) 0%, #F3F4F6 100%) !important;
  border-color: var(--border-glass, rgba(0,0,0,0.08)) !important;
}
[data-theme="unthread"] .membership-credential {
  background: linear-gradient(145deg, #FFFFFF 0%, #F9FAFB 100%) !important;
  border: 1px solid #E5E7EB !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.08) !important;
}
/* Credential card text colors */
[data-theme="material-light"] .membership-credential .text-white,
[data-theme="nordic"] .membership-credential .text-white,
[data-theme="sunset"] .membership-credential .text-white,
[data-theme="unthread"] .membership-credential .text-white {
  color: var(--text-primary, #1F2937) !important;
}
[data-theme="material-light"] .membership-credential .text-white\/25,
[data-theme="nordic"] .membership-credential .text-white\/25,
[data-theme="sunset"] .membership-credential .text-white\/25,
[data-theme="unthread"] .membership-credential .text-white\/25 {
  color: var(--text-muted, #9CA3AF) !important;
}
[data-theme="material-light"] .membership-credential .border-white\/10,
[data-theme="nordic"] .membership-credential .border-white\/10,
[data-theme="sunset"] .membership-credential .border-white\/10,
[data-theme="unthread"] .membership-credential .border-white\/10 {
  border-color: rgba(0,0,0,0.06) !important;
}
/* QR section background */
[data-theme="material-light"] .membership-qr-section,
[data-theme="nordic"] .membership-qr-section,
[data-theme="sunset"] .membership-qr-section,
[data-theme="unthread"] .membership-qr-section {
  background: rgba(0,0,0,0.03) !important;
}
/* QR image — undo invert on light themes */
[data-theme="material-light"] .membership-qr-section img,
[data-theme="nordic"] .membership-qr-section img,
[data-theme="sunset"] .membership-qr-section img,
[data-theme="unthread"] .membership-qr-section img {
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
}
/* Gradient text — use accent color instead of multi-color gradient on light */
[data-theme="material-light"] .membership-credential .bg-clip-text,
[data-theme="nordic"] .membership-credential .bg-clip-text,
[data-theme="sunset"] .membership-credential .bg-clip-text,
[data-theme="unthread"] .membership-credential .bg-clip-text {
  -webkit-text-fill-color: var(--text-primary, #1F2937) !important;
  background: none !important;
}
/* Photo border */
[data-theme="material-light"] .membership-credential .border-gray-900,
[data-theme="nordic"] .membership-credential .border-gray-900,
[data-theme="sunset"] .membership-credential .border-gray-900,
[data-theme="unthread"] .membership-credential .border-gray-900 {
  border-color: #FFFFFF !important;
}
/* Glow orbs — hide on light themes */
[data-theme="material-light"] .membership-glow,
[data-theme="nordic"] .membership-glow,
[data-theme="sunset"] .membership-glow,
[data-theme="unthread"] .membership-glow {
  display: none !important;
}

/* ═══════════════════════════════════════════════════════════════════════
   GAMIFICATION — config section input overrides for light themes
   ═══════════════════════════════════════════════════════════════════════ */
[data-theme="material-light"] .gm-scope .input,
[data-theme="material-light"] .gm-scope .select,
[data-theme="material-light"] .gm-scope input[type="number"],
[data-theme="material-light"] .gm-scope input[type="text"],
[data-theme="material-light"] .gm-scope input[type="date"],
[data-theme="material-light"] .gm-scope textarea,
[data-theme="material-light"] .gm-scope select,
[data-theme="nordic"] .gm-scope .input,
[data-theme="nordic"] .gm-scope .select,
[data-theme="nordic"] .gm-scope input[type="number"],
[data-theme="nordic"] .gm-scope input[type="text"],
[data-theme="nordic"] .gm-scope input[type="date"],
[data-theme="nordic"] .gm-scope textarea,
[data-theme="nordic"] .gm-scope select,
[data-theme="sunset"] .gm-scope .input,
[data-theme="sunset"] .gm-scope .select,
[data-theme="sunset"] .gm-scope input[type="number"],
[data-theme="sunset"] .gm-scope input[type="text"],
[data-theme="sunset"] .gm-scope input[type="date"],
[data-theme="sunset"] .gm-scope textarea,
[data-theme="sunset"] .gm-scope select,
[data-theme="unthread"] .gm-scope .input,
[data-theme="unthread"] .gm-scope .select,
[data-theme="unthread"] .gm-scope input[type="number"],
[data-theme="unthread"] .gm-scope input[type="text"],
[data-theme="unthread"] .gm-scope input[type="date"],
[data-theme="unthread"] .gm-scope textarea,
[data-theme="unthread"] .gm-scope select {
  background: var(--bg-card, #FFFFFF) !important;
  border-color: var(--border-glass, #E5E7EB) !important;
  color: var(--text-primary, #1F2937) !important;
}
[data-theme="unthread"] .gm-scope .input,
[data-theme="unthread"] .gm-scope .select,
[data-theme="unthread"] .gm-scope input[type="number"],
[data-theme="unthread"] .gm-scope input[type="text"],
[data-theme="unthread"] .gm-scope input[type="date"],
[data-theme="unthread"] .gm-scope textarea,
[data-theme="unthread"] .gm-scope select {
  background: #FFFFFF !important;
  border: 1px solid #D1D5DB !important;
  color: #111827 !important;
}
[data-theme="unthread"] .gm-scope .input::placeholder,
[data-theme="unthread"] .gm-scope textarea::placeholder,
[data-theme="unthread"] .gm-scope input::placeholder {
  color: #9CA3AF !important;
}
/* Labels in gamification */
[data-theme="material-light"] .gm-scope .label,
[data-theme="nordic"] .gm-scope .label,
[data-theme="sunset"] .gm-scope .label,
[data-theme="unthread"] .gm-scope .label {
  color: var(--text-secondary, #4B5563) !important;
}

/* ─── Utility: hide scrollbar ─── */
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.no-scrollbar::-webkit-scrollbar { display: none; }

/* ═══════════════════════════════════════════════════════════════
   MOBILE UI CLEANUP — flatten nested cards, reduce visual noise
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

  /* ── 1) Hide ALL info-card grids on mobile (dismissible, wastes space) ── */
  .module-info-grid,
  .dismissible-panel { display: none !important; }

  /* ── 2) Compact ALL hero variants — single-line bar on mobile ── */
  .module-hero {
    padding: 0.75rem 1rem !important;
    border-radius: 0.875rem !important;
    margin-bottom: 0.5rem !important;
  }
  .module-hero .flex-col { flex-direction: row !important; align-items: center !important; }
  .module-hero-description,
  .module-hero .text-textsoft,
  .module-hero .text-white\/60 { display: none !important; }

  /* Hide descriptions in ALL custom heroes */
  .gm-hero > p, .mkt-hero p:not([class*="stat"]):not([class*="badge"]),
  .nh-hero p.text-slate-500,
  .nh-hero p.text-sm:not(.nh-pill),
  [class*="-hero"] > .text-textsoft,
  [class*="-hero"] > div > .text-textsoft { display: none !important; }
  /* Ensure nh-hero data pills stay visible */
  .nh-hero .nh-pill { display: inline-flex !important; }
  .module-hero-icon {
    width: 2rem !important; height: 2rem !important;
    font-size: 0.8rem !important;
    border-radius: 0.5rem !important;
  }
  .module-hero-title { font-size: 1rem !important; }
  .module-hero-header { gap: 0.5rem !important; }
  .module-hero-actions .chip { font-size: 0.6rem !important; padding: 0.15rem 0.5rem !important; }
  .module-hero::before,
  .module-hero::after { display: none !important; }

  /* Custom heroes (gamification, marketing-auto, nutrition) */
  .gm-hero,
  .mkt-hero {
    padding: 0.75rem 1rem !important;
    border-radius: 0.875rem !important;
    margin-bottom: 0.5rem !important;
  }
  .gm-hero::before, .gm-hero::after,
  .mkt-hero::before { display: none !important; }
  .gm-hero p, .mkt-hero p:not([class*="stat"]):not([class*="badge"]) { display: none !important; }
  .gm-hud, .gm-hud * { display: revert !important; }

  /* ── 3) Flatten glass-soft / glass-panel — remove outer "card" wrappers on mobile ── */
  .glass-soft,
  .glass-panel {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
  }
  .glass-soft:hover,
  .glass-panel:hover {
    border-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  /* ── 3b) Hide custom feature/intro grids on mobile (same as module-info-grid) ── */
  .promotions-grid-intro,
  .promotions-hero__highlights,
  .promotions-hero__aside { display: none !important; }

  /* ── 4) Reduce container padding ── */
  .container { padding: 0.75rem !important; }
  .container.p-6,
  .container.p-3 { padding: 0.75rem !important; }

  /* ── 5) Tighter section spacing inside modules ── */
  .wm-section,
  .mkt-stat-card,
  .mkt-ai-center,
  .emp-search-bar {
    padding: 0.875rem !important;
    border-radius: 0.875rem !important;
    margin-bottom: 0.75rem !important;
  }

  /* ── 6) Kill hover transforms on mobile (no hover on touch) ── */
  .module-info-card:hover,
  .glass-soft:hover,
  .glass-card:hover,
  .wm-card:hover,
  .mkt-stat-card:hover,
  .emp-card:hover {
    transform: none !important;
    box-shadow: inherit !important;
  }

  /* ── 7) Flatten nested cards inside sections ── */
  .wm-card,
  .ast-stat-card {
    padding: 0.75rem !important;
    border-radius: 0.75rem !important;
  }

  /* ── 8) Reduce tab bars ── */
  .wm-tabs {
    padding: 0.2rem !important;
    gap: 0.2rem !important;
    border-radius: 0.65rem !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .wm-tab {
    padding: 0.4rem 0.75rem !important;
    font-size: 0.72rem !important;
    white-space: nowrap;
  }

  /* ── 9) Tables: horizontal scroll instead of breaking layout ── */
  .wm-table,
  .rpt-table-card table,
  table.min-w-full {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* ── 10) Modals: full-width on mobile ── */
  .modal-card,
  [class*="max-w-"] {
    max-width: 100% !important;
    margin: 0.5rem !important;
  }

  /* ── 11) Chip / badge sizing ── */
  .chip, .wm-badge, .mkt-badge, .emp-count-badge {
    font-size: 0.6rem !important;
    padding: 0.15rem 0.5rem !important;
  }

  /* ── 12) Compact stat grids ── */
  .gm-hud { gap: 0.75rem !important; }
  .gm-level-badge {
    width: 56px !important; height: 56px !important;
  }

  /* ── 13) Compact cs-stat cards (class-scheduling) — 2-col grid, smaller ── */
  .cs-stat {
    padding: 0.75rem !important;
    gap: 0.5rem !important;
  }
  .cs-stat__icon {
    width: 2rem !important; height: 2rem !important;
    font-size: 0.75rem !important;
  }
  .cs-stat__value { font-size: 1.15rem !important; }

  /* ── 14) Compact push-notification / online-booking / digital-waiver stat cards ── */
  [class*="glass-soft"][class*="rounded-xl"][class*="p-5"] {
    padding: 0.75rem !important;
  }

  /* ── 15) Marketing SMS: force single column on mobile ── */
  .mk-compose-layout {
    grid-template-columns: 1fr !important;
  }

  /* ══════════════════════════════════════════════════════════
     16) MOBILE SIDEBAR — off-canvas drawer (layout.html handles positioning)
     These rules only tune TYPOGRAPHY / SPACING of the sidebar internals.
     ══════════════════════════════════════════════════════════ */
  #sidebarMenu {
    background: var(--bg-primary, #0B0F17) !important;
    padding-top: 3rem !important;
  }

  /* Sidebar internals: flatten all card-like styling */
  #sidebarMenu .sidebar-premium,
  #sidebarMenu .container {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
  }
  #sidebarMenu .sidebar-item-premium {
    height: 2.75rem !important;
    padding: 0 0.75rem !important;
    border-radius: 0.625rem !important;
    font-size: 0.875rem !important;
    border: none !important;
  }
  #sidebarMenu .sidebar-item-premium i {
    font-size: 0.9rem !important;
    min-width: 1.5rem !important;
  }
  #sidebarMenu .sidebar-label-premium {
    font-size: 0.875rem !important;
  }
  #sidebarMenu .sidebar-group-toggle {
    padding: 0.5rem 0.5rem !important;
  }
  #sidebarMenu .sidebar-group-toggle span {
    font-size: 0.7rem !important;
  }
  #sidebarMenu .sidebar-group-items ul {
    padding-left: 0 !important;
  }

  /* Main content: no card wrapper on mobile (legacy class harmless when present) */
  .main-content-premium {
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    backdrop-filter: none !important;
    padding: 0 !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   UNIFIED DESIGN SYSTEM — Responsive primitives
   Drop-in classes that every fragment can use.
   Theme-aware: everything uses CSS variables.
   ═══════════════════════════════════════════════════════════ */

/* ─── Page header (standard pattern: icon + title + subtitle + actions) ─── */
.page-header {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1.25rem;
}
.page-header__main {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  min-width: 0;
  flex: 1;
}
.page-header__icon {
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-md);
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 0.18), rgba(var(--accent-secondary-rgb), 0.12));
  color: var(--accent);
  font-size: 1.125rem;
  border: 1px solid rgba(var(--accent-rgb), 0.2);
}
.page-header__text { min-width: 0; flex: 1; }
.page-header__title {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--text-primary);
  line-height: 1.2;
  margin: 0;
  letter-spacing: -0.01em;
}
.page-header__subtitle {
  font-size: 0.85rem;
  color: var(--text-secondary);
  line-height: 1.5;
  margin-top: 0.25rem;
}
.page-header__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
@media (min-width: 768px) {
  .page-header { flex-direction: row; align-items: center; justify-content: space-between; }
  .page-header__title { font-size: 1.5rem; }
}

/* ─── Section — divider-based grouping (NOT a nested card) ─── */
.section {
  padding: 1rem 0;
  border-top: 1px solid var(--border-subtle);
  margin-top: 1rem;
}
.section:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.section-title {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--text-muted);
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.section-title i { color: var(--accent); opacity: 0.7; }

/* ─── Surface — ONE-LEVEL card. No nested glass-on-glass. ─── */
.surface {
  background: var(--bg-glass-soft);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-lg);
  padding: 1rem;
  backdrop-filter: blur(var(--blur));
  -webkit-backdrop-filter: blur(var(--blur));
  transition: border-color var(--transition-fast);
}
.surface:hover { border-color: rgba(var(--accent-rgb), 0.2); }
@media (min-width: 640px) { .surface { padding: 1.25rem; } }
@media (min-width: 1024px) { .surface { padding: 1.5rem; } }

/* When surface is nested inside another surface/glass — flatten it */
.surface .surface,
.surface .glass,
.surface .glass-soft,
.surface .card,
.glass .surface,
.glass-soft .surface,
.card .surface {
  background: transparent !important;
  border: 1px solid var(--border-subtle) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  padding: 0.75rem !important;
}

/* ─── Subsurface — child panels inside a surface (flat look) ─── */
.subsurface {
  background: transparent;
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  padding: 0.75rem;
}

/* ─── KPI / stat tile (one-level card) ─── */
.stat-tile {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem;
  background: var(--bg-glass-soft);
  border: 1px solid var(--border-glass);
  border-radius: var(--radius-md);
  transition: all var(--transition-fast);
  min-width: 0;
}
.stat-tile:hover {
  border-color: rgba(var(--accent-rgb), 0.25);
  transform: translateY(-2px);
}
.stat-tile__icon {
  flex-shrink: 0;
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius-sm);
  background: rgba(var(--accent-rgb), 0.12);
  color: var(--accent);
  font-size: 0.9rem;
}
.stat-tile__body { min-width: 0; flex: 1; }
.stat-tile__label {
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-muted);
  font-weight: 700;
  margin-bottom: 0.125rem;
}
.stat-tile__value {
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--text-primary);
  line-height: 1.1;
  word-break: break-word;
}
.stat-tile__value--sm { font-size: 1rem; }
.stat-tile__hint {
  font-size: 0.7rem;
  color: var(--text-secondary);
  margin-top: 0.2rem;
}

/* ─── Grids — fluid, theme-aware responsive grids ─── */
.grid-auto-sm {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 14rem), 1fr));
  gap: 0.75rem;
}
.grid-auto-md {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr));
  gap: 0.875rem;
}
.grid-auto-lg {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
  gap: 1rem;
}
.grid-kpis {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.625rem;
}
@media (min-width: 640px) { .grid-kpis { grid-template-columns: repeat(3, 1fr); gap: 0.875rem; } }
@media (min-width: 1024px) { .grid-kpis { grid-template-columns: repeat(4, 1fr); gap: 1rem; } }
@media (min-width: 1280px) { .grid-kpis { grid-template-columns: repeat(5, 1fr); } }

/* ─── Form rows ─── */
.field {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  min-width: 0;
}
.field-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-muted);
  font-weight: 700;
}
.field-hint { font-size: 0.7rem; color: var(--text-muted); }
.form-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.875rem;
}
@media (min-width: 640px) { .form-grid--2 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 768px) {
  .form-grid--3 { grid-template-columns: repeat(3, 1fr); }
  .form-grid--4 { grid-template-columns: repeat(4, 1fr); }
}

/* ─── Toolbar ─── */
.toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 0;
  margin-bottom: 0.75rem;
  border-bottom: 1px solid var(--border-subtle);
}
.toolbar__spacer { flex: 1; }

/* ─── Empty state ─── */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  padding: 2rem 1rem;
  text-align: center;
  color: var(--text-secondary);
}
.empty-state__icon {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(var(--accent-rgb), 0.08);
  color: var(--accent);
  font-size: 1.25rem;
  opacity: 0.7;
}
.empty-state__title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text-primary);
}
.empty-state__text {
  font-size: 0.8rem;
  color: var(--text-muted);
  max-width: 32rem;
  line-height: 1.5;
}

/* ─── UNIVERSAL overflow-x containment ───────────────────────────────
   Grid children without min-width:0 force their parent wider than the
   viewport when they contain long unbreakable content (SKUs, URLs, etc).
   These rules are the single source of truth; apply to all fragments. */
.app-main, .module-shell { min-width: 0; max-width: 100%; overflow-x: hidden; }
.module-shell * { max-width: 100%; min-width: 0; }
/* Re-allow sidebar-scroll-area children that legitimately need flex sizing */
#sidebarMenu * { max-width: none; min-width: 0; }
.module-shell [class*="grid-cols"],
.module-shell [class*="grid-"],
.module-shell [style*="grid"] { min-width: 0; }
.module-shell [class*="grid-cols"] > *,
.module-shell [class*="grid-"] > *,
.module-shell [style*="grid"] > * { min-width: 0; }
.module-shell pre,
.module-shell code { white-space: pre-wrap; word-break: break-word; }
.module-shell { overflow-wrap: break-word; word-wrap: break-word; }
.module-shell img, .module-shell video, .module-shell iframe { max-width: 100%; height: auto; }
/* Tables that won't wrap: give them a scroll parent instead of breaking the layout */
.module-shell table:not(.table-nowrap-ok) { max-width: 100%; }

/* ─── Responsive tables: wrap in .table-scroll for horizontal scroll instead of breaking layout ─── */
.table-scroll {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--radius-md);
}
.table-scroll table { min-width: 640px; }

/* ─── Mobile-specific: collapse nested backgrounds, reduce padding ─── */
@media (max-width: 639px) {
  .page-header__title { font-size: 1.1rem; }
  .page-header__icon { width: 2.25rem; height: 2.25rem; font-size: 1rem; }
  .surface { padding: 0.875rem; border-radius: var(--radius-md); }
  .stat-tile { padding: 0.75rem; }
  .stat-tile__icon { width: 1.875rem; height: 1.875rem; font-size: 0.75rem; }
  .stat-tile__value { font-size: 1rem; }
  .section { padding: 0.75rem 0; }

  /* On very small screens, flatten deeply-nested glass layers automatically */
  .surface .surface .surface,
  .glass .glass .glass,
  .glass-soft .glass-soft {
    border: none !important;
    background: transparent !important;
    padding: 0 !important;
  }
}

/* ─── Stacked content helper (opt-in) ─── */
.stack-sm > * + * { margin-top: 0.5rem; }
.stack-md > * + * { margin-top: 0.875rem; }
.stack-lg > * + * { margin-top: 1.25rem; }

/* ═══════════════════════════════════════════════════════════
   COMPACT REVISION — module-hero / module-info-grid
   Backwards-compat with existing .module-hero / .module-info-* classes
   used across many fragments. Make them tighter + responsive.
   ═══════════════════════════════════════════════════════════ */

.module-hero {
  padding: 0.875rem 1rem !important;
  margin-bottom: 0.75rem !important;
}
.module-hero-header { gap: 0.75rem !important; align-items: center !important; }
.module-hero-icon {
  width: 2.25rem !important;
  height: 2.25rem !important;
  border-radius: var(--radius-md) !important;
  font-size: 0.95rem !important;
}
.module-hero-title { font-size: 1.05rem !important; line-height: 1.2 !important; }
.module-hero-description {
  font-size: 0.78rem !important;
  line-height: 1.4 !important;
  margin-top: 0.125rem !important;
}
.module-hero-description + .module-hero-description { display: none !important; }
.module-hero-actions { gap: 0.5rem !important; }
@media (min-width: 768px) {
  .module-hero { padding: 1rem 1.25rem !important; }
  .module-hero-icon { width: 2.5rem !important; height: 2.5rem !important; font-size: 1rem !important; }
  .module-hero-title { font-size: 1.2rem !important; }
}

/* Compact info cards — avoid eating vertical space */
.module-info-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0.5rem !important;
  margin-bottom: 0.875rem !important;
}
@media (min-width: 640px) { .module-info-grid { grid-template-columns: repeat(2, 1fr) !important; } }
@media (min-width: 1024px) { .module-info-grid { grid-template-columns: repeat(3, 1fr) !important; } }
.module-info-card {
  padding: 0.625rem 0.75rem !important;
  gap: 0.625rem !important;
  border-radius: var(--radius-md) !important;
}
.module-info-card:hover { transform: none !important; }
.module-info-icon {
  width: 1.875rem !important;
  height: 1.875rem !important;
  font-size: 0.7rem !important;
  border-radius: var(--radius-sm) !important;
  flex-shrink: 0;
}
.module-info-title { font-size: 0.78rem !important; font-weight: 700 !important; }
.module-info-text { font-size: 0.7rem !important; line-height: 1.35 !important; }

/* On mobile, optionally hide info-grid completely (it's just decorative help) */
@media (max-width: 639px) {
  .module-info-grid.dismissible-panel { display: none !important; }
}

/* ═══ UNIVERSAL TABS — single-line horizontal scroll, never wrap/stack ═══
   Targets every tab pattern in the app: role="tablist", .nav-tabs, .rpt-tabs,
   .wm-tabs, .ast-tabs, .tab-bar, and generic .toolbar.scrollable. */
[role="tablist"],
.nav.nav-tabs,
ul.nav-tabs,
.rpt-tabs,
.wm-tabs,
.ast-tabs,
.tab-bar,
.toolbar.scrollable {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  min-width: 0;
  max-width: 100%;
}
[role="tablist"]::-webkit-scrollbar,
.nav.nav-tabs::-webkit-scrollbar,
ul.nav-tabs::-webkit-scrollbar,
.rpt-tabs::-webkit-scrollbar,
.wm-tabs::-webkit-scrollbar,
.ast-tabs::-webkit-scrollbar,
.tab-bar::-webkit-scrollbar,
.toolbar.scrollable::-webkit-scrollbar { display: none; width: 0; height: 0; }
[role="tablist"] > *,
.nav.nav-tabs > *,
ul.nav-tabs > *,
.rpt-tabs > *,
.wm-tabs > *,
.ast-tabs > *,
.tab-bar > *,
.toolbar.scrollable > * {
  flex-shrink: 0;
  white-space: nowrap;
}

/* ═══ Action button rows — allow wrap but space properly ═══ */
.page-header__actions,
.toolbar:not(.scrollable) {
  flex-wrap: wrap;
}
/* Long button labels should truncate, not force parent wider */
.page-header__actions > *,
.toolbar > * { max-width: 100%; min-width: 0; }

/* ═══ Page header — stack on narrow screens so actions don't crush title ═══ */
@media (max-width: 639px) {
  .page-header {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0.75rem !important;
  }
  .page-header__actions { width: 100%; }
  .page-header__actions > .btn-primary,
  .page-header__actions > button { flex: 1 1 auto; min-width: 0; justify-content: center; }
}

/* ═══ Tables — never force parent wider than viewport ═══
   Instead wrap in scroll when there's real tabular data too wide. */
.app-main table {
  width: 100%;
  table-layout: auto;
  max-width: 100%;
}
/* If a table has many columns that need a minimum width, wrap its parent cell
   with .table-scroll — that allows horizontal scroll WITHIN the card instead
   of breaking the whole page layout. */
.module-shell > table,
.app-main > section > table,
.app-main > div > table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ═══ Images in cards — never overflow or distort parent ═══ */
.surface img, .card img, .stat-tile img, article img {
  max-width: 100%;
  height: auto;
  object-fit: cover;
}

/* ═══ Forms with inline fields — stack on narrow ═══ */
@media (max-width: 639px) {
  .form-inline,
  .flex.flex-wrap.gap-3.items-end,
  .flex.flex-wrap.gap-3.mb-5 {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .form-inline > *,
  .flex.flex-wrap.gap-3.items-end > *,
  .flex.flex-wrap.gap-3.mb-5 > * {
    width: 100%;
  }
}

/* ═══ Modals — never overflow viewport ═══ */
.modal-backdrop { padding: 0.5rem; }
.modal-card {
  width: 100%;
  max-width: min(100%, 48rem);
  max-height: calc(100vh - 1rem);
  overflow-y: auto;
}
@media (max-width: 639px) {
  .modal-card {
    max-width: 100% !important;
    max-height: calc(100vh - 0.5rem);
    border-radius: var(--radius-md) !important;
  }
}

/* ═══ Long unbreakable strings (emails, URLs, SKUs) ═══ */
.app-main td, .app-main dd, .app-main dt,
.app-main .truncate-safe {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Common deeply-nested gradient/card patterns — flatten on mobile */
@media (max-width: 639px) {
  /* Strip heavy gradients on mobile to prevent visual chaos and improve perf */
  .module-hero::before, .module-hero::after { display: none !important; }
  /* Flatten any deeply nested glass surface */
  [class*="glass-soft"] [class*="glass-soft"] {
    background: transparent !important;
    border: none !important;
    backdrop-filter: none !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
  /* Reset extreme rounded corners on mobile cards */
  [class*="rounded-3xl"], [class*="rounded-2xl"] { border-radius: var(--radius-md) !important; }
}

/* Generic vertical breathing for module bodies (backward compat) */
@media (max-width: 767px) {
  .app-main > * + * { margin-top: 0.5rem; }
}

/* Smaller modal padding on mobile */
@media (max-width: 639px) {
  .modal-card { padding: 1rem !important; border-radius: var(--radius-md) !important; }
}

/* ═══════════════════════════════════════════════════════════
   DESIGN SYSTEM — UNIVERSAL CONTROL SIZING
   All interactive controls follow the 8px grid from --ds-space-* tokens.
   Three sizes: compact (32px), default (40px), prominent (48px).
   Same vertical rhythm = balanced visual weight everywhere.
   ═══════════════════════════════════════════════════════════ */

/* Default button height — matches navbar icon buttons + sidebar items */
.app-main .btn-primary,
.app-main .btn-ghost,
.app-main button.bg-green-500,
.app-main button.bg-green-600,
.app-main button.bg-emerald-500,
.app-main button.bg-emerald-600,
.app-main button.bg-red-500,
.app-main button.bg-red-600,
.app-main button.bg-blue-500,
.app-main button.bg-blue-600,
.app-main button.bg-amber-500,
.app-main button.bg-amber-600 {
  min-height: 2.25rem;                /* 36px — default button */
  padding-inline: 0.875rem !important;
  border-radius: var(--radius-sm, 0.5rem) !important;
  font-size: 0.8125rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  transition: background-color 0.15s ease, border-color 0.15s ease, opacity 0.15s ease;
}
.app-main .btn-primary.btn-sm,
.app-main .btn-ghost.btn-sm { min-height: 1.75rem; padding-inline: 0.625rem !important; font-size: 0.75rem !important; }
.app-main .btn-primary.btn-lg,
.app-main .btn-ghost.btn-lg { min-height: 2.625rem; padding-inline: 1.25rem !important; font-size: 0.875rem !important; }

/* Icon-only buttons — perfect squares */
.app-main button[class*="w-8 h-8"],
.app-main button[class*="w-10 h-10"] {
  display: inline-flex; align-items: center; justify-content: center;
}

/* Inputs / selects / textareas — same visual weight as buttons */
.app-main input[type="text"],
.app-main input[type="email"],
.app-main input[type="password"],
.app-main input[type="number"],
.app-main input[type="search"],
.app-main input[type="tel"],
.app-main input[type="date"],
.app-main input[type="datetime-local"],
.app-main input[type="week"],
.app-main input[type="time"],
.app-main select,
.app-main .input {
  min-height: 2.25rem;
  padding: 0.375rem 0.75rem !important;
  border-radius: var(--radius-sm, 0.5rem) !important;
  font-size: 0.8125rem !important;
  line-height: 1.25 !important;
}
.app-main textarea,
.app-main .textarea {
  padding: 0.5rem 0.75rem !important;
  border-radius: var(--radius-sm, 0.5rem) !important;
  font-size: 0.8125rem !important;
  line-height: 1.4 !important;
}

/* Tabs — consistent height across all tab patterns */
[role="tab"],
.rpt-tab,
.wm-tab,
.tab-btn {
  min-height: 2.25rem !important;
  padding: 0 0.75rem !important;
  font-size: 0.8125rem !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.375rem !important;
}

/* Badges — consistent padding + height */
.badge-premium,
.chip,
.chip-premium,
[class*="chip-"] {
  min-height: 1.5rem;
  padding: 0.125rem 0.5rem !important;
  font-size: 0.6875rem !important;
  font-weight: 600 !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.25rem !important;
  line-height: 1 !important;
  white-space: nowrap;
}

/* Form labels — subtle uppercase, consistent */
.app-main label,
.app-main .label,
.app-main .field-label {
  display: block;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-muted) !important;
  margin-bottom: 0.375rem;
}

/* Section titles (h2, h3 inside fragments) — consistent hierarchy */
.app-main h2:not([class*="text-"]):not([class*="module-hero"]):not(.page-header__title) {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--text-primary);
  letter-spacing: -0.01em;
}
.app-main h3:not([class*="text-"]):not([class*="module-hero"]) {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--text-primary);
}
.app-main h4:not([class*="text-"]) {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--text-primary);
}

/* Universal padding for surfaces — uses tokens */
.surface, .card-premium, .module-info-card {
  padding: var(--ds-space-4, 1rem);
}
@media (min-width: 768px) {
  .surface, .card-premium, .module-info-card { padding: var(--ds-space-5, 1.25rem); }
}

/* Universal vertical rhythm between module sections */
.app-main > * + * { margin-top: var(--ds-space-4, 1rem); }
.app-main > .page-header + * { margin-top: var(--ds-space-4, 1rem); }

/* ═══ Focus rings — consistent across all interactive elements ═══ */
.app-main button:focus-visible,
.app-main a:focus-visible,
.app-main input:focus-visible,
.app-main select:focus-visible,
.app-main textarea:focus-visible,
.app-main [role="tab"]:focus-visible {
  outline: 2px solid var(--accent) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}