
:root {
  --bg-void: #070709;
  --bg-surface: #121217;
  --border-subtle: rgba(255, 255, 255, 0.08);
  --accent-violet: #7839cd;
  --accent-amber: #e87a1e;
  --accent-crimson: #c71822;
  --glow-violet: 0 0 25px rgba(120, 57, 205, 0.25);
  --glow-amber: 0 0 15px rgba(232, 122, 30, 0.35);
  --glow-crimson: 0 0 20px rgba(199, 24, 34, 0.45);
  --text-primary: #ededed;
  --text-muted: #888891;
}

body {
  background-color: var(--bg-void) !important;
  color: var(--text-primary) !important;
  background-image: 
    radial-gradient(circle at 15% 20%, rgba(232, 122, 30, 0.04) 0%, transparent 40%),
    radial-gradient(circle at 85% 20%, rgba(199, 24, 34, 0.05) 0%, transparent 40%),
    radial-gradient(circle at 50% 80%, rgba(120, 57, 205, 0.06) 0%, transparent 50%) !important;
  background-attachment: fixed !important;
}

button[type="submit"], .btn-primary, .checkout-btn, .reserve-btn, .add-to-cart {
  background: var(--accent-crimson) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: var(--glow-crimson) !important;
  transition: all 0.25s ease !important;
}

button[type="submit"]:hover, .btn-primary:hover, .checkout-btn:hover, .reserve-btn:hover, .add-to-cart:hover {
  background: #a5121b !important;
  box-shadow: 0 0 30px rgba(199, 24, 34, 0.7) !important;
}

a:hover, .nav-link:hover {
  color: var(--accent-amber) !important;
}

.card, .product-card, .product-item {
  border: 1px solid rgba(120, 57, 205, 0.2) !important;
  transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.card:hover, .product-card:hover, .product-item:hover {
  border-color: var(--accent-amber) !important;
  box-shadow: var(--glow-amber) !important;
}
