/* ============================================================
   LARRIEU AUTOMOBILES — HEADER & FOOTER
   Template-parts partagés (header.php / footer.php).
   ============================================================ */

/* ============================================================
   TOP BAR — barre fine au-dessus du header
   Adresse à gauche · réseaux sociaux + téléphone à droite
   ============================================================ */
/* 
html, body{
  overflow-x: clip !important;
} */
  
.topbar{
  background:var(--ink-2);
  border-bottom:1px solid var(--border-ink);
  font-size:var(--text-xs);
}
.topbar__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--space-4); min-height:38px;
}
.topbar__address{
  display:inline-flex; align-items:center; gap:var(--space-2);
  font-family:var(--font-sans); color:var(--on-ink-muted);
  line-height:1.2;
}
.topbar__address i{ color:var(--brand); }
.topbar__address:hover{ color:var(--on-ink); }
.topbar__actions{ display:flex; align-items:center; gap:var(--space-4); }
.topbar__social{
  display:inline-flex; align-items:center; gap:var(--space-2);
  list-style:none; padding:0; margin:0;
}
.topbar__social-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border:1px solid var(--border-ink);
  border-radius:var(--radius-pill); color:var(--on-ink-muted);
  font-size:0.8rem; transition:color .15s, border-color .15s, background-color .15s;
}
.topbar__social-link:hover{
  color:var(--on-brand); background:var(--brand); border-color:var(--brand);
}
.topbar__phone{
  display:inline-flex; align-items:center; gap:var(--space-2);
  font-family:var(--font-mono); font-weight:var(--fw-medium);
  color:var(--on-ink);
}
.topbar__phone i{ color:var(--brand); }
.topbar__phone:hover{ color:var(--brand); }

@media (max-width:575.98px){
  .topbar__address span{ display:none; }
}

/* ============================================================
   HEADER — sticky, présent à l'identique sur toutes les pages
   ============================================================ */
.site-header{
  top:0; z-index:1000;
  background:rgba(14,13,12,0.96);
  /* backdrop-filter:saturate(140%) blur(8px); */
  border-bottom:1px solid var(--border-ink);
}

#bootscore-navbar{
  margin-left: 0 !important;
}
/* .site-header__inner{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--space-5); min-height:76px;
} */
.site-header__logo{ display:inline-flex; align-items:center; }
.site-header__logo img{ max-height:60px; width:auto; }

@media (max-width:425px) {
  .site-header__logo img{ max-height:45px; }
}

/* Navigation principale (desktop) */
/* .site-nav{ display:flex; align-items:center; gap:var(--space-2); list-style:none; padding:0; margin:0; } */
.nav-link{
  display:inline-flex; align-items:center; height:40px; padding:0 var(--space-3);
  font-family:var(--font-sans); font-weight:var(--fw-semibold);
  font-size:var(--text-sm); color:var(--on-ink-muted);
  border-radius:var(--radius-sm); white-space:nowrap;
}
.nav-link:hover{ color:var(--on-ink); }
.nav-link.active{ color:var(--brand) !important; font-weight: 700;}
.nav-link.active::after{
  content:""; position:absolute; }
.site-nav__item{ position:relative; }
.site-nav__item.active .nav-link{ color:var(--brand); }

.nav-toggler {
  background:var(--neutral-700) ;
  color: var(--neutral-400);
  border: none;
}

@media (max-width:991.98px){
  .site-header__nav{ display:none; }
  .site-header__phone--text{ display:none; }
  .site-header__toggle{ display:inline-flex; }
  .site-header__cta--desktop{ display:none; }
}
@media (max-width:575.98px){
  .site-header__cta-compact{ display:none; }
}


/* Responsive */

#offcanvas-navbar{
  background:rgba(14,13,12,0.96);
  /* backdrop-filter:saturate(140%) blur(8px); */
  border-bottom:1px solid var(--border-ink);
}

#offcanvas-navbar .offcanvas-header{
  color: white;
}

#offcanvas-navbar .offcanvas-header .btn-close{
  filter: invert(1);
}

/* ============================================================
   FOOTER — présent à l'identique sur toutes les pages
   ============================================================ */
