/* ==========================================================================
   Firma elettronica — NON MODIFICARE.

   Regole copiate senza variazioni da modulo-soci-ordinari-style.css, che Sox
   ha approvato come aspetto di riferimento. Valgono per ENTRAMBI i moduli: il
   partner aveva regole proprie (bordo 2px, raggio 8px, altezza mobile 150px)
   e viene allineato a queste.

   Il blocco e' escluso dal restyling: la firma ha valore legale dichiarato ai
   sensi dell'art. 14 CO.

   Il canvas e il suo JS non si toccano in nessuno dei due moduli. I due moduli
   usano tecniche diverse ma entrambe valide:
   - ordinari: resizeCanvas() adatta il buffer alla larghezza CSS;
   - partner:  getPosition() tiene il buffer fisso (500x180) e scala le
     coordinate del puntatore su canvas.width / rect.width.
   Nessuna delle due dipende dai valori di bordo, raggio o padding qui sotto.

   .form-group compare qui perche' dopo il restyling resta usato da un solo
   punto per pagina, il contenitore della firma. Tutti gli altri campi usano
   .mod-campo.
   ========================================================================== */

.form-group {
  display: flex;
  flex-direction: column;
}

.form-group > label {
  font-weight: 500;
  margin-bottom: .5rem;
  color: var(--text-dark);
}

.signature-container {
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

#sigpad {
  width: 100%;
  max-width: 520px;
  height: 180px;
  display: block;
  touch-action: none; /* importante per pointer events su mobile */
  cursor: crosshair;
}

.signature-controls {
  padding: .5rem;
  background: #f8fafc;
  border-top: 1px solid var(--border);
}

.clear-signature {
  padding: .45rem .9rem;
  border: none;
  border-radius: 8px;
  background: var(--border);
  cursor: pointer;
  font-size: .95rem;
  transition: var(--transition);
}

.clear-signature:hover {
  background: #cbd5e1;
}

/* Il breakpoint e' 768px, non 480px: nell'originale questa regola sta dentro
   @media (max-width: 768px) di modulo-soci-ordinari-style.css (righe 636 e
   652). Copiarla a 480px avrebbe alzato il canvas da 140px a 180px per tutte
   le larghezze fra 481 e 768px, cambiando l'aspetto approvato. */
@media (max-width: 768px) {
  #sigpad {
    height: 140px;
  }
}