/*
 * Caricamento di file · modello 1.0.0 (dal CRM di Daniel Castorani, 07/10/2026)
 *
 * Senza JavaScript il campo file del browser resta visibile. Con lo script
 * (.comp-allegati-pronto) il campo si nasconde alla vista ma resta nel
 * modulo e raggiungibile da tastiera, e l'etichetta diventa la zona.
 */
.comp-allegati{display:flex; flex-direction:column; gap:.5rem; font-family:var(--comp-carattere, inherit);}
.comp-allegati-pronto .comp-allegati-campo{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0;
}
.comp-allegati-zona{
  box-sizing:border-box; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.25rem;
  min-height:7rem; padding:1.25rem 1rem; text-align:center; cursor:pointer;
  border:1.5px dashed var(--comp-bordo-campo, var(--comp-bordo, #c9cec8)); border-radius:var(--comp-raggio, 10px);
  background:var(--comp-superficie, #fff); color:var(--comp-testo-2, #5a6566); font-size:.9375rem;
}
.comp-allegati-azione{
  display:inline-flex; align-items:center; min-height:44px; padding:0 1rem; border-radius:var(--comp-raggio, 10px);
  background:var(--comp-accento, #2b5f5a); color:var(--comp-accento-testo, #fff); font-weight:500;
}
.comp-allegati-aiuto{font-size:.8125rem;}
.comp-allegati-zona:hover, .comp-allegati-zona[data-sopra]{border-color:var(--comp-accento, #2b5f5a); background:var(--comp-superficie-2, #f3f4f2);}
/* Il fuoco è sul campo nascosto: si vede sulla zona. */
.comp-allegati-campo:focus-visible + .comp-allegati-zona{outline:2px solid var(--comp-focus, #2b5f5a); outline-offset:2px;}
.comp-allegati-campo[aria-invalid="true"] + .comp-allegati-zona{border-color:var(--comp-errore, #9b2c2c);}

.comp-allegati-scelti{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.375rem;}
.comp-allegati-scelti:empty{display:none;}
.comp-allegati-file{
  display:flex; align-items:center; gap:.75rem; padding:.375rem .375rem .375rem .5rem;
  border:1px solid var(--comp-bordo, #d9ddd8); border-radius:var(--comp-raggio, 10px); background:var(--comp-superficie, #fff);
}
.comp-allegati-file[data-troppo]{border-color:var(--comp-errore, #9b2c2c); background:var(--comp-errore-sfondo, #fbe7e6);}
.comp-allegati-miniatura{
  flex:none; width:44px; height:44px; display:inline-flex; align-items:center; justify-content:center; overflow:hidden;
  border-radius:var(--comp-raggio-piccolo, 8px); background:var(--comp-superficie-2, #f3f4f2); color:var(--comp-testo-2, #5a6566);
  font-family:ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.6875rem; letter-spacing:.06em;
}
.comp-allegati-miniatura img{width:100%; height:100%; object-fit:cover; display:block;}
.comp-allegati-testo{flex:1; min-width:0; display:flex; flex-direction:column;}
.comp-allegati-nome{font-size:.9375rem; color:var(--comp-testo, #1f2a2b); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.comp-allegati-peso{font-size:.8125rem; color:var(--comp-testo-2, #5a6566);}
.comp-allegati-file[data-troppo] .comp-allegati-peso{color:var(--comp-errore, #9b2c2c);}
.comp-allegati-togli{
  flex:none; min-height:44px; padding:0 .75rem; border:0; border-radius:var(--comp-raggio-piccolo, 8px);
  background:transparent; color:var(--comp-testo-2, #5a6566); font:inherit; font-size:.875rem; cursor:pointer;
}
.comp-allegati-togli:hover{background:var(--comp-superficie-2, #f3f4f2); color:var(--comp-testo, #1f2a2b);}
.comp-allegati-togli:focus-visible{outline:2px solid var(--comp-focus, #2b5f5a); outline-offset:1px;}
/* Al tocco non si trascina: la frase non serve. */
@media (pointer: coarse){ .comp-allegati-trascina{display:none;} .comp-allegati-zona{min-height:5rem;} }