.site-footer{ background:var(--ink); color:var(--on-ink); }
.site-footer__top{ padding-block:var(--space-10) var(--space-9); }
.site-footer__brand img{ height:46px; width:auto; margin-bottom:var(--space-5); }
.site-footer__tagline{
  color:var(--on-ink-muted); font-size:var(--text-sm);
  line-height:var(--lh-relaxed); max-width:34ch;
}
.site-footer__social{
  display:flex; align-items:center; gap:var(--space-3);
  list-style:none; padding:0; margin:var(--space-5) 0 0;
}
.site-footer__social-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border:1px solid var(--border-ink);
  border-radius:var(--radius-pill); color:var(--on-ink-muted);
  transition:color .15s, border-color .15s, background-color .15s;
}
.site-footer__social-link:hover{
  color:var(--on-brand); background:var(--brand); border-color:var(--brand);
}
.site-footer__col-title{
  font-family:var(--font-sans); font-weight:var(--fw-bold);
  font-size:var(--text-xs); letter-spacing:var(--ls-wider);
  text-transform:uppercase; color:var(--brand);
  margin-bottom:var(--space-5);
}
.site-footer__list{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:var(--space-3); }
.site-footer__link{ color:var(--on-ink-muted); font-size:var(--text-sm); }
.site-footer__link:hover{ color:var(--on-ink); }

.site-footer__contact{ display:flex; flex-direction:column; gap:var(--space-4); }
.site-footer__contact-item{
  display:flex; align-items:flex-start; gap:var(--space-3);
  color:var(--on-ink-muted); font-size:var(--text-sm); line-height:var(--lh-snug);
}
.site-footer__contact-item i{ color:var(--brand); margin-top:3px; width:18px; text-align:center; }
.site-footer__contact-item a{ color:var(--on-ink-muted); }
.site-footer__contact-item a:hover{ color:var(--on-ink); }

.site-footer__hours-row{
  display:flex; justify-content:space-between; gap:var(--space-4);
  font-size:var(--text-sm); color:var(--on-ink-muted);
  padding-block:var(--space-2); border-bottom:1px solid var(--border-ink);
}
.site-footer__hours-row span:last-child{ font-family:var(--font-mono); color:var(--on-ink); }

.site-footer__bottom{
  border-top:1px solid var(--border-ink);
  padding-block:var(--space-5);
}
.site-footer__copy{ font-size:var(--text-xs); color:var(--on-ink-muted); }
.site-footer__legal{ display:flex; gap:var(--space-5); list-style:none; padding:0; margin:0; flex-wrap:wrap; }
.site-footer__legal a{ font-size:var(--text-xs); color:var(--on-ink-muted); }
.site-footer__legal a:hover{ color:var(--on-ink); }


.top-button{
  background: var(--brand);
  border-color: var(--brand);
  transform: scale(1);
  transition: transform .3s ease-in;
}

.top-button:hover, .top-button:active{
  background: var(--brand-hover) !important;
  border-color: var(--brand-hover) !important;
  transform: scale(0.93) !important;
}


/* ============================================================
   COOKIE CONSENT — bandeau RGPD (Bootscore : markup Bootstrap)
   Conteneurs réels : barre #bs-cookie-bar + modale #bs-cookie-modal.
   Habillage aligné sur la charte : thème sombre (--ink-2) + accent --brand.
   ============================================================ */

/* --- Barre de consentement (fixée en bas) --- */
#bs-cookie-bar{
  background-color:var(--ink-2) !important;   /* écrase .bg-body-tertiary */
  color:var(--on-ink);
  border-top:1px solid var(--border-ink);
  box-shadow:0 -.5rem 1.5rem rgba(0,0,0,.35);
}
#bs-cookie-bar #c-ttl{
  font-family:var(--font-sans); font-weight:var(--fw-bold); color:var(--on-ink);
}
#bs-cookie-bar #c-txt{
  color:var(--on-ink-muted); font-size:var(--text-sm); line-height:var(--lh-relaxed);
}
#bs-cookie-bar #consent-links{ border-color:var(--border-ink) !important; }
#bs-cookie-bar #consent-links a{ color:var(--on-ink-muted) !important; }
#bs-cookie-bar #consent-links a:hover{ color:var(--brand) !important; }

