/* ============================================================
   AbdoAgent — Central theme (design tokens, extensible)
   Loaded by every page before its own <style>.
   Pages consume the CSS variables below; light/dark + accent +
   corner radius are switched centrally here and via theme.js.
   ============================================================ */
:root {
  color-scheme: light;
  /* Base accent (may be overridden inline by theme.js from settings) */
  --brand-light: #4A2C85;
  --brand-dark: #8B6CD9;
  --brand: var(--brand-light);
  --brand-2: #6B48B8;
  --on-brand: #ffffff;
  /* Surface & text */
  --bg: #F4F4F8;
  --card: #FFFFFF;
  --text: #1B1B2F;
  --muted: #7A7A93;
  --border: #E6E7F0;
  --line: #EEF0F5;
  --shadow: 0 1px 2px rgba(23,22,54,.05), 0 10px 28px rgba(23,22,54,.07);
  /* Status */
  --ok: #2E7D32;
  --ok-bg: #EAF6EA;
  --danger: #C62828;
  --danger-bg: #FDECEC;
  --pro: #0B5F9E;
  --pro-bg: #E8F4FD;
  --open-bg: #F0EBFA;
  /* Corners */
  --radius: 14px;
  --radius-sm: 9px;
}

[data-theme="dark"] {
  color-scheme: dark;
  --brand: var(--brand-dark);
  --brand-2: #A285E8;
  --on-brand: #140E24;
  --bg: #12101C;
  --card: #1C1A2B;
  --text: #ECEBF6;
  --muted: #9C9AB1;
  --border: #2C2A40;
  --line: #262437;
  --shadow: 0 1px 2px rgba(0,0,0,.3), 0 10px 28px rgba(0,0,0,.35);
  --ok: #66BB6A;
  --ok-bg: rgba(102,187,106,.14);
  --danger: #EF8188;
  --danger-bg: rgba(239,129,136,.14);
  --pro: #5BA8F0;
  --pro-bg: rgba(91,168,240,.14);
  --open-bg: rgba(183,155,240,.16);
}

/* Sensible hard-deps default so unstyled containers still adapt */
html { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
body { background: var(--bg); color: var(--text); }

/* Smooth theme switching (applied while toggling at runtime) */
html.theming * { transition: background-color .2s ease, border-color .2s ease, color .15s ease; }