/* ═══════════════════════════════════════════════════════
   CHAT NOIR AU CLAIR DE LUNE — Thème PrestaShop
   Palette : fond #0a0a0f, or #d4c5a9, texte #c8bfaf
   Police  : Cinzel (titres), Playfair Display (corps)
═══════════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600&family=Playfair+Display&display=swap');

/* ── OVERRIDE VARIABLES BOOTSTRAP 5 ─────────────────────────── */
/* Bootstrap utilise :root,[data-bs-theme=light] — on doit utiliser EXACTEMENT
   le même sélecteur pour avoir la même spécificité et l'emporter (cascade) */
:root,
[data-bs-theme="light"],
[data-bs-theme=light] {
  --bs-body-color: #c8bfaf;
  --bs-body-color-rgb: 200, 191, 175;
  --bs-body-bg: #0a0a0f;
  --bs-secondary-color: rgba(200, 191, 175, 0.55);
  --bs-emphasis-color: #d4c5a9;
  --bs-emphasis-color-rgb: 212, 197, 169;
  --bs-light: #0d0d14;
  --bs-light-rgb: 13, 13, 20;
  --bs-light-bg-subtle: #0d0d14;
  --bs-light-text-emphasis: #d4c5a9;
  --bs-card-bg: rgba(255,255,255,0.03);
  --bs-card-border-color: rgba(212,197,169,0.18);
  --bs-card-color: #c8bfaf;
  --bs-form-label-color: rgba(212,197,169,0.8);
  --bs-border-color: rgba(212,197,169,0.25);
  --bs-border-color-translucent: rgba(212,197,169,0.15);
  --bs-link-color: #c9a96e;
  --bs-link-hover-color: #d4c5a9;
}

/* ── Reset & base ─────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

body {
  background-color: #0a0a0f !important;
  color: #c8bfaf !important;
  font-family: 'Playfair Display', Georgia, serif !important;
}

/* ── Header ──────────────────────────────────────── */
#header, .header-top, .header-bottom, .header__top, .header-nav, nav.header-nav {
  background-color: #0d0d14 !important;
  border-bottom: 1px solid rgba(212,197,169,0.2) !important;
}

.header__logo img, .logo { max-height: 60px; }

#_desktop_logo .logo-text,
.navbar-brand {
  font-family: 'Cinzel', serif !important;
  color: #d4c5a9 !important;
  font-size: 1.4rem;
  letter-spacing: 3px;
  text-transform: uppercase;
}

/* Nav links */
.header-nav a, .header-top a, .top-nav a,
#top-menu > li > a, .nav-link {
  color: #d4c5a9 !important;
  font-family: 'Cinzel', serif !important;
  font-size: 0.75rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  transition: color 0.2s !important;
}
.header-nav a:hover, #top-menu > li > a:hover, .nav-link:hover {
  color: #fff !important;
  text-decoration: none !important;
}

/* ── Fil d'Ariane ────────────────────────────────── */
#wrapper, .breadcrumb-wrapper, nav[aria-label='breadcrumb'] {
  background-color: #0a0a0f !important;
}
.breadcrumb-item a, .breadcrumb-item { color: rgba(212,197,169,0.5) !important; font-size: 0.8rem; }
.breadcrumb-item.active { color: #d4c5a9 !important; }
.breadcrumb-item + .breadcrumb-item::before { color: rgba(212,197,169,0.3) !important; }

/* ── Titres de page ──────────────────────────────── */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4 {
  font-family: 'Cinzel', serif !important;
  color: #d4c5a9 !important;
  letter-spacing: 2px !important;
}
#js-product-list-header { font-size: 2rem; margin-bottom: 2rem; text-align: center; }

/* ── Section produits ────────────────────────────── */
#products, #main, .page-content, #content-wrapper, #wrapper {
  background-color: #0a0a0f !important;
}

/* ── Cartes produit ──────────────────────────────── */
.card, .product-miniature, article.product-miniature {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(212,197,169,0.18) !important;
  border-radius: 10px !important;
  transition: transform 0.25s, border-color 0.25s !important;
  overflow: hidden;
}
.card:hover, .product-miniature:hover {
  transform: translateY(-4px) !important;
  border-color: rgba(212,197,169,0.4) !important;
}

