/* Self-hosted Inter (RODO: no Google Fonts runtime call). woff2 in ./fonts/. */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/inter-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/inter-latin-ext-400-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/inter-latin-500-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/inter-latin-ext-500-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/inter-latin-600-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/inter-latin-ext-600-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/inter-latin-700-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/inter-latin-ext-700-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/inter-latin-800-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/inter-latin-ext-800-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/* TrackTms - Design System Variables */
:root {
  /* Primary Colors */
  --primary: #0052FF;
  --primary-hover: #0040CC;
  --primary-light: #E6EEFF;
  --primary-dark: #003299;
  --primary-blue: #0052FF;
  
  /* Secondary Colors */
  --secondary: #64748B;
  --secondary-hover: #475569;
  --secondary-light: #F1F5F9;
  --secondary-dark: #334155;
  
  /* Status Colors */
  --success: #10B981;
  --success-hover: #059669;
  --success-light: #D1FAE5;
  --success-dark: #047857;
  
  --danger: #EF4444;
  --danger-hover: #DC2626;
  --danger-light: #FEE2E2;
  --danger-dark: #B91C1C;
  
  --warning: #F59E0B;
  --warning-hover: #D97706;
  --warning-light: #FEF3C7;
  --warning-dark: #B45309;
  
  --info: #0052FF;
  --info-light: #E6EEFF;
  
  /* Neutral Colors */
  --white: #FFFFFF;
  --gray-50: #F9FAFB;
  --gray-100: #F3F4F6;
  --gray-200: #E5E7EB;
  --gray-300: #D1D5DB;
  --gray-400: #9CA3AF;
  --gray-500: #6B7280;
  --gray-600: #4B5563;
  --gray-700: #374151;
  --gray-800: #1F2937;
  --gray-900: #111827;
  --black: #000000;
  
  /* Background Colors */
  --bg-primary: #FFFFFF;
  --bg-white: #FFFFFF;
  --bg-secondary: #F9FAFB;
  --bg-tertiary: #F3F4F6;
  --bg-gray-light: #F4F6F9;
  
  /* Text Colors */
  --text-primary: #1A1A1A;
  --text-dark: #1A1A1A;
  --text-secondary: #6B7280;
  --text-gray: #666666;
  --text-tertiary: #9CA3AF;
  --text-inverse: #FFFFFF;
  
  /* Border Colors */
  --border-primary: #E5E7EB;
  --border-secondary: #D1D5DB;
  --border-focus: #0052FF;
  
  /* Spacing Scale (4px base) */
  --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;
  
  /* Border Radius */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;
  
  /* Shadows — layered soft (premium) */
  --shadow-sm: 0 1px 2px rgba(13,20,33,.05);
  --shadow-md: 0 1px 3px rgba(13,20,33,.05), 0 8px 18px -6px rgba(13,20,33,.10);
  --shadow-lg: 0 18px 50px -12px rgba(13,20,33,.20), 0 4px 12px rgba(13,20,33,.07);
  --shadow-xl: 0 28px 70px -16px rgba(13,20,33,.26);

  /* Premium theme additions */
  --ease-out: cubic-bezier(.16,1,.3,1);
  --brand-grad: linear-gradient(135deg, #0052FF, #3b82f6);
  --brand-glow: rgba(0,82,255,.28);
  --top-bg: rgba(255,255,255,.72);
  --rail: #0b1020;
  --rail2: #171d2e;
  --rail-ink: #8a92a6;
  --rail-ink2: #eef1f8;
  
  /* Typography */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;
  
  /* Font Sizes */
  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-lg: 18px;
  --text-xl: 20px;
  --text-2xl: 24px;
  --text-3xl: 30px;
  --text-4xl: 36px;
  
  /* Font Weights */
  --font-normal: 400;
  --font-medium: 500;
  --font-semibold: 600;
  --font-bold: 700;
  
  /* Line Heights */
  --leading-tight: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.75;
  
  /* Transitions — premium easing app-wide */
  --transition-fast: 160ms cubic-bezier(.16,1,.3,1);
  --transition-base: 240ms cubic-bezier(.16,1,.3,1);
  --transition-slow: 400ms cubic-bezier(.16,1,.3,1);

  /* Glass (frosted) — single source of truth */
  --glass-bg: rgba(255,255,255,.72);
  --glass-bg-strong: rgba(255,255,255,.85);
  --glass-blur: 16px;
  --glass-saturate: 1.5;
  --glass-border: rgba(255,255,255,.5);
  
  /* Z-Index Scale */
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-modal: 300;
  --z-tooltip: 400;
  --z-toast: 500;
  
  /* Layout */
  --sidebar-width: 260px;
  --sidebar-collapsed: 72px;
  --header-height: 64px;
  --content-max-width: 1400px;
}

/* Dark Mode Variables */
[data-theme="dark"] {
  --bg-primary: #111827;
  --bg-secondary: #1F2937;
  --bg-tertiary: #374151;
  
  --text-primary: #F9FAFB;
  --text-secondary: #D1D5DB;
  --text-tertiary: #9CA3AF;
  
  --border-primary: #374151;
  --border-secondary: #4B5563;
  
  --primary-light: #1a2f5e;
  --success-light: #064E3B;
  --danger-light: #7F1D1D;
  --warning-light: #78350F;

  /* Inverted gray scale: tokenised text (gray-700/800/900) lightens and
     tokenised surfaces (gray-50/100/200) darken automatically in dark mode.
     This adapts the many page-specific colours the tokenizer mapped to grays. */
  --gray-50: #111827;
  --gray-100: #1F2937;
  --gray-200: #374151;
  --gray-300: #4B5563;
  --gray-400: #6B7280;
  --gray-500: #9CA3AF;
  --gray-600: #D1D5DB;
  --gray-700: #E5E7EB;
  --gray-800: #F3F4F6;
  --gray-900: #F9FAFB;

  /* Fixed-dark text aliases + light surface aliases flipped for dark. */
  --text-dark: #F9FAFB;
  --text-gray: #9CA3AF;
  --secondary: #94A3B8;
  --bg-white: #111827;
  --bg-gray-light: #1F2937;

  /* Premium (dark) */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.4);
  --shadow-md: 0 1px 3px rgba(0,0,0,.45), 0 10px 26px -8px rgba(0,0,0,.55);
  --shadow-lg: 0 22px 60px -14px rgba(0,0,0,.65), 0 4px 14px rgba(0,0,0,.5);
  --top-bg: rgba(17,24,39,.72);
  --rail: #05080f;
  --rail2: #121826;
  --glass-bg: rgba(17,24,39,.70);
  --glass-bg-strong: rgba(17,24,39,.85);
  --glass-border: rgba(255,255,255,.08);
}

/* Compact Mode */
.compact-mode {
  --space-1: 2px;
  --space-2: 4px;
  --space-3: 6px;
  --space-4: 10px;
  --space-5: 14px;
  --space-6: 18px;
  font-size: 13px;
}