/* ============================================================
   WOSOL DIGITAL GROWTH — COLOR TOKENS
   Brand palette from the official Brand Identity Guideline (May 2026).
   Premium, high-contrast: deep pine green + rich black, burgundy accent.
   ============================================================ */

:root {
  /* --- Brand core (exact brand-guide hex) --- */
  --wosol-pine-teal: #1D4D38;   /* Color One  — primary green, structural stability */
  --wosol-deep-black: #060706;  /* Color Two  — near-black anchor for type + bg */
  --wosol-alabaster: #E9E9E9;   /* Color Three — neutral breathable surface */
  --wosol-grey-olive: #A29A93;  /* Color Four — mid-tone bridge */
  --wosol-burgundy: #72171F;    /* Color Five — strategic accent energy */
  --wosol-white: #FFFFFF;       /* Color Six  — crisp white, negative space */

  /* --- Pine teal scale (tints/shades of the primary) --- */
  --pine-900: #0E2A1E;
  --pine-800: #163C2C;
  --pine-700: #1D4D38;  /* base */
  --pine-600: #2A6048;
  --pine-500: #3A7659;
  --pine-400: #5E9079;
  --pine-300: #8FB3A2;
  --pine-200: #C0D4CA;
  --pine-100: #E4EDE8;

  /* --- Burgundy scale (accent) --- */
  --burgundy-900: #410D11;
  --burgundy-700: #72171F;  /* base */
  --burgundy-500: #9A2731;
  --burgundy-300: #C76A72;
  --burgundy-100: #F2DCDE;

  /* --- Neutral / greyscale ramp (warm-leaning, olive influence) --- */
  --neutral-0:   #FFFFFF;
  --neutral-50:  #F6F5F4;
  --neutral-100: #E9E9E9;  /* alabaster */
  --neutral-200: #D8D5D2;
  --neutral-300: #BFBAB4;
  --neutral-400: #A29A93;  /* grey olive */
  --neutral-500: #847C75;
  --neutral-600: #645D57;
  --neutral-700: #46413C;
  --neutral-800: #262422;
  --neutral-900: #121110;
  --neutral-950: #060706;  /* deep black */

  /* ============================================================
     SEMANTIC ALIASES — use these in components
     ============================================================ */

  /* Surfaces */
  --surface-page: var(--wosol-white);
  --surface-raised: var(--neutral-50);
  --surface-sunken: var(--neutral-100);
  --surface-card: var(--wosol-white);
  --surface-inverse: var(--wosol-deep-black);   /* dark canvas */
  --surface-brand: var(--wosol-pine-teal);      /* green canvas */
  --surface-brand-deep: var(--pine-900);

  /* Text */
  --text-strong: var(--wosol-deep-black);
  --text-body: var(--neutral-800);
  --text-muted: var(--neutral-500);
  --text-faint: var(--neutral-400);
  --text-on-dark: var(--wosol-white);
  --text-on-dark-muted: rgba(255, 255, 255, 0.66);
  --text-on-brand: var(--wosol-white);
  --text-accent: var(--wosol-burgundy);
  --text-brand: var(--wosol-pine-teal);

  /* Borders / lines */
  --border-subtle: var(--neutral-200);
  --border-default: var(--neutral-300);
  --border-strong: var(--neutral-800);
  --border-on-dark: rgba(255, 255, 255, 0.16);
  --border-brand: var(--wosol-pine-teal);

  /* Interactive */
  --accent: var(--wosol-burgundy);
  --accent-hover: var(--burgundy-500);
  --brand: var(--wosol-pine-teal);
  --brand-hover: var(--pine-600);
  --brand-active: var(--pine-800);

  /* Focus ring */
  --focus-ring: var(--pine-500);

  /* Status (kept on-brand: green = positive, burgundy = danger) */
  --status-success: var(--pine-600);
  --status-success-surface: var(--pine-100);
  --status-danger: var(--wosol-burgundy);
  --status-danger-surface: var(--burgundy-100);
  --status-warning: #9A6B12;
  --status-warning-surface: #F6ECD7;
  --status-info: var(--neutral-700);
  --status-info-surface: var(--neutral-100);
}
