/* ============================================================
   ECP Spartans — Design Tokens
   Brand palette and shared variables for the entire prototype.
   ============================================================ */

:root {
  /* Brand colours */
  --navy:          #00205B;
  --red:           #E4002B;
  --sky:           #0098DA;
  --white:         #FFFFFF;
  --background:    #F5F7FA;
  --dark:          #081426;

  /* Extended palette */
  --text:          #16263E;
  --muted:         #626E80;
  --border:        #E3E8EF;
  --navy-soft:     #ECF1FA;
  --sky-soft:      #E8F5FC;
  --red-soft:      #FFF0F3;
  --success:       #176749;
  --success-soft:  #EAF6EF;
  --warning:       #865600;
  --warning-soft:  #FFF6DF;

  /* Typography */
  --font:         "Segoe UI", -apple-system, BlinkMacSystemFont, Arial, sans-serif;
  --font-display: "Arial Black", "Segoe UI", sans-serif;
  --font-mono:    "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --text-xs:   .6875rem;   /* 11px */
  --text-sm:   .8125rem;   /* 13px */
  --text-base: .9375rem;   /* 15px */
  --text-lg:   1.125rem;   /* 18px */

  /* 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;

  /* Radii */
  --radius-sm:   6px;
  --radius:      12px;
  --radius-lg:   18px;
  --radius-xl:   24px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-sm:     0 2px 8px #08142605;
  --shadow:        0 12px 36px #0814260D;
  --shadow-dialog: 0 24px 80px #08142633;

  /* Layout */
  --sidebar-width:      248px;
  --header-height:      80px;
  --mobile-nav-height:  76px;

  /* Motion */
  --ease:       cubic-bezier(.2, .7, .2, 1);
  --transition: 180ms var(--ease);

  color-scheme: light;
}

/* Breakpoints used across the prototype:
   480px  — small phones
   768px  — tablets / layout switch
   1100px — desktop sidebar
   1440px — wide desktop                  */