/* ============================================================
   NeoVibe — Luxury Metallic Silver-Gray & Electric Blue Design Tokens
   ============================================================ */

:root {
  /* ── Metallic White & Liquid Platinum Backgrounds ── */
  --bg-dark:          #e6ebf2;
  --bg-body:          #f4f6fa;
  --bg-card:          linear-gradient(145deg, #ffffff 0%, #f3f6fa 100%);
  --bg-card-solid:    #ffffff;
  --bg-card-hover:    linear-gradient(145deg, #ffffff 0%, #eaf0f8 100%);
  --bg-elevated:      #ffffff;
  --bg-input:         #ffffff;

  /* ── Chrome & Silver Metallic Borders ── */
  --border-subtle:    rgba(180, 195, 215, 0.45);
  --border-mid:       rgba(150, 175, 205, 0.65);
  --border-bright:    rgba(120, 150, 190, 0.85);
  --border-blue-glow: rgba(0, 102, 238, 0.60);
  --border-cyan-glow: rgba(0, 148, 255, 0.50);

  /* ── Electric Blue Accent Palette ── */
  --blue:             #0066ee;
  --blue-deep:        #004ecc;
  --blue-glow:        rgba(0, 102, 238, 0.25);
  --blue-subtle:      rgba(0, 102, 238, 0.08);
  --cyan:             #0094ff;
  --cyan-glow:        rgba(0, 148, 255, 0.25);
  --cyan-subtle:      rgba(0, 148, 255, 0.08);

  /* ── High-Contrast Deep Graphite & Silver Text ── */
  --text-main:        #0c1422;
  --text-silver:      #222f42;
  --text-muted:       #485b73;
  --text-dim:         #6e8099;

  /* ── Chrome / Metallic White Gradients ── */
  --grad-metallic:    linear-gradient(135deg, #ffffff 0%, #cbd5e1 50%, #94a3b8 100%);
  --grad-steel:       linear-gradient(145deg, #ffffff 0%, #e8eef6 100%);
  --grad-card:        linear-gradient(145deg, #ffffff 0%, #f3f6fa 100%);
  --grad-blue:        linear-gradient(135deg, #0066ee 0%, #004ecc 100%);
  --grad-blue-vivid:  linear-gradient(135deg, #0080ff 0%, #0055dd 100%);
  --grad-topbar:      linear-gradient(90deg, #d8e2ee 0%, #f4f7fb 35%, #ffffff 50%, #f4f7fb 65%, #d8e2ee 100%);

  /* ── Status Colors ── */
  --success:          #129e5a;
  --warning:          #d97706;
  --danger:           #dc2626;
  --sale-grad:        linear-gradient(135deg, #0066ee, #0094ff);

  /* ── Typography ── */
  --font:             'Inter', 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-mono:        'JetBrains Mono', 'Fira Code', monospace;

  /* ── Layout ── */
  --container-width:  1300px;
  --radius-xs:        6px;
  --radius-sm:        10px;
  --radius-md:        16px;
  --radius-lg:        22px;
  --radius-xl:        30px;
  --radius-pill:      9999px;

  /* ── Shadows — Platinum Ambient & Subtle Glow ── */
  --shadow-xs:        0 2px 6px rgba(12, 20, 34, 0.04);
  --shadow-sm:        0 4px 14px rgba(12, 20, 34, 0.06);
  --shadow-md:        0 8px 28px rgba(12, 20, 34, 0.09);
  --shadow-lg:        0 16px 48px rgba(12, 20, 34, 0.12);
  --shadow-card:      0 8px 30px rgba(12, 20, 34, 0.06), 0 1px 3px rgba(12, 20, 34, 0.04);
  --shadow-blue:      0 0 24px rgba(0, 102, 238, 0.25), 0 0 8px rgba(0, 102, 238, 0.15);
  --shadow-cyan:      0 0 24px rgba(0, 148, 255, 0.20), 0 0 8px rgba(0, 148, 255, 0.12);
  --shadow-inset:     inset 0 1px 2px rgba(12, 20, 34, 0.05);

  /* ── Motion ── */
  --ease-out:         cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:      cubic-bezier(0.4, 0, 0.2, 1);
  --t-fast:           0.18s;
  --t-normal:         0.30s;
  --t-slow:           0.50s;

  /* ── Glass Effect ── */
  --glass:            blur(20px) saturate(180%);

}