/* =============================================================================
   AB — Sticky Footer d'agenzia v1 — agribarbicate.it
   Blocco autonomo. Prefisso unico `.ab-sticky-*` / `.ab-assist*` / `.ab-modal*`,
   token scoped `--ab-*`. Nessuna dipendenza dal tema (haven-child).
   Sorgente di verita' dello STILE = QUESTO FILE.
   Pattern: agriturismovallemartina.it (barra, `vm-sticky-v2.css`) +
            studiocaputovellotti.it (finestra modale, `cv-styles.css`).
   Adattamenti dichiarati rispetto alle sorgenti:
     - prefisso `vm-`/`cv-` -> `ab-`;
     - i token del tema Astra usati dalla modale di caputovellotti
       (--surface, --ink, --ink-3, --line, --r-xl, --shadow-xl, --z-modal,
       --font-display, --t-fast, --c-primary) NON esistono su Haven: sono stati
       risolti in valori concreti equivalenti, dichiarati qui sotto come `--ab-*`.
   ============================================================================= */

/* ── BARRA ─────────────────────────────────────────────────────────────────── */
.ab-sticky-bar {
  --ab-blu: #1B355A;   /* blu CTA d'agenzia          */
  --ab-wa:  #25D366;   /* verde WhatsApp ufficiale   */
  --ab-red: #FF0000;   /* rosso stato aperto         */
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 99990;      /* SOTTO il banner del consenso (99999): non si scavalca */
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.78);
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  backdrop-filter: blur(18px) saturate(180%);
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 -6px 24px rgba(14, 34, 54, 0.06);
  padding: 12px clamp(20px, 4vw, 48px);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: inherit;
}
.ab-sticky-bar *,
.ab-sticky-bar *::before,
.ab-sticky-bar *::after { box-sizing: border-box; }

.ab-sticky-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  max-width: 100%;
  flex-wrap: nowrap;
}

/* Spazio in fondo al documento pari all'ingombro reale della barra
   (12+12 padding + 46 dell'elemento piu' alto = 70px) + margine di respiro. */
body { padding-bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important; }

