/* NaviFormation — overrides front (FAQ, highlights, promo recap, qty icons) */

/* helper */
.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* FAQ: questions on dark blue with white text */
.faq-item summary{
  background:#0B2A5B;
  color:#fff;
}
.faq-item summary::after{ color: rgba(255,255,255,.92); }
.faq-item[open] summary::after{ color:#fff; }
.faq-body{
  background:#fff;
  color:#0F172A;
}

/* Highlights: remove card borders/shadows (keep centered look) */
.highlight{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 12px 10px !important;
}

/* Call button hover: keep readable over hero media */
.btn-call:hover{
  background: rgba(255,255,255,.92) !important;
}

/* Cart qty: show people icons */
.qty-people{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 46px;
  padding: 0 4px;
  font-size: 16px;
  line-height: 1;
  letter-spacing: 1px;
}

/* Recap: promo line highlighted */
.recap-row.promo{ display:none; }
.recap-row.promo.is-visible{
  display:flex;
  background: rgba(245,158,11,.10);
  border: 1px solid rgba(245,158,11,.25);
  border-radius: 12px;
  padding: 8px 10px;
  margin-top: 6px;
  border-bottom: none;
}
.recap-row.promo.is-visible .recap-left,
.recap-row.promo.is-visible .recap-right{
  color:#B45309;
  font-weight: 1000;
}

/* Recap: permits list row */
.recap-row.permits{
  padding: 6px 0;
}
.permits-list{
  text-align:right;
  color:#334155;
  font-weight: 900;
}


/* Wrap fixes + icons */
.people-icons{
  display:inline-flex;
  align-items:center;
  gap:2px;
  flex-wrap:nowrap;
  white-space:nowrap;
  color: var(--primary);
  vertical-align:middle;
}
.people-icons .pi{
  width:16px;
  height:16px;
  fill: currentColor;
  display:block;
}
.people-icons .more{
  font-weight: 1000;
  margin-left: 2px;
  line-height: 1;
  color: var(--primary);
}

/* Avoid € wrapping in recap amounts (but not the permits multi-line row) */
.recap-row:not(.permits) .recap-right,
.recap-row:not(.permits) .recap-right *{
  white-space:nowrap;
}

/* Permits list: one item per line */
.permits-list{
  display:flex;
  flex-direction:column;
  gap:4px;
  align-items:flex-end;
  text-align:right;
}
.permit-line{
  white-space:nowrap;
}
/* =============================
   V9 HOTFIX – Header / Hero
   ============================= */

/* Menu item "style bouton" */
[data-nav] .nav__link--button {
  background: #0b2d5c;
  color: #fff !important;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 800;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

/* Aligne verticalement le contenu du hero slider */
.hero > .container {
  height: 100%;
  display: flex;
  align-items: center;
}

/* Si un ancien bouton "Appeler" existe encore (callCta), on le masque par défaut */
[data-call-cta] { display: none !important; }

/* Centre verticalement le contenu du Hero/Slider (la .container est centrée mais le texte restait en haut) */
.hero > .container {
  height: 100%;
  display: flex;
  align-items: center;
}

/* Evite les décalages en mobile */
@media (max-width: 768px) {
  .hero { min-height: 520px; }
}

/* ------------------------------
   Header / Menu toggle
   ------------------------------ */

/* "Menu" à gauche des traits et alignement propre */
[data-nav-toggle], .nav__toggle{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  line-height: 1;
}
[data-nav-toggle] .menu-label, .nav__toggle .menu-label{ order: 1; }
[data-nav-toggle] .menu-icon, .nav__toggle .menu-icon{ order: 2; }

/* ------------------------------
   Hero slider : empilement + centrage vertical
   ------------------------------ */

.hero__content{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 14px;
}
.hero__actions{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}


/* v9.2 – Hotfix (menu button color + mobile Menu spacing)
   Keep this file loaded AFTER overrides.css
*/
:root{
  --navy-btn:#0b2d4a;
}

/* Menu item styled as button */
a.is-button,
.nav a.is-button,
.site-nav a.is-button,
.header-nav a.is-button,
.menu a.is-button{
  background: var(--navy-btn) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.0) !important;
  padding: 12px 16px !important;
  border-radius: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .2px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-decoration: none !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.10);
}
a.is-button:hover,
a.is-button:focus-visible{
  filter: brightness(1.05);
  transform: translateY(-1px);
}

