:root {
  --theme-primary-dark: #1e3a8a;
  --theme-primary: #3b82f6;
  --theme-primary-light: #60a5fa;
  --theme-accent-dark: #374151;
  --theme-accent: #4b5563;
  --theme-body-bg: #f3f4f6;
  --theme-text: #374151;
}

html[data-theme="yellow"] {
  --theme-primary-dark: #a16207;
  --theme-primary: #eab308;
  --theme-primary-light: #facc15;
  --theme-accent-dark: #92400e;
  --theme-accent: #b45309;
  --theme-body-bg: #fffbeb;
  --theme-text: #451a03;
}

body {
  background-color: var(--theme-body-bg) !important;
  color: var(--theme-text);
}

.navbar {
  background: linear-gradient(135deg, var(--theme-primary-dark) 0%, var(--theme-primary) 100%) !important;
  border-bottom-color: var(--theme-primary-light) !important;
}

.btn-primary {
  background: linear-gradient(135deg, var(--theme-primary) 0%, var(--theme-primary-dark) 100%) !important;
  border-color: var(--theme-primary) !important;
}

.btn-primary:hover {
  background: linear-gradient(135deg, var(--theme-primary-dark) 0%, var(--theme-primary) 100%) !important;
  border-color: var(--theme-primary-light) !important;
}

.form-control,
.form-select {
  border-color: var(--theme-primary) !important;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--theme-primary-dark) !important;
  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--theme-primary) 25%, transparent) !important;
}

.section-card {
  border-color: var(--theme-primary) !important;
}

.section-header,
.dashboard-header,
.page-header {
  background: linear-gradient(135deg, var(--theme-accent-dark) 0%, var(--theme-accent) 100%) !important;
}

.modal-header {
  background: linear-gradient(135deg, var(--theme-primary-dark) 0%, var(--theme-primary) 100%) !important;
  color: #fff !important;
}

/* Ajustes visuales específicos para tema Ferretería */
html[data-theme="yellow"] .welcome-card,
html[data-theme="yellow"] .info-card {
  background: linear-gradient(135deg, #78350f 0%, #92400e 100%) !important;
  color: #fff !important;
}

html[data-theme="yellow"] .stats-card,
html[data-theme="yellow"] .dashboard-card[onclick*="loadOpenOrders"] {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: #fff !important;
}

html[data-theme="yellow"] .dashboard-card {
  border-color: #d97706 !important;
  box-shadow: 0 4px 15px rgba(217, 119, 6, 0.25) !important;
}

html[data-theme="yellow"] .dashboard-card:hover {
  border-color: #92400e !important;
  box-shadow: 0 8px 25px rgba(146, 64, 14, 0.35) !important;
}

html[data-theme="yellow"] .product-code,
html[data-theme="yellow"] .product-detail-code {
  background: linear-gradient(135deg, #a16207 0%, #d97706 100%) !important;
  color: #fff !important;
}

html[data-theme="yellow"] .product-price,
html[data-theme="yellow"] .text-primary.product-price {
  color: #b45309 !important;
}

html[data-theme="yellow"] .product-detail-price-section {
  background: linear-gradient(135deg, #d97706 0%, #92400e 100%) !important;
  color: #fff !important;
}

html[data-theme="yellow"] .product-detail-specs .text-primary,
html[data-theme="yellow"] .product-detail-specs .spec-item i {
  color: #b45309 !important;
}

html[data-theme="yellow"] .scroll-top-btn {
  border-color: #d97706 !important;
  background: linear-gradient(135deg, #a16207 0%, #eab308 100%) !important;
  box-shadow: 0 4px 18px rgba(161, 98, 7, 0.35) !important;
}

html[data-theme="yellow"] .scroll-top-btn:hover {
  box-shadow: 0 8px 24px rgba(180, 83, 9, 0.45) !important;
}

/* Catálogo: tarjeta sin ítem en carrito — borde/sombra en paleta amarilla (no azul) */
html[data-theme="yellow"] .product-card:not(.in-cart) {
  border-color: var(--theme-primary) !important;
  box-shadow: 0 4px 15px color-mix(in srgb, var(--theme-primary) 22%, transparent) !important;
}

html[data-theme="yellow"] .product-card:not(.in-cart):hover {
  border-color: var(--theme-accent) !important;
  box-shadow: 0 8px 25px color-mix(in srgb, var(--theme-accent-dark) 32%, transparent) !important;
}

html[data-theme="yellow"] .btn-logout,
html[data-theme="yellow"] .btn-config {
  background-color: #d97706 !important;
  border-color: #d97706 !important;
  color: #fff !important;
}

html[data-theme="yellow"] .btn-logout:hover,
html[data-theme="yellow"] .btn-config:hover {
  background-color: #92400e !important;
  border-color: #92400e !important;
  box-shadow: 0 0 15px rgba(217, 119, 6, 0.35) !important;
}

html[data-theme="yellow"] .bottom-navbar {
  background: rgba(146, 64, 14, 0.8) !important;
  border-top: 1px solid rgba(234, 179, 8, 0.45) !important;
}

html[data-theme="yellow"] .bottom-navbar .nav-item,
html[data-theme="yellow"] .bottom-navbar .nav-item i {
  color: rgba(255, 255, 255, 0.9) !important;
}

html[data-theme="yellow"] .quantity-controls .btn-outline-secondary {
  border-color: #d97706 !important;
  color: #b45309 !important;
  background: #fff7ed !important;
}

html[data-theme="yellow"] .quantity-controls .btn-outline-secondary:hover {
  border-color: #92400e !important;
  color: #fff !important;
  background: #d97706 !important;
}

/* Catálogo / detalle: "Agregar al carrito" = gris pizarra (mismo criterio que badge de stock) */
html[data-theme="yellow"] .btn-add-to-cart-catalog {
  background: linear-gradient(135deg, #374151 0%, #4b5563 100%) !important;
  border-color: #4b5563 !important;
  color: #fff !important;
  box-shadow: 0 2px 10px rgba(55, 65, 81, 0.28) !important;
}

html[data-theme="yellow"] .btn-add-to-cart-catalog:hover {
  background: linear-gradient(135deg, #4b5563 0%, #1f2937 100%) !important;
  border-color: #374151 !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(31, 41, 55, 0.38) !important;
}

html[data-theme="yellow"] .btn-in-cart,
html[data-theme="yellow"] .product-card.in-cart::before {
  background: linear-gradient(135deg, #15803d 0%, #166534 100%) !important;
  border-color: #15803d !important;
}

html[data-theme="yellow"] .product-card.in-cart {
  border-color: #22c55e !important;
  box-shadow: 0 4px 15px rgba(22, 163, 74, 0.35) !important;
}

/* Modal Carrito de compras — tema amarillo (quita azules / code magenta) */
html[data-theme="yellow"] #cartModal .modal-header {
  background: linear-gradient(135deg, var(--theme-primary-dark) 0%, var(--theme-primary) 100%) !important;
  border-bottom-color: color-mix(in srgb, var(--theme-primary-light) 50%, transparent) !important;
}

html[data-theme="yellow"] #cartModal #cart-total.text-primary,
html[data-theme="yellow"] #cartModal .text-primary#cart-total {
  color: #b45309 !important;
}

html[data-theme="yellow"] #cartModal code {
  color: #92400e !important;
  background-color: #fffbeb !important;
  padding: 0.15rem 0.4rem;
  border-radius: 0.25rem;
  border: 1px solid rgba(217, 119, 6, 0.35);
}

html[data-theme="yellow"] #cartModal .input-group .form-control {
  border-color: #d97706 !important;
}

html[data-theme="yellow"] #cartModal .input-group .form-control:focus {
  border-color: #b45309 !important;
  box-shadow: 0 0 0 0.2rem rgba(217, 119, 6, 0.25) !important;
}

html[data-theme="yellow"] #cartModal .input-group .btn-outline-secondary {
  border-color: #d97706 !important;
  color: #b45309 !important;
  background: #fff7ed !important;
}

html[data-theme="yellow"] #cartModal .input-group .btn-outline-secondary:hover:not(:disabled) {
  border-color: #92400e !important;
  color: #fff !important;
  background: #d97706 !important;
}

