/* =====================================================
   STARLINK VMS — Design Tokens
   ===================================================== */

:root {
  /* Brand Colours */
  --color-primary:     #2E86C1;
  --color-primary-dark:#1A5276;
  --color-primary-light:#EAF4FB;
  --color-orange:      #E8722A;
  --color-navy:        #0A2A4A;
  --color-navy-mid:    #1A3A5C;

  /* Status Colours */
  --color-success:     #27AE60;
  --color-success-dark:#1E8449;
  --color-warning:     #F39C12;
  --color-warning-dark:#784212;
  --color-error:       #E74C3C;
  --color-error-dark:  #C0392B;
  --color-info:        #2E86C1;

  /* Neutral Palette */
  --color-white:       #FFFFFF;
  --color-bg:          #F5F7FA;
  --color-bg-alt:      #F4F6F7;
  --color-border:      #D5D8DC;
  --color-border-light:#E8EAED;
  --color-text:        #1A1A2E;
  --color-text-secondary: #5D6D7E;
  --color-text-muted:  #95A5A6;
  --color-placeholder: #BDC3C7;

  /* Visitor Type Badges */
  --badge-general-bg:     #EBF5FB;
  --badge-general-text:   #2E86C1;
  --badge-contractor-bg:  #FEF5EC;
  --badge-contractor-text:#E8722A;
  --badge-delivery-bg:    #F5EEF8;
  --badge-delivery-text:  #8E44AD;
  --badge-vip-bg:         #FEF9E7;
  --badge-vip-text:       #B7950B;

  /* Status Pills */
  --status-onsite-bg:    #EAFAF1;
  --status-onsite-text:  #1E8449;
  --status-signout-bg:   #F2F3F4;
  --status-signout-text: #7F8C8D;
  --status-overstay-bg:  #FEF5E7;
  --status-overstay-text:#784212;

  /* Typography */
  --font-family:       'Inter', system-ui, -apple-system, sans-serif;
  --font-size-xs:      12px;
  --font-size-sm:      14px;
  --font-size-base:    16px;
  --font-size-md:      18px;
  --font-size-lg:      20px;
  --font-size-xl:      24px;
  --font-size-2xl:     28px;
  --font-size-3xl:     32px;
  --font-size-4xl:     40px;

  /* Border Radius */
  --radius-sm:         4px;
  --radius-md:         6px;
  --radius-lg:         8px;
  --radius-xl:         12px;
  --radius-2xl:        16px;
  --radius-pill:       999px;

  /* Shadows */
  --shadow-card:       0 2px 8px rgba(0,0,0,0.08);
  --shadow-card-hover: 0 4px 16px rgba(0,0,0,0.12);
  --shadow-modal:      0 8px 32px rgba(0,0,0,0.16);
  --shadow-dropdown:   0 4px 12px rgba(0,0,0,0.12);

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

  /* Sidebar */
  --sidebar-width:     240px;
  --sidebar-collapsed: 64px;
  --app-bar-height:    64px;

  /* Transitions */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   350ms ease;
}