/*
  AyaBookings design tokens, v1
  Load before page CSS on every surface.
*/

@font-face {
  font-family: 'Glacial Indifference';
  src: url('../front/fonts/GlacialIndifference-Bold.woff2') format('woff2'),
       url('../front/css/fonts/GlacialIndifference-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --aya-brand-900: #004040;
  --aya-brand-800: #003333;
  --aya-brand-700: #006666;
  --aya-brand-600: #008080;
  --aya-brand-300: #9FD6D6;
  --aya-brand-100: #E6F2F2;
  --aya-brand-50: #F3FAF9;

  --aya-cta: #FF6F00;
  --aya-cta-hover: #E35F00;
  --aya-star: #FFD700;

  --aya-ink: #0F2A2A;
  --aya-slate: #2D343E;
  --aya-body: #43484B;
  --aya-muted: #6A747B;
  --aya-subtle: #8C98A2;
  --aya-border-strong: #DCE4E8;
  --aya-border: #E8EEF1;
  --aya-divider: #F1F4F6;
  --aya-canvas: #F6F9FC;
  --aya-surface: #FFFFFF;
  --aya-footer: #1F2122;

  --aya-success: #14713D;
  --aya-success-bg: #E7F5EE;
  --aya-warning: #9A5B00;
  --aya-warning-bg: #FFF4E5;
  --aya-danger: #B42318;
  --aya-danger-bg: #FDECEA;
  --aya-info: #005F5F;
  --aya-info-bg: #E6F2F2;
  --aya-neutral: #4B555E;
  --aya-neutral-bg: #F0F3F5;
  --aya-ussd: #5B3B97;
  --aya-ussd-bg: #EFE9F8;

  --aya-font-display: 'Glacial Indifference', system-ui, sans-serif;
  --aya-font-app: 'Inter', system-ui, sans-serif;
  --aya-font-marketing-body: system-ui, -apple-system, 'Segoe UI', sans-serif;

  --aya-text-display: 60px;
  --aya-text-h1-marketing: 44px;
  --aya-text-h1-app: 28px;
  --aya-text-kpi: 30px;
  --aya-text-h2-app: 15px;
  --aya-text-body-app: 14px;
  --aya-text-body-marketing: 16px;
  --aya-text-label: 13px;
  --aya-text-caption: 12px;

  --aya-space-1: 4px;
  --aya-space-2: 8px;
  --aya-space-3: 12px;
  --aya-space-4: 16px;
  --aya-space-5: 20px;
  --aya-space-6: 24px;
  --aya-space-8: 32px;
  --aya-space-12: 48px;
  --aya-space-24: 96px;

  --aya-radius-xs: 6px;
  --aya-radius-sm: 8px;
  --aya-radius-md: 10px;
  --aya-radius-lg: 12px;
  --aya-radius-xl: 16px;
  --aya-radius-2xl: 20px;
  --aya-radius-pill: 999px;

  --aya-shadow-card: 0 1px 2px rgba(16, 40, 40, 0.04);
  --aya-shadow-raised: 0 12px 30px rgba(16, 40, 40, 0.12);
  --aya-shadow-panel: -20px 0 50px rgba(0, 0, 0, 0.12);
  --aya-shadow-feature: 0 24px 60px rgba(0, 64, 64, 0.10);

  --aya-focus-ring: 0 0 0 3px #FFFFFF, 0 0 0 5px var(--aya-brand-600);
  --aya-focus-ring-inset: 0 0 0 3px color-mix(in srgb, var(--aya-brand-600) 25%, transparent);
}

.biz-theme {
  --biz-accent: var(--aya-brand-600);
  --biz-font: 'Outfit', system-ui, sans-serif;
  --biz-tint: color-mix(in srgb, var(--biz-accent) 8%, #FFFFFF);
  font-family: var(--biz-font);
}

/* Dark mode: marketing uses body.dark-mode; admin uses the same class when site_mode is dark */
body.dark-mode {
  --aya-brand-900: #003333;
  --aya-brand-800: #002929;
  --aya-brand-700: #008080;
  --aya-brand-600: #00a3a3;
  --aya-brand-300: #6FA8A8;
  --aya-brand-100: #1a3d3d;
  --aya-brand-50: #142f2f;

  --aya-cta: #FF6F00;
  --aya-cta-hover: #E35F00;
  --aya-star: #FFD700;

  --aya-ink: #e8ecef;
  --aya-slate: #d1d7db;
  --aya-body: #c2c7d0;
  --aya-muted: #9aa3ab;
  --aya-subtle: #7d8790;
  --aya-border-strong: #3d4449;
  --aya-border: #343a40;
  --aya-divider: #2f353a;
  --aya-canvas: #212529;
  --aya-surface: #2b3035;
  --aya-footer: #1a1d1f;

  --aya-success: #3dd68c;
  --aya-success-bg: #1a3328;
  --aya-warning: #f5c451;
  --aya-warning-bg: #3d3018;
  --aya-danger: #f97066;
  --aya-danger-bg: #3d1f1c;
  --aya-info: #5ecbcb;
  --aya-info-bg: #1a3333;
  --aya-neutral: #b8c0c8;
  --aya-neutral-bg: #343a40;
  --aya-ussd: #b794f6;
  --aya-ussd-bg: #2d2438;

  --aya-shadow-card: 0 1px 2px rgba(0, 0, 0, 0.2);
  --aya-shadow-raised: 0 12px 30px rgba(0, 0, 0, 0.35);
  --aya-shadow-panel: -20px 0 50px rgba(0, 0, 0, 0.45);
  --aya-shadow-feature: 0 24px 60px rgba(0, 0, 0, 0.25);

  --aya-focus-ring: 0 0 0 3px var(--aya-surface), 0 0 0 5px var(--aya-brand-600);
}