/* ============================================================
   soloidee.it - Stili del MODULO della scheda badante.
   Condivisi fra iscriviti-badante.php (prima compilazione) e
   mia-scheda.php (quando lei corregge la sua scheda): stavano
   dentro una pagina sola e la seconda sarebbe venuta diversa.
   ============================================================ */
/* --- Modulo pensato per il telefono --- */
.modulo { max-width: 34rem; margin: 0 auto; }
.blocco {
    background: #fff; border: 1px solid #e2e2e2; border-radius: .8rem;
    padding: 1.1rem; margin: 0 0 1.1rem;
}
.blocco h2 { margin: 0 0 .2rem; font-size: 1.15rem; }
.blocco .aiuto { margin: 0 0 .9rem; color: #666; font-size: .92rem; }
.campo { margin: 0 0 1rem; }
/* Un campo con "hidden" deve sparire davvero: senza questa riga la regola
   qui sopra vince sul comportamento di serie e resta visibile. */
.campo[hidden] { display: none; }
.campo > label { display: block; font-weight: 600; margin-bottom: .3rem; }
.campo input[type=text], .campo input[type=tel], .campo input[type=email],
.campo input[type=number], .campo input[type=date], .campo select, .campo textarea {
    width: 100%; box-sizing: border-box;
    font-size: 1.05rem;            /* 16px+ : evita lo zoom automatico su iPhone */
    padding: .7rem .8rem; border: 1px solid #bbb; border-radius: .5rem;
}
.campo textarea { min-height: 6rem; }
.campo .nota { display: block; color: #666; font-size: .88rem; margin-top: .3rem; }
/* Caselle a scelta multipla: pastiglie grandi, comode col dito */
.pastiglie { display: flex; flex-wrap: wrap; gap: .5rem; }
.pastiglie label {
    display: inline-flex; align-items: center; gap: .45rem;
    border: 1px solid #bbb; border-radius: 2rem; padding: .55rem .9rem;
    font-size: 1rem; cursor: pointer; background: #fafafa;
}
.pastiglie input { width: 1.15rem; height: 1.15rem; }
.pastiglie label:has(input:checked) { background: #eaf7ee; border-color: #1a7f37; font-weight: 600; }
/* Consensi */
.consenso { display: flex; gap: .6rem; align-items: flex-start; margin: 0 0 .8rem; }
.consenso input { width: 1.3rem; height: 1.3rem; margin-top: .15rem; flex: none; }
/* Errori */
.errore { color: #b3261e; font-weight: 600; font-size: .95rem; margin-top: .35rem; }
.campo-ko input, .campo-ko select, .campo-ko textarea { border-color: #b3261e; border-width: 2px; }
/* Il punto da correggere si accende per un momento, così l'occhio lo trova
   anche se la pagina ci è arrivata scorrendo da sola. */
.lampeggia {
    animation: accendi 2.2s ease-out;
    border-radius: .5rem;
}
@keyframes accendi {
    0%, 45%  { background: #ffe9e6; box-shadow: 0 0 0 6px #ffe9e6; }
    100%     { background: transparent; box-shadow: none; }
}
.riquadro-ko {
    background: #fdecea; border: 1px solid #f3b4ae; border-radius: .6rem;
    padding: .9rem 1.1rem; margin: 0 0 1.2rem;
}
.bottone-grande {
    display: block; width: 100%; box-sizing: border-box; text-align: center;
    font-size: 1.15rem; padding: .95rem 1rem; border: 0; border-radius: .6rem;
    background: #1a7f37; color: #fff; font-weight: 700; cursor: pointer;
}
.riquadro-ok {
    background: #eaf7ee; border: 1px solid #a8ddb8; border-radius: .6rem;
    padding: 1.1rem; margin: 0 0 1.2rem;
}
.riquadro-ok code { word-break: break-all; }

/* --- Testata del modulo: titolo + via d'uscita --- */
.testa-modulo { display: flex; align-items: flex-start; gap: .8rem; }
.testa-modulo h1 { flex: 1 1 auto; margin: 0; }
.chiudi-modulo {
    flex: none; display: flex; align-items: center; gap: .35rem;
    background: #fff; border: 1px solid #ccc; border-radius: .5rem;
    padding: .5rem .8rem; font-size: 1rem; cursor: pointer; color: #444;
    min-height: 2.6rem;
}
.chiudi-modulo:hover { border-color: #999; }
.rassicura { background: #f2f7f4; border-radius: .5rem; padding: .7rem .9rem; }
.ritrovato {
    background: #eaf7ee; border: 1px solid #a8ddb8; border-radius: .6rem;
    padding: .8rem .9rem; margin: 0 0 1rem; font-size: .95rem;
}
.ritrovato button {
    display: block; margin-top: .5rem; background: none; border: 0;
    color: #b00020; text-decoration: underline; cursor: pointer; font-size: .92rem;
}

/* --- Foto e referenze: pulsanti grandi al posto di "Scegli file" --- */
.file-nascosto { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.due-bottoni { display: grid; gap: .6rem; margin: .2rem 0 .6rem; }
.bottone-foto {
    display: flex; align-items: center; justify-content: center; gap: .6rem;
    width: 100%; box-sizing: border-box; min-height: 3.4rem;
    border: 0; border-radius: .6rem; background: #1a7f37; color: #fff;
    font-size: 1.08rem; font-weight: 700; cursor: pointer; padding: .8rem 1rem;
}
.bottone-foto .ico { font-size: 1.4rem; line-height: 1; }
.bottone-foto.chiaro { background: #fff; color: #1a5f2c; border: 2px solid #1a7f37; }
.avvertenza {
    background: #fff8e6; border: 1px solid #f0d79a; border-radius: .5rem;
    padding: .8rem .9rem; margin: .7rem 0 0; font-size: .93rem; line-height: 1.45;
}
.ref-anteprima { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .8rem; }
.ref-anteprima img {
    width: 5.5rem; height: 7rem; object-fit: cover;
    border: 1px solid #ddd; border-radius: .4rem;
}
.ref-anteprima .nota, .ref-anteprima .errore { width: 100%; margin: 0; }
