/* =====================================================
   MotoPartes - Theme Oscuro (Modern Dark)
   ===================================================== */

:root {
  --primary:       #f97316;
  --primary-dark:  #ea6a05;
  --primary-light: rgba(249, 115, 22, 0.15);
  --bg:            #09090b; /* Deep zinc background */
  --surface:       #18181b; /* Card background */
  --surface-hover: #27272a;
  --border:        #27272a;
  --text:          #fafafa;
  --text-muted:    #a1a1aa;
  --success:       #22c55e;
  --danger:        #ef4444;
  --radius:        12px;
}

body.theme-oscuro {
  background-color: var(--bg);
  color: var(--text);
  font-family: 'Inter', sans-serif;
  line-height: 1.5;
}

/* ── Typography & Headings ── */
body.theme-oscuro h1, body.theme-oscuro h2, body.theme-oscuro h3, body.theme-oscuro h4 {
  color: var(--text);
  font-family: 'Outfit', sans-serif;
}

/* ── Navbar ── */
body.theme-oscuro .navbar {
  background: rgba(9, 9, 11, 0.8);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  box-shadow: none;
}

body.theme-oscuro .nav-logo { color: var(--text); font-weight: 800; }
body.theme-oscuro .nav-logo span { color: var(--primary); }

body.theme-oscuro .nav-search input {
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 8px;
  padding-left: 2.5rem;
}
body.theme-oscuro .nav-search input:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px var(--primary-light);
}

body.theme-oscuro .nav-links a { color: var(--text-muted); font-weight: 500; transition: color 0.2s; }
body.theme-oscuro .nav-links a:hover, body.theme-oscuro .nav-links a.active {
    color: var(--primary);
    background: transparent;
}

body.theme-oscuro .cart-btn {
    background: var(--surface);
    border: 1px solid var(--border);
    color: var(--text);
    border-radius: 8px;
    transition: all 0.2s;
}
body.theme-oscuro .cart-btn:hover { background: var(--surface-hover); }
body.theme-oscuro .cart-count { background: var(--primary); color: white; }

/* ── Cards (Products & Categories) ── */
body.theme-oscuro .part-card, body.theme-oscuro .category-card {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s;
}

body.theme-oscuro .part-card:hover, body.theme-oscuro .category-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.5);
    border-color: rgba(249, 115, 22, 0.3); /* Subtle primary border on hover */
}

body.theme-oscuro .part-card-img-wrapper { background: #000; border-radius: var(--radius) var(--radius) 0 0; padding: 1rem; }
body.theme-oscuro .part-card-name { color: var(--text); font-weight: 600; }
body.theme-oscuro .part-card-brand { color: var(--text-muted); }
body.theme-oscuro .part-card-price { color: var(--primary); font-size: 1.25rem; font-weight: 700; }
body.theme-oscuro .part-card-footer { border-top-color: var(--border); }
body.theme-oscuro .category-card span { color: var(--text); font-weight: 600; }
body.theme-oscuro .category-card i { color: var(--primary); }

/* ── Buttons ── */
body.theme-oscuro .btn-primary {
    background-color: var(--primary);
    color: white;
    border: none;
    font-weight: 600;
}
body.theme-oscuro .btn-primary:hover {
    background-color: var(--primary-dark);
}
body.theme-oscuro .btn-outline {
    border: 1px solid var(--border);
    color: var(--text);
    background: transparent;
}
body.theme-oscuro .btn-outline:hover {
    background: var(--surface-hover);
    border-color: var(--text-muted);
}

/* ── Slider ── */
body.theme-oscuro .main-slider {
    background: var(--bg);
}

/* ── Cart Drawer ── */
body.theme-oscuro .cart-drawer {
    background: var(--surface);
    border-left: 1px solid var(--border);
}
body.theme-oscuro .cart-drawer-header, body.theme-oscuro .cart-drawer-footer {
    border-color: var(--border);
    background: var(--bg);
}
body.theme-oscuro .cart-item { border-color: var(--border); }
body.theme-oscuro .cart-item-name { color: var(--text); }
body.theme-oscuro .cart-item-price { color: var(--primary); }
body.theme-oscuro .qty-btn { background: var(--surface-hover); color: var(--text); border-color: var(--border); }

/* ── Footer ── */
body.theme-oscuro footer {
    background: #000;
    border-top: 1px solid var(--border);
    padding: 4rem 0 2rem;
}
body.theme-oscuro .footer-brand .logo-text { color: var(--text); }
body.theme-oscuro .footer-col h4 { color: var(--text); }
body.theme-oscuro .footer-col ul li a { color: var(--text-muted); }
body.theme-oscuro .footer-col ul li a:hover { color: var(--primary); }
body.theme-oscuro .footer-bottom { border-top-color: var(--border); color: var(--text-muted); }

/* ── Catalog Sidebar ── */
body.theme-oscuro .catalog-sidebar {
    background: var(--surface);
    border-right: 1px solid var(--border);
}
body.theme-oscuro .catalog-sidebar .sidebar-title {
    color: var(--text);
}
body.theme-oscuro .sidebar-item {
    color: var(--text-muted);
}
body.theme-oscuro .sidebar-item:hover {
    background: var(--surface-hover);
    color: var(--text);
}
body.theme-oscuro .sidebar-item.active {
    background: var(--primary-light);
    color: var(--primary);
}
body.theme-oscuro .sidebar-item .count {
    background: var(--bg);
    color: var(--text-muted);
}
body.theme-oscuro .sidebar-item.active .count {
    background: var(--primary);
    color: white;
}
body.theme-oscuro #brand-search-sidebar {
    background: var(--bg) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
body.theme-oscuro .catalog-topbar {
    color: var(--text);
}

/* ── Checkout ── */
body.theme-oscuro .checkout-form-card, body.theme-oscuro .order-summary-card {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text);
}
body.theme-oscuro .checkout-form-card h2, body.theme-oscuro .order-summary-card h3 {
    color: var(--text);
}
body.theme-oscuro .form-control {
    background: var(--bg);
    border-color: var(--border);
    color: var(--text);
}
body.theme-oscuro .form-control:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--primary-light);
}
body.theme-oscuro .form-label {
    color: var(--text-muted);
}
body.theme-oscuro .summary-item {
    border-bottom-color: var(--border);
    color: var(--text);
}
body.theme-oscuro .summary-total {
    border-top-color: var(--border);
    color: var(--text);
}
body.theme-oscuro .summary-total .value {
    color: var(--primary);
}
body.theme-oscuro div[style*="background: white"] {
    background: var(--surface) !important;
}

/* Custom Scrollbar */
body.theme-oscuro ::-webkit-scrollbar { width: 8px; }
body.theme-oscuro ::-webkit-scrollbar-track { background: var(--bg); }
body.theme-oscuro ::-webkit-scrollbar-thumb { background: var(--surface-hover); border-radius: 4px; }
body.theme-oscuro ::-webkit-scrollbar-thumb:hover { background: var(--border); }

/* Utility */
.text-gradient {
    background: linear-gradient(to right, var(--primary), #fb923c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
