/* ============================================================
 * AYA Theme — Centralized Design Token System
 * ============================================================
 *
 * All shared design tokens for the AreYouAlive application.
 * Tokens respond to Bootstrap's data-bs-theme attribute so they
 * auto-switch when the user toggles light/dark mode.
 *
 * Usage: Reference tokens as var(--aya-<token-name>).
 *
 * Light mode: warm whites, subtle borders, amber accents
 * Dark mode:  dark navy, subtle borders, amber accents
 *             (matches the landing page prototype)
 * ============================================================ */

/* ---- Shared tokens (same in both modes) ---- */

:root {
  /* Accent Colors */
  --aya-accent-primary: #F59E0B;
  --aya-accent-primary-hover: #FBBF24;
  --aya-accent-primary-rgb: 245, 158, 11;
  --aya-accent-success: #34D399;
  --aya-accent-success-rgb: 52, 211, 153;
  --aya-accent-danger: #991B1B;
  --aya-accent-danger-rgb: 153, 27, 27;
  --aya-accent-warning: #FBBF24;
  --aya-accent-warning-rgb: 251, 191, 36;
  --aya-accent-info: #60A5FA;
  --aya-accent-info-rgb: 96, 165, 250;

  /* Typography */
  --aya-font-heading: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --aya-font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --aya-font-mono: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;

  /* Border Radius */
  --aya-radius-sm: 4px;
  --aya-radius-md: 8px;
  --aya-radius-lg: 12px;
  --aya-radius-xl: 16px;
  --aya-radius-full: 9999px;

  /* Transitions */
  --aya-transition-fast: 150ms ease;
  --aya-transition-default: 300ms ease;
  --aya-transition-slow: 500ms ease;
}

/* ---- Light Mode ---- */

[data-bs-theme="light"] {
  /* Backgrounds */
  --aya-bg-primary: #FAFAF9;
  --aya-bg-primary-rgb: 250, 250, 249;
  --aya-bg-secondary: #F3F3F1;
  --aya-bg-secondary-rgb: 243, 243, 241;
  --aya-bg-surface: #FFFFFF;
  --aya-bg-surface-rgb: 255, 255, 255;
  --aya-bg-surface-hover: #F7F7F5;

  /* Borders */
  --aya-border-default: #E2E2DF;
  --aya-border-hover: #CBCBC8;
  --aya-border-accent: #F59E0B;

  /* Text */
  --aya-text-primary: #1A1A1C;
  --aya-text-primary-rgb: 26, 26, 28;
  --aya-text-secondary: #6B6B73;
  --aya-text-tertiary: #9B9BA3;
  --aya-text-on-accent: #111113;

  /* Accent (slightly darker amber for contrast on light backgrounds) */
  --aya-accent-primary: #D97706;
  --aya-accent-primary-hover: #B45309;
  --aya-accent-primary-rgb: 217, 119, 6;
  --aya-accent-glow: rgba(217, 119, 6, 0.10);

  /* Shadows */
  --aya-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --aya-shadow-elevated: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* ---- Dark Mode (matches landing page prototype) ---- */

[data-bs-theme="dark"] {
  /* Backgrounds */
  --aya-bg-primary: #111113;
  --aya-bg-primary-rgb: 17, 17, 19;
  --aya-bg-secondary: #161618;
  --aya-bg-secondary-rgb: 22, 22, 24;
  --aya-bg-surface: #1D1916;
  --aya-bg-surface-rgb: 29, 25, 22;
  --aya-bg-surface-hover: #262017;

  /* Borders */
  --aya-border-default: #332C21;
  --aya-border-hover: #3A3A3E;
  --aya-border-accent: #F59E0B;

  /* Text */
  --aya-text-primary: #ECECEC;
  --aya-text-primary-rgb: 236, 236, 236;
  --aya-text-secondary: #909096;
  --aya-text-tertiary: #5C5C63;
  --aya-text-on-accent: #111113;

  /* Accent (brighter amber for contrast on dark backgrounds) */
  --aya-accent-primary: #F59E0B;
  --aya-accent-primary-hover: #FBBF24;
  --aya-accent-primary-rgb: 245, 158, 11;
  --aya-accent-glow: rgba(245, 158, 11, 0.12);

  /* Shadows */
  --aya-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.4);
  --aya-shadow-elevated: 0 4px 12px rgba(0, 0, 0, 0.5);
}
