/* ========================================
   FASTAP dashboards: design tokens
   Brand plum (from the Fastap logo and website) for actions and active states,
   warm neutrals, solid fills. The old token names (purple-*, gradient-*) are kept
   so existing pages pick up the look without edits; they now hold solid colours.
   ======================================== */

:root {
  /* Surfaces */
  --bg-primary: #ffffff;
  --bg-secondary: #f6f6f8;
  --bg-tertiary: #eeeef2;
  --bg-accent: #e6e6ec;

  /* Text */
  --text-primary: #18181f;
  --text-secondary: #45454f;
  --text-muted: #74747f;
  --text-white: #ffffff;
  --text-color: var(--text-primary);

  /* Lines */
  --border-light: #e5e5ea;
  --border-medium: #d2d2da;
  --border-dark: #a5a5b0;
  --border-color: var(--border-light);

  /* Shadows: soft */
  --shadow-sm: 0 1px 2px rgba(24, 24, 31, 0.05);
  --shadow-md: 0 2px 8px rgba(24, 24, 31, 0.06);
  --shadow-lg: 0 8px 24px rgba(24, 24, 31, 0.08);
  --shadow-xl: 0 16px 40px rgba(24, 24, 31, 0.12);

  /* Brand */
  --brand-50: #faf3fb;
  --brand-100: #f3e3f5;
  --brand-200: #e6c6ea;
  --brand-400: #b865bd;
  --brand-500: #9c44a2;
  --brand-600: #83338a;
  --brand-700: #6c2872;
  --brand-900: #3b1440;
  --ink: #18181f;
  --ink-hover: #6c2872;
  --accent: #83338a;
  --accent-hover: #6c2872;
  --accent-soft: #f6ebf7;

  /* Legacy accent names: the brand plum */
  --purple-300: #e6c6ea;
  --purple-400: #b865bd;
  --purple-500: #83338a;
  --purple-600: #6c2872;
  --primary-color: #83338a;
  --primary-dark: #6c2872;
  --primary-light: #f6ebf7;

  /* Supporting colours for charts, tiles and status */
  --blue-400: #5b8fd1;
  --blue-500: #2f6db5;
  --blue-600: #255791;
  --pink-400: #d4628d;
  --pink-500: #b84474;
  --pink-600: #96355d;
  --orange-400: #e39a3b;
  --orange-500: #c97d1e;
  --orange-600: #a66415;
  --teal-500: #1a8a85;

  --green-500: #2b8a57;
  --green-600: #227146;
  --red-500: #c23b33;
  --red-600: #a2302a;
  --yellow-500: #b07400;
  --success-color: #2b8a57;
  --danger-color: #c23b33;
  --warning-color: #b07400;
  --info-color: #2f6db5;

  /* Former gradients: solid fills (background-image still accepts them) */
  --gradient-purple: linear-gradient(#83338a, #83338a);
  --gradient-blue: linear-gradient(#2f6db5, #2f6db5);
  --gradient-pink: linear-gradient(#b84474, #b84474);
  --gradient-orange: linear-gradient(#c97d1e, #c97d1e);
  --gradient-multi: linear-gradient(#83338a, #83338a);
  --gradient-hero: linear-gradient(#83338a, #83338a);

  /* Cards */
  --card-bg: #ffffff;
  --card-hover-bg: #fafafc;
  --card-border: #e5e5ea;

  /* Buttons */
  --btn-primary-bg: #83338a;
  --btn-primary-color: #ffffff;
  --btn-secondary-bg: #ffffff;
  --btn-secondary-color: #18181f;
  --btn-outline-border: #d2d2da;
  --btn-outline-color: #18181f;

  /* Header */
  --header-bg: #ffffff;
  --header-border: #e5e5ea;
  --header-shadow: 0 1px 3px rgba(24, 24, 31, 0.06);

  /* Spacing */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2rem;
  --space-xl: 3rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  /* Type */
  --font-primary: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Courier New', monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;

  --font-light: 300;
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  --font-extrabold: 700;

  --leading-tight: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-2xl: 16px;
  --radius-full: 9999px;

  --transition-fast: 120ms ease;
  --transition-base: 180ms ease;
  --transition-slow: 240ms ease;

  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-popover: 1060;
  --z-tooltip: 1070;
}

/* Dark theme (Light / Dark switch in the header) */
[data-theme="dark"] {
  --bg-primary: #17161c;
  --bg-secondary: #111015;
  --bg-tertiary: #222129;
  --bg-accent: #2b2a33;

  --text-primary: #f3f2f7;
  --text-secondary: #cfcdd8;
  --text-muted: #9c9aa8;

  --border-light: #2e2d36;
  --border-medium: #403f4a;
  --border-dark: #66646f;

  --shadow-sm: none;
  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.45);
  --shadow-xl: 0 16px 40px rgba(0, 0, 0, 0.5);

  --brand-50: #2a1730;
  --brand-100: #33193a;
  --accent: #d48ad9;
  --accent-hover: #e3ace7;
  --accent-soft: #2f1a35;
  --purple-300: #4d2853;
  --purple-400: #d48ad9;
  --purple-500: #d48ad9;
  --purple-600: #e3ace7;
  --primary-color: #d48ad9;

  --card-bg: #17161c;
  --card-hover-bg: #1e1d24;
  --card-border: #2e2d36;

  --btn-primary-bg: #a64aad;
  --btn-primary-color: #ffffff;
  --btn-secondary-bg: #222129;
  --btn-secondary-color: #f3f2f7;
  --btn-outline-border: #403f4a;
  --btn-outline-color: #f3f2f7;

  --header-bg: #17161c;
  --header-border: #2e2d36;
}

/* Utility classes kept for old markup; all solid now. */
.gradient-purple, .gradient-multi, .gradient-hero { background: var(--accent); }
.gradient-blue { background: var(--blue-500); }
.gradient-pink { background: var(--pink-500); }
.gradient-orange { background: var(--orange-500); }
.text-gradient-purple, .text-gradient-multi { color: inherit; }

.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow-md { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); }
.hover-shadow-md:hover, .hover-shadow-lg:hover, .hover-shadow-xl:hover { box-shadow: var(--shadow-md); }

.transition-fast { transition: all var(--transition-fast); }
.transition-base { transition: all var(--transition-base); }
.transition-slow { transition: all var(--transition-slow); }