/*!
 * Autoanalisi: cosa puoi automatizzare con l'IA — fogli di stile
 * Prefisso classi: .aa- . Usa variabili CSS del sito quando presenti,
 * con valori di riserva (fallback) per funzionare anche da sola.
 */

.aa-app {
  --aa-colore-primario: var(--colore-primario, #0d5c63);
  --aa-colore-primario-scuro: var(--colore-primario-scuro, #08363b);
  --aa-colore-testo: var(--colore-testo, #1c1c1c);
  --aa-colore-testo-chiaro: var(--colore-testo-chiaro, #55605f);
  --aa-colore-sfondo: var(--colore-sfondo, #ffffff);
  --aa-colore-sfondo-alt: var(--colore-sfondo-alt, #f4f7f6);
  --aa-colore-bordo: var(--colore-bordo, #d8e0df);
  --aa-colore-ok: #1b7a3d;
  --aa-colore-attenzione: #a15c00;
  --aa-colore-rischio: #a13030;
  --aa-radius: 10px;
  --aa-font: inherit;

  font-family: var(--aa-font);
  color: var(--aa-colore-testo);
  background: var(--aa-colore-sfondo);
  max-width: 980px;
  margin: 2rem auto;
  padding: 1.25rem;
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  box-sizing: border-box;
}

.aa-app *,
.aa-app *::before,
.aa-app *::after {
  box-sizing: border-box;
}

.aa-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Barra passi ------------------------------------------------------------ */

.aa-passi {
  margin-bottom: 1.5rem;
}

.aa-passi-lista {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.aa-passo {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  background: var(--aa-colore-sfondo-alt);
  color: var(--aa-colore-testo-chiaro);
  font-size: 0.9rem;
}

.aa-passo-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--aa-colore-bordo);
  color: var(--aa-colore-testo);
  font-weight: 700;
  font-size: 0.8rem;
}

.aa-passo-attivo {
  background: var(--aa-colore-primario);
  color: #fff;
}

.aa-passo-attivo .aa-passo-num {
  background: #fff;
  color: var(--aa-colore-primario);
}

.aa-passo-fatto .aa-passo-num {
  background: var(--aa-colore-ok);
  color: #fff;
}

/* Titoli e testo ---------------------------------------------------------- */

.aa-titolo {
  margin: 0 0 0.25rem;
  font-size: 1.4rem;
  line-height: 1.25;
}

.aa-sottotitolo {
  margin: 0 0 1.25rem;
  color: var(--aa-colore-testo-chiaro);
}

.aa-sottotitolo-report {
  margin: 2rem 0 0.75rem;
  font-size: 1.1rem;
}

.aa-aiuto {
  font-size: 0.85rem;
  color: var(--aa-colore-testo-chiaro);
  margin: 0.25rem 0 0;
}

.aa-vuoto {
  padding: 1rem;
  border: 1px dashed var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  color: var(--aa-colore-testo-chiaro);
  text-align: center;
}

/* Form generico ------------------------------------------------------------ */

.aa-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.25rem;
}

.aa-campo {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.aa-campo-largo {
  grid-column: 1 / -1;
}

.aa-campo label,
.aa-fieldset legend {
  font-weight: 600;
  font-size: 0.92rem;
}

.aa-campo input[type="text"],
.aa-campo input[type="number"],
.aa-campo select,
.aa-campo textarea {
  width: 100%;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--aa-colore-bordo);
  border-radius: 6px;
  font-size: 1rem;
  font-family: inherit;
  color: var(--aa-colore-testo);
  background: var(--aa-colore-sfondo);
}

.aa-campo input:focus-visible,
.aa-campo select:focus-visible,
.aa-campo textarea:focus-visible,
.aa-btn:focus-visible,
.aa-esempio-btn:focus-visible {
  outline: 3px solid var(--aa-colore-primario);
  outline-offset: 2px;
}

.aa-fieldset {
  grid-column: 1 / -1;
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  padding: 0.75rem 1rem 1rem;
}

.aa-checkgrid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 0.5rem 1rem;
  margin-top: 0.5rem;
}

.aa-check {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.aa-check input {
  width: 1.1rem;
  height: 1.1rem;
}

.aa-check label {
  font-weight: 400;
}

/* Pulsanti ------------------------------------------------------------------ */

.aa-azioni {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
  align-items: center;
}

.aa-azioni-top {
  margin-top: 0;
  margin-bottom: 1.25rem;
}

.aa-btn {
  appearance: none;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 0.65rem 1.1rem;
  font-size: 0.95rem;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
}

.aa-btn-primario {
  background: var(--aa-colore-primario);
  color: #fff;
}

.aa-btn-primario:hover {
  background: var(--aa-colore-primario-scuro);
}

.aa-btn-primario:disabled {
  background: var(--aa-colore-bordo);
  color: var(--aa-colore-testo-chiaro);
  cursor: not-allowed;
}

.aa-btn-secondario {
  background: var(--aa-colore-sfondo-alt);
  color: var(--aa-colore-testo);
  border-color: var(--aa-colore-bordo);
}

.aa-btn-secondario:hover {
  background: var(--aa-colore-bordo);
}

.aa-btn-testo {
  background: transparent;
  color: var(--aa-colore-testo-chiaro);
  text-decoration: underline;
  padding: 0.65rem 0.25rem;
}

.aa-btn-elimina {
  background: transparent;
  color: var(--aa-colore-rischio);
  border: 1px solid var(--aa-colore-rischio);
  padding: 0.3rem 0.65rem;
  font-size: 0.85rem;
}

.aa-btn-elimina:hover {
  background: var(--aa-colore-rischio);
  color: #fff;
}

/* Esempi ---------------------------------------------------------------------- */

.aa-pannello-esempi {
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  padding: 1rem;
  margin-bottom: 1.5rem;
  background: var(--aa-colore-sfondo-alt);
}

.aa-esempi-lista {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.5rem;
}

.aa-esempio-btn {
  width: 100%;
  text-align: left;
  background: var(--aa-colore-sfondo);
  border: 1px solid var(--aa-colore-bordo);
  border-radius: 6px;
  padding: 0.6rem 0.75rem;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.aa-esempio-btn:hover {
  border-color: var(--aa-colore-primario);
}

.aa-esempio-titolo {
  font-weight: 600;
  font-size: 0.92rem;
}

.aa-esempio-reparto {
  font-size: 0.8rem;
  color: var(--aa-colore-testo-chiaro);
}

/* Righe attività -------------------------------------------------------------- */

.aa-riga {
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  padding: 1rem;
  margin-bottom: 1rem;
}

.aa-riga-intestazione {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.aa-riga-titolo {
  margin: 0;
  font-size: 1rem;
}

.aa-riga-griglia {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.85rem 1rem;
}

.aa-riga-nota {
  margin: 0.75rem 0 0;
  font-size: 0.85rem;
  color: var(--aa-colore-primario-scuro);
  font-weight: 600;
}

.aa-riga textarea {
  resize: vertical;
  min-height: 2.5rem;
}

/* Report --------------------------------------------------------------------- */

.aa-report-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.aa-card {
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  padding: 1rem;
  background: var(--aa-colore-sfondo-alt);
}

.aa-card-titolo {
  margin: 0 0 0.4rem;
  font-size: 0.85rem;
  color: var(--aa-colore-testo-chiaro);
}

.aa-card-valore {
  margin: 0;
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--aa-colore-primario-scuro);
}

.aa-card-nota {
  margin: 0.35rem 0 0;
  font-size: 0.78rem;
  color: var(--aa-colore-testo-chiaro);
  font-style: italic;
}

.aa-top3 {
  margin: 0 0 1rem;
  padding-left: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.aa-top3-item {
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  padding: 0.75rem 1rem;
}

.aa-top3-item p {
  margin: 0.35rem 0 0;
  color: var(--aa-colore-testo-chiaro);
  font-size: 0.9rem;
}

.aa-badge {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  margin-left: 0.5rem;
}

.aa-badge-molto-alto {
  background: #d8f3dc;
  color: #1b4332;
}

.aa-badge-alto {
  background: #e4f1d3;
  color: #365314;
}

.aa-badge-medio {
  background: #fef3c7;
  color: #7c4a03;
}

.aa-badge-basso {
  background: #f1f1f1;
  color: #555;
}

.aa-tabella-scroll {
  overflow-x: auto;
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
}

.aa-tabella {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
  min-width: 720px;
}

.aa-tabella th,
.aa-tabella td {
  padding: 0.55rem 0.7rem;
  border-bottom: 1px solid var(--aa-colore-bordo);
  text-align: left;
  vertical-align: top;
}

.aa-tabella thead th {
  background: var(--aa-colore-sfondo-alt);
  position: sticky;
  top: 0;
}

.aa-tabella tbody tr:last-child td,
.aa-tabella tbody tr:last-child th {
  border-bottom: none;
}

.aa-rischi-lista {
  margin: 0 0 0.5rem;
  padding-left: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.aa-nota-calcolo {
  margin-top: 1.5rem;
  border: 1px solid var(--aa-colore-bordo);
  border-radius: var(--aa-radius);
  padding: 0.75rem 1rem;
}

.aa-nota-calcolo summary {
  cursor: pointer;
  font-weight: 600;
}

.aa-nota-calcolo-corpo {
  margin-top: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  font-size: 0.9rem;
  color: var(--aa-colore-testo-chiaro);
}

.aa-azioni-report {
  margin-top: 2rem;
}

.aa-invito {
  margin-top: 1rem;
  font-size: 0.95rem;
}

.aa-link {
  color: var(--aa-colore-primario);
  font-weight: 600;
}

/* Responsive: fino a 360px -------------------------------------------------- */

@media (max-width: 720px) {
  .aa-form,
  .aa-riga-griglia {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .aa-app {
    margin: 1rem auto;
    padding: 0.85rem;
  }

  .aa-titolo {
    font-size: 1.2rem;
  }

  .aa-card-valore {
    font-size: 1.35rem;
  }

  .aa-riga-intestazione {
    flex-direction: column;
    align-items: flex-start;
  }

  .aa-azioni {
    flex-direction: column;
    align-items: stretch;
  }

  .aa-btn {
    width: 100%;
    text-align: center;
  }
}

@media (max-width: 360px) {
  .aa-passo-nome {
    display: none;
  }

  .aa-card-valore {
    font-size: 1.2rem;
  }
}

/* Stampa ---------------------------------------------------------------------- */

@media print {
  .aa-passi,
  .aa-azioni,
  .aa-pannello-esempi,
  .aa-invito {
    display: none !important;
  }

  .aa-app {
    border: none;
    margin: 0;
    padding: 0;
    max-width: none;
  }

  .aa-tabella-scroll {
    overflow: visible;
    border: none;
  }

  .aa-tabella {
    min-width: 0;
    font-size: 11pt;
  }

  .aa-card,
  .aa-riga,
  .aa-top3-item,
  .aa-nota-calcolo {
    break-inside: avoid;
  }

  .aa-nota-calcolo {
    border: none;
    padding: 0;
  }

  .aa-nota-calcolo[open] summary {
    font-weight: 700;
  }

  a[href]::after {
    content: "";
  }
}
