/* BrainPal theme -- design tokens. The ONLY place colours, fonts, radii and shadows are defined.
   Light by default, dark via html[data-bp-mode="dark"] (set before first paint in the layout). */
:root {
  --bp-font: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bp-font-head: 'Inter Tight', 'Inter', ui-sans-serif, system-ui, sans-serif;

  /* BrainFit logo colours (public/acp/assets/img/brainfit_logo.png): blue #00BBE7, green #50B847,
     orange #FBAE16, used for accents (top stripe, success/warning). Buttons, links and the active
     menu use HQ's indigo so ACP and HQ read as one product. */
  --bp-logo-blue: #00BBE7;
  --bp-logo-green: #50B847;
  --bp-logo-orange: #FBAE16;

  --bp-brand: #4F46E5;            /* main: HQ indigo-600 (buttons, links, active menu) */
  --bp-brand-hover: #4338CA;
  --bp-brand-weak: rgba(99, 102, 241, 0.10);
  --bp-brand-ring: rgba(99, 102, 241, 0.25);
  --bp-on-brand: #ffffff;
  --bp-avatar: linear-gradient(135deg, #818CF8, #D946EF);   /* HQ's initials avatar */
  --bp-input-bg: #f8fafc;         /* inputs/selects: light grey like HQ, white on focus */

  --bp-bg: #f8fafc;               /* page */
  --bp-surface: #ffffff;          /* cards, menus, inputs */
  --bp-surface-2: #f1f5f9;        /* table heads, hovers, segmented controls */
  --bp-surface-3: #e2e8f0;
  --bp-border: #e2e8f0;
  --bp-border-strong: #cbd5e1;

  --bp-heading: #0f172a;
  --bp-text: #334155;
  --bp-muted: #64748b;
  --bp-faint: #94a3b8;

  --bp-success: #2F8A27;  --bp-success-weak: #EEF8EC;  --bp-success-line: #BFE3B8;   /* brand green */
  --bp-info: #4F46E5;     --bp-info-weak: #EEF2FF;     --bp-info-line: #C7D2FE;     /* HQ indigo */
  --bp-warning: #B7770A;  --bp-warning-weak: #FFF7E6;  --bp-warning-line: #FDDB97;   /* brand orange */
  --bp-danger: #e11d48;   --bp-danger-weak: #fff1f2;   --bp-danger-line: #fecdd3;

  --bp-radius-sm: 7px;
  --bp-radius: 10px;
  --bp-radius-lg: 14px;
  --bp-radius-xl: 18px;

  --bp-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05);
  --bp-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --bp-shadow-lg: 0 12px 32px -8px rgba(15, 23, 42, 0.18), 0 4px 10px -4px rgba(15, 23, 42, 0.08);
  --bp-backdrop: rgba(15, 23, 42, 0.45);

  --bp-topbar-h: 60px;
}

html[data-bp-mode="dark"] {
  --bp-brand: #6366F1;
  --bp-brand-hover: #818CF8;
  --bp-brand-weak: rgba(99, 102, 241, 0.16);
  --bp-brand-ring: rgba(99, 102, 241, 0.35);
  --bp-on-brand: #ffffff;
  --bp-input-bg: #1b1b28;

  --bp-bg: #0a0a12;
  --bp-surface: #13131d;
  --bp-surface-2: #1b1b28;
  --bp-surface-3: #262636;
  --bp-border: #262636;
  --bp-border-strong: #34344a;

  --bp-heading: #f1f5f9;
  --bp-text: #cbd5e1;
  --bp-muted: #94a3b8;
  --bp-faint: #64748b;

  --bp-success: #6FCF66;  --bp-success-weak: rgba(80, 184, 71, 0.12);  --bp-success-line: rgba(80, 184, 71, 0.35);
  --bp-info: #A5B4FC;     --bp-info-weak: rgba(99, 102, 241, 0.14);  --bp-info-line: rgba(99, 102, 241, 0.38);
  --bp-warning: #FBAE16;  --bp-warning-weak: rgba(251, 174, 22, 0.12); --bp-warning-line: rgba(251, 174, 22, 0.35);
  --bp-danger: #fb7185;   --bp-danger-weak: rgba(251, 113, 133, 0.1);  --bp-danger-line: rgba(251, 113, 133, 0.3);

  --bp-shadow-sm: none;
  --bp-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
  --bp-shadow-lg: 0 16px 40px -10px rgba(0, 0, 0, 0.7);
  --bp-backdrop: rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}
