/* ============================================================
   MedAcademy — Design tokens
   Medical teal + health green (healthcare, trustworthy)
   ============================================================ */
:root {
  /* brand */
  --primary:        #0891B2;
  --primary-600:    #0E7490;
  --primary-700:    #155E75;
  --primary-050:    #ECFEFF;
  --primary-100:    #CFFAFE;
  --accent:         #16A34A;
  --accent-600:     #15803D;
  --accent-050:     #F0FDF4;
  --gold:           #D97706;

  /* surfaces */
  --bg:             #F0FDFA;
  --bg-alt:         #F7FEFD;
  --surface:        #FFFFFF;
  --surface-2:      #F7FEFD;
  --fg:             #134E4A;
  --fg-2:           #3D6B67;
  --fg-3:           #6E9490;
  --muted:          #E8F1F6;
  --border:         #CCFBF1;
  --border-2:       #E3F3F1;
  --ink:            #062E2B;

  /* semantic */
  --danger:         #DC2626;
  --danger-050:     #FEF2F2;
  --warn:           #D97706;
  --warn-050:       #FFFBEB;
  --ok:             #16A34A;

  /* specialties */
  --med:            #0891B2;
  --med-050:        #ECFEFF;
  --pharm:          #16A34A;
  --pharm-050:      #F0FDF4;
  --dent:           #7C3AED;
  --dent-050:       #F5F3FF;

  /* radii */
  --r-xs: 8px;
  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;

  /* elevation */
  --sh-1: 0 1px 2px rgba(6, 46, 43, .05), 0 4px 14px rgba(6, 46, 43, .05);
  --sh-2: 0 10px 30px rgba(6, 46, 43, .09);
  --sh-3: 0 24px 60px rgba(6, 46, 43, .16);
  --sh-btn: 0 6px 16px rgba(8, 145, 178, .28);

  /* typography */
  --f-head: 'Tajawal', 'IBM Plex Sans Arabic', system-ui, 'Segoe UI', sans-serif;
  --f-body: 'IBM Plex Sans Arabic', 'Tajawal', system-ui, 'Segoe UI', sans-serif;
  --f-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* rhythm */
  --sp-1: .25rem;  --sp-2: .5rem;   --sp-3: .75rem;
  --sp-4: 1rem;    --sp-5: 1.5rem;  --sp-6: 2rem;
  --sp-7: 3rem;    --sp-8: 4.5rem;
  --maxw: 1240px;
  --t-fast: 150ms ease;
  --t-med: 260ms cubic-bezier(.4, 0, .2, 1);
}