/* ==========================================================================
   Mobile : barre fixe en bas d'écran « Appeler / Réserver » (components/footer.php).
   Invisible sur ordinateur. Masquée quand le menu mobile est ouvert.
   Fichier chargé à part (avec ?v=) depuis components/head.php.
   ========================================================================== */
.barre-mobile { display: none; }

/* Points des carrousels : même rond de 12px, mais zone de toucher de 32px
   (au lieu de 12px), plus facile à viser au doigt. Surcharge carousel.css. */
.carousel__dots { gap: 0; }
.carousel__dot {
  width: 32px; height: 32px;
  display: grid; place-items: center;
  background: transparent;
}
.carousel__dot::before {
  content: "";
  width: 12px; height: 12px; border-radius: 50%;
  background: #fff;
  transition: background .2s;
}
.carousel__dot.active { background: transparent; }
.carousel__dot.active::before { background: var(--c-red); }
.carousel__dot:focus-visible { outline: 2px solid var(--c-cyan); outline-offset: -4px; border-radius: 50%; }

@media (max-width: 760px) {
  .barre-mobile {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 95; /* sous le header (99), le menu (1300), les modales (1301) et le bandeau cookies */
    display: grid;
    grid-template-columns: 1fr 1.6fr;
    gap: .6rem;
    padding: .6rem 16px calc(.6rem + env(safe-area-inset-bottom, 0px));
    background: rgba(10, 10, 18, .92);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border-top: 1px solid rgba(255, 255, 255, .12);
    transition: transform .3s ease;
  }
  .barre-mobile__btn {
    display: flex; align-items: center; justify-content: center; gap: .5rem;
    min-height: 48px;
    border-radius: 999px;
    font-family: var(--font-display);
    text-transform: uppercase;
    letter-spacing: .5px;
    font-size: 1rem;
    color: #fff;
    text-decoration: none;
  }
  .barre-mobile__btn--appel { border: 2px solid rgba(255, 255, 255, .7); }
  .barre-mobile__btn--reserver { background: var(--c-red); box-shadow: 0 6px 18px rgba(245, 51, 63, .35); }
  .barre-mobile__btn:focus-visible { outline: 2px solid var(--c-cyan); outline-offset: 2px; }
  body.menu-open .barre-mobile { transform: translateY(110%); }
  /* Place pour ne rien cacher en bas de page. */
  body:has(.barre-mobile) { padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px)); }
}