/**
 * Fichier : /assets/css/global-fixes.css
 * Rôle    : Corrections globales — visibilité textes, tailles typographie,
 *           textes blancs sur fond sombre, paragraphes lisibles partout
 */

/* ══════════════════════════════════════════════════════════
   TYPOGRAPHIE — tailles de base correctes
══════════════════════════════════════════════════════════ */

html { font-size: 16px; }

body {
  font-size: 16px;
  line-height: 1.7;
  color: #e8e8e8;
}

/* Paragraphes — jamais petits, jamais gris invisibles */
p {
  font-size: 16px;
  line-height: 1.75;
  color: #d8d8d8;
  margin-bottom: 16px;
}

/* Sections sur fond sombre → texte blanc cassé */
.section p,
.performance p,
.hero-text,
.page-hero p,
.about-copy > p:not(.eyebrow) { color: #d8d8d8; }

/* Sections sur fond clair (about) → texte sombre */
.about p,
.about-copy > p:not(.eyebrow) { color: #3a3a3a; }

/* Small / small → lisibles */
small  { font-size: 13px; color: #aaa; }
.muted { color: #aaa; }

/* Textes dans les cards sombres */
.acard p,
.account-card p,
.auth-card-pro p { color: #d0d0d0; }

/* Breadcrumb */
.breadcrumb,
.breadcrumb a,
.breadcrumb span { color: #aaa; font-size: 13px; }
.breadcrumb a:hover { color: var(--red); }

/* Texte eyebrow */
.eyebrow { font-size: 13px; color: var(--red); }

/* Trust items */
.trust-item b    { color: #ffffff; font-size: 13px; }
.trust-item small{ color: #c0c0c0; font-size: 12px; }

/* Footer textes lisibles */
.footer p,
.footer a { color: #a0a0a0; font-size: 13px; }
.footer h4 { color: #ffffff; }

/* Ticker — lisible */
.ticker-item { color: #888; font-size: 12px; }

/* Check list sur fond clair */
.check-list div { color: #2a2a2a; font-size: 15px; font-weight: 700; }

/* ══════════════════════════════════════════════════════════
   SECTION ABOUT — fond blanc, textes sombres
══════════════════════════════════════════════════════════ */
.about { background: #f1f1f1; color: #111; }
.about h2, .about .eyebrow { color: #111; }
.about p { color: #444; }

/* ══════════════════════════════════════════════════════════
   DASHBOARD STATS — chiffres lisibles
══════════════════════════════════════════════════════════ */
.dquick-item small { color: #aaa; font-size: 12px; }
.dquick-item b     { color: #ffffff; }

/* Stat 0 en rouge → on met en blanc pour 0 aussi */
.ahstat b { color: var(--red); font-size: 24px; }
.ahstat span { color: #888; font-size: 11px; }

/* ══════════════════════════════════════════════════════════
   FORMULAIRES — labels et placeholders visibles
══════════════════════════════════════════════════════════ */
.auth-field input::placeholder  { color: #555; font-size: 15px; }
.auth-field label               { color: #555; }
.float-group label              { color: #888; }
.form-group label               { color: #ccc; font-size: 13px; }

/* Input text couleur */
input, textarea, select {
  color: #ffffff;
}
input::placeholder,
textarea::placeholder { color: #555; }

/* ══════════════════════════════════════════════════════════
   HERO — textes grands et visibles
══════════════════════════════════════════════════════════ */
.hero-text {
  font-size: 17px;
  line-height: 1.7;
  color: #d8d8d8;
  max-width: 600px;
}

/* ══════════════════════════════════════════════════════════
   PAGES LÉGALES — fond sombre, texte lisible
══════════════════════════════════════════════════════════ */
.legal-page { background: #060809; color: #d8d8d8; }
.legal-content { max-width: 860px; margin: 0 auto; padding: 60px 0 100px; }
.legal-content h1 {
  font-family: Oswald, Impact, sans-serif;
  font-style: italic;
  font-size: clamp(36px, 4vw, 54px);
  margin: 0 0 8px;
  color: #fff;
}
.legal-content h2 {
  font-family: Oswald, sans-serif;
  font-size: 22px;
  font-style: italic;
  margin: 40px 0 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--red);
  color: #fff;
}
.legal-content h3 {
  font-size: 17px;
  font-weight: 700;
  margin: 24px 0 10px;
  color: #eee;
}
.legal-content p {
  font-size: 15px;
  color: #c8c8c8;
  line-height: 1.8;
  margin-bottom: 16px;
}
.legal-content ul,
.legal-content ol { margin: 12px 0 20px 24px; }
.legal-content li {
  font-size: 15px;
  color: #c8c8c8;
  line-height: 1.8;
  margin-bottom: 8px;
}
.legal-content a { color: var(--red); text-decoration: underline; }
.legal-content a:hover { color: #ff4444; }
.legal-content .legal-meta {
  background: #111416;
  border: 1px solid #1e2124;
  border-left: 4px solid var(--red);
  padding: 18px 22px;
  margin: 20px 0 30px;
  font-size: 14px;
  color: #d0d0d0;
  line-height: 1.8;
}
.legal-content .legal-meta strong { color: #fff; }
.legal-toc {
  background: #111416;
  border: 1px solid #1e2124;
  padding: 24px 28px;
  margin-bottom: 40px;
}
.legal-toc h4 { color: #fff; font-size: 13px; letter-spacing: 1px; margin: 0 0 14px; }
.legal-toc ol { margin: 0; padding: 0 0 0 18px; }
.legal-toc li { margin-bottom: 6px; }
.legal-toc a  { color: #aaa; font-size: 14px; text-decoration: none; transition: color .2s; }
.legal-toc a:hover { color: var(--red); }

/* ══════════════════════════════════════════════════════════
   REGISTER BENEFITS — fond sombre, texte blanc
══════════════════════════════════════════════════════════ */
.benefit-item b     { color: #ffffff; font-size: 12px; }
.benefit-item small { color: #888; font-size: 11px; }

/* ══════════════════════════════════════════════════════════
   ORDER ROWS — textes lisibles
══════════════════════════════════════════════════════════ */
.or-num b    { color: #ffffff; font-size: 14px; }
.or-num small { color: #888; font-size: 12px; }
.or-amount   { color: #ffffff; font-weight: 800; }
.od-info small { color: #666; }
.od-info b   { color: #ffffff; }

/* ══════════════════════════════════════════════════════════
   CATEGORY CONTENT — textes sur image
══════════════════════════════════════════════════════════ */
.category-content small { color: #ddd; font-size: 11px; }
.category-content p     { color: #bbb; font-size: 13px; margin: 0 0 14px; }

/* ══════════════════════════════════════════════════════════
   PRODUCT INFO — textes lisibles
══════════════════════════════════════════════════════════ */
.product-info small { color: #888; font-size: 10px; }
.product-info h3 a  { color: #ffffff; }
.product-info h3 a:hover { color: var(--red); }
.rating span { color: #888; }
.price { color: #ffffff; }
.price del { color: #777; font-size: 14px; }

/* ══════════════════════════════════════════════════════════
   CART — textes blancs
══════════════════════════════════════════════════════════ */
.cart-row-info h3 a { color: #ffffff; }
.cart-row-cat { color: #777; font-size: 10px; }
.summary-vat  { color: #777; font-size: 12px; }
.cart-continue { color: #888; }

/* ══════════════════════════════════════════════════════════
   REVIEW CARDS
══════════════════════════════════════════════════════════ */
.review p    { color: #d0d0d0; font-size: 15px; }
.review b    { color: #ffffff; }
.review small { color: #888; }

/* ══════════════════════════════════════════════════════════
   ACCESSORY CARD
══════════════════════════════════════════════════════════ */
.accessory-card p { color: #aaa; font-size: 13px; }

/* ══════════════════════════════════════════════════════════
   PERFORMANCE COPY
══════════════════════════════════════════════════════════ */
.performance-copy > p:not(.eyebrow) { color: #c8c8c8; font-size: 16px; }
.specs span { color: #aaa; font-size: 11px; }

/* ══════════════════════════════════════════════════════════
   FOOTER LEGAL LINKS
══════════════════════════════════════════════════════════ */
.footer-bottom { color: #888; font-size: 12px; }
.footer-bottom a { color: #888; }
.footer-bottom a:hover { color: #fff; }

/* Footer legal links */
.footer-legal-links { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.footer-legal-links a { color:#888; font-size:12px; transition:color .2s; }
.footer-legal-links a:hover { color:#fff; }
.footer-legal-links span { color:#444; font-size:12px; }
.footer-bottom { padding:20px 0; border-top:1px solid #1a1d20; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; font-size:12px; color:#666; }

/* Legal page responsive */
@media(max-width:780px){
  .legal-content { padding:40px 0 60px; }
  .legal-content h2 { font-size:20px; }
  .legal-content p, .legal-content li { font-size:15px; }
}

/* Overrides final — tout texte sur fond sombre doit être lisible */
.section-head p:not(.eyebrow) { color: #c0c0c0; font-size: 16px; }
.banner p { color: #e0e0e0; font-size: 16px; }
.performance-copy > p:not(.eyebrow) { color: #c8c8c8; font-size: 16px; }
.hero-text { color: #d8d8d8; font-size: 17px; }
.about-copy > p:not(.eyebrow) { color: #444; font-size: 16px; }

/* Auth card description */
.auth-card-sub { color: #aaa; font-size: 15px; }
.auth-card-pro p { color: #c0c0c0; }

/* Ticker visible */
.ticker-item { color: #666; font-size: 12px; font-weight: 700; letter-spacing: 1px; }

/* Product description sur page detail */
.detail-desc { color: #c0c0c0; font-size: 15px; line-height: 1.8; }

/* Contact form */
.contact-info > p { color: #c0c0c0; font-size: 16px; }
.contact-card p   { color: #d0d0d0; font-size: 14px; }

/* About page legal cards */
.legal-card p { color: #c8c8c8; font-size: 14px; }

/* Checkout */
.checkout-legal { color: #888; font-size: 13px; }
.checkout-legal a { color: var(--red); }

/* Cart coupon */
.coupon-input::placeholder { color: #555; }

/* Cart empty */
.cart-empty p { color: #aaa; font-size: 16px; }

/* ══════════════════════════════════════════════════════════
   ORDER SUCCESS PAGE
══════════════════════════════════════════════════════════ */
.success-page .acard { background:#111416; border:1px solid #1e2124; margin-bottom:20px; overflow:visible; }
.success-page .acard-head { display:flex; align-items:center; justify-content:space-between; padding:18px 22px; border-bottom:1px solid #1a1d20; }
.success-page .acard-head h3 { margin:0; font-family:Oswald; font-size:18px; font-style:italic; color:#fff; }

/* ══════════════════════════════════════════════════════════
   CHECKOUT — address autocomplete dropdown
══════════════════════════════════════════════════════════ */
.address-autocomplete-wrap { position:relative; }
.address-input-wrap { position:relative; }

/* Scrollbar personnalisée pour les suggestions */
.address-suggestions::-webkit-scrollbar { width:4px; }
.address-suggestions::-webkit-scrollbar-track { background:#0d0f12; }
.address-suggestions::-webkit-scrollbar-thumb { background:var(--red); border-radius:2px; }

/* ══════════════════════════════════════════════════════════
   CHECKOUT STEPS (header)
══════════════════════════════════════════════════════════ */
.checkout-steps { display:flex; align-items:center; justify-content:center; gap:0; margin-bottom:40px; }
.step { display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; max-width:180px; }
.step-num {
  width:44px; height:44px; border-radius:50%; display:grid; place-items:center;
  font-weight:900; font-size:14px; position:relative; z-index:1;
  border:2px solid #2a2d32; background:#111416; color:#666; transition:.3s;
}
.step.done .step-num { background:var(--red); border-color:var(--red); color:#fff; }
.step.active .step-num { border-color:var(--red); color:var(--red); background:#130505; box-shadow:0 0 0 4px rgba(239,11,11,.15); }
.step-label { font-size:10px; font-weight:800; letter-spacing:.8px; color:#555; text-align:center; }
.step.done .step-label, .step.active .step-label { color:#fff; }
.step-line { flex:1; height:2px; background:#1e2124; position:relative; max-width:100px; }
.step-line.done { background:var(--red); }

/* ══════════════════════════════════════════════════════════
   TYPOGRAPHY — Responsive fixes
══════════════════════════════════════════════════════════ */
@media(max-width:780px) {
  .success-page { padding:30px 0 60px; }
  .success-meta { flex-direction:column; }
  .sm-item { border-right:0; border-bottom:1px solid #1e2124; }
  .success-layout { grid-template-columns:1fr; }
  .bank-alert { flex-direction:column; gap:12px; }
  .ba-row { grid-template-columns:1fr; gap:4px; }
  .ba-row small { font-size:9px; }
  .checkout-steps { gap:4px; }
  .step-label { display:none; }
  .step-line { max-width:40px; }
  .step-num { width:36px; height:36px; font-size:12px; }
}