/* Scandolafruit — colori presi dal logo */
:root {
  --verde: #31a944;
  --verde-scuro: #23803a;
  --verde-chiaro: #e8f6ea;
  --rosso: #e4032d;
  --rosso-chiaro: #fde8ec;
  --scuro: #12251a;
  --scuro-2: #1d3a27;
  --sfondo: #f4f6f2;
  --carta: #ffffff;
  --testo: #1c2a21;
  --tenue: #5f6f64;
  --bordo: #dde3dc;
  --giallo: #f5a524;
  --blu: #2f6fd0;
  --raggio: 12px;
  --ombra: 0 1px 2px rgba(18, 37, 26, .06), 0 4px 16px rgba(18, 37, 26, .06);
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--sfondo);
  color: var(--testo);
  font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
body.incorporato { background: transparent; }
a { color: var(--verde-scuro); }
h1, h2 { line-height: 1.2; margin: 0 0 .5rem; }
h1 { font-size: 1.75rem; }
h2 { font-size: 1.1rem; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nascosto { display: none !important; }

.contenitore { max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.contenitore--stretto { max-width: 820px; }
main.contenitore { padding-top: 24px; padding-bottom: 48px; }

/* Testata */
.testata { background: var(--scuro); color: #fff; }
.testata__riga { display: flex; align-items: center; gap: 24px; min-height: 64px; flex-wrap: wrap; }
.marchio { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; font-size: 1.25rem; letter-spacing: -.01em; }
.marchio img { display: block; height: 28px; width: auto; }
.marchio em { font-style: normal; font-size: .75rem; text-transform: uppercase; letter-spacing: .08em; background: var(--scuro-2); padding: 3px 8px; border-radius: 99px; color: #cfe3d4; }
.testata__tag { margin-left: auto; color: #cfe3d4; font-size: .95rem; }
.menu { display: flex; gap: 4px; flex-wrap: wrap; }
.menu a { color: #cfe3d4; text-decoration: none; padding: 8px 12px; border-radius: 8px; font-size: .95rem; }
.menu a:hover { background: var(--scuro-2); color: #fff; }
.menu a.attivo { background: var(--scuro-2); color: #fff; box-shadow: inset 0 -2px 0 var(--verde); }
.esci { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.chi { color: #cfe3d4; font-size: .9rem; }

/* Bottoni */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: 1px solid var(--bordo); background: var(--carta); color: var(--testo);
  padding: 9px 16px; border-radius: 8px; font: inherit; font-weight: 600; font-size: .95rem;
  text-decoration: none; cursor: pointer; white-space: nowrap;
}
.btn:hover { border-color: #b9c4bb; }
.btn--primario { background: var(--verde); border-color: var(--verde); color: #fff; }
.btn--primario:hover { background: var(--verde-scuro); border-color: var(--verde-scuro); }
.btn--secondario { background: var(--carta); }
.btn--pericolo { background: var(--carta); color: var(--rosso); border-color: #f3b3c0; }
.btn--pericolo:hover { background: var(--rosso-chiaro); border-color: var(--rosso); }
.btn--trasparente { background: transparent; color: #fff; border-color: #3c5a46; }
.btn--trasparente:hover { border-color: #fff; }
.btn--piccolo { padding: 6px 12px; font-size: .875rem; }
.btn--grande { padding: 14px 28px; font-size: 1.05rem; }
.btn[disabled] { opacity: .6; cursor: progress; }

/* Avvisi */
.avviso { border-radius: var(--raggio); padding: 14px 18px; margin: 16px 0; border: 1px solid; }
.avviso p, .avviso ul { margin: .25rem 0; }
.avviso ul { padding-left: 1.2rem; }
.avviso--ok { background: var(--verde-chiaro); border-color: #b5e0bc; color: #17542a; }
.avviso--errore { background: var(--rosso-chiaro); border-color: #f5b5c2; color: #8a0a24; }
.avviso--info { background: #eef4fc; border-color: #c8daf4; color: #1d3f72; }

/* Schede e moduli */
.scheda { background: var(--carta); border: 1px solid var(--bordo); border-radius: var(--raggio); box-shadow: var(--ombra); padding: 20px; margin: 0 0 16px; }
fieldset.scheda { min-width: 0; }
.scheda legend { font-weight: 700; font-size: 1.1rem; padding: 0 6px; margin-left: -6px; display: flex; align-items: center; gap: 10px; }
.numero { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--verde); color: #fff; font-size: .9rem; }
.intro { margin: 16px 0 24px; }
.intro p { color: var(--tenue); font-size: 1.05rem; }
.nota { color: var(--tenue); font-size: .92rem; margin: 0 0 12px; }

.griglia { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.griglia--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; }
.campo { display: flex; flex-direction: column; gap: 5px; }
.campo--largo { grid-column: 1 / -1; }
.campo label { font-weight: 600; font-size: .92rem; }
.campo small { color: var(--tenue); font-size: .82rem; }
.req { color: var(--rosso); }
input[type=text], input[type=email], input[type=tel], input[type=date], input[type=password], input[type=search], input:not([type]), select, textarea {
  width: 100%; font: inherit; color: inherit; background: #fff;
  border: 1px solid #c9d2ca; border-radius: 8px; padding: 10px 12px; min-height: 44px;
}
textarea { resize: vertical; }
/* Su iPhone i campi data hanno una larghezza minima propria e uscivano dal riquadro */
input[type=date] { -webkit-appearance: none; appearance: none; display: block; min-width: 0; max-width: 100%; text-align: left; }
input[type=date]::-webkit-date-and-time-value { text-align: left; margin: 0; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--verde); box-shadow: 0 0 0 3px rgba(49, 169, 68, .2); }
input.maiuscolo { text-transform: uppercase; }
input:user-invalid, select:user-invalid { border-color: var(--rosso); }

.documenti { display: grid; gap: 10px; }
.doc { display: flex; align-items: center; gap: 16px; border: 1px dashed #c3cdc5; border-radius: 10px; padding: 12px 14px; background: #fafcf9; }
.doc--fatto { border-style: solid; border-color: #b5e0bc; background: var(--verde-chiaro); }
.doc__testo { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.doc__testo small { color: var(--tenue); font-size: .85rem; }
.doc__caricati { color: var(--verde-scuro) !important; }
.doc__scelti { font-size: .85rem; color: var(--verde-scuro); font-weight: 600; overflow-wrap: anywhere; }
.doc__bottone { position: relative; overflow: hidden; }
.doc__bottone input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.doc__bottone:focus-within { box-shadow: 0 0 0 3px rgba(49, 169, 68, .3); }

.spunta { display: flex; gap: 12px; align-items: flex-start; cursor: pointer; }
.spunta input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--verde); flex: none; }
.trappola { position: absolute; left: -9999px; }
.invio { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-top: 8px; }
.invio small { color: var(--tenue); }

/* Scelta lingua */
.lingue { display: flex; justify-content: flex-end; gap: 4px; margin-bottom: -8px; }
.lingue a { padding: 4px 12px; border-radius: 99px; font-size: .9rem; font-weight: 600; text-decoration: none; color: var(--tenue); border: 1px solid var(--bordo); background: var(--carta); }
.lingue a:hover { border-color: var(--verde); color: var(--verde-scuro); }
.lingue a.attiva { background: var(--verde); border-color: var(--verde); color: #fff; }

/* Pagina "la tua candidatura" */
.riepilogo { display: flex; gap: 18px; align-items: flex-start; }
.mancanti { margin: .25rem 0 0; padding-left: 1.2rem; color: #8a0a24; font-weight: 600; }
.copia { display: flex; gap: 8px; margin-top: 8px; }
.copia input { flex: 1; min-width: 0; font-size: .9rem; background: #fff; }
.messaggio { text-align: center; padding: 40px 20px; }

/* Icone V verde / X rossa */
.esito { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; flex: none; }
.esito svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.esito--ok { background: var(--verde); }
.esito--ko { background: var(--rosso); }
.esito--neutro { background: #e3e8e4; color: var(--tenue); font-weight: 700; }
.esito--grande { width: 52px; height: 52px; }
.esito--grande svg { width: 30px; height: 30px; }

/* Login */
.pagina-login { background: radial-gradient(circle at 30% 20%, #1f4a2d, var(--scuro) 60%); min-height: 100vh; }
.login { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 32px; padding: 24px 16px; }
.login__logo { width: 260px; max-width: 80%; height: auto; }
.login__scheda { background: #fff; width: 100%; max-width: 380px; border-radius: 16px; padding: 32px 28px; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); display: flex; flex-direction: column; gap: 14px; }
.login h1 { text-align: center; margin: 0 0 4px; font-size: 1.3rem; }
.login .avviso { margin: 0; }

/* Gestionale */
.titolo-pagina { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 16px; }
.titolo-pagina h1 { margin: 0; }
.azioni { display: flex; gap: 8px; flex-wrap: wrap; }
.statistiche { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.stat { background: var(--carta); border: 1px solid var(--bordo); border-radius: var(--raggio); padding: 16px; text-decoration: none; color: var(--tenue); display: flex; flex-direction: column; box-shadow: var(--ombra); border-top: 4px solid var(--scuro-2); }
.stat:hover { border-color: #b9c4bb; }
.stat__num { font-size: 2rem; font-weight: 700; color: var(--testo); line-height: 1.1; }
.stat--ok { border-top-color: var(--verde); }
.stat--ko { border-top-color: var(--rosso); }
.stat--nuove { border-top-color: var(--giallo); }

.filtri { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }
.filtri input[type=search] { flex: 1 1 260px; width: auto; }
.filtri select { width: auto; flex: 0 1 auto; }
.azzera { font-size: .9rem; }
.conteggio { color: var(--tenue); font-size: .9rem; margin: 0 0 8px; }
.vuoto { text-align: center; color: var(--tenue); padding: 40px; }

.tabella-wrap { background: var(--carta); border: 1px solid var(--bordo); border-radius: var(--raggio); box-shadow: var(--ombra); overflow-x: auto; }
.tabella { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tabella th { text-align: left; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--tenue); padding: 12px 14px; border-bottom: 1px solid var(--bordo); background: #fafcf9; white-space: nowrap; }
.tabella td { padding: 12px 14px; border-bottom: 1px solid #edf0ec; vertical-align: middle; }
.tabella tr:last-child td { border-bottom: 0; }
.tabella tbody tr[data-link] { cursor: pointer; }
.tabella tbody tr[data-link]:hover { background: #f6faf5; }
.tabella td small { display: block; color: var(--tenue); font-size: .82rem; }
.col-esito { width: 64px; text-align: center; }
.nome { font-weight: 700; text-decoration: none; color: var(--testo); }
.nome:hover { color: var(--verde-scuro); text-decoration: underline; }
.mancano { color: #b10a2b !important; }
.riga--nuova .nome::after { content: "NUOVA"; margin-left: 8px; font-size: .65rem; font-weight: 700; letter-spacing: .05em; background: var(--giallo); color: #3d2700; padding: 2px 6px; border-radius: 4px; vertical-align: middle; }
.riga--spenta { opacity: .55; }
.lingua-tag { font-size: .65rem; font-weight: 700; letter-spacing: .05em; border: 1px solid var(--bordo); color: var(--tenue); padding: 1px 5px; border-radius: 4px; vertical-align: middle; }

.etichetta { display: inline-block; font-size: .8rem; font-weight: 600; padding: 3px 10px; border-radius: 99px; background: #eef1ed; color: var(--testo); white-space: nowrap; }
.etichetta--nuova { background: #fff3dc; color: #7a4b00; }
.etichetta--valutazione { background: #e7effb; color: #1d4b8f; }
.etichetta--colloquio { background: #f0e8fb; color: #5a2a94; }
.etichetta--assunto { background: var(--verde-chiaro); color: #17542a; }
.etichetta--scartato { background: #eceeed; color: #5b625d; }

.indietro { display: inline-block; margin-bottom: 12px; text-decoration: none; font-size: .95rem; }
.titolo-candidato { display: flex; align-items: center; gap: 14px; }
.sotto { margin: 0; color: var(--tenue); }
.stato-form { display: flex; align-items: center; gap: 8px; }
.stato-form label { font-weight: 600; }
.stato-form select { width: auto; }

.dettaglio { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.dati { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; margin: 0; }
.dati dt { font-size: .8rem; color: var(--tenue); text-transform: uppercase; letter-spacing: .04em; }
.dati dd { margin: 2px 0 0; font-weight: 600; overflow-wrap: anywhere; }
.dati--largo { grid-column: 1 / -1; }
.testo-lungo { white-space: pre-line; font-weight: 400 !important; }
.manca { color: var(--rosso) !important; font-weight: 700; }
.vuoto-campo { color: #a3ada6; }

.elenco-doc { list-style: none; margin: 0 0 12px; padding: 0; }
.elenco-doc li { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid #edf0ec; }
.elenco-doc li:last-child { border-bottom: 0; }
.elenco-doc li > div { flex: 1; min-width: 0; }
.elenco-doc small { display: block; color: var(--tenue); font-size: .82rem; }
.file { margin-top: 4px; overflow-wrap: anywhere; }
.aggiungi-doc summary { cursor: pointer; color: var(--verde-scuro); font-weight: 600; font-size: .92rem; }
.aggiungi-doc form { margin-top: 12px; display: grid; gap: 10px; }
.invia-link { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.nota-form { display: grid; gap: 8px; justify-items: start; margin-bottom: 12px; }
.note { list-style: none; margin: 0; padding: 0; }
.note li { border-left: 3px solid var(--verde); padding: 4px 0 4px 12px; margin-bottom: 12px; }
.note p { margin: 0; white-space: pre-line; }
.note small { color: var(--tenue); }
.elimina { text-align: right; }

.azioni-utente { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.in-linea { display: flex; gap: 6px; }
.in-linea input { width: 160px; min-height: 34px; padding: 6px 10px; }

/* Telefono */
@media (max-width: 760px) {
  h1 { font-size: 1.45rem; }
  .griglia, .griglia--4, .dati { grid-template-columns: minmax(0, 1fr); }
  .statistiche { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dettaglio { grid-template-columns: minmax(0, 1fr); }
  .scheda { padding: 16px; }
  .doc { flex-direction: column; align-items: stretch; }
  .testata__riga { gap: 8px 16px; padding-top: 10px; padding-bottom: 10px; }
  .testata__tag { display: none; }
  .esci { margin-left: 0; }
  .menu { order: 3; width: 100%; }
  .filtri select, .filtri .btn { flex: 1 1 45%; }
  .stato-form { width: 100%; }
  .stato-form select { flex: 1; }

  /* La tabella diventa un elenco di schede */
  .tabella-wrap { background: transparent; border: 0; box-shadow: none; }
  .tabella thead { display: none; }
  .tabella, .tabella tbody, .tabella tr, .tabella td { display: block; width: 100%; }
  .tabella tr { background: var(--carta); border: 1px solid var(--bordo); border-radius: var(--raggio); margin-bottom: 10px; padding: 10px 14px; position: relative; box-shadow: var(--ombra); }
  .tabella td { border: 0; padding: 4px 0; }
  .tabella td[data-etichetta]::before { content: attr(data-etichetta); display: block; font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--tenue); }
  .tabella td[data-etichetta="Candidato"]::before { display: none; }
  .tabella td.col-esito { position: absolute; right: 12px; top: 12px; width: auto; padding: 0; }
  .tabella td[data-etichetta="Candidato"] { padding-right: 44px; }
  .in-linea input { width: 100%; }
}
