/* =========================================================
   NextBizAI — Design Tokens
   Material Design 3 inspired, pastel palette
   ========================================================= */

:root,
[data-theme="light"] {
  /* ---------- Brand / Primary ---------- */
  --md-primary: #A8C7FA;
  --md-primary-strong: #5B8DEF;
  --md-on-primary: #0B1F3A;
  --md-primary-container: #D3E3FD;
  --md-on-primary-container: #0B1F3A;

  /* ---------- Secondary (lavender) ---------- */
  --md-secondary: #C5C0E8;
  --md-secondary-container: #E5E1F7;
  --md-on-secondary-container: #3A2F8F;

  /* ---------- Tertiary (mint) ---------- */
  --md-tertiary: #B8E0D2;
  --md-tertiary-container: #DCEFE6;
  --md-on-tertiary-container: #1E6B4F;

  /* ---------- Accent (peach) ---------- */
  --md-accent-peach: #FFCDB2;
  --md-accent-peach-container: #FFE3D4;
  --md-on-accent-peach-container: #8A4A28;

  /* ---------- Error ---------- */
  --md-error: #E66A6A;
  --md-error-container: #FADBDB;
  --md-on-error-container: #8A2828;

  /* ---------- Surface ---------- */
  --md-surface: #FAFBFC;
  --md-surface-elevated: #FFFFFF;
  --md-surface-variant: #F1F3F5;
  --md-surface-tonal: #EEF3FB;       /* very subtle primary tint */

  --md-on-surface: #1F1F1F;
  --md-on-surface-muted: #5F6368;
  --md-on-surface-subtle: #80868B;

  --md-outline: #E1E3E6;
  --md-outline-strong: #C7CACE;

  /* row hover */
  --md-hover-layer: rgba(91, 141, 239, 0.06);
  --md-selected-layer: rgba(91, 141, 239, 0.12);
}

[data-theme="dark"] {
  /* Soft dark — Material 3 dark surfaces, but keeping pastel accents */
  --md-primary: #A8C7FA;
  --md-primary-strong: #A8C7FA;
  --md-on-primary: #0B1F3A;
  --md-primary-container: #2A3F66;
  --md-on-primary-container: #D3E3FD;

  --md-secondary: #C5C0E8;
  --md-secondary-container: #3D3677;
  --md-on-secondary-container: #E5E1F7;

  --md-tertiary: #B8E0D2;
  --md-tertiary-container: #1E4538;
  --md-on-tertiary-container: #DCEFE6;

  --md-accent-peach: #FFCDB2;
  --md-accent-peach-container: #5A3A26;
  --md-on-accent-peach-container: #FFE3D4;

  --md-error: #F4A0A0;
  --md-error-container: #5A2828;
  --md-on-error-container: #FADBDB;

  --md-surface: #131416;
  --md-surface-elevated: #1B1D20;
  --md-surface-variant: #25282C;
  --md-surface-tonal: #1C2128;

  --md-on-surface: #E3E5E8;
  --md-on-surface-muted: #9AA0A6;
  --md-on-surface-subtle: #6F7480;

  --md-outline: #2E3136;
  --md-outline-strong: #3F434A;

  --md-hover-layer: rgba(168, 199, 250, 0.08);
  --md-selected-layer: rgba(168, 199, 250, 0.16);
}

:root {
  /* ---------- Typography ---------- */
  --font-display: 'Google Sans Display', 'Google Sans', system-ui, sans-serif;
  --font-sans: 'Google Sans', 'Roboto', system-ui, sans-serif;
  --font-body: 'Roboto', system-ui, sans-serif;
  --font-mono: 'Roboto Mono', ui-monospace, monospace;

  /* ---------- Shape ---------- */
  --r-xs: 8px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 28px;
  --r-full: 9999px;

  /* ---------- Elevation ---------- */
  --e-1: 0 1px 2px rgba(60,64,67,.06), 0 1px 3px rgba(60,64,67,.08);
  --e-2: 0 1px 2px rgba(60,64,67,.06), 0 2px 6px rgba(60,64,67,.10);
  --e-3: 0 4px 8px rgba(60,64,67,.08), 0 6px 16px rgba(60,64,67,.12);
  --e-4: 0 8px 16px rgba(60,64,67,.10), 0 12px 28px rgba(60,64,67,.14);

  /* ---------- Spacing ---------- */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;
  --s-4: 16px;  --s-5: 20px;  --s-6: 24px;
  --s-8: 32px;  --s-10: 40px; --s-12: 48px;
  --s-16: 64px; --s-20: 80px;

  /* ---------- Layout ---------- */
  --sidebar-w: 260px;
  --content-max: 1240px;

  /* ---------- Motion ---------- */
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-emphasized: cubic-bezier(0.3, 0, 0, 1);
  --d-short: 150ms;
  --d-med: 250ms;
  --d-long: 400ms;
}

[data-theme="dark"] {
  --e-1: 0 1px 2px rgba(0,0,0,.4), 0 1px 3px rgba(0,0,0,.3);
  --e-2: 0 1px 2px rgba(0,0,0,.4), 0 2px 6px rgba(0,0,0,.4);
  --e-3: 0 4px 8px rgba(0,0,0,.4), 0 6px 16px rgba(0,0,0,.5);
  --e-4: 0 8px 16px rgba(0,0,0,.5), 0 12px 28px rgba(0,0,0,.6);
}