/* ═══════════════════════════════════════════════
   DiagnosKit — Design System Variables
   ═══════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;600;700;800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,300&display=swap');

:root {
  /* ── Brand Colors ── */
  --blue:        #3AABDB;
  --blue-dark:   #1E7FA8;
  --blue-deep:   #0D5070;
  --blue-light:  #EAF6FD;
  --blue-mid:    #C2E8F6;

  --green:       #7DC242;
  --green-dark:  #5A9430;
  --green-light: #EDF7E3;

  --gray-900:    #1A2332;
  --gray-700:    #3D4F63;
  --gray-500:    #6B7C92;
  --gray-300:    #BDC8D4;
  --gray-100:    #F2F6FA;
  --white:       #FFFFFF;

  /* ── Status Colors ── */
  --status-pending:   #F59E0B;
  --status-confirmed: #3AABDB;
  --status-ready:     #7DC242;
  --status-done:      #94A3B8;
  --status-error:     #EF4444;

  /* ── Typography ── */
  --font-display: 'Syne', sans-serif;
  --font-body:    'DM Sans', sans-serif;

  /* ── Spacing ── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ── Border Radius ── */
  --radius-sm:   6px;
  --radius-md:   12px;
  --radius-lg:   20px;
  --radius-xl:   32px;
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-sm:  0 1px 3px rgba(26,35,50,0.08), 0 1px 2px rgba(26,35,50,0.04);
  --shadow-md:  0 4px 16px rgba(26,35,50,0.10), 0 2px 6px rgba(26,35,50,0.06);
  --shadow-lg:  0 12px 40px rgba(26,35,50,0.14), 0 4px 12px rgba(26,35,50,0.08);
  --shadow-xl:  0 24px 64px rgba(26,35,50,0.18), 0 8px 20px rgba(26,35,50,0.10);
  --shadow-blue: 0 8px 32px rgba(58,171,219,0.28);
  --shadow-green: 0 8px 24px rgba(125,194,66,0.28);

  /* ── Transitions ── */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:    cubic-bezier(0.7, 0, 0.84, 0);
  --ease-inout: cubic-bezier(0.45, 0, 0.55, 1);
  --duration-fast:   150ms;
  --duration-normal: 280ms;
  --duration-slow:   500ms;

  /* ── Layout ── */
  --container-max: 1280px;
  --header-h:      72px;
}