/* FALCO marketing site — design tokens.
   Source: DESIGN.md, with two corrections verified against
   apps/customer_app/lib/core/theme.dart (see plan v2 §1):
     - hint text is #767676, not DESIGN.md's #AAAAAA (WCAG AA floor on #F7F7F7)
     - ops-app gold drift (#CDA94B) is ignored; #C9A84C is canonical */

@font-face {
  font-family: 'Cairo';
  src: url('/fonts/Cairo-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Cairo';
  src: url('/fonts/Cairo-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/IBMPlexSansArabic-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/IBMPlexSansArabic-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Brand gold */
  --gold: #C9A84C;
  --gold-light: #F0C040;
  --gold-dark: #9A7A30;
  --gold-pearl: #F5E0A0;
  --gold-burnish: #8A6A22;

  /* Light surfaces (default) */
  --bg: #F7F7F7;
  --surface: #FFFFFF;
  --surface-variant: #F0F0F0;
  --border: #E0E0E0;
  --divider: #EEEEEE;
  --cream: #F5F0E6;
  --cream-light: #FBF8F1;

  /* Text — light */
  --text-primary: #1A1A1A;
  --text-secondary: #6B6B6B;
  --text-hint: #767676; /* corrected floor, not DESIGN.md's #AAAAAA — 4.5:1 on white */

  /* Semantic */
  --success: #27AE60;
  --error: #E74C3C;
  --warning: #F39C12;
  --info: #1B6EA0;

  /* Type scale */
  --font-display: 'Cairo', sans-serif;
  --font-body: 'IBM Plex Sans Arabic', sans-serif;

  --fs-display: 28px;   --lh-display: 1.2;  --ls-display: -0.5px; --fw-display: 700;
  --fs-h-lg: 22px;      --lh-h-lg: 1.3;                            --fw-h-lg: 700;
  --fs-h-md: 18px;      --lh-h-md: 1.3;                            --fw-h-md: 600;
  --fs-title: 16px;     --lh-title: 1.4;                           --fw-title: 600;
  --fs-body-lg: 15px;   --lh-body-lg: 1.6;                         --fw-body-lg: 400;
  --fs-body: 13px;      --lh-body: 1.6;                            --fw-body: 400;
  --fs-label: 12px;     --lh-label: 1.4;   --ls-label: 0.3px;      --fw-label: 600;

  /* Radius */
  --radius-button: 14px;
  --radius-input: 14px;
  --radius-card: 16px;
  --radius-chip: 20px;
  --radius-pill: 26px;

  /* Spacing */
  --sp-xs: 8px;
  --sp-sm: 12px;
  --sp-md: 16px;
  --sp-lg: 24px;
  --sp-xl: 28px;
  --sp-2xl: 40px;

  /* Shadows */
  --shadow-ambient-sm: 0 2px 6px rgba(0,0,0,0.06);
  --shadow-card: 0 4px 12px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.04);
  --shadow-lifted: 0 8px 24px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.06);
  --shadow-glass-pill: 0 0 32px rgba(0,0,0,0.09), 0 4px 8px rgba(0,0,0,0.05);

  /* Glass header (the site's one permitted glass surface) */
  --glass-tint: rgba(255,255,255,0.55);
  --glass-border: rgba(255,255,255,0.40);
  --glass-blur: 12px;

  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0D0D0D;
    --surface: #1A1A1A;
    --surface-variant: #2C2C2C;
    --border: #2E2E2E;
    --divider: #2E2E2E;

    --text-primary: #FFFFFF;
    --text-secondary: #AAAAAA;
    --text-hint: #888888;

    --glass-tint: rgba(26,26,26,0.45);
    --glass-border: rgba(255,255,255,0.18);

    color-scheme: dark;
  }
}

:root[data-theme="dark"] {
  --bg: #0D0D0D;
  --surface: #1A1A1A;
  --surface-variant: #2C2C2C;
  --border: #2E2E2E;
  --divider: #2E2E2E;

  --text-primary: #FFFFFF;
  --text-secondary: #AAAAAA;
  --text-hint: #888888;

  --glass-tint: rgba(26,26,26,0.45);
  --glass-border: rgba(255,255,255,0.18);

  color-scheme: dark;
}