html[data-theme="yellow"] #cartModal .input-group .btn-outline-secondary:disabled {
  opacity: 0.55;
}

/* Vaciar carrito (botón bajo resumen, fuera del input-group) */
html[data-theme="yellow"] #cartModal .d-grid > .btn-outline-secondary {
  border-color: #d97706 !important;
  color: #b45309 !important;
  background: #fffbeb !important;
}

html[data-theme="yellow"] #cartModal .d-grid > .btn-outline-secondary:hover {
  border-color: #92400e !important;
  color: #fff !important;
  background: #d97706 !important;
}

html[data-theme="yellow"] #cartModal #cart-content .card {
  border-color: rgba(217, 119, 6, 0.45) !important;
}

/* Alertas personalizadas: confirmación (ej. confirmar pedido) — tema amarillo */
html[data-theme="yellow"] .custom-alert.confirm {
  background: linear-gradient(135deg, var(--theme-primary-dark) 0%, var(--theme-primary) 100%) !important;
  color: #ffffff !important;
  border-left-color: var(--theme-primary-light) !important;
  box-shadow: 0 8px 32px rgba(161, 98, 7, 0.4) !important;
}

html[data-theme="yellow"] .custom-alert.confirm .confirm-btn {
  background: #fffbeb !important;
  color: #451a03 !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
  font-weight: 600;
}

html[data-theme="yellow"] .custom-alert.confirm .confirm-btn:hover {
  background: #ffffff !important;
  color: #78350f !important;
}

html[data-theme="yellow"] .custom-alert.confirm .cancel-btn {
  border: 1px solid rgba(255, 255, 255, 0.9) !important;
  color: #ffffff !important;
  background: rgba(146, 64, 14, 0.35) !important;
}

html[data-theme="yellow"] .custom-alert.confirm .cancel-btn:hover {
  background: rgba(120, 53, 15, 0.55) !important;
  color: #ffffff !important;
}

/* Toasts globales (wwwroot/js/alerts.js) — tema Ferretería: bienvenida y demás alertas */
html[data-theme="yellow"] .custom-alert.success {
  background: linear-gradient(135deg, var(--theme-primary-dark) 0%, var(--theme-primary) 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 32px rgba(161, 98, 7, 0.4) !important;
}

html[data-theme="yellow"] .custom-alert.error {
  background: linear-gradient(135deg, #78350f 0%, #92400e 100%) !important;
  color: #fef3c7 !important;
  box-shadow: 0 8px 32px rgba(120, 53, 15, 0.35) !important;
}

html[data-theme="yellow"] .custom-alert.warning {
  background: linear-gradient(135deg, #ca8a04 0%, #a16207 100%) !important;
  color: #fffbeb !important;
  box-shadow: 0 8px 32px rgba(161, 98, 7, 0.35) !important;
}

html[data-theme="yellow"] .custom-alert.info {
  background: linear-gradient(135deg, var(--theme-accent-dark) 0%, var(--theme-accent) 100%) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 32px rgba(146, 64, 14, 0.35) !important;
}