/**
 * sbz-ui.css — stili condivisi per l'icona "?" (.sbpm-help) e le varianti toast
 * info/help/close usate da sbz-ui.js. Caricato su /iscriviti/ e /dashboard/.
 *
 * Le classi base .sbpmd-toast / .sbpmd-toast-wrap vivono in dashboard.css.
 * @since 3.6.0
 */

/* ---- Icona "?" -------------------------------------------------------------- */
.sbpm-help{
  display:inline-flex;align-items:center;justify-content:center;
  width:18px;height:18px;min-width:18px;
  border-radius:50%;border:1.5px solid var(--border,#d0d0d0);background:transparent;
  color:var(--ink-faint,#888);font-size:.72rem;font-weight:700;line-height:1;
  cursor:pointer;vertical-align:middle;margin-left:6px;padding:0;
  transition:border-color .15s ease,color .15s ease;
}
.sbpm-help:hover{border-color:var(--crimson,#c01e1e);color:var(--crimson,#c01e1e)}
.sbpm-help:focus-visible{outline:2px solid var(--crimson,#c01e1e);outline-offset:2px}
@media (pointer:coarse){
  .sbpm-help{width:24px;height:24px;min-width:24px} /* tap target */
}

/* ---- Toast: variante informativa + help (multi-riga, chiudibile) ------------ */
.sbpmd-toast--info{background:#1f2937}

.sbpmd-toast--help{
  align-items:flex-start;
  max-width:420px;
  background:#1a1a1a;
  text-align:left;
  padding-right:38px;       /* spazio per il "×" */
  /* Centrato verticalmente nel viewport (esce dal flusso del wrap, che è
     ancorato in basso a destra per i toast di servizio). */
  position:fixed;
  top:50%;
  right:20px;
  left:auto;
  /* !important per battere la regola base .sbpmd-toast.is-in (stessa specificità) */
  transform:translateY(-50%) scale(.97)!important;
}
.sbpmd-toast--help.is-in{
  transform:translateY(-50%) scale(1)!important;
}
@media (max-width:768px){
  .sbpmd-toast--help{ left:16px; right:16px; max-width:none; }
}
.sbpmd-toast__body{display:flex;flex-direction:column;gap:5px;min-width:0}
.sbpmd-toast__title{font-size:1rem;font-weight:700;line-height:1.3}
.sbpmd-toast__line{
  margin:0;font-weight:500;font-size:.9rem;line-height:1.4;
  color:#f0f0f0;white-space:normal;
}
.sbpmd-toast__line strong{font-weight:700;color:#fff}
.sbpmd-toast__text{white-space:pre-line}

.sbpmd-toast__close{
  /* !important + appearance:none per neutralizzare gli stili <button> del Kit
     Elementor (padding 8px 16px → la "×" finiva fuori centro / box 43px). */
  -webkit-appearance:none;appearance:none;box-sizing:border-box;
  position:absolute;top:8px;right:8px;
  width:28px!important;height:28px!important;min-width:28px;
  padding:0!important;margin:0!important;
  border:none!important;background:transparent;color:rgba(255,255,255,.7);
  font-size:1.4rem!important;line-height:1!important;font-weight:400!important;text-align:center;text-indent:0;
  cursor:pointer;border-radius:6px;
  pointer-events:auto;display:flex!important;align-items:center;justify-content:center;
  box-shadow:none!important;
}
.sbpmd-toast__close:hover{color:#fff;background:rgba(255,255,255,.12)}
.sbpmd-toast__close:focus-visible{outline:2px solid rgba(255,255,255,.6);outline-offset:1px}

/* Il singolo toast riceve pointer-events:auto (il wrap è pointer-events:none). */
.sbpmd-toast--help{pointer-events:auto}

/* ---- Avviso policy foto (inline) -------------------------------------------- */
.sbz-photo-policy{
  display:flex;align-items:flex-start;gap:10px;
  margin:14px 0 4px;padding:11px 14px;
  background:#fff8e6;border:1px solid #f1d486;border-left:3px solid #e0a800;
  border-radius:8px;
}
.sbz-photo-policy__icon{font-size:1.05rem;line-height:1.4;color:#a87900;flex:0 0 auto}
.sbz-photo-policy__text{
  margin:0;font-size:.85rem;line-height:1.45;color:#5a4a1a;
}
.sbz-photo-policy__text strong{color:#3d3210}
.sbz-policy-link{
  display:inline;padding:0;border:none;background:none;
  color:var(--crimson,#c01e1e);font:inherit;font-weight:700;
  text-decoration:underline;text-underline-offset:2px;cursor:pointer;
}
.sbz-policy-link:hover{color:#9a1717}
.sbz-policy-link:focus-visible{outline:2px solid var(--crimson,#c01e1e);outline-offset:2px;border-radius:3px}

/* ---- Modale (popup/termini) ------------------------------------------------- */
.sbz-modal-overlay{
  position:fixed;inset:0;z-index:99999;
  display:flex;align-items:center;justify-content:center;padding:20px;
  background:rgba(15,15,18,.55);
  opacity:0;transition:opacity .2s ease;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
}
.sbz-modal-overlay.is-in{opacity:1}
.sbz-modal{
  position:relative;width:100%;max-width:480px;max-height:85vh;overflow:auto;
  background:#fff;border-radius:14px;padding:26px 24px 22px;
  box-shadow:0 18px 50px rgba(0,0,0,.3);
  transform:translateY(10px) scale(.98);transition:transform .2s ease;
  font-family:inherit;
}
.sbz-modal-overlay.is-in .sbz-modal{transform:none}
.sbz-modal__close{
  position:absolute;top:10px;right:12px;
  width:32px;height:32px;padding:0;border:none;background:transparent;
  color:#888;font-size:1.6rem;line-height:1;cursor:pointer;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
}
.sbz-modal__close:hover{color:#222;background:rgba(0,0,0,.06)}
.sbz-modal__close:focus-visible{outline:2px solid var(--crimson,#c01e1e);outline-offset:1px}
.sbz-policy-modal__title{
  font-size:1.18rem;font-weight:800;line-height:1.25;color:#1a1a1a;
  margin:0 28px 12px 0;
}
.sbz-policy-modal__body{font-size:.92rem;line-height:1.5;color:#3a3a3a}
.sbz-policy-modal__body p{margin:0 0 10px}
.sbz-policy-modal__body ul{margin:0 0 10px;padding-left:20px}
.sbz-policy-modal__body li{margin:0 0 5px}
.sbz-policy-modal__body strong{color:#1a1a1a}
.sbz-policy-modal__cta{
  display:inline-flex;align-items:center;margin-top:6px;
  padding:10px 18px;border-radius:9px;
  background:var(--crimson,#c01e1e);color:#fff;font-weight:700;font-size:.9rem;
  text-decoration:none;
}
.sbz-policy-modal__cta:hover{background:#9a1717;color:#fff}
.sbz-policy-modal__cta:focus-visible{outline:2px solid #1a1a1a;outline-offset:2px}