/* ============================================================
   LJD GLOBAL — Header + Footer pour toutes les pages WP
   Layout pixel-perfect du mockup V4 Vaughn (Crate & Barrel) :
   utility bar NOIRE + 3 cols simples + nav CENTRÉE minimale
   ============================================================ */

body.ljd-theme { color:#1a1a1a; font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
:where(body.ljd-theme a) { color:inherit; } /* spec 0 pour ne pas écraser Tailwind text-* */
.ljd-utility-bar *, .ljd-header *, .ljd-footer * { box-sizing:border-box; }

/* ============ UTILITY BAR (NOIRE V4) ============ */
.ljd-utility-bar { background:#1a1a1a; color:#fff; font-size:12px; padding:8px 0; }
.ljd-utility-inner { max-width:1440px; margin:0 auto; padding:0 24px;
  display:flex; justify-content:space-between; align-items:center; gap:30px; flex-wrap:wrap; }
.ljd-utility-bar a { color:#fff; text-decoration:underline; }
.ljd-utility-bar a:hover { text-decoration:none; }
/* Groupes barre noire : messages à gauche, liens À propos/Contact à droite */
.ljd-utility-msgs { display:flex; gap:30px; align-items:center; flex-wrap:wrap; }
.ljd-utility-links { display:flex; align-items:center; }
.ljd-utility-links a { text-decoration:none; padding:0 12px; position:relative; }
.ljd-utility-links a:hover { text-decoration:underline; }
.ljd-utility-links a + a::before { content:"·"; position:absolute; left:-2px; color:#888;
  text-decoration:none; }
.ljd-utility-links a:last-child { padding-right:0; }

/* ============ MAIN HEADER : 3 colonnes V4 ============ */
.ljd-header { background:#fff; border-bottom:1px solid #e5e5e5; padding:14px 24px 0; }
.ljd-header-top { display:grid; grid-template-columns:1fr auto 1fr;
  align-items:center; max-width:1440px; margin:0 auto; padding-bottom:14px; gap:20px; }

.ljd-header .ljd-utils { display:flex; gap:18px; font-size:12px; color:#666; }
/* Accroche éditoriale serif (colonne gauche, équilibre les icônes de droite) */
.ljd-tagline { font-family:'Bodoni Moda','Playfair Display',Georgia,serif; font-style:italic;
  font-size:15px; color:#2f4a3a; letter-spacing:.01em; white-space:nowrap; }
.ljd-header .ljd-utils a { color:#666; text-decoration:none; transition:color .15s; }
.ljd-header .ljd-utils a:hover { color:#1a1a1a; }
.ljd-utils-right { justify-content:flex-end; gap:24px; }
.ljd-icon-link { display:flex; align-items:center; gap:6px; white-space:nowrap; }
.ljd-icon { font-size:15px; }
/* Icônes SVG ligne (loupe / compte / panier) */
.ljd-utils-right .ljd-icon-link { position:relative; color:#1a1a1a; }
.ljd-utils-right .ljd-icon-link:hover { color:#000; }
.ljd-icon-svg { width:22px; height:22px; display:block; }
/* Badge compteur panier (vert de marque) */
.ljd-cart-link { padding-top:2px; }
.ljd-cart-count {
  position:absolute; top:-7px; right:-9px;
  min-width:18px; height:18px; padding:0 4px; box-sizing:border-box;
  display:flex; align-items:center; justify-content:center;
  background:#2f4a3a; color:#fff; font-size:11px; font-weight:600;
  line-height:1; border-radius:9px;
}

/* Logo central serif Bodoni — taille V4 (26px) */
.ljd-logo { text-align:center; }
.ljd-logo a { font-family:'Bodoni Moda', 'Playfair Display', Georgia, serif;
  font-size:26px; font-weight:500; letter-spacing:0.01em; color:#1a1a1a;
  text-decoration:none; line-height:1; }
.ljd-logo a:hover { text-decoration:none; }
.ljd-logo img { max-height:50px; width:auto; display:inline-block; }
.ljd-logo .custom-logo-link { display:inline-block; }

/* ============ NAV CENTRÉE V4 (pas de search bar, pas de bullets) ============ */
.ljd-nav { max-width:1440px; margin:0 auto; padding:12px 0; font-size:13px; font-weight:500; }
.ljd-nav-list { list-style:none; padding:0; margin:0;
  display:flex; gap:32px; justify-content:center; flex-wrap:wrap; }
.ljd-nav-list li { list-style:none; padding:0; margin:0; display:inline-block; }
.ljd-nav-list li::marker, .ljd-nav-list li::before { content:''; display:none; }
.ljd-nav-list a { color:#1a1a1a; text-decoration:none; padding:6px 0;
  border-bottom:2px solid transparent; transition:border-color .15s; }
.ljd-nav-list a:hover,
.ljd-nav-list .current-menu-item a,
.ljd-nav-list .current_page_item a { border-bottom-color:#1a1a1a; }
.ljd-nav-list .ljd-nav-accent a { color:#d9251c; font-weight:700; }
/* Fallback : si on n'a pas de menu WP, on rend juste les <a> bruts du fallback PHP */
.ljd-nav > a { color:#1a1a1a; text-decoration:none; padding:6px 0; margin:0 16px; }

/* Bouton CTA plein (hero) : garder le texte blanc au survol (le thème le passait en noir) */
.ljd-cta-solid,
.ljd-cta-solid:hover,
.ljd-cta-solid:focus { color:#fff !important; }

/* ============ FOOTER ============ */
.ljd-footer { background:#1a1a1a; color:#ccc; padding:50px 24px 24px; margin-top:80px;
  font-family:'Inter', sans-serif; }
.ljd-footer-cols { max-width:1440px; margin:0 auto;
  display:grid; grid-template-columns:repeat(4, 1fr); gap:40px;
  padding-bottom:30px; border-bottom:1px solid #333; }

.ljd-foot-col p, .ljd-foot-col a { font-size:13px; color:#ccc; margin:0 0 8px;
  text-decoration:none; display:block; line-height:1.6; }
.ljd-foot-col a:hover { color:#fff; }
.ljd-foot-title { font-family:'Bodoni Moda', Georgia, serif; font-size:15px;
  font-weight:500; color:#fff; margin:0 0 14px; text-transform:uppercase;
  letter-spacing:0.08em; }

.ljd-footer-bottom { max-width:1440px; margin:0 auto; padding-top:20px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap;
  gap:14px; font-size:12px; color:#888; }
.ljd-footer-pay { margin:0; }
.ljd-footer-copy { margin:0; }

/* ============ PAGES ÉDITORIALES (contact, à propos, légales) ============ */
/* Centre le contenu ET le titre, masque la sidebar (vide) pour la lisibilité.
   .content-area est float:left dans Shoptimizer -> on retire le float sinon
   margin:auto ne centre pas. Exclut la home et le tunnel WooCommerce. */
body.page:not(.home):not(.woocommerce-page) .content-area {
  float:none;
  width:100%;
  max-width:820px;
  margin-left:auto;
  margin-right:auto;
  padding-left:24px;
  padding-right:24px;
  box-sizing:border-box;
}
body.page:not(.home):not(.woocommerce-page) .entry-header {
  max-width:820px;
  margin-left:auto;
  margin-right:auto;
  padding-left:24px;
  padding-right:24px;
  box-sizing:border-box;
}
body.page:not(.home):not(.woocommerce-page) .widget-area { display:none; }

/* Air en haut des pages éditoriales (sous le menu). */
body.page:not(.home):not(.woocommerce-page) .entry-header { padding-top:50px; }

/* Page Contact : masque le titre "Contact" redondant (le H2 sert de titre)
   et compense l'air en haut puisque le entry-header est masqué. */
body.page-id-720 .entry-header { display:none; }
body.page-id-720 .content-area { padding-top:50px; }

/* Bouton Fluent Forms aligné sur la charte CTA du site (bouton noir uppercase). */
.fluentform .ff-btn-submit,
.fluentform button.ff-btn-submit {
  background:#1a1a1a !important;
  color:#fff !important;
  padding:16px 34px !important;
  font-weight:600 !important;
  font-size:14px !important;
  text-transform:uppercase !important;
  letter-spacing:0.04em !important;
  border:none !important;
  border-radius:2px !important;
  cursor:pointer !important;
  transition:background 0.2s ease !important;
}
.fluentform .ff-btn-submit:hover,
.fluentform button.ff-btn-submit:hover { background:#333 !important; }

/* ============ PANIER / COMMANDE / COMPTE (WooCommerce classique) ============ */
/* .content-area est pleine largeur + float sur ces pages -> on le centre et on
   ajoute des marges, aligné sur la largeur du header/footer (1440). Ciblé sur
   cart/checkout/account uniquement (PAS les archives produit). */
body.woocommerce-cart .content-area,
body.woocommerce-checkout .content-area,
body.woocommerce-account .content-area {
  float:none;
  width:100%;
  max-width:1440px;
  margin-left:auto;
  margin-right:auto;
  padding-left:24px;
  padding-right:24px;
  box-sizing:border-box;
}

/* Notices WooCommerce à la charte LJD (noir/blanc) — retire le vert Shoptimizer. */
.woocommerce-message {
  background:#1a1a1a !important;
  border-top-color:#1a1a1a !important;
  color:#fff !important;
}
.woocommerce-message::before { color:#fff !important; }
.woocommerce-message a:not(.button) { color:#fff !important; }
.woocommerce-message a.button,
.woocommerce-message .button {
  background:#fff !important;
  color:#1a1a1a !important;
  border:none !important;
}
.woocommerce-message a.button:hover,
.woocommerce-message .button:hover { background:#e8e3da !important; color:#1a1a1a !important; }

/* ============ RESPONSIVE ============ */
@media (max-width: 992px) {
  .ljd-header-top { grid-template-columns:1fr; text-align:center; gap:12px; }
  .ljd-header .ljd-utils { justify-content:center; flex-wrap:wrap; }
  .ljd-utils-right { justify-content:center; }
  .ljd-nav { overflow-x:auto; flex-wrap:nowrap; justify-content:flex-start;
    padding:12px 0 8px; }
  .ljd-nav a { white-space:nowrap; }
  .ljd-footer-cols { grid-template-columns:repeat(2, 1fr); gap:30px; }
}

@media (max-width: 480px) {
  .ljd-utility-inner { font-size:10px; gap:14px; }
  .ljd-logo a { font-size:22px; }
  .ljd-footer-cols { grid-template-columns:1fr; }
  .ljd-footer-bottom { flex-direction:column; text-align:center; }
}