/* lim-spia.css · lavagna docenti 3.1 (30/10/2026): la spia dello stato del microfono e il pannello dell'adulto in «Bambini».
   Si carica DOPO lim.css. Porta in produzione i blocchi 1-3 del mockup P1 (prossima/mockup/p1-ritocco/ritocco.css, giri
   G1 e G2), senza gli stati calma/rumore (decisione 8A) e con lo stato errore. Il gancio è data-rit su #lim-bambini, scritto
   da lim-spia.js. La vista grande e la banda (blocchi 4 e 5) stanno in lim.css. */

/* 1. La spia: colore E parola E segno; in Bambini in alto al centro, nella vista grande nella barra */
.rit-spia{display:inline-flex;align-items:center;gap:0.5em;padding:0.3em 0.9em;border-radius:999px;font-weight:800;white-space:nowrap;color:#fff;background:#4A4F63;box-sizing:border-box}   /* spento: grigio neutro, cerchio vuoto; il rosso è del solo errore */
.rit-spia::before{content:"";width:0.8em;height:0.8em;border-radius:50%;border:0.12em solid currentColor;box-sizing:border-box;flex:none}
.rit-spia[data-stato="permesso"]{background:#D4A017;color:#231A35}
.rit-spia[data-stato="permesso"]::before{background:currentColor;border:0}
.rit-spia[data-stato="acceso"]{background:#1F8A4C}
.rit-spia[data-stato="acceso"]::before{background:currentColor;border:0}
.rit-spia[data-stato="misura"]{background:#1D5FA8}
.rit-spia[data-stato="misura"]::before{border-top-color:transparent}
.rit-spia[data-stato="errore"]{background:#C62828}
.rit-spia[data-stato="errore"]::before{border:0;border-radius:0;background:currentColor;clip-path:polygon(20% 0,50% 30%,80% 0,100% 20%,70% 50%,100% 80%,80% 100%,50% 70%,20% 100%,0 80%,30% 50%,0 20%)}
.rit-spia[data-stato="pausa"]{background:#D4A017;color:#231A35}
.rit-spia[data-stato="pausa"]::before{content:"\275A\275A";width:auto;height:auto;border:0;border-radius:0;font-size:0.8em}
.rit-livello{display:inline-block;width:3.2em;height:0.5em;border-radius:999px;background:rgba(255,255,255,0.35);overflow:hidden;flex:none}
.rit-spia[data-stato="permesso"] .rit-livello,.rit-spia[data-stato="pausa"] .rit-livello{background:rgba(35,26,53,0.25)}
.rit-livello i{display:block;height:100%;width:0;background:currentColor}
.bambini .rit-spia{position:absolute;top:16px;left:50%;transform:translateX(-50%);z-index:3;font-size:clamp(22px,3.2vh,42px)}
.lim-barra-area .rit-spia{font-size:calc(var(--testo) * 0.95);min-height:var(--tocco);order:-1}

/* 1b. Sotto 1400 px la spia della barra mostra solo il segno e la barretta del livello (la barra dei tasti deve stare su una riga):
       la parola resta ai lettori di schermo (clip a 1 px, non display:none) e nel title */
@media (max-width:1400px){
  .lim-barra-area .rit-spia{min-width:0;padding:0 0.5em;gap:0.35em}
  .lim-barra-area .rit-spia .rit-testo{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .lim-barra-area .rit-spia .rit-livello{width:2.2em}
}

/* 2. Il pannello dell'adulto a misura fissa, in alto a sinistra; Pausa SEMPRE nello stesso punto (primo tasto); la misura
      staccata di 40 px e in contorno; le cifre del timer in basso a sinistra; le bolle attenuate quando non seguono il suono */
.bambini-adulto{left:16px;top:16px;bottom:auto;width:min(31vw,600px);max-width:none;height:clamp(150px,19vh,230px);
  display:flex;flex-direction:column;justify-content:flex-end;gap:0.3em;background:rgba(8,14,32,0.85)}
.bambini-riga{font-size:clamp(17px,2.2vh,28px);font-weight:600;max-width:none;overflow:hidden}
.bambini-conto{font-size:clamp(20px,2.8vh,36px)}
.bambini-timer{top:auto;bottom:16px;left:16px}
.bambini-tasti{flex-wrap:nowrap;align-items:center}
#bambini-pausa{order:-1}
#bambini-misura,#bambini-di-nuovo{margin-left:40px;background:transparent;color:#F2F5FF;border-color:#F2F5FF}
.bambini-tasto{min-height:clamp(60px,7vh,96px);min-width:clamp(120px,10vw,240px);font-size:clamp(20px,2.6vh,34px);white-space:nowrap}
.bambini:not([data-rit="spento"]):not([data-rit="permesso"]) .bambini-privacy{display:none !important}   /* la frase sulla privacy resta da spento e in attesa del permesso */
.bambini-micro{display:none !important}
.bambini[data-rit="pausa"] .bambini-tela,.bambini[data-rit="spento"] .bambini-tela,.bambini[data-rit="permesso"] .bambini-tela,.bambini[data-rit="errore"] .bambini-tela{opacity:0.4}

/* 3. Microfono spento, in attesa del permesso o in errore: un riquadro centrale grande al posto della riga piccola;
      in permesso i tasti spariscono (si tocca Consenti nel browser), in errore Avvia resta e riprova */
.bambini[data-rit="spento"] .bambini-adulto,.bambini[data-rit="permesso"] .bambini-adulto,.bambini[data-rit="errore"] .bambini-adulto{left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(60vw,900px);height:auto;padding:1.2em 1.6em;background:rgba(8,14,32,0.92);border-radius:24px;align-items:center;text-align:center;justify-content:center}
.bambini[data-rit="spento"] .bambini-tasti,.bambini[data-rit="permesso"] .bambini-tasti,.bambini[data-rit="errore"] .bambini-tasti{justify-content:center}
.bambini[data-rit="spento"] .bambini-tasto,.bambini[data-rit="errore"] .bambini-tasto{background:#15803D;border-color:#15803D;color:#fff;min-width:clamp(220px,24vw,480px)}

/* telefono: il pannello non copre la spia (spia più piccola, pannello sotto e largo quanto lo schermo) */
@media (max-width:700px){
  .bambini .rit-spia{font-size:18px;top:12px}
  .bambini-adulto{left:12px;top:72px;width:calc(100% - 24px);height:auto;min-height:0}
  .bambini[data-rit="spento"] .bambini-adulto,.bambini[data-rit="permesso"] .bambini-adulto,.bambini[data-rit="errore"] .bambini-adulto{left:12px;top:72px;transform:none;width:calc(100% - 24px)}
  .bambini-tasti{flex-wrap:wrap}
  #bambini-misura,#bambini-di-nuovo{margin-left:0}
  .bambini-tasto{min-width:0}
  .bambini[data-rit="spento"] .bambini-tasto,.bambini[data-rit="errore"] .bambini-tasto{min-width:0;width:100%}
}