/* ============================================
   BLUE SHIELD AUTO BROKERS — CSS VARIABLES
   Edit colors, fonts, and spacing here
   ============================================ */

:root {
  /* ── Brand Colors ── */
  --blue:        #008bcd;   /* Primary accent — change this to rebrand */
  --blue-dark:   #006fa3;   /* Hover state for buttons */
  --blue-glow:   rgba(0, 139, 205, 0.13);

  /* ── Background Layers ── */
  --dark:        #0a0c10;   /* Page background */
  --nav-bg:      #0d1017;   /* Navbar / topbar / footer */
  --card-bg:     #13161d;   /* Cards, panels */
  --inset-bg:    #0f1219;   /* Inputs, inset sections */

  /* ── Borders ── */
  --border:      #1e2433;

  /* ── Text ── */
  --text:        #e2e8f0;   /* Body text */
  --muted:       #8899b0;   /* Secondary / labels */

  /* ── Status Colors ── */
  --success:     #68d391;
  --success-bg:  #1c4532;
  --error:       #f87171;
  --warning:     #fbbf24;

  /* ── Typography ── */
  --font-display: 'Bebas Neue', sans-serif;
  --font-body:    'Inter', sans-serif;

  /* ── Border Radius ── */
  --radius-sm:   4px;
  --radius-md:   6px;
  --radius-lg:   8px;
  --radius-xl:   10px;

  /* ── Shadows ── */
  --shadow-card:  0 4px 24px rgba(0, 139, 205, 0.10);
  --shadow-hover: 0 8px 28px rgba(0, 139, 205, 0.13);
}