/*
 * HolDent — Sticky bottom bar (mobile)
 */

.holdent-sticky-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  /* Auto-flow column: si adatta al numero di bottoni effettivo (2 o 3),
     ognuno occupa 1fr → niente colonne vuote se "Prenota" è nascosto. */
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 2px;
  padding: 8px;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid var(--color-border);
  z-index: var(--z-sticky-cta);
  padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 1023.98px) {
  .holdent-sticky-bar { display: grid; }
  /* Body padding-bottom = altezza effettiva sticky bar (base 72px) + safe-area
     home indicator iPhone (env() può aggiungere fino a ~34px). Senza questa
     somma, su iOS con home indicator la barra appariva "rialzata" perché il
     suo padding-bottom interno aumentava ma il body padding-bottom non si
     adeguava → content visibile sotto la barra. */
  body {
    padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px));
  }
}

/* Nascondi la sticky-bar quando il menu mobile off-canvas è aperto (il menu
   ha già le sue CTA Chiama+WhatsApp in fondo, niente duplicazione + niente
   barra che copre le voci di menu). Class .holdent-mobile-menu-open è messa
   sul body da assets/js/navigation.js al toggle del menu. */
body.holdent-mobile-menu-open .holdent-sticky-bar {
  display: none !important;
}

.holdent-sticky-bar__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 56px;
  border-radius: var(--radius-md);
  font-weight: 700;
  font-size: var(--fs-body-s);
  transition: opacity var(--transition-fast);
}

.holdent-sticky-bar__btn--tel {
  background: var(--color-alternate);
  color: var(--color-primary);
  /* Audit 08giu2026 #8: bordo per staccare il bottone dallo sfondo chiaro */
  border: 1.5px solid var(--color-primary);
}

.holdent-sticky-bar__btn--wa {
  background: var(--color-whatsapp);
  color: #fff;
}

.holdent-sticky-bar__btn--prenota {
  background: var(--color-dark);
  color: #fff;
}