/**
 * Lakshya Welfare Society — Design Tokens & Variables
 * Rooted in authentic community welfare aesthetic:
 * Deep Forest Green, Warm Teal, Cream, Charcoal, and Muted Gold
 */

:root {
  /* Brand Color Palette */
  --color-primary-900: #123326;
  --color-primary-800: #1B4C3A;
  --color-primary: #205C46; /* Deep Forest Green */
  --color-primary-600: #267156;
  --color-primary-500: #2B8A78; /* Warm Teal */
  --color-primary-400: #4AA493;
  --color-primary-100: #E3F1EC;
  --color-primary-50: #F0F7F4;

  /* Accent & Warmth */
  --color-accent: #C59635; /* Muted Gold */
  --color-accent-light: #DFC078;
  --color-accent-dark: #98711E;
  --color-accent-wash: #FAF5E8;

  /* Surfaces & Backgrounds */
  --color-cream: #FAF8F1; /* Warm Cream background */
  --color-cream-muted: #F3EFE4;
  --color-surface: #FFFFFF;
  --color-surface-hover: #FDFCF9;
  --color-surface-sunken: #EFE9DB;

  /* Text & Hierarchy */
  --color-text-main: #1F2B26; /* Charcoal Slate - high contrast */
  --color-text-muted: #53635D; /* Muted slate - WCAG AA compliant */
  --color-text-inverse: #FFFFFF;
  --color-text-subtle: #798882;

  /* Borders & Dividers */
  --color-border: #E0DAD0;
  --color-border-subtle: #ECE7DE;
  --color-border-strong: #C8C0B2;

  /* Functional Status */
  --color-status-success: #1E6B3E;
  --color-status-success-bg: #EAF7EE;
  --color-status-warning: #9A5B08;
  --color-status-warning-bg: #FEF7EA;
  --color-status-error: #B92525;
  --color-status-error-bg: #FDF2F2;
  --color-status-info: #1D5E85;
  --color-status-info-bg: #EDF7FC;

  /* Typography */
  --font-heading: 'Lora', Georgia, 'Times New Roman', serif;
  --font-body: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;

  /* Font Scales */
  --text-xs: 0.75rem;     /* 12px */
  --text-sm: 0.875rem;    /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-lg: 1.125rem;    /* 18px */
  --text-xl: 1.25rem;     /* 20px */
  --text-2xl: 1.5rem;     /* 24px */
  --text-3xl: 1.875rem;   /* 30px */
  --text-4xl: 2.25rem;    /* 36px */
  --text-5xl: 3rem;       /* 48px */
  --text-6xl: 3.75rem;    /* 60px */

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

  /* Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  /* Shadows - Organic and Subdued */
  --shadow-sm: 0 1px 3px rgba(31, 43, 38, 0.06), 0 1px 2px rgba(31, 43, 38, 0.04);
  --shadow-md: 0 4px 12px rgba(31, 43, 38, 0.07), 0 2px 4px rgba(31, 43, 38, 0.04);
  --shadow-lg: 0 12px 28px rgba(31, 43, 38, 0.08), 0 4px 10px rgba(31, 43, 38, 0.04);
  --shadow-elevated: 0 20px 40px rgba(27, 76, 58, 0.12), 0 8px 16px rgba(31, 43, 38, 0.06);

  /* Layout Containers */
  --container-max: 1200px;
  --container-narrow: 840px;
  --container-wide: 1360px;
  --container-pad: 1.5rem;

  /* Animation Timings */
  --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 350ms cubic-bezier(0.16, 1, 0.3, 1);
}
