/*
 * The Digital Reef Charitable Trust — Brand Design Tokens
 * Colour palette by Nourished Studio — Branding Proposal V.2
 *
 * Usage: Import this file into any project:
 *   @import url('path/to/dr-branding/styles/variables.css');
 */

:root {
  /* ─── Primary Colours ─── */
  --dr-pine-needle-green: #3E4843;
  --dr-forest-fern: #566D49;
  --dr-sage: #8AA382;
  --dr-olive: #D0D9A3;
  --dr-deep-blue: #3A708E;
  --dr-coastal: #89B1CC;

  /* ─── Secondary Colours ─── */
  --dr-golden: #F2E280;
  --dr-dusty-yellow: #F7E9A7;
  --dr-wild-plum: #4E3A4C;
  --dr-mist: #C1D7E9;
  --dr-canyon-clay: #C95235;
  --dr-ivory: #F3E9DE;

  /* ─── Semantic Aliases ─── */
  --dr-text-primary: var(--dr-pine-needle-green);
  --dr-text-secondary: var(--dr-forest-fern);
  --dr-text-muted: var(--dr-sage);
  --dr-text-on-dark: var(--dr-ivory);
  --dr-bg-page: var(--dr-ivory);
  --dr-bg-card: #FFFFFF;
  --dr-bg-accent: var(--dr-olive);
  --dr-bg-dark: var(--dr-pine-needle-green);
  --dr-bg-deep: var(--dr-wild-plum);
  --dr-link: var(--dr-deep-blue);
  --dr-link-hover: var(--dr-forest-fern);
  --dr-action-primary: var(--dr-forest-fern);
  --dr-action-secondary: var(--dr-deep-blue);
  --dr-action-warm: var(--dr-canyon-clay);
  --dr-success: var(--dr-forest-fern);
  --dr-warning: var(--dr-golden);
  --dr-danger: var(--dr-canyon-clay);
  --dr-info: var(--dr-coastal);

  /* ─── Gradients ─── */
  --dr-gradient-forest-depth: linear-gradient(135deg, #3E4843 0%, #566D49 50%, #8AA382 100%);
  --dr-gradient-coastal-mist: linear-gradient(135deg, #3A708E 0%, #89B1CC 50%, #C1D7E9 100%);
  --dr-gradient-golden-hour: linear-gradient(135deg, #C95235 0%, #F2E280 100%);
  --dr-gradient-nz-landscape: linear-gradient(180deg, #89B1CC 0%, #8AA382 40%, #566D49 70%, #3E4843 100%);
  --dr-gradient-earth-tone: linear-gradient(135deg, #4E3A4C 0%, #3E4843 50%, #566D49 100%);

  /* ─── Typography ─── */
  --dr-font-heading: 'Outfit', 'Inter', system-ui, sans-serif;
  --dr-font-body: 'Inter', system-ui, -apple-system, sans-serif;
  --dr-font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* ─── Font Sizes ─── */
  --dr-text-xs: 0.75rem;
  --dr-text-sm: 0.875rem;
  --dr-text-base: 1rem;
  --dr-text-lg: 1.125rem;
  --dr-text-xl: 1.25rem;
  --dr-text-2xl: 1.5rem;
  --dr-text-3xl: 1.875rem;
  --dr-text-4xl: 2.25rem;
  --dr-text-5xl: 3rem;

  /* ─── Spacing ─── */
  --dr-space-1: 0.25rem;
  --dr-space-2: 0.5rem;
  --dr-space-3: 0.75rem;
  --dr-space-4: 1rem;
  --dr-space-6: 1.5rem;
  --dr-space-8: 2rem;
  --dr-space-12: 3rem;
  --dr-space-16: 4rem;

  /* ─── Border Radius ─── */
  --dr-radius-sm: 0.25rem;
  --dr-radius-md: 0.5rem;
  --dr-radius-lg: 0.75rem;
  --dr-radius-xl: 1rem;
  --dr-radius-full: 9999px;

  /* ─── Shadows (tinted with brand greens) ─── */
  --dr-shadow-sm: 0 1px 2px 0 rgba(62, 72, 67, 0.05);
  --dr-shadow-md: 0 4px 6px -1px rgba(62, 72, 67, 0.1), 0 2px 4px -2px rgba(62, 72, 67, 0.1);
  --dr-shadow-lg: 0 10px 15px -3px rgba(62, 72, 67, 0.1), 0 4px 6px -4px rgba(62, 72, 67, 0.1);
  --dr-shadow-forest-glow: 0 0 20px rgba(86, 109, 73, 0.25);
  --dr-shadow-coastal-glow: 0 0 20px rgba(58, 112, 142, 0.25);
  --dr-shadow-clay-glow: 0 0 20px rgba(201, 82, 53, 0.25);

  /* ─── Transitions ─── */
  --dr-transition-fast: 150ms ease;
  --dr-transition-normal: 300ms ease;
  --dr-transition-slow: 500ms ease;

  /* ─── Severity Tokens ─── */
  --dr-severity-info: #2563EB;
  --dr-severity-info-bg: #EFF6FF;
  --dr-severity-info-border: #93C5FD;
  --dr-severity-info-text: #1E40AF;
  --dr-severity-low: #16A34A;
  --dr-severity-low-bg: #F0FDF4;
  --dr-severity-low-border: #86EFAC;
  --dr-severity-low-text: #166534;
  --dr-severity-medium: #D97706;
  --dr-severity-medium-bg: #FFFBEB;
  --dr-severity-medium-border: #FCD34D;
  --dr-severity-medium-text: #92400E;
  --dr-severity-high: #EA580C;
  --dr-severity-high-bg: #FFF7ED;
  --dr-severity-high-border: #FDBA74;
  --dr-severity-high-text: #9A3412;
  --dr-severity-critical: #DC2626;
  --dr-severity-critical-bg: #FEF2F2;
  --dr-severity-critical-border: #FCA5A5;
  --dr-severity-critical-text: #991B1B;
  --dr-severity-emergency: #FFFFFF;
  --dr-severity-emergency-bg: #7F1D1D;
  --dr-severity-emergency-border: #991B1B;
  --dr-severity-emergency-text: #FFFFFF;

  /* ─── Status Tokens ─── */
  --dr-status-draft: #6B7280;
  --dr-status-draft-bg: #F3F4F6;
  --dr-status-pending: #8B5CF6;
  --dr-status-pending-bg: #F5F3FF;
  --dr-status-active: #2563EB;
  --dr-status-active-bg: #EFF6FF;
  --dr-status-paused: #D97706;
  --dr-status-paused-bg: #FFFBEB;
  --dr-status-complete: #16A34A;
  --dr-status-complete-bg: #F0FDF4;
  --dr-status-archived: #9CA3AF;
  --dr-status-archived-bg: #F9FAFB;
  --dr-status-cancelled: #EF4444;
  --dr-status-cancelled-bg: #FEF2F2;

  /* ─── Source Category Tokens ─── */
  --dr-source-gazette: #1E3A5F;
  --dr-source-lga: #065F46;
  --dr-source-fta: #7C3AED;
  --dr-source-council: #0369A1;
  --dr-source-media: #BE185D;
  --dr-source-community: #EA580C;

  /* ─── Domain Tokens ─── */
  --dr-domain-environment: #16A34A;
  --dr-domain-planning: #2563EB;
  --dr-domain-transport: #D97706;
  --dr-domain-health: #DC2626;
  --dr-domain-recreation: #0891B2;
  --dr-domain-infrastructure: #7C3AED;
  --dr-domain-governance: #4B5563;
  --dr-domain-finance: #CA8A04;

  /* ─── Interaction / Accessibility Tokens ─── */
  --dr-focus-ring-color: #2563EB;
  --dr-focus-ring-width: 2px;
  --dr-focus-ring-offset: 2px;
  --dr-disabled-opacity: 0.5;
  --dr-min-touch-target: 44px;
}