.product-miniature .card-body, .product-miniature .card-block {
  background: transparent !important;
  padding: 1rem !important;
}

.product-miniature .product-title a,
.product-miniature h2 a,
.product-miniature .product-title {
  font-family: 'Cinzel', serif !important;
  color: #d4c5a9 !important;
  font-size: 0.95rem !important;
  letter-spacing: 1px !important;
  text-decoration: none !important;
}

.product-miniature .price, .product-price-and-shipping .price,
span.price { color: #c9a96e !important; font-size: 1.1rem !important; font-family: 'Cinzel', serif !important; }

/* ── Page produit ────────────────────────────────── */
.product-cover img { border-radius: 8px; border: 1px solid rgba(212,197,169,0.2); }
.product-description, .product-description-short { color: #c8bfaf !important; line-height: 1.8; }
.product-information h1 { font-size: 2rem; }

/* ── Boutons ─────────────────────────────────────── */
.btn-primary, .add-to-cart, button[data-button-action='add-to-cart'] {
  background: transparent !important;
  border: 1px solid #d4c5a9 !important;
  color: #d4c5a9 !important;
  font-family: 'Cinzel', serif !important;
  font-size: 0.75rem !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  border-radius: 4px !important;
  padding: 0.6rem 1.5rem !important;
  transition: all 0.2s !important;
}
.btn-primary:hover, .add-to-cart:hover {
  background: rgba(212,197,169,0.1) !important;
  color: #fff !important;
}

/* ── Panier ──────────────────────────────────────── */
.cart-overview, .cart-container, #cart {
  background: #0a0a0f !important;
  color: #c8bfaf !important;
}
.cart-item { border-bottom: 1px solid rgba(212,197,169,0.1) !important; }
.cart-subtotals, .cart-total { color: #d4c5a9 !important; }

/* ── Footer ──────────────────────────────────────── */
#footer, footer {
  background: #06060a !important;
  border-top: 1px solid rgba(212,197,169,0.15) !important;
  color: rgba(212,197,169,0.5) !important;
}
#footer a, footer a { color: rgba(212,197,169,0.6) !important; }
#footer a:hover, footer a:hover { color: #d4c5a9 !important; }
.footer__title, .block-title { font-family: 'Cinzel', serif !important; color: #d4c5a9 !important; font-size: 0.8rem !important; letter-spacing: 2px !important; }

/* ── Formulaires ─────────────────────────────────── */
input, textarea, select, .form-control {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(212,197,169,0.25) !important;
  color: #c8bfaf !important;
  border-radius: 6px !important;
}
input:focus, textarea:focus, select:focus, .form-control:focus {
  border-color: rgba(212,197,169,0.6) !important;
  background: rgba(255,255,255,0.06) !important;
  box-shadow: none !important;
  outline: none !important;
  color: #d4c5a9 !important;
}
label { color: rgba(212,197,169,0.75) !important; font-size: 0.85rem !important; }

/* ── Pagination ──────────────────────────────────── */
.pagination .page-link {
  background: transparent !important;
  border-color: rgba(212,197,169,0.2) !important;
  color: #d4c5a9 !important;
}
.pagination .page-item.active .page-link {
  background: rgba(212,197,169,0.1) !important;
  color: #d4c5a9 !important;
}

/* ── Alertes / notifications ─────────────────────── */
.alert-success { background: rgba(100,180,100,0.1) !important; border-color: rgba(100,180,100,0.3) !important; color: #8fd8a0 !important; }
.alert-danger   { background: rgba(220,80,80,0.1) !important;  border-color: rgba(220,80,80,0.3) !important;  color: #e08080 !important; }

/* ── Dropdown panier / compte ────────────────────── */
.dropdown-menu, .blockcart__modal, .cart-preview {
  background: #0f0f18 !important;
  border: 1px solid rgba(212,197,169,0.2) !important;
}
.dropdown-item { color: #c8bfaf !important; }
.dropdown-item:hover { background: rgba(212,197,169,0.07) !important; color: #d4c5a9 !important; }

/* ── Lien retour au site principal ───────────────── */
.chatnoir-back-link {
  display: block;
  text-align: center;
  padding: 0.5rem;
  background: #06060a;
  color: rgba(212,197,169,0.5) !important;
  font-family: 'Cinzel', serif;
  font-size: 0.7rem;
  letter-spacing: 2px;
  border-bottom: 1px solid rgba(212,197,169,0.1);
  text-decoration: none !important;
}
.chatnoir-back-link:hover { color: #d4c5a9 !important; }

/* ── Checkout / Commande ─────────────────────────────── */
/* Surcharge les règles HARDCODÉES du thème compilé (couleurs #fefefe / #fff) */
.cart-summary, .cart-summary .card-footer { background-color: #0d0d14 !important; }
.cart__item .product-line__title { color: #d4c5a9 !important; }

/* Barre de progression des étapes (bg-light → sombre) */
.checkout__steps,
.checkout__steps.bg-light {
  background-color: #0d0d14 !important;
  border-bottom: 1px solid rgba(212,197,169,0.15) !important;
}
.checkout__steps__number {
  background-color: #d4c5a9 !important;
  color: #0a0a0f !important;
  font-family: 'Cinzel', serif !important;
}
.checkout__steps__text, .checkout__steps__item,
.checkout__steps .nav-link,
.checkout__steps .btn {
  color: rgba(212,197,169,0.55) !important;
  font-family: 'Cinzel', serif !important;
  font-size: 0.72rem !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
}
.checkout__steps .nav-link.active,
.checkout__steps .nav-link.active .checkout__steps__text {
  color: #d4c5a9 !important;
}

/* Conteneurs principaux */
.cart-grid-body, .cart-grid-right,
#js-checkout-summary, .cart-summary.card {
  background: transparent !important;
  color: #c8bfaf !important;
}

/* Cards checkout */
.cart-grid-body .card, .cart-grid-right .card,
.checkout-process .card, .accordion-item,
.js-checkout .card {
  background: rgba(255,255,255,0.03) !important;
  border-color: rgba(212,197,169,0.18) !important;
  color: #c8bfaf !important;
}

/* En-têtes cartes / étapes */
.card-header, .card-header h1, .card-header h2, .card-header h3,
.card-header .h3, .accordion-button {
  background: rgba(255,255,255,0.04) !important;
  color: #d4c5a9 !important;
}
.accordion-button::after { filter: invert(1) brightness(0.7); }

/* Formulaire informations personnelles */
.form-label, .col-form-label         { color: rgba(212,197,169,0.8) !important; }
.form-check-label                    { color: #c8bfaf !important; }
.form-text, .form-text *             { color: rgba(200,191,175,0.5) !important; }
.invalid-feedback                    { color: #e08080 !important; }
.form-select option                  { background: #0f0f18; color: #c8bfaf; }

/* Radio buttons et checkboxes — fond clair pour être visibles */
.form-check-input {
  --bs-form-check-bg: rgba(255,255,255,0.12) !important;
  background-color: rgba(255,255,255,0.12) !important;
  border: 1px solid rgba(212,197,169,0.6) !important;
}
.form-check-input:checked {
  background-color: #d4c5a9 !important;
  border-color: #d4c5a9 !important;
  --bs-form-check-bg: #d4c5a9 !important;
}
.form-check-input:focus {
  border-color: rgba(212,197,169,0.8) !important;
  box-shadow: 0 0 0 0.2rem rgba(212,197,169,0.2) !important;
}

/* Lignes récapitulatif panier */
.cart-summary__line                  { color: #c8bfaf !important; }
.cart-summary__label                 { color: #c8bfaf !important; }
.cart-summary__value                 { color: #d4c5a9 !important; }
.cart-summary__label--sub            { color: rgba(200,191,175,0.6) !important; }
.cart-summary__line__value           { color: #d4c5a9 !important; }
/* Total TTC */
.cart-total .cart-summary__label,
.cart-total .cart-summary__value     { color: #d4c5a9 !important; font-weight: bold; }
/* Sous-totaux (cart page) */
.cart-detailed__subtotals .cart-summary__label,
.cart-detailed__totals .cart-summary__label,
.cart-detailed__subtotals .cart-summary__value,
.cart-detailed__totals .cart-summary__value { color: #c8bfaf !important; }
/* "X articles" + "Afficher les détails" */
.cart-summary__line .js-subtotal     { color: #c8bfaf !important; }
.js-cart-detailed-totals             { color: #c8bfaf !important; }

/* Étapes checkout */
.checkout-process, .checkout-process *:not(button):not(.btn):not(a) { color: #c8bfaf; }
.checkout-step, .checkout-step .card,
.checkout-step .card-body, .checkout-step section { color: #c8bfaf !important; }
.checkout-step h1, .checkout-step h2, .checkout-step h3,
.checkout-step .step-edit, .checkout-step .step-number { color: #d4c5a9 !important; }

/* Adresses */
.address-item .card, .address-block .card  { color: #c8bfaf !important; }
.address-alias                             { color: #d4c5a9 !important; font-family: 'Cinzel', serif !important; }

/* Options livraison */
.delivery-option, .delivery-option label       { color: #c8bfaf !important; }
.delivery-option .carrier-name                 { color: #d4c5a9 !important; }
.delivery-option .carrier-delay                { color: rgba(200,191,175,0.6) !important; }

/* Confirmation de commande */
.order-confirmation-table td, .order-confirmation-table th { color: #c8bfaf !important; border-color: rgba(212,197,169,0.15) !important; }
.order-confirmation h3, .order-confirmation .card-title    { color: #d4c5a9 !important; }

/* Tables Bootstrap générales */
.table, .table td, .table th, .table-bordered td, .table-bordered th {
  color: #c8bfaf !important;
  border-color: rgba(212,197,169,0.15) !important;
  background: transparent !important;
}

/* Bootstrap text utilities */
.text-body                           { color: #c8bfaf !important; }
.text-dark                           { color: #c8bfaf !important; }
.text-muted                          { color: rgba(200,191,175,0.55) !important; }
.text-secondary                      { color: rgba(200,191,175,0.7) !important; }

/* .bg-light général (utilisé dans plusieurs endroits de hummingbird) */
.bg-light:not(button):not(.btn)      { background-color: #0d0d14 !important; }

/* Séparateurs */
hr, .separator { border-color: rgba(212,197,169,0.15) !important; }

/* Résumé final avant paiement */
.order-final-summary .card { background: rgba(255,255,255,0.03) !important; border-color: rgba(212,197,169,0.18) !important; }
.order-final-summary td, .order-final-summary th { color: #c8bfaf !important; }

/* ── Validation formulaires (override !important sur border) ─────────────── */
/* Notre rule "input { border: ... !important }" écrase les couleurs Bootstrap
   de validation. On rétablit ici les états :invalid et :valid */
.was-validated input:invalid,
.was-validated select:invalid,
.was-validated textarea:invalid,
.was-validated .form-control:invalid,
input.is-invalid,
select.is-invalid,
textarea.is-invalid,
.form-control.is-invalid {
  border-color: #e08080 !important;
  box-shadow: 0 0 0 0.2rem rgba(220, 80, 80, 0.18) !important;
}
.was-validated input:valid,
.was-validated select:valid,
.was-validated textarea:valid,
.was-validated .form-control:valid,
input.is-valid,
select.is-valid,
.form-control.is-valid {
  border-color: rgba(100, 180, 100, 0.7) !important;
  box-shadow: none !important;
}
/* Affiche les messages d'erreur Bootstrap */
.was-validated :invalid ~ .invalid-feedback,
.is-invalid ~ .invalid-feedback {
  display: block !important;
  color: #e08080 !important;
}
/* S'assure que le bouton Continuer est toujours cliquable */
button.continue,
.checkout-step button.continue,
.checkout-step .btn.continue {
  pointer-events: auto !important;
  cursor: pointer !important;
}
/* Boutons désactivés après submit doivent montrer un loading visuel */
.checkout-step button.continue.disabled,
.checkout-step button.continue[disabled] {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}