/* GridStrat Clarity design tokens.
 *
 * Single source of truth for color, type, spacing, radius and shadow.
 * Components (app.css) and Bootstrap bridges read ONLY from these
 * variables, so a rebrand is a change to this file.
 *
 * Palette follows the GridStrat brand guide (v1): deep navy foundation,
 * signal cyan for calls to action and highlights, strategic/operational
 * teal for trust and methodology, mist-gray executive surfaces, slate
 * text, and a restrained proof green reserved for evidence of gains.
 *
 * Contrast notes: signal cyan (#00B8D9) reads well as a filled button
 * with navy text, but fails contrast as text on white, so links and
 * outline buttons use operational teal (#0F766E) instead.
 */
:root {
  /* Brand — navy foundation */
  --gs-brand-900: #07111F;   /* intelligence navy: navbar, hero, headings */
  --gs-brand-700: #0B1628;   /* deep slate blue: dark panels, hover/active */
  --gs-brand-500: #0F766E;   /* operational teal: links, outline buttons, active states */
  --gs-brand-300: #5EEAD4;   /* light teal: accents on dark surfaces */
  --gs-brand-100: #D9F3EF;   /* teal tint: selected rows, soft highlights */

  /* Accent — signal cyan */
  --gs-accent-500: #00B8D9;  /* primary CTA fill, key highlights */
  --gs-accent-700: #0A9DBA;  /* CTA hover */
  --gs-accent-300: #2DD4FF;  /* electric blue: data highlights, diagrams */
  --gs-accent-100: #E0F6FB;  /* cyan tint: today marker, info surfaces */

  /* Teal — strategic layer (charts, methodology, governed facts) */
  --gs-teal-500: #14B8A6;
  --gs-teal-700: #0F766E;

  /* Proof green — evidence of gains only (lift arrows, passed checks) */
  --gs-proof-500: #84CC16;
  --gs-proof-300: #A3E635;

  /* Neutrals — slate text, mist surfaces */
  --gs-neutral-900: #1E293B;  /* headings on light */
  --gs-neutral-700: #334155;  /* body text */
  --gs-neutral-500: #64748B;  /* secondary text, metadata */
  --gs-neutral-300: #CBD5E1;  /* borders, dividers */
  --gs-neutral-200: #E2E8F0;  /* light borders, table lines */
  --gs-neutral-100: #EEF4F7;  /* ice gray: alternating sections, table heads */
  --gs-neutral-50:  #F7FAFC;  /* mist white: page background */
  --gs-neutral-0:   #FFFFFF;  /* cards */

  /* Semantic status (kept distinct from the brand accents) */
  --gs-success: #1C8F4E;
  --gs-warning: #C47F00;
  --gs-danger:  #C0392B;
  --gs-info:    #0A9DBA;

  /* Content-type palette (calendar dots, legend, type column) */
  --gs-type-thought-leadership: #0F766E;
  --gs-type-educational: #00B8D9;
  --gs-type-news-events: #E0565B;
  --gs-type-product-service-info: #7C5CBF;
  --gs-type-conference: #84CC16;
  --gs-type-holiday: #D97706;
  --gs-type-reminder: #E6B400;
  --gs-type-other: #64748B;

  /* Typography — Inter with a system fallback (see base.html) */
  --gs-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --gs-text-xs: 0.75rem;
  --gs-text-sm: 0.875rem;
  --gs-text-md: 1rem;
  --gs-text-lg: 1.125rem;
  --gs-text-xl: 1.5rem;
  --gs-text-2xl: 2rem;

  /* Spacing (4px base) */
  --gs-space-1: 0.25rem;
  --gs-space-2: 0.5rem;
  --gs-space-3: 0.75rem;
  --gs-space-4: 1rem;
  --gs-space-5: 1.5rem;
  --gs-space-6: 2rem;
  --gs-space-8: 3rem;

  /* Shape + depth */
  --gs-radius-sm: 0.375rem;
  --gs-radius-md: 0.5rem;
  --gs-radius-lg: 0.75rem;
  --gs-shadow-sm: 0 1px 2px rgba(7, 17, 31, 0.06);
  --gs-shadow-md: 0 4px 12px rgba(7, 17, 31, 0.08);

  /* Layout */
  --gs-navbar-height: 3.5rem;

  /* Bootstrap bridges — keep Bootstrap utilities on-brand */
  --bs-primary: var(--gs-brand-500);
  --bs-primary-rgb: 15, 118, 110;
  --bs-info: var(--gs-info);
  --bs-info-rgb: 10, 157, 186;
  --bs-link-color: var(--gs-brand-500);
  --bs-link-color-rgb: 15, 118, 110;
  --bs-link-hover-color: var(--gs-brand-700);
  --bs-link-hover-color-rgb: 11, 22, 40;
  --bs-body-font-family: var(--gs-font-sans);
  --bs-body-color: var(--gs-neutral-700);
  --bs-heading-color: var(--gs-neutral-900);
  --bs-secondary-color: var(--gs-neutral-500);
  --bs-border-color: var(--gs-neutral-200);
  --bs-border-radius: var(--gs-radius-md);
  --bs-border-radius-sm: var(--gs-radius-sm);
  --bs-border-radius-lg: var(--gs-radius-lg);
}