/* --- Modale de réglages --- */
#bs-cookie-modal #s-inr{
  background-color:var(--ink-2) !important;   /* écrase .modal-content (var --bs-modal-bg) */
  color:var(--on-ink);
  border:1px solid var(--border-ink);
  border-radius:var(--radius-lg, .75rem);
}
#bs-cookie-modal #s-hdr,
#bs-cookie-modal #s-bns{ border-color:var(--border-ink) !important; }
#bs-cookie-modal #s-ttl{
  font-family:var(--font-sans); font-weight:var(--fw-bold); color:var(--on-ink);
}
/* Bouton « fermer » (croix) rendu visible sur fond sombre, comme l'offcanvas */
#bs-cookie-modal #s-c-bn{ filter:invert(1); }

/* Blocs de catégories */
#bs-cookie-modal .c-bl{ color:var(--on-ink-muted); }
#bs-cookie-modal .c-bl.b-ex{
  background-color:rgba(255,255,255,.04) !important;   /* écrase .bg-body-tertiary */
  border:1px solid var(--border-ink);
}
#bs-cookie-modal .b-tl{
  font-family:var(--font-sans); font-weight:var(--fw-semibold); color:var(--on-ink);
}
#bs-cookie-modal .b-tl::before{
  filter: invert(1) !important;
}
#bs-cookie-modal .desc .p{ color:var(--on-ink-muted); }

/* Interrupteurs (switches Bootstrap) : actif = couleur de marque */
#bs-cookie-modal .form-check-input:checked{
  background-color:var(--brand) !important;
  border-color:var(--brand) !important;
}
#bs-cookie-modal .form-check-input:focus{
  border-color:var(--brand) !important;
  box-shadow:0 0 0 .25rem rgba(255,255,255,.15) !important;
}

/* Tableaux de cookies */
/* #bs-cookie-modal table{ width:100%; font-size:var(--text-xs); color:var(--on-ink-muted); }
#bs-cookie-modal th{ color:var(--on-ink); font-weight:var(--fw-semibold); } */
#bs-cookie-modal th,
#bs-cookie-modal td{
  border-bottom:1px solid var(--border-ink);
 text-align:right; vertical-align:top;
}

/* --- Boutons (.btn Bootstrap) : on pilote les variables --bs-btn-* --- */
/* Tout accepter = couleur de marque */
#c-p-bn, #s-all-bn{
  --bs-btn-color:var(--on-brand); --bs-btn-bg:var(--brand); --bs-btn-border-color:var(--brand);
  --bs-btn-hover-color:var(--on-brand); --bs-btn-hover-bg:var(--brand-hover); --bs-btn-hover-border-color:var(--brand-hover);
  --bs-btn-active-color:var(--on-brand); --bs-btn-active-bg:var(--brand-hover); --bs-btn-active-border-color:var(--brand-hover);
}
/* Tout refuser = bouton plein neutre, aussi visible que « Tout accepter » (RGPD) */
#c-s-bn, #s-rall-bn{
  --bs-btn-color:var(--on-ink); --bs-btn-bg:rgba(255,255,255,.12); --bs-btn-border-color:rgba(255,255,255,.20);
  --bs-btn-hover-color:var(--on-ink); --bs-btn-hover-bg:rgba(255,255,255,.20); --bs-btn-hover-border-color:rgba(255,255,255,.30);
  --bs-btn-active-color:var(--on-ink); --bs-btn-active-bg:rgba(255,255,255,.24); --bs-btn-active-border-color:rgba(255,255,255,.30);
}
/* Personnaliser / Enregistrer = contour discret (action secondaire) */
#set-s-bn, #s-sv-bn{
  --bs-btn-color:var(--on-ink-muted); --bs-btn-bg:transparent; --bs-btn-border-color:var(--border-ink);
  --bs-btn-hover-color:var(--on-ink); --bs-btn-hover-bg:rgba(255,255,255,.08); --bs-btn-hover-border-color:var(--on-ink-muted);
}
/* Rayon + graisse alignés sur les boutons du site */
.c-bn{ border-radius:var(--radius-sm) !important; font-weight:var(--fw-semibold) !important; }


