/* =========================================================
   IL PANNELLO "FOTO SENZA POSIZIONE"
   =========================================================
   ⬇️ NUOVO (18/08/2026). Foglio suo e non due blocchi dentro a main.css,
   che è già fra i quattro file da dividere (§4.4).

   Stessa forma dei pannelli che propongono e poi scrivono (💬 Chiedi al
   tuo modello, css/chiedi-llm.css): velo scuro, finestra che scorre, righe
   con la casella a sinistra e l'esito a destra. Non è pigrizia — due
   pannelli che chiedono la stessa cosa devono somigliarsi, o si impara due
   volte lo stesso gesto.
   ========================================================= */

.fp-velo{
  position:fixed; inset:0; z-index:6000;
  background:rgba(0,0,0,.45);
  display:flex; align-items:center; justify-content:center;
  padding:16px;
}

.fp-finestra{
  background:var(--white);
  border-radius:12px;
  box-shadow:var(--shadow);
  width:min(520px, 100%);
  /* Alta al massimo quanto lo schermo, e a scorrere è il contenuto: su un
     telefono l'elenco può essere di quaranta righe, e una finestra più
     alta della pagina si porta via il pulsante di conferma. */
  max-height:88vh;
  display:flex; flex-direction:column;
  padding:16px;
  overflow-y:auto;
}

.fp-testa{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.fp-testa h3{ margin:0; font-size:16px; }
.fp-chiudi{
  border:none; background:none; cursor:pointer;
  font-size:18px; line-height:1; color:var(--muted); padding:4px 6px;
}

.fp-intro{ font-size:12.5px; color:var(--muted); margin:8px 0 4px; line-height:1.45; }
.fp-limite{ font-size:11.5px; color:var(--muted); margin-bottom:8px; }
.fp-conta{ font-size:11px; color:var(--muted); margin-bottom:6px; }

.fp-riga{
  display:flex; align-items:center; gap:10px;
  padding:8px 4px;
  border-top:1px solid var(--line);
  cursor:pointer;
}
.fp-riga input{ flex-shrink:0; }
.fp-testo{ flex:1; min-width:0; display:flex; flex-direction:column; }
.fp-nome{ font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fp-sub{ font-size:11px; color:var(--muted); }

/* Lo scarto è il numero che decide, e sta a destra dove si legge in
   colonna: si scorre l'elenco guardando quello, non i nomi dei file. */
.fp-ok{ font-size:11px; color:var(--visited); flex-shrink:0; }
.fp-no{ font-size:11px; color:var(--muted); flex-shrink:0; }

/* Spenta e non nascosta: una foto che il programma non sa collocare è
   un'informazione, e toglierla dall'elenco farebbe credere che il conto
   sia riuscito su tutte. */
.fp-riga.spento{ opacity:.55; cursor:default; }

.fp-avviso{ font-size:12px; color:var(--muted); margin:8px 0 0; min-height:1em; }

.fp-primario{
  margin-top:10px;
  padding:10px 12px;
  border:none; border-radius:8px;
  background:var(--ink); color:var(--white);
  font-size:13px; cursor:pointer;
}
.fp-primario:disabled{ opacity:.45; cursor:default; }

/* La riga che apre il pannello, dentro al riquadro delle foto della
   tappa. Sta lì e non in un menù perché è dove le foto si guardano —
   e da telefono la barra laterale è l'unica porta che si apre sempre
   (CLAUDE.md §1, corollario). */
.fp-apri{
  display:inline-block;
  margin-top:6px;
  font-size:11.5px;
  color:var(--ink);
  background:none; border:1px solid var(--line); border-radius:6px;
  padding:4px 8px; cursor:pointer;
}