/* ========================================
   ProShield — Theme System (Light / Dark)
   ======================================== */

/* Light Mode (Default) */
:root {
  --bg: #E4E9F0;
  --bg-secondary: #f2f4f7;
  --text-primary: #1A2B3C;
  --text-secondary: #4A6280;
  --primary: #0E70B8;
  --primary-dark: #0A5A96;
  --primary-light: #3B96D8;
  --accent: #D2DEED;
  --border: #B4C8DE;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
  --shadow-xl: 0 16px 50px rgba(0, 0, 0, 0.15);

  /* Glass */
  --glass-bg: rgba(228, 233, 240, 0.92);
  --glass-border: rgba(170, 195, 220, 0.5);

  /* Hero overlay */
  --hero-overlay: rgba(0, 0, 0, 0.45);

  /* Card */
  --card-bg: #F0F4F8;
  --card-hover-shadow: 0 12px 40px rgba(14, 112, 184, 0.15);

  /* Badge backgrounds */
  --badge-mat: #9CA3AF;
  --badge-clear: #0E70B8;
  --badge-stone: #1E3A5F;
  --badge-selfheal: #D97706;
  --badge-warranty: #0E70B8;
  --badge-black: #000000;
  --badge-nardo: #a0a5a9;
  --badge-brown: #8b5e34;
  --badge-satin: linear-gradient(135deg, #ffffff 0%, #d1d9e6 50%, #ffffff 100%);
  --badge-satin-solid: #d1d9e6;
  --badge-sky: #3B96D8;
}

/* Dark Mode */
[data-theme="dark"] {
  --bg: #0A0A0A;
  --bg-secondary: #111827;
  --text-primary: #F0F4F8;
  --text-secondary: #9CAABB;
  --primary: #3B96D8;
  --primary-dark: #2A82C4;
  --primary-light: #5AADE6;
  --accent: #0D1F35;
  --border: #1E3A5F;

  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.5);
  --shadow-xl: 0 16px 50px rgba(0, 0, 0, 0.6);

  --glass-bg: rgba(10, 10, 10, 0.9);
  --glass-border: rgba(30, 58, 95, 0.4);

  --hero-overlay: rgba(0, 0, 0, 0.55);

  --card-bg: #111827;
  --card-hover-shadow: 0 12px 40px rgba(59, 150, 216, 0.2);

  --badge-mat: #6B7280;
  --badge-clear: #3B96D8;
  --badge-stone: #2A82C4;
  --badge-selfheal: #F59E0B;
  --badge-warranty: #3B96D8;
}