/* ══════════════════════════════════════════════════════
   HENRY DASHBOARD — GLOBAL THEME
   Dark = default  |  [data-theme="light"] = light mode
   html[data-theme="light"] beats :root specificity so
   CSS variable overrides cascade to all children.
══════════════════════════════════════════════════════ */

/* ── THEME TOGGLE BUTTON ───────────────────────────── */
.theme-toggle {
  position: fixed;
  right: 16px;
  top: max(env(safe-area-inset-top, 0px), 14px);
  z-index: 9000;
  width: 36px; height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.09);
  backdrop-filter: blur(14px) saturate(1.6);
  -webkit-backdrop-filter: blur(14px) saturate(1.6);
  color: rgba(255,255,255,0.82);
  font-size: 15px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: transform 0.18s cubic-bezier(0.22,1,0.36,1), background 0.25s, border-color 0.25s;
  -webkit-tap-highlight-color: transparent;
}
html[data-theme="light"] .theme-toggle {
  border-color: rgba(109,40,217,0.22);
  background: rgba(255,255,255,0.70);
  color: rgba(26,14,48,0.72);
  box-shadow: 0 2px 12px rgba(109,40,217,0.12);
}
.theme-toggle:hover  { transform: scale(1.14); }
.theme-toggle:active { transform: scale(0.90); }


/* ══════════════════════════════════════════════════════
   LIGHT MODE — CSS VARIABLE OVERRIDES
   These cascade to all children automatically.
══════════════════════════════════════════════════════ */
html[data-theme="light"] {
  color-scheme: light;

  /* Page colours */
  --bg-page:  #ede8f7;

  /* Text — all pages use one of these two sets */
  --text-primary:   #1a0e30;
  --text-secondary: rgba(26,14,48,0.72);
  --text-tertiary:  rgba(26,14,48,0.46);
  --text-1: #1a0e30;
  --text-2: rgba(26,14,48,0.72);
  --text-3: rgba(26,14,48,0.46);
  --text-4: rgba(26,14,48,0.28);

  /* Semantic colours */
  --good:    #059669;
  --info:    #2563eb;
  --warning: #d97706;
  --warn:    #d97706;
  --bad:     #dc2626;
  --danger:  #dc2626;
  --success: #059669;

  /* Borders / surfaces */
  --border:   rgba(26,14,48,0.11);
  --bg-card:  rgba(255,255,255,0.64);
  --bg-input: rgba(26,14,48,0.05);
}


/* ══════════════════════════════════════════════════════
   LIGHT MODE — STRUCTURAL OVERRIDES
══════════════════════════════════════════════════════ */