/* Make sure the phone number doesn't wrap weirdly in button */
a.is-button .menu-phone,
a.is-button .phone,
a.is-button span{
  white-space: nowrap;
}

/* Mobile burger "Menu" label spacing (avoid touching the icon) */
.menu-toggle,
button.menu-toggle,
.header .menu-toggle{
  display:flex;
  align-items:center;
  gap: 10px; /* space between label and burger */
}

.menu-toggle .label,
button.menu-toggle .label,
.menu-toggle .menu-label{
  margin-right: 6px;
}

/* If your burger is built with pseudo lines inside .burger */
.menu-toggle .burger,
.menu-toggle .hamburger{
  flex: 0 0 auto;
}

/* =============================
   HOTFIX — Burger: "Menu" à gauche des traits
   ============================= */

/* Cible large : toggle menu (desktop+mobile) */
.menu-toggle,
button.menu-toggle,
.nav__toggle,
button.nav__toggle,
[data-nav-toggle]{
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;              /* espace entre texte et burger */
  line-height: 1 !important;
  white-space: nowrap;
}

/* Texte "Menu" (peut être span.label / span.menu-label) */
.menu-toggle .label,
.menu-toggle .menu-label,
.nav__toggle .label,
.nav__toggle .menu-label,
[data-nav-toggle] .label,
[data-nav-toggle] .menu-label{
  position: static !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  order: 1 !important;              /* texte avant */
}

/* Icône burger (peut être .burger / .hamburger / .menu-icon) */
.menu-toggle .burger,
.menu-toggle .hamburger,
.menu-toggle .menu-icon,
.nav__toggle .burger,
.nav__toggle .hamburger,
.nav__toggle .menu-icon,
[data-nav-toggle] .burger,
[data-nav-toggle] .hamburger,
[data-nav-toggle] .menu-icon{
  position: static !important;
  transform: none !important;
  order: 2 !important;              /* burger après */
  flex: 0 0 auto !important;
}

/* Si ton burger est dessiné en pseudo-éléments, on évite qu’ils se baladent */
.menu-toggle .burger::before,
.menu-toggle .burger::after,
.menu-toggle .hamburger::before,
.menu-toggle .hamburger::after,
.nav__toggle .burger::before,
.nav__toggle .burger::after{
  position: relative;
}


/* ordre explicite */
button.nav-toggle[data-nav-toggle] .nav-toggle-label{
  order: 1 !important;
  position: static !important;
  transform: none !important;
  margin: 0 !important;
}

button.nav-toggle[data-nav-toggle] .nav-toggle-icon{
  order: 2 !important;
  position: static !important;
  transform: none !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}

/* évite toute superposition due à des styles existants */
button.nav-toggle[data-nav-toggle] .nav-toggle-label,
button.nav-toggle[data-nav-toggle] .nav-toggle-icon{
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
}



/* Ensure the button fits its content and the label sits left of the burger */
.nav-toggle{width:auto !important;}
.nav-toggle{gap:10px !important;}
.nav-toggle-label{margin-right:6px !important;}

/* Desktop: pas de burger */
@media (min-width: 981px) {
  .nav-toggle { display: none !important; }
  .nav { display: flex !important; }
}

/* Mobile: burger visible */
@media (max-width: 980px) {
  .nav-toggle { display: inline-flex !important; }
}

/* Menu item "style bouton" */
.nav a.nav-btn,
.nav a.nav-btn:visited {
  background: #0B1F3A;   /* bleu foncé */
  color: #fff;
  padding: 10px 14px;
  border-radius: 12px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  border: 1px solid rgba(0,0,0,0.06);
}

/* Hover */
.nav a.nav-btn:hover {
  filter: brightness(1.05);
}

/* Si ton menu mobile empile les liens, on garde un rendu propre */
@media (max-width: 980px) {
  .nav a.nav-btn {
    justify-content: center;
    width: 100%;
  }
}