/* ==========================================================================
   Pulse Habits — light theme
   Applied through html[data-theme='light'] by js/theme.js.
   ========================================================================== */

html[data-theme='light'] {
  color-scheme: light;

  --tint-rgb: 15, 23, 42;

  --bg: #f2f5fa;
  --bg-deep: #e7ecf5;
  --surface: #ffffff;
  --surface-2: #f7f9fd;
  --surface-3: #edf1f8;
  --surface-4: #e2e8f2;
  --surface-glass: rgba(255, 255, 255, 0.88);

  --text: #0f172a;
  --text-soft: #26344a;
  --muted: #4b5b73;
  --dim: #5a6a82;
  --faint: #78879d;

  --indigo: #5b5ef0;
  --indigo-bright: #4338ca;
  --cyan: #0891b2;
  --cyan-bright: #0e7490;
  --amber: #d97706;
  --amber-bright: #b45309;
  --rose: #e11d48;
  --violet: #7c3aed;

  --shell-grad-a: #fbfcff;
  --shell-grad-b: #eef2f9;
  --input-bg: #ffffff;
  --input-bg-focus: #ffffff;
  --topbar-bg: rgba(248, 250, 253, 0.84);
  --nav-bg: rgba(250, 252, 255, 0.95);
  --modal-bg: #ffffff;
  --overlay-bg: rgba(15, 23, 42, 0.38);
  --overlay-bg-soft: rgba(15, 23, 42, 0.3);
  --menu-bg: rgba(255, 255, 255, 0.98);
  --tooltip-bg: #ffffff;
  --tooltip-text: #0f172a;
  --tooltip-border: rgba(15, 23, 42, 0.16);
  --chart-track: rgba(15, 23, 42, 0.1);
  --chart-grid: rgba(15, 23, 42, 0.07);

  --shadow-card: 0 14px 34px -26px rgba(15, 23, 42, 0.5), inset 0 1px 0 #ffffff;
  --shadow-pop: 0 26px 54px -22px rgba(15, 23, 42, 0.28);
  --shadow-hover: 0 26px 48px -30px rgba(15, 23, 42, 0.45), 0 0 0 1px rgba(15, 23, 42, 0.04);
}

html[data-theme='light'] body {
  background:
    radial-gradient(1100px 560px at 82% -12%, rgba(var(--accent-rgb), 0.11), transparent 62%),
    radial-gradient(900px 520px at 12% 112%, rgba(99, 102, 241, 0.09), transparent 60%),
    var(--bg);
}

html[data-theme='light'] ::selection {
  background: rgba(var(--accent-rgb), 0.24);
  color: var(--accent-contrast);
}

html[data-theme='light'] ::-webkit-scrollbar-thumb {
  background: rgba(15, 23, 42, 0.16);
  border-color: var(--bg);
}

html[data-theme='light'] ::-webkit-scrollbar-thumb:hover {
  background: rgba(15, 23, 42, 0.26);
}

/* Surfaces that still carry a literal dark tone ------------------------- */

html[data-theme='light'] .hero-glow {
  opacity: 0.55;
}

html[data-theme='light'] .brand-mark {
  background: linear-gradient(145deg, rgba(var(--accent-rgb), 0.16), rgba(6, 182, 212, 0.06));
}

html[data-theme='light'] .search-trigger {
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
}

html[data-theme='light'] .avatar {
  background: linear-gradient(145deg, #6366f1, #0ea472);
  color: #ffffff;
  border-color: rgba(15, 23, 42, 0.12);
  box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.04);
}

html[data-theme='light'] .avatar-status {
  border-color: var(--surface);
}

html[data-theme='light'] .menu-pop,
html[data-theme='light'] .palette,
html[data-theme='light'] .modal {
  box-shadow: var(--shadow-pop);
}

html[data-theme='light'] .modal {
  border-color: rgba(15, 23, 42, 0.12);
}

html[data-theme='light'] .tooltip-bubble {
  box-shadow: 0 14px 30px -12px rgba(15, 23, 42, 0.28);
}

html[data-theme='light'] .select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}

/* Typography / text colour fixes --------------------------------------- */

html[data-theme='light'] .brand-name,
html[data-theme='light'] .hero-title,
html[data-theme='light'] .nav-item.active,
html[data-theme='light'] .seg-btn.active,
html[data-theme='light'] .week-day.today .wd-date,
html[data-theme='light'] .timer-time,
html[data-theme='light'] .menu-item:hover,
html[data-theme='light'] .palette-item.active,
html[data-theme='light'] .palette-item:hover {
  color: var(--text);
}

html[data-theme='light'] .chip-emerald {
  background: rgba(var(--accent-rgb), 0.12);
  color: #047857;
}

html[data-theme='light'] .chip-rose {
  color: #be123c;
}

html[data-theme='light'] .chip-violet {
  color: #6d28d9;
}

html[data-theme='light'] .btn-danger {
  color: #be123c;
}

html[data-theme='light'] .menu-item.is-danger {
  color: #be123c;
}

html[data-theme='light'] .menu-item.is-danger .material-symbols-outlined {
  color: #e11d48;
}

html[data-theme='light'] .btn-primary {
  color: var(--accent-contrast);
}

html[data-theme='light'] .btn-indigo {
  color: #ffffff;
}

/* Inline accent colours from habit data stay legible on white ---------- */

html[data-theme='light'] .habit-icon,
html[data-theme='light'] .tl-item-icon,
html[data-theme='light'] .habit-card-rate strong,
html[data-theme='light'] .habit-detail-head .chip[style],
html[data-theme='light'] .habit-card-meta .chip[style] {
  filter: saturate(1.05) brightness(0.86);
}

/* Chart and heatmap contrast ------------------------------------------- */

html[data-theme='light'] .heat-cell.l4.over {
  box-shadow: 0 0 7px rgba(6, 182, 212, 0.4);
}

html[data-theme='light'] .heat-cell:hover {
  outline-color: rgba(15, 23, 42, 0.55);
}