/* ============================================================
   TRADITEX EXPLOSIVES — CSS Variables
   ============================================================ */

:root {
  --bg: #F5F6F7;
  --bg-surface: #FFFFFF;
  --bg-raised: #ECEEF0;
  --bg-sunken: #E2E4E7;

  --navy: #1A2B45;
  --navy-light: #243858;
  --anthracite: #2D3A47;
  --steel: #4A5568;
  --steel-light: #718096;
  --steel-faint: #A0AEC0;

  --border: #D1D5DB;
  --border-strong: #9CA3AF;
  --border-navy: rgba(26,43,69,0.15);

  --safety: #E8691A;
  --safety-hover: #D45A0E;
  --safety-pale: #FFF3EC;
  --safety-border: #F4A261;

  --ok: #1B6840;
  --ok-pale: #F0FFF4;
  --ok-border: #68D391;

  --warn: #92640A;
  --warn-pale: #FFFBEB;
  --warn-border: #F6D860;

  --danger: #9B2335;
  --danger-pale: #FFF5F5;
  --danger-border: #FC8181;

  --info: #1E4D8C;
  --info-pale: #EBF4FF;
  --info-border: #90CDF4;

  --font-primary: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  --font-mono: 'JetBrains Mono', 'IBM Plex Mono', monospace;

  --header-h: 68px;

  --radius-sm: 2px;
  --radius-btn: 3px;

  --shadow-card: 0 1px 4px rgba(0,0,0,0.06), 0 0 0 1px rgba(0,0,0,0.02);
  --shadow-hover: 0 6px 20px rgba(0,0,0,0.10);

  --trans-fast: 150ms linear;
  --trans-base: 200ms linear;
}