/* ── Theme: The SLP (default) — blush rose / girly pink ──────── */
:root,
[data-theme="slp"] {
  --brand-50:  255 245 249;
  --brand-100: 255 228 239;
  --brand-200: 254 200 221;
  --brand-300: 252 163 195;
  --brand-400: 248 138 178;
  --brand-500: 240 115 162;
  --brand-600: 219 93 142;
  --brand-700: 184 72 118;
  --brand-800: 148 56 94;
  --brand-900: 112 40 70;

  --sidebar-from: #fff5f9;
  --sidebar-to:   #ffe9f1;
  --sidebar-border: #fed7e4;
  --sidebar-nav-hover: rgba(255,228,239,0.8);
  --sidebar-inactive: rgb(219 93 142);
  --sidebar-footer-text: rgb(252 163 195);
  --sidebar-title: rgb(148 56 94);
  --sidebar-sub: rgb(219 93 142);
  --logo-ring1: #f073a2;
  --logo-ring2: #ffe4ef;

  --app-bg: #fffafc;
}

/* ── Theme: Teddy — warm dark chocolate ─────────────────────── */
[data-theme="teddy"] {
  --brand-50:  45 34 25;
  --brand-100: 61 46 34;
  --brand-200: 90 63 42;
  --brand-300: 139 94 60;
  --brand-400: 192 120 64;
  --brand-500: 212 133 79;
  --brand-600: 184 103 58;
  --brand-700: 154 82 48;
  --brand-800: 122 62 37;
  --brand-900: 90 45 26;

  --sidebar-from: #241c16;
  --sidebar-to:   #1c1410;
  --sidebar-border: #3d2e22;
  --sidebar-nav-hover: rgba(61,46,34,0.8);
  --sidebar-inactive: rgb(192 120 64);
  --sidebar-footer-text: rgb(90 63 42);
  --sidebar-title: rgb(232 213 192);
  --sidebar-sub: rgb(192 120 64);
  --logo-ring1: #d4854f;
  --logo-ring2: #3d2e22;

  --app-bg: #1c1410;
}

/* ── Theme: Henry — majestic sapphire & antique gold ────────── */
[data-theme="henry"] {
  --brand-50:  250 247 237;
  --brand-100: 241 234 214;
  --brand-200: 221 202 153;
  --brand-300: 201 169 97;
  --brand-400: 163 133 72;
  --brand-500: 26 43 92;
  --brand-600: 20 34 74;
  --brand-700: 15 27 62;
  --brand-800: 10 20 48;
  --brand-900: 6 14 35;

  --sidebar-from: #0a1430;
  --sidebar-to:   #060e23;
  --sidebar-border: #1a2b5c;
  --sidebar-nav-hover: rgba(26,43,92,0.6);
  --sidebar-inactive: rgb(201 169 97);
  --sidebar-footer-text: rgba(201,169,97,0.6);
  --sidebar-title: rgb(250 247 237);
  --sidebar-sub: rgb(201 169 97);
  --logo-ring1: #c9a961;
  --logo-ring2: #1a2b5c;

  --app-bg: #faf6ea;
}

[data-theme="henry"] aside nav a:hover {
  background-color: rgba(201,169,97,0.12) !important;
  color: rgb(221 202 153) !important;
}

/* ── Theme: Eddy — dingy cardboard & worn khaki ─────────────── */
[data-theme="eddy"] {
  --brand-50:  241 235 218;
  --brand-100: 228 217 190;
  --brand-200: 206 189 154;
  --brand-300: 174 151 115;
  --brand-400: 138 114 80;
  --brand-500: 125 106 75;
  --brand-600: 102 84 57;
  --brand-700: 82 67 45;
  --brand-800: 62 50 33;
  --brand-900: 42 34 22;

  --sidebar-from: #ddd0b8;
  --sidebar-to:   #cfbf9d;
  --sidebar-border: #a88f69;
  --sidebar-nav-hover: rgba(206,189,154,0.7);
  --sidebar-inactive: rgb(102 84 57);
  --sidebar-footer-text: rgb(138 114 80);
  --sidebar-title: rgb(62 50 33);
  --sidebar-sub: rgb(102 84 57);
  --logo-ring1: #7d6a4b;
  --logo-ring2: #cebd9a;

  --app-bg: #ede2c8;
}

/* ── Base ────────────────────────────────────────────────────── */
html { scroll-behavior: smooth; }

body {
  background-color: var(--app-bg);
  color: #1e293b;
  font-family: 'Jost', sans-serif;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button, a { transition: color 0.15s, background-color 0.15s, border-color 0.15s; }
td { vertical-align: middle; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { opacity: 1; }
input[type="date"]::-webkit-calendar-picker-indicator { opacity: 0.5; cursor: pointer; }

::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 9999px; }
::-webkit-scrollbar-thumb:hover { background: #9ca3af; }

/* ── Dark theme (Teddy) global overrides ─────────────────────── */
.dark body { background-color: #1c1410; color: #e8d5c0; }
.dark .bg-white         { background-color: #2d2219 !important; }
.dark .bg-slate-50      { background-color: #241c16 !important; }
.dark .bg-slate-100     { background-color: #3d2e22 !important; }
.dark .bg-slate-200     { background-color: #4a3826 !important; }
.dark .bg-pink-50\/50   { background-color: rgba(45,34,25,0.5) !important; }
.dark .bg-pink-50       { background-color: #2d2219 !important; }

.dark .text-slate-800   { color: #e8d5c0 !important; }
.dark .text-slate-700   { color: #d4c4b0 !important; }
.dark .text-slate-600   { color: #c0ae9a !important; }
.dark .text-slate-500   { color: #a89888 !important; }
.dark .text-slate-400   { color: #907870 !important; }
.dark .text-slate-300   { color: #7a6555 !important; }

.dark .border-slate-200 { border-color: #3d2e22 !important; }
.dark .border-slate-100 { border-color: #3d2e22 !important; }
.dark .divide-slate-50 > :not([hidden]) ~ :not([hidden]) { border-color: #3d2e22; }
.dark .divide-y > :not([hidden]) ~ :not([hidden]) { border-color: #3d2e22; }
.dark .shadow-sm        { box-shadow: 0 1px 3px rgba(0,0,0,0.4) !important; }

.dark input, .dark select, .dark textarea {
  background-color: #241c16 !important;
  color: #e8d5c0 !important;
  border-color: #5a3f2a !important;
}
.dark input::placeholder, .dark textarea::placeholder { color: #7a6555 !important; }
.dark table thead { background-color: #241c16 !important; }
.dark .hover\:bg-slate-50:hover { background-color: #241c16 !important; }
.dark .hover\:bg-slate-50\/50:hover { background-color: rgba(36,28,22,0.5) !important; }
.dark .hover\:bg-slate-100:hover { background-color: #3d2e22 !important; }

/* ── Mobile bottom nav padding ───────────────────────────────── */
@media (max-width: 767px) {
  .mobile-padded-bottom { padding-bottom: 5rem; }
}

/* ── Toast notification ──────────────────────────────────────── */
#mq-toast {
  position: fixed;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  display: none;
  padding: 0.625rem 1.25rem;
  border-radius: 0.75rem;
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: 0 4px 20px rgba(0,0,0,0.12);
  white-space: nowrap;
}
#mq-toast.show { display: block; }
#mq-toast.success { background: #f0fdf4; color: #15803d; border: 1px solid #bbf7d0; }
#mq-toast.error   { background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; }