/* ── BOTTONI AZIONE (pill icona + label) ───────────────────────────────────── */
.ab-sticky-bar a.ab-btn,
.ab-sticky-bar button.ab-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0;
  padding: 11px 20px;
  border-radius: 999px;
  border: 2px solid var(--ab-blu);
  background: var(--ab-blu);
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.01em;
  text-decoration: none;
  text-transform: none;
  white-space: nowrap;
  box-shadow: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.ab-sticky-bar a.ab-btn:visited { color: #fff; }
.ab-sticky-bar .ab-ico {
  width: 18px; height: 18px;
  flex: 0 0 auto;
  display: block;
  fill: currentColor;
}
.ab-sticky-bar .ab-lbl { display: inline; }

/* hover = inversione (fondo bianco, bordo/testo/icona nel colore del bottone) */
@media (hover: hover) and (pointer: fine) {
  .ab-sticky-bar a.ab-btn:hover,
  .ab-sticky-bar button.ab-btn:hover {
    background: #fff;
    border-color: var(--ab-blu);
    color: var(--ab-blu);
    box-shadow: 0 14px 28px -10px rgba(0, 0, 0, .25);
  }
  .ab-sticky-bar a.ab-btn--wa:hover {
    border-color: var(--ab-wa);
    color: var(--ab-wa);
  }
}
.ab-sticky-bar a.ab-btn:focus-visible,
.ab-sticky-bar button:focus-visible {
  outline: 2px solid var(--ab-blu);
  outline-offset: 3px;
}

/* WhatsApp — verde ufficiale */
.ab-sticky-bar a.ab-btn--wa {
  background: var(--ab-wa);
  border-color: var(--ab-wa);
  color: #fff;
}

/* ── SLOT BOT RISERVATO (nessun bottone emesso in questo run) ───────────────
   Le regole restano qui, inerti: il markup del bottone dell'assistente si
   inserisce DOPO "Dove siamo" e diventa visibile solo quando lo snippet
   dell'embed aggiunge la classe .ab-chat-on su <html>. Senza quella classe
   non c'e' traccia del bottone in pagina. Stessa meccanica di vallemartina. */
.ab-sticky-bar .ab-assist {
  display: none;
  align-items: center;
  justify-content: center;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  border-radius: 999px;
  font: inherit;
  line-height: 1;
  color: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
html.ab-chat-on .ab-sticky-bar .ab-assist { display: inline-flex; }
.ab-sticky-bar .ab-assist:hover,
.ab-sticky-bar .ab-assist:focus,
.ab-sticky-bar .ab-assist:active {
  background: none !important;
  box-shadow: none !important;
}
.ab-sticky-bar .ab-assist-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0;
  border-radius: 999px;
  background: transparent;
  transition: background .15s ease;
}
.ab-sticky-bar .ab-assist-ava {
  flex: 0 0 auto;
  width: 46px; height: 46px;
  border-radius: 50%;
  border: 2px solid var(--ab-blu);
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .15s ease, border-color .15s ease;
}
.ab-sticky-bar .ab-assist-disc {
  flex: 0 0 auto;
  width: 30px; height: 30px;
  border-radius: 50%;
  overflow: hidden;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.ab-sticky-bar .ab-assist-disc img {
  width: 100%; height: 100%;
  object-fit: contain;
  display: block;
  border: 0;
  box-shadow: none;
  margin: 0;
}
.ab-sticky-bar .ab-assist-x { display: none; width: 18px; height: 18px; }
.ab-sticky-bar .ab-assist-label {
  font-family: inherit;
  font-weight: 700;
  font-size: 15px;
  color: var(--ab-blu);
  padding: 4px 8px;
  white-space: nowrap;
  transition: color .15s ease;
}
.ab-sticky-bar .ab-assist.is-open .ab-assist-ava   { border-color: var(--ab-red); }
.ab-sticky-bar .ab-assist.is-open .ab-assist-label { color: var(--ab-red); }
.ab-sticky-bar .ab-assist.is-open .ab-assist-disc img { display: none; }
.ab-sticky-bar .ab-assist.is-open .ab-assist-x        { display: block; }
@media (hover: hover) and (pointer: fine) {
  .ab-sticky-bar .ab-assist:hover .ab-assist-pill  { background: var(--ab-blu); }
  .ab-sticky-bar .ab-assist:hover .ab-assist-ava   { background: var(--ab-blu); border-color: var(--ab-blu); }
  .ab-sticky-bar .ab-assist:hover .ab-assist-label { color: #fff; }
  .ab-sticky-bar .ab-assist.is-open:hover .ab-assist-pill  { background: var(--ab-red); }
  .ab-sticky-bar .ab-assist.is-open:hover .ab-assist-ava   { background: var(--ab-red); border-color: var(--ab-red); }
  .ab-sticky-bar .ab-assist.is-open:hover .ab-assist-label { color: #fff; }
}

/* ── FINESTRA MODALE "DOVE SIAMO" ──────────────────────────────────────────
   Fotocopiata da studiocaputovellotti.it (`.cv-modal*`) e adattata: i token del
   tema Astra non esistono su Haven, quindi sono risolti in valori concreti. */
.ab-modal {
  position: fixed; inset: 0;
  z-index: 99995;               /* sopra la barra (99990), SOTTO il banner (99999) */
  background: rgba(14, 34, 54, 0.55);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  display: none;
  align-items: center; justify-content: center;
  padding: 20px;
}
.ab-modal * , .ab-modal *::before, .ab-modal *::after { box-sizing: border-box; }
.ab-modal.is-open { display: flex; }

.ab-modal-content {
  background: #fff;
  border-radius: 18px;
  max-width: 640px; width: 100%;
  max-height: 92vh; overflow-y: auto;
  box-shadow: 0 30px 60px -20px rgba(14, 34, 54, .35);
  position: relative;
  font-family: inherit;
}
.ab-modal-content--map { max-width: 1080px; padding: 0; }

.ab-modal-close {
  position: absolute; top: 16px; right: 16px;
  width: 36px; height: 36px; border-radius: 50%;
  border: 0;
  background: rgba(14, 34, 54, 0.06);
  display: inline-flex; align-items: center; justify-content: center;
  color: #0E2236;
  font-size: 20px; line-height: 1;
  cursor: pointer;
  transition: background .15s ease;
  z-index: 2;
}
.ab-modal-close:hover { background: rgba(14, 34, 54, 0.12); }
.ab-modal-close:focus-visible { outline: 2px solid #1B355A; outline-offset: 2px; }

.ab-modal-map-header {
  padding: 20px 28px;
  display: flex; align-items: center; gap: 14px; justify-content: space-between;
  border-bottom: 1px solid rgba(14, 34, 54, 0.12);
  flex-wrap: wrap;
}
.ab-modal-map-header h3 {
  margin: 0;
  font-family: inherit;
  font-size: 1.25rem;
  font-weight: 600;
  color: #0E2236;
}
.ab-modal-map-header span { font-size: 0.875rem; color: #5A6B7B; }

.ab-modal-map-frame {
  width: 100%; height: 70vh; min-height: 480px;
  border: 0;
  background: #EEF1F4;
  /* La mappa e' un SERVIZIO di terza parte: finche' Complianz non la sblocca
     (aggiungendo la classe `cmplz-activated`) l'iframe resta nascosto e al suo
     posto si vede il segnaposto qui sotto. Misurato: su questo markup Complianz
     NON inserisce un segnaposto proprio, quindi senza questa regola il riquadro
     resterebbe un rettangolo grigio vuoto. */
  display: none;
}
.ab-modal-map-frame.cmplz-activated { display: block; }
.ab-modal-map-frame.cmplz-activated + .ab-map-fallback { display: none; }

/* Segnaposto proprio: stessa altezza del riquadro della mappa, cosi' la finestra
   non cambia forma quando la mappa si sblocca. */
.ab-map-fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  text-align: center;
  width: 100%;
  height: 70vh; min-height: 480px;
  padding: 24px;
  background: #EEF1F4;
  color: #5A6B7B;
}
.ab-map-fallback p { margin: 0; max-width: 46ch; font-size: 0.95rem; line-height: 1.5; }
.ab-map-fallback .ab-map-consent {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 18px;
  border-radius: 999px;
  border: 2px solid #1B355A;
  background: #1B355A;
  color: #fff;
  font-family: inherit;
  font-size: 14px; font-weight: 600; line-height: 1;
  cursor: pointer;
}
.ab-map-fallback .ab-map-consent:hover { background: #fff; color: #1B355A; }
.ab-map-fallback .ab-map-consent:focus-visible { outline: 2px solid #1B355A; outline-offset: 3px; }

.ab-modal-actions {
  padding: 0 28px;
  display: flex; gap: 12px; flex-wrap: wrap; align-items: center;
}
.ab-modal-actions .ab-modal-maplink {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 16px;
  padding: 9px 18px;
  border-radius: 999px;
  border: 2px solid #1B355A;
  background: #1B355A;
  color: #fff;
  font-size: 14px; font-weight: 600; line-height: 1;
  text-decoration: none;
}
.ab-modal-actions .ab-modal-maplink:hover { background: #fff; color: #1B355A; }
.ab-modal-actions .ab-modal-maplink:focus-visible { outline: 2px solid #1B355A; outline-offset: 3px; }

.ab-modal-close-row { text-align: center; margin: 16px 0 20px; }
.ab-modal-close-link {
  display: inline-block;
  background: transparent;
  border: 1px solid #5A6B7B;
  border-radius: 6px;
  padding: 7px 16px;
  cursor: pointer;
  font-size: 0.875rem;
  color: #5A6B7B;
  text-decoration: none;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.ab-modal-close-link:hover { background: #5A6B7B; border-color: #5A6B7B; color: #fff; }
.ab-modal-close-link:focus-visible { outline: 2px solid #1B355A; outline-offset: 2px; }

/* ── MOBILE ≤700px: SOLI cerchi 46×46 icon-only ────────────────────────────── */
@media (max-width: 700px) {
  .ab-sticky-bar { padding: 10px 12px; }
  .ab-sticky-inner { gap: 14px; }
  .ab-sticky-bar a.ab-btn,
  .ab-sticky-bar button.ab-btn {
    flex: 0 0 auto;
    width: 46px; height: 46px;
    padding: 0;
    gap: 0;
    border-radius: 50%;
  }
  .ab-sticky-bar .ab-lbl { display: none; }
  .ab-sticky-bar .ab-ico { width: 20px; height: 20px; }
  .ab-sticky-bar .ab-assist-label { display: none; }
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)) !important; }

  .ab-modal { padding: 12px; }
  .ab-modal-map-header { padding: 16px 20px; }
  .ab-modal-actions { padding: 0 20px; }
  .ab-modal-map-frame,
  .ab-map-fallback { height: 60vh; min-height: 360px; }
}
@media (max-width: 360px) {
  .ab-sticky-inner { gap: 10px; }
}

/* ── ATTERRAGGIO DELL'ANCORA DEL MODULO DEI CONTATTI ───────────────────────
   Il bottone "Email" della barra porta a /contatti/#contatti-form. Misurato il
   20 agosto 2026 con browser reale su quattro profili (Chromium/WebKit x
   desktop/mobile) e in quattro posizioni di scorrimento: in ALTO questa pagina
   NON ha nessun elemento fisso o appiccicato — l'intestazione del sito scorre
   via. Gli unici elementi fissi stanno in BASSO (barra contatti 69/67px,
   "torna su" 45px, bottone del consenso 50px). Il margine qui sotto non deve
   quindi scansare niente: serve solo a staccare il modulo dal bordo alto della
   finestra, e supera con margine il minimo di 16px richiesto. */
#contatti-form { scroll-margin-top: 24px; }

/* ── STAMPA ────────────────────────────────────────────────────────────────── */
@media print {
  .ab-sticky-bar { display: none !important; }
  .ab-modal { display: none !important; }
  body { padding-bottom: 0 !important; }
}
