/* ==========================================================================
   Mpalo Design System Tokens
   Single source of truth for colors, typography, spacing, and borders.
   ========================================================================== */

:root {
  color-scheme: dark;
  /* ----------------------------------------------------------------------
     Typography
     ---------------------------------------------------------------------- */
  --font-family-display: 'Radley', serif;
  --font-family-body: 'Martel', serif;
  --font-family-mind-display: 'Eina', system-ui, -apple-system, sans-serif;
  --font-family-mind-body: 'ASM', system-ui, -apple-system, sans-serif;

  /* Typographic Scale (Mind + Shared) */
  --font-size-xs: 0.75rem; /* 12px */
  --font-size-sm: 0.875rem; /* 14px */
  --font-size-base: 1rem; /* 16px */
  --font-size-lg: 1.125rem; /* 18px */
  --font-size-xl: 1.25rem; /* 20px */
  --font-size-2xl: 1.5rem; /* 24px */
  --font-size-3xl: 1.875rem; /* 30px */
  --font-size-4xl: 2.25rem; /* 36px */
  --font-size-5xl: 3rem; /* 48px */

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  /* ----------------------------------------------------------------------
     Spacing (4px Base)
     ---------------------------------------------------------------------- */
  --spacing-1: 0.25rem; /* 4px */
  --spacing-2: 0.5rem;  /* 8px */
  --spacing-3: 0.75rem; /* 12px */
  --spacing-4: 1rem;    /* 16px */
  --spacing-5: 1.25rem; /* 20px */
  --spacing-6: 1.5rem;  /* 24px */
  --spacing-8: 2rem;    /* 32px */
  --spacing-10: 2.5rem; /* 40px */
  --spacing-12: 3rem;   /* 48px */
  --spacing-16: 4rem;   /* 64px */
  --spacing-20: 5rem;   /* 80px */
  --spacing-24: 6rem;   /* 96px */

  /* ----------------------------------------------------------------------
     Borders & Radius
     ---------------------------------------------------------------------- */
  --radius-sm: 0.25rem;  /* 4px */
  --radius-md: 0.375rem; /* 6px */
  --radius-lg: 0.5rem;   /* 8px */
  --radius-xl: 0.75rem;  /* 12px */
  --radius-2xl: 1rem;    /* 16px */
  --radius-3xl: 1.25rem; /* 20px */
  --radius-pill: 9999px;

  /* ----------------------------------------------------------------------
     Shadows
     ---------------------------------------------------------------------- */
  --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);

  /* ----------------------------------------------------------------------
     Color Palette (Unified)
     ---------------------------------------------------------------------- */
  /* Backgrounds */
  --color-bg-primary: #101017;
  --color-bg-secondary: #1C1B23;
  --color-bg-tertiary: #24242D;
  --color-bg-quaternary: #2D2D39;
  
  /* Mind Platform Dark Mode Overrides for Background (Standardizing #141414 etc.) */
  --color-mind-bg-primary: #141414;
  --color-mind-bg-secondary: #1F1F1F;
  --color-mind-bg-tertiary: #292929;
  --color-mind-bg-quaternary: #333333;

  /* Surfaces & Headers */
  --color-header-bg: #000000;
  --color-footer-bg: #b62057;
  --color-hero-bg: #b62057;

  /* Text Colors */
  --color-text-primary: #f6ecda;
  --color-text-secondary: #DADFF7;
  --color-text-muted: #B5B2C2;
  --color-text-info: #5870a1;
  --color-text-header: #b62057;

  /* Brand / Accents */
  --color-accent-primary: #5e7ce2;
  --color-accent-secondary: #627CE4;
  --color-accent-hover: #758FE6;
  --color-link: #5e7ce2;
  --color-link-hover: #b62057;
  
  /* Signup Alternate Accent */
  --color-signup-accent: #88d07ac9;

  /* Borders */
  --color-border-primary: #232528;
  --color-border-secondary: #2F3237;
  --color-border-subtle: #3D3D3D;
  --color-border-normal: #474747;
  --color-border-accent: #525252;
  --color-border-light: hsla(0, 50%, 95%, 0.05);

  /* Status Colors */
  --color-status-success: #6de5adac;
  --color-status-warning: #edc95e;
  --color-status-error: #ce5864;
  --color-status-danger: #A71D31;
  --color-status-success-solid: #10B981;
  --color-status-warning-solid: #F59E0B;
  --color-status-error-solid: #EF4444;

  /* Functional Primitive Colors */
  --color-green: #a4da8b;
  --color-yellow: #fff78e;
  --color-red: #fca5a5;
  --color-blue: #9aaeff;
  --color-orange: #ecb041;
  --color-purple: #9c59df;

  /* Scrollbar */
  --color-scrollbar-bg: #0d1117;
  --color-scrollbar-thumb: #30363d;
  --color-scrollbar-thumb-hover: #484f58;
  --color-scrollbar-thumb-active: #656d76;
}

/* ------------------------------------------------------------------------
   Light Mode Overrides (Mind Platform)
   Note: To be managed strictly through variables, not specificity wars.
   ------------------------------------------------------------------------ */
[data-theme="light"] {
  --color-mind-bg-primary: #F4F3EE;
  --color-mind-bg-secondary: #EDECE8;
  --color-mind-bg-tertiary: #E8E7E3;
  --color-mind-bg-quaternary: #DFDEDB;
  
  --color-text-secondary: #242325;
  --color-text-muted: #65655E;
  --color-border-primary: #D3D2CE;
}
