/* ════════════════════════════════════════════════════════════════
 * Mobile Conversion Layer — Agile Technology suite
 * Riutilizzabile su EViX, QSA, NIS2, TRPG, LG231, ecc.
 * Si attiva SOLO su mobile (≤768px) — desktop invariato.
 * Classi prefissate .mobconv-* per zero conflitti con CSS host.
 * ════════════════════════════════════════════════════════════════ */

/* ── Variabili di tema (override via inline style sul container) ── */
:root {
  --mobconv-accent:   #E31E24;
  --mobconv-accent2:  #B71518;
  --mobconv-bg:       #0A0A0A;
  --mobconv-text:     #FFFFFF;
  --mobconv-sub:      rgba(255,255,255,0.75);
  --mobconv-border:   rgba(255,255,255,0.12);
}

/* ── Sticky CTA bar (bottom) — visibile solo mobile ────────────── */
.mobconv-sticky {
  display: none; /* nascosta di default */
  position: fixed;
  left: 0; right: 0;
  bottom: 0;
  z-index: 9990;
  background: linear-gradient(180deg, rgba(10,10,10,0.96), rgba(10,10,10,1));
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-top: 1px solid var(--mobconv-border);
  padding: 10px 16px;
  padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -8px 32px rgba(0,0,0,0.45);
  transform: translateY(100%);
  transition: transform .28s ease;
}
.mobconv-sticky-row { max-width: 540px; margin: 0 auto; }
.mobconv-cta { max-width: 100%; }
/* iPhone XS / SE: padding ridotto per non sovrastare */
@media (max-width: 380px) {
  .mobconv-sticky { padding: 8px 12px; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
  .mobconv-cta { font-size: 14px !important; padding: 0 12px !important; min-height: 44px !important; }
  .mobconv-pill { min-height: 44px !important; min-width: 44px !important; }
}
.mobconv-sticky.show { transform: translateY(0); }

.mobconv-sticky-row {
  display: flex;
  gap: 8px;
  align-items: stretch;
}

.mobconv-pill {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 48px;
  padding: 0 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
  color: var(--mobconv-text);
  border: 1px solid var(--mobconv-border);
  text-decoration: none;
  font-size: 18px;
  transition: background .15s, transform .15s;
}
.mobconv-pill:active { transform: scale(0.96); background: rgba(255,255,255,0.14); }
.mobconv-pill.wa { background: rgba(37,211,102,0.18); border-color: rgba(37,211,102,0.45); color: #25D366; }

.mobconv-cta {
  flex: 1 1 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 48px;
  padding: 0 16px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--mobconv-accent), var(--mobconv-accent2));
  color: #FFFFFF;
  text-decoration: none;
  font-weight: 700;
  font-size: 14.5px;
  letter-spacing: 0.01em;
  box-shadow: 0 8px 24px rgba(0,0,0,0.35), 0 0 0 1px rgba(255,255,255,0.06) inset;
  transition: transform .15s;
}
.mobconv-cta:active { transform: scale(0.98); }

/* ── WhatsApp FAB (alternativa standalone — usabile su Diamante-like) ── */
.mobconv-wa-fab {
  display: none;
  position: fixed;
  right: 16px;
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  z-index: 9980;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #25D366;
  color: white;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 26px;
  box-shadow: 0 8px 28px rgba(37,211,102,0.45);
  transition: transform .2s, box-shadow .2s;
  animation: mobconv-pulse 2.4s ease-out infinite;
}
.mobconv-wa-fab:active { transform: scale(0.92); }
@keyframes mobconv-pulse {
  0%   { box-shadow: 0 8px 28px rgba(37,211,102,0.45), 0 0 0 0 rgba(37,211,102,0.55); }
  70%  { box-shadow: 0 8px 28px rgba(37,211,102,0.45), 0 0 0 18px rgba(37,211,102,0); }
  100% { box-shadow: 0 8px 28px rgba(37,211,102,0.45), 0 0 0 0 rgba(37,211,102,0); }
}

/* ── Trust ribbon (sotto hero su mobile, opzionale) ─────────────── */
.mobconv-trust {
  display: none;
  background: linear-gradient(180deg, rgba(0,0,0,0.04), rgba(0,0,0,0.02));
  border-top: 1px solid rgba(0,0,0,0.06);
  border-bottom: 1px solid rgba(0,0,0,0.06);
  padding: 14px 12px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.mobconv-trust::-webkit-scrollbar { display: none; }
.mobconv-trust-row {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  white-space: nowrap;
  padding: 0 4px;
}
.mobconv-trust-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(0,0,0,0.7);
  letter-spacing: 0.01em;
}
.mobconv-trust-item::before {
  content: "✓";
  color: var(--mobconv-accent);
  font-weight: 900;
  font-size: 11px;
}
.mobconv-trust-item:not(:first-child)::after {
  content: "·";
  color: rgba(0,0,0,0.25);
  margin-left: 18px;
  font-size: 16px;
  font-weight: 900;
}
/* Variante dark per siti dark-theme */
.mobconv-trust.dark {
  background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));
  border-top-color: rgba(255,255,255,0.08);
  border-bottom-color: rgba(255,255,255,0.08);
}
.mobconv-trust.dark .mobconv-trust-item { color: rgba(255,255,255,0.85); }
.mobconv-trust.dark .mobconv-trust-item:not(:first-child)::after { color: rgba(255,255,255,0.2); }

/* ── Mobile-only: attiva tutto sotto i 768px ─────────────────────── */
@media (max-width: 768px) {
  .mobconv-sticky { display: block; }
  .mobconv-wa-fab[data-enabled="true"] { display: inline-flex; }
  /* Hide WA FAB quando sticky è visibile (ridondante) */
  .mobconv-sticky.show ~ .mobconv-wa-fab { display: none !important; }
  .mobconv-trust { display: block; }

  /* iOS: no zoom su input/select (font-size ≥16px) */
  input, select, textarea {
    font-size: max(16px, 1rem) !important;
  }

  /* Spazio extra in bottom della pagina per non coprire CTA esistenti */
  body.mobconv-padded {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* Su desktop nasconde TUTTO senza margine d'errore */
@media (min-width: 769px) {
  .mobconv-sticky, .mobconv-wa-fab, .mobconv-trust { display: none !important; }
}