/* ── Aurora Rings ── */
.aurora-rings {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
.ar-r1 {
  position: absolute;
  width: 700px; height: 700px;
  border-radius: 50%;
  top: 60%; left: 48%;
  transform: translate(-50%, -50%) perspective(1000px) rotateX(70deg);
  border: 1.5px solid rgba(255,110,15,0.22);
  box-shadow: 0 0 32px 5px rgba(255,110,15,0.10), inset 0 0 24px 2px rgba(255,110,15,0.06);
  animation: ring-pulse-1 22s ease-in-out infinite alternate;
}
.ar-r2 {
  position: absolute;
  width: 460px; height: 460px;
  border-radius: 50%;
  top: 16%; left: 76%;
  transform: translate(-50%, -50%) perspective(800px) rotateX(62deg) rotateZ(28deg);
  border: 1px solid rgba(200,25,100,0.20);
  box-shadow: 0 0 22px 3px rgba(200,25,100,0.09);
  animation: ring-pulse-2 30s ease-in-out infinite alternate;
}
.ar-r3 {
  position: absolute;
  width: 290px; height: 290px;
  border-radius: 50%;
  top: 78%; left: 14%;
  transform: translate(-50%, -50%) perspective(700px) rotateX(65deg) rotateZ(-22deg);
  border: 1px solid rgba(130,15,255,0.18);
  box-shadow: 0 0 16px 2px rgba(130,15,255,0.08);
  animation: ring-pulse-3 16s ease-in-out infinite alternate;
}
@keyframes ring-pulse-1 {
  0%   { transform: translate(-50%, -50%) perspective(1000px) rotateX(67deg) rotateZ(  0deg) scale(0.97); opacity: 0.55; }
  100% { transform: translate(-50%, -50%) perspective(1000px) rotateX(73deg) rotateZ(  8deg) scale(1.04); opacity: 1.00; }
}
@keyframes ring-pulse-2 {
  0%   { transform: translate(-50%, -50%) perspective(800px) rotateX(59deg) rotateZ( 24deg) scale(0.95); opacity: 0.45; }
  100% { transform: translate(-50%, -50%) perspective(800px) rotateX(65deg) rotateZ( 33deg) scale(1.06); opacity: 0.88; }
}
@keyframes ring-pulse-3 {
  0%   { transform: translate(-50%, -50%) perspective(700px) rotateX(62deg) rotateZ(-18deg) scale(0.94); opacity: 0.40; }
  100% { transform: translate(-50%, -50%) perspective(700px) rotateX(69deg) rotateZ(-26deg) scale(1.08); opacity: 0.80; }
}
/* Hide rings + mesh + starfield in light mode */
html[data-theme="light"] .aurora-rings { display: none; }
html[data-theme="light"] .aurora-mesh  { display: none !important; }
html[data-theme="light"] body::after   { background-image: none !important; }

/* ── Body & Aurora ── */
html[data-theme="light"] body {
  background-color: #ede8f7 !important;
  color: #1a0e30;
}
html[data-theme="light"] body::before {
  background:
    radial-gradient(ellipse 130% 55% at 70% 58%, rgba(230,72,12,0.06)  0%, transparent 85%),
    radial-gradient(ellipse  65% 48% at 14% 76%, rgba(158,0,222,0.07)  0%, transparent 68%),
    radial-gradient(ellipse  55% 38% at 44% 20%, rgba(105,0,198,0.05)  0%, transparent 65%),
    radial-gradient(ellipse  42% 28% at 90% 14%, rgba(172,208,0,0.04)  0%, transparent 58%) !important;
}

/* ── Glass cards — white frosted ── */
html[data-theme="light"] .card {
  background: linear-gradient(160deg, rgba(255,255,255,0.82) 0%, rgba(255,255,255,0.68) 100%) !important;
  border-color: rgba(255,255,255,0.95) !important;
  box-shadow: 0 6px 32px rgba(109,40,217,0.09), 0 1px 0 rgba(255,255,255,1) inset !important;
}
html[data-theme="light"] .card:hover {
  box-shadow: 0 16px 48px rgba(109,40,217,0.14), 0 1px 0 rgba(255,255,255,1) inset !important;
}
html[data-theme="light"] .card::before {
  background: linear-gradient(90deg, transparent 0%, rgba(139,58,255,0.48) 35%, rgba(0,168,140,0.42) 65%, transparent 100%) !important;
}
html[data-theme="light"] .gm-card {
  background: linear-gradient(160deg, rgba(255,255,255,0.80) 0%, rgba(255,255,255,0.65) 100%) !important;
  border-color: rgba(255,255,255,0.95) !important;
  box-shadow: 0 6px 32px rgba(109,40,217,0.09), 0 1px 0 rgba(255,255,255,1) inset !important;
}
html[data-theme="light"] .gm-card::before {
  background: linear-gradient(90deg, transparent 0%, rgba(139,58,255,0.45) 35%, rgba(0,168,140,0.40) 65%, transparent 100%) !important;
}
html[data-theme="light"] .stat-tile {
  background: linear-gradient(160deg, rgba(255,255,255,0.80) 0%, rgba(255,255,255,0.65) 100%) !important;
  border-color: rgba(255,255,255,0.95) !important;
  box-shadow: 0 4px 20px rgba(109,40,217,0.08) !important;
}
html[data-theme="light"] .stat-tile:hover {
  box-shadow: 0 12px 36px rgba(109,40,217,0.14) !important;
}

/* ── Tab bar ── */
html[data-theme="light"] .tabbar-inner {
  background: rgba(248,245,255,0.96) !important;
  border-color: rgba(109,40,217,0.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,1), 0 -4px 24px rgba(109,40,217,0.07) !important;
}
html[data-theme="light"] .tab { color: rgba(26,14,48,0.50) !important; }
html[data-theme="light"] .tab[aria-current="page"] {
  color: #6d28d9 !important;
  background: linear-gradient(135deg, rgba(109,40,217,0.10) 0%, rgba(13,148,136,0.07) 100%) !important;
  border-color: rgba(109,40,217,0.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.90), 0 0 18px rgba(109,40,217,0.14) !important;
}
html[data-theme="light"] .tab[aria-current="page"] .tab-icon svg {
  filter: drop-shadow(0 0 4px rgba(109,40,217,0.55)) !important;
}

/* ── Inputs & textareas ── */
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] textarea {
  background: rgba(26,14,48,0.05) !important;
  border-color: rgba(26,14,48,0.13) !important;
  color: #1a0e30 !important;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder { color: rgba(26,14,48,0.32) !important; }

/* ── Modals ── */
html[data-theme="light"] .modal-bg,
html[data-theme="light"] #manualModalBg,
html[data-theme="light"] #setModalBg { background: rgba(26,14,48,0.28) !important; }
html[data-theme="light"] .modal {
  background: linear-gradient(160deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.82) 100%) !important;
  border-color: rgba(255,255,255,0.95) !important;
  color: #1a0e30 !important;
}
html[data-theme="light"] .modal h3,
html[data-theme="light"] .modal label { color: #1a0e30 !important; }

/* ── Search results ── */
html[data-theme="light"] #searchResults {
  background: rgba(255,255,255,0.96) !important;
  border-color: rgba(109,40,217,0.12) !important;
  box-shadow: 0 8px 32px rgba(109,40,217,0.10) !important;
}
html[data-theme="light"] .search-result { border-color: rgba(26,14,48,0.06) !important; }
html[data-theme="light"] .search-result:hover { background: rgba(109,40,217,0.05) !important; }
html[data-theme="light"] .search-result-name { color: #1a0e30 !important; }
html[data-theme="light"] .search-result-meta { color: rgba(26,14,48,0.52) !important; }
html[data-theme="light"] .search-loading { color: rgba(26,14,48,0.45) !important; }
html[data-theme="light"] .search-section-label { color: rgba(26,14,48,0.38) !important; }

/* ── Date nav ── */
html[data-theme="light"] .date-nav {
  background: rgba(255,255,255,0.55) !important;
  border-color: rgba(109,40,217,0.13) !important;
}
html[data-theme="light"] .date-nav.is-past {
  background: rgba(109,40,217,0.07) !important;
  border-color: rgba(109,40,217,0.24) !important;
}
html[data-theme="light"] .date-nav-btn {
  background: rgba(26,14,48,0.06) !important;
  border-color: rgba(26,14,48,0.12) !important;
  color: rgba(26,14,48,0.60) !important;
}
html[data-theme="light"] .date-nav-date { color: #1a0e30 !important; }
html[data-theme="light"] .date-nav-sublabel { color: rgba(26,14,48,0.40) !important; }

/* ── Home page ── */
html[data-theme="light"] .dash-title {
  background: linear-gradient(135deg,#6d28d9 0%,#0d9488 38%,#2563eb 58%,#6d28d9 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important;
}
html[data-theme="light"] .cring-time  { color: #1a0e30 !important; }
html[data-theme="light"] .cring-phase { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .cring-remaining { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .cring-pct   { color: #1a0e30 !important; text-shadow: none !important; }
html[data-theme="light"] .wx-temp     { color: #1a0e30 !important; }
html[data-theme="light"] .wx-unit, html[data-theme="light"] .wx-feels, html[data-theme="light"] .wx-location { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .wx-condition { color: rgba(26,14,48,0.78) !important; }
html[data-theme="light"] .wx-pill  { background: rgba(26,14,48,0.07) !important; color: rgba(26,14,48,0.58) !important; }
html[data-theme="light"] .wx-loading, html[data-theme="light"] .wx-error { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .quote-label  { color: rgba(26,14,48,0.34) !important; }
html[data-theme="light"] .quote-text   { color: rgba(26,14,48,0.84) !important; }
html[data-theme="light"] .quote-author { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .stat-tile-label { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .stat-tile-val   { color: #1a0e30 !important; }
html[data-theme="light"] .stat-tile-sub   { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .stat-tile-bar   { background: rgba(26,14,48,0.07) !important; }
html[data-theme="light"] .wt-big   { color: #1a0e30 !important; text-shadow: none !important; }
html[data-theme="light"] .wt-unit  { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .wt-delta { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .wt-input {
  background: rgba(26,14,48,0.05) !important;
  border-color: rgba(26,14,48,0.12) !important;
  color: #1a0e30 !important;
}
html[data-theme="light"] .goal-ticker {
  background: rgba(255,255,255,0.60) !important;
  border-color: rgba(109,40,217,0.12) !important;
}
html[data-theme="light"] .goal-ticker-row { color: #1a0e30 !important; }
html[data-theme="light"] .goal-ticker-label { color: rgba(26,14,48,0.44) !important; }
html[data-theme="light"] .goal-ticker-meta  { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .goal-ticker-led-dot { background: #059669 !important; }
html[data-theme="light"] .section-title { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .gm-eyebrow { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .gm-progress-num { color: #1a0e30 !important; }
html[data-theme="light"] .gm-progress-total,
html[data-theme="light"] .gm-progress-label { color: rgba(26,14,48,0.45) !important; }
html[data-theme="light"] .gm-streak { color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .gm-streak-num { color: #1a0e30 !important; }
html[data-theme="light"] .goal-row { color: #1a0e30 !important; }
html[data-theme="light"] .goal-text { color: #1a0e30 !important; }
html[data-theme="light"] .goal-done .goal-text { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .goal-cb-box {
  border-color: rgba(26,14,48,0.22) !important;
  background: rgba(26,14,48,0.04) !important;
}
html[data-theme="light"] .goal-drag    { color: rgba(26,14,48,0.22) !important; }
html[data-theme="light"] .goal-delete  { color: rgba(26,14,48,0.28) !important; }
html[data-theme="light"] .gm-queue-btn { color: rgba(26,14,48,0.32) !important; }
html[data-theme="light"] .empty-state  { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .gm-tomorrow-sub   { color: rgba(26,14,48,0.44) !important; }
html[data-theme="light"] .gm-tomorrow-count { color: rgba(26,14,48,0.50) !important; }
html[data-theme="light"] .gm-push-btn {
  background: rgba(26,14,48,0.06) !important;
  color: rgba(26,14,48,0.55) !important;
  border-color: rgba(26,14,48,0.10) !important;
}
html[data-theme="light"] .gm-input-wrap input {
  background: rgba(26,14,48,0.05) !important;
  border-color: rgba(26,14,48,0.12) !important;
  color: #1a0e30 !important;
}
html[data-theme="light"] .day-ring-hours { color: rgba(26,14,48,0.38) !important; }

/* ── Health / Macros page ── */
html[data-theme="light"] .day-pill { background: rgba(26,14,48,0.07) !important; color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .header { color: #1a0e30 !important; }
html[data-theme="light"] .section-label { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .tdee-big { color: #1a0e30 !important; text-shadow: none !important; }
html[data-theme="light"] .tdee-unit { color: rgba(26,14,48,0.50) !important; }
html[data-theme="light"] .macro-target-val { color: #1a0e30 !important; }
html[data-theme="light"] .macro-target-lbl { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .macro-target-sub { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .macro-bar-item   { color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .macro-bar-track  { background: rgba(26,14,48,0.07) !important; }
html[data-theme="light"] .macro-bar-label  { color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .macro-bar-val    { color: rgba(26,14,48,0.65) !important; }
html[data-theme="light"] .log-item   { border-color: rgba(26,14,48,0.07) !important; }
html[data-theme="light"] .log-name   { color: #1a0e30 !important; }
html[data-theme="light"] .log-meta   { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .log-del    { color: rgba(26,14,48,0.28) !important; }
html[data-theme="light"] .log-empty  { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .log-grams  { color: rgba(26,14,48,0.40) !important; }
html[data-theme="light"] .water-big  { color: #1a0e30 !important; }
html[data-theme="light"] .water-sep, html[data-theme="light"] .water-unit-lbl { color: rgba(26,14,48,0.40) !important; }
html[data-theme="light"] .water-tgt-lbl { color: rgba(26,14,48,0.65) !important; }
html[data-theme="light"] .water-minus-btn {
  background: rgba(26,14,48,0.06) !important;
  border-color: rgba(26,14,48,0.11) !important;
  color: rgba(26,14,48,0.65) !important;
}
html[data-theme="light"] .water-bar-track { background: rgba(26,14,48,0.07) !important; }
html[data-theme="light"] .water-dot { background: rgba(26,14,48,0.08) !important; }
html[data-theme="light"] .water-helper { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .whoop-label   { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] #whoopBurn { background: rgba(26,14,48,0.05) !important; border-color: rgba(26,14,48,0.12) !important; color: #1a0e30 !important; }
html[data-theme="light"] .spark-legend  { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .custom-badge  { border-color: rgba(109,40,217,0.35) !important; color: rgba(109,40,217,0.90) !important; }
html[data-theme="light"] #servingForm {
  background: rgba(26,14,48,0.26) !important;
}
html[data-theme="light"] .serving-modal {
  background: linear-gradient(160deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.82) 100%) !important;
  border-color: rgba(255,255,255,0.95) !important;
}
html[data-theme="light"] #servingName, html[data-theme="light"] #servingPer100, html[data-theme="light"] #servingPreview { color: rgba(26,14,48,0.70) !important; }
html[data-theme="light"] .field label { color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .goal-seg button { background: rgba(26,14,48,0.06) !important; color: rgba(26,14,48,0.55) !important; border-color: rgba(26,14,48,0.10) !important; }
html[data-theme="light"] .goal-seg button.active { background: rgba(109,40,217,0.15) !important; color: #6d28d9 !important; border-color: rgba(109,40,217,0.30) !important; }

/* ── Stack page ── */
html[data-theme="light"] .stack-card {
  background: linear-gradient(160deg, rgba(255,255,255,0.80) 0%, rgba(255,255,255,0.65) 100%) !important;
  border-color: rgba(255,255,255,0.95) !important;
  box-shadow: 0 6px 32px rgba(109,40,217,0.09), 0 1px 0 rgba(255,255,255,1) inset !important;
}
html[data-theme="light"] .stack-item { border-color: rgba(26,14,48,0.07) !important; }
html[data-theme="light"] .stack-name { color: #1a0e30 !important; }
html[data-theme="light"] .stack-time { color: rgba(26,14,48,0.44) !important; }
html[data-theme="light"] .stack-desc { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .stack-check {
  border-color: rgba(26,14,48,0.20) !important;
  background: rgba(26,14,48,0.03) !important;
}
html[data-theme="light"] .stack-taken-badge { background: rgba(5,150,105,0.12) !important; color: #059669 !important; }
html[data-theme="light"] .stack-progress-text { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .stack-empty { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .low-badge { background: rgba(220,38,38,0.10) !important; color: #dc2626 !important; }

/* ── Gym page ── */
html[data-theme="light"] .po-card,
html[data-theme="light"] .wt-card,
html[data-theme="light"] .wt-section {
  background: linear-gradient(160deg, rgba(255,255,255,0.80) 0%, rgba(255,255,255,0.65) 100%) !important;
  border-color: rgba(255,255,255,0.95) !important;
  box-shadow: 0 6px 32px rgba(109,40,217,0.09), 0 1px 0 rgba(255,255,255,1) inset !important;
}
html[data-theme="light"] .po-title    { color: #1a0e30 !important; }
html[data-theme="light"] .po-day-date { color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .po-day-split { color: #6d28d9 !important; }
html[data-theme="light"] .po-day-split.is-rest { color: #2563eb !important; }
html[data-theme="light"] .po-sub-title  { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .po-seg-label  { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] .po-ex-name    { color: #1a0e30 !important; }
html[data-theme="light"] .po-ex-target  { color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .po-ex-log     { color: rgba(26,14,48,0.40) !important; }
html[data-theme="light"] .po-unit       { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .wt-num        { color: #1a0e30 !important; text-shadow: none !important; }
html[data-theme="light"] .po-last-label { color: rgba(26,14,48,0.42) !important; }
html[data-theme="light"] .po-last-value { color: rgba(26,14,48,0.70) !important; }
html[data-theme="light"] .po-btn-secondary {
  background: rgba(26,14,48,0.06) !important;
  border-color: rgba(26,14,48,0.11) !important;
  color: rgba(26,14,48,0.65) !important;
}
html[data-theme="light"] .po-bw-banner { background: rgba(26,14,48,0.06) !important; color: rgba(26,14,48,0.55) !important; }
html[data-theme="light"] .wt-date-modal-title { color: #1a0e30 !important; }
html[data-theme="light"] .wt-date-modal-sub   { color: rgba(26,14,48,0.48) !important; }
html[data-theme="light"] .wt-date-entry        { border-color: rgba(26,14,48,0.07) !important; }
html[data-theme="light"] .wt-chart-yaxis span  { color: rgba(26,14,48,0.38) !important; }
html[data-theme="light"] #stackProgressText    { color: rgba(26,14,48,0.48) !important; }
