/* Aniyab UI design tokens — Style Guide (Colors / Shadows / Typography) */

:root {
  /* ── Brand / Primary ── */
  --ay-brand-primary-dark: #022251;
  --ay-brand-primary: #002D71;
  --ay-brand-primary-light: #0545A6;
  --ay-brand-primary-lighter: #3974CD;
  --ay-brand-primary-pale: #B9D3F9;
  --ay-brand-primary-paler: #EBF1FB;

  /* ── Brand / Secondary ── */
  --ay-brand-secondary-dark: #ED5904;
  --ay-brand-secondary: #FF6F1C;
  --ay-brand-secondary-light: #FF843C;
  --ay-brand-secondary-lighter: #F8A16F;
  --ay-brand-secondary-pale: #FFD7C0;
  --ay-brand-secondary-paler: #FFF3EB;

  /* ── Main neutrals ── */
  --ay-neutral: #E7E7DF;

  /* ── Assistive ── */
  --ay-success: #129A44;
  --ay-success-pale: #F0FEF5;
  --ay-success-dark: #0C6602;
  --ay-error: #D92412;
  --ay-error-pale: #FFEEED;
  --ay-error-dark: #A21303;
  --ay-warning: #D19C02;
  --ay-warning-pale: #FFF8E8;
  --ay-warning-dark: #856504;
  --ay-info-border: var(--ay-brand-primary-lighter);

  /* ── Text ── */
  --ay-text-title: #302E2E;
  --ay-text-main: #404040;
  --ay-text-secondary: #737373;
  --ay-text-tertiary: #A3A3A3;
  --ay-text-disable: #BBBAB9;
  --ay-text-contrast: #FFFFFF;

  /* ── Surfaces / Background ── */
  --ay-surface-white: #FFFFFF;
  --ay-surface-light: #FEFEFE;
  --ay-surface-disabled: #F4F4F5;
  --ay-bg-darker: #E7E5E4;
  --ay-bg-dark: #F4F4F5;
  --ay-bg-light: #FAFAFA;
  --ay-bg-lighter: #FEFEFE;
  --ay-bg-white: #FFFFFF;
  --ay-scrim: rgba(48, 46, 46, 0.3);

  /* ── Border ── */
  --ay-border-light: #E7E5E4;
  --ay-border-dark: #D6D3D1;
  --ay-border-disabled: #D6D3D1;
  --ay-border-active: var(--ay-brand-primary-lighter);

  /* ── Elevation (Shadows) ── */
  --ay-elevation-sm: 0px 1px 8px rgba(163, 163, 163, 0.25);
  --ay-elevation-md: 0px 4px 12px rgba(163, 163, 163, 0.25);
  --ay-elevation-lg: 0px 4px 24px rgba(163, 163, 163, 0.25);
  --ay-elevation-active: 0px -4px 24px rgba(97, 155, 254, 0.22), 0px 4px 12px rgba(97, 155, 254, 0.12);
  --ay-elevation-1: 0px 1px 1px rgba(16, 24, 64, 0.14), 0px 1px 3px rgba(16, 24, 64, 0.12);

  /* ── Switch / focus halo ── */
  --ay-accent-blue: #2D7AFE;
  --ay-switch-halo-hover: rgba(45, 122, 254, 0.04);
  --ay-switch-halo-focus: rgba(45, 122, 254, 0.3);

  /* ── Radius ── */
  --ay-radius-btn: 8px;
  --ay-radius-check: 4px;
  --ay-radius-table: 12px;
  --ay-radius-badge: 12px;
  --ay-radius-card: 16px;

  /* ── Logo sizes ── */
  --ay-logo-lg: 180px;
  --ay-logo-md: 80px;
  --ay-logo-sm: 32px;

  /* ── Font family (Dana / DanaFaNum) ── */
  --ay-font-family: dana, DanaFaNum, IRANSansfanum, Tahoma, sans-serif;

  /* Display 2XL — 48/60 · 600 */
  --ay-type-display-2xl-size: 48px;
  --ay-type-display-2xl-line: 60px;
  --ay-type-display-2xl-weight: 600;

  /* Display XL — 36/48 · 600 */
  --ay-type-display-xl-size: 36px;
  --ay-type-display-xl-line: 48px;
  --ay-type-display-xl-weight: 600;

  /* Display LG — 28/44 · 600 */
  --ay-type-display-lg-size: 28px;
  --ay-type-display-lg-line: 44px;
  --ay-type-display-lg-weight: 600;

  /* Display Md — 24/40 · 500 */
  --ay-type-display-md-size: 24px;
  --ay-type-display-md-line: 40px;
  --ay-type-display-md-weight: 500;

  /* Display Sm — 20/36 · 600 */
  --ay-type-display-sm-size: 20px;
  --ay-type-display-sm-line: 36px;
  --ay-type-display-sm-weight: 600;

  /* Text XL — 16/28 · 500 / 700 */
  --ay-type-text-xl-size: 16px;
  --ay-type-text-xl-line: 28px;
  --ay-type-text-xl-weight: 500;
  --ay-type-text-xl-bold-weight: 700;

  /* Text LG — 14/28 · 500 / 700 */
  --ay-type-text-lg-size: 14px;
  --ay-type-text-lg-line: 28px;
  --ay-type-text-lg-weight: 500;
  --ay-type-text-lg-bold-weight: 700;

  /* Text Md — 12/24 · 500 / 700 */
  --ay-type-text-md-size: 12px;
  --ay-type-text-md-line: 24px;
  --ay-type-text-md-weight: 500;
  --ay-type-text-md-bold-weight: 700;

  /* Text Sm — 11/20 · 500 / 700 */
  --ay-type-text-sm-size: 11px;
  --ay-type-text-sm-line: 20px;
  --ay-type-text-sm-weight: 500;
  --ay-type-text-sm-bold-weight: 700;
}