body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f8f8f8;
    line-height: 1.6;
    font-size: 100%;
    color: #333;
    text-align: center;
}

header {
    background-color: #fff;
    border-bottom: 1px solid #ccc;
    padding: 1em 0;
    position: relative;
}

.header-container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 100px;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Classe per il primo logo */
.logo-cavazza {
    width: 200px;
    height: auto;
}

/* Classe per il secondo logo */
.logo-aula {
    width: 230px;
    height: auto;
}

.nav-links ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.menu-title {
    font-size: 1.2rem;
    margin: 0 0 10px 0;
}

.nav-links a {
    display: block;
    width: 240px;
    box-sizing: border-box;
    text-align: center;
    text-decoration: none;
    color: #0073e6;
    padding: 10px 15px;
    border: 1px solid red;
    border-radius: 4px;
    transition: background-color 0.3s;
}

.nav-links a:hover,
.nav-links a:focus {
    background-color: #e6f7ff;
    outline: 2px solid #0073e6;
    outline-offset: 2px;
}

/* Contenuto principale delle pagine */
main {
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    flex-direction: column;
    padding: 20px;
    flex-wrap: wrap;
    min-height: auto;
    text-align: left;
}

/* Le intestazioni delle pagine rimangono centrate */
main h1,
main h2,
main h3,
main h4,
main h5,
main h6 {
    text-align: center;
}

/* La homepage mantiene il testo centrato */
main.home-main {
    text-align: center;
}

main.home-main p {
    text-align: center;
}

.welcome,
.latest-news {
    border: 1px solid #ffcccc;
    border-radius: 4px;
    margin: 20px;
    padding: 20px;
    background: linear-gradient(white, #ffe6e6);
    flex: 1;
    min-width: 300px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: red;
    margin-top: 0;
}

footer {
    background-color: #fff;
    padding: 10px;
    border-top: 1px solid #ccc;
    position: static;
    width: auto;
    text-align: center;
}

/* Visualizzazione su smartphone e tablet */
@media screen and (max-width: 768px) {

    /*
     * Logo Cavazza, menu e logo Aula
     * vengono disposti uno sotto l'altro.
     */
    .header-container {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .nav-links ul {
        flex-direction: column;
    }

    .logo-cavazza,
    .logo-aula {
        width: 80px;
    }
}

/* Autenticazione e pannello accessi */
.auth-main,
.admin-main {
    min-height: calc(100vh - 40px);
    padding-bottom: 90px;
}

.auth-card,
.admin-section {
    width: min(760px, calc(100% - 40px));
    margin: 20px auto;
    padding: 24px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-sizing: border-box;
    text-align: left;
}

.auth-logo {
    display: block;
    width: 150px;
    height: auto;
    margin: 0 auto 12px;
}

.auth-form,
.admin-form,
.azioni-utente form {
    display: grid;
    gap: 16px;
}

.auth-form div,
.admin-form div {
    display: grid;
    gap: 6px;
}

.auth-form input,
.admin-form input,
.admin-form select,
.azioni-utente input {
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    font: inherit;
}

button,
.button-link {
    display: inline-block;
    padding: 10px 16px;
    font: inherit;
    cursor: pointer;
}

.messaggio {
    margin: 16px 0;
    padding: 12px;
    border: 2px solid currentColor;
    border-radius: 4px;
    font-weight: bold;
}

.errore {
    color: #8b0000;
}

.successo {
    color: #176b2c;
}

.help-text {
    margin: 0;
    font-size: 0.95em;
}

.table-wrapper {
    overflow-x: auto;
}

table {
    width: 100%;
    border-collapse: collapse;
}

th,
td {
    padding: 10px;
    border: 1px solid #999;
    text-align: left;
    vertical-align: top;
}

.azioni-utente {
    min-width: 260px;
}

.azioni-utente form + form {
    margin-top: 12px;
}

@media screen and (max-width: 768px) {

    footer {
        position: static;
        width: auto;
    }
}

/* Correzione accessibilità login */
.auth-main {
    display: block;
    min-height: auto;
    padding: 20px;
}

.auth-form button {
    width: 100%;
    padding: 12px;
    background-color: red;
    color: white;
    border: 2px solid #a00000;
    border-radius: 4px;
    font-weight: bold;
}

.auth-form button:hover,
.auth-form button:focus {
    background-color: #a00000;
    outline: 3px solid #005fcc;
    outline-offset: 2px;
}

/* Sezione con elenco a sinistra e immagine a destra */
.pagina-con-immagine {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 40px;
    width: 100%;
    max-width: 1000px;
    margin: 20px auto;
    box-sizing: border-box;
}

.pagina-contenuto {
    flex: 1;
    min-width: 0;
}

.pagina-immagine {
    flex: 0 0 380px;
    max-width: 380px;
}

.pagina-immagine img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
}

/* Smartphone e tablet */
@media screen and (max-width: 768px) {
    .pagina-con-immagine {
        flex-direction: column;
        gap: 20px;
    }

    .pagina-contenuto {
        width: 100%;
    }

    .pagina-immagine {
        width: 100%;
        max-width: 380px;
        margin: 0 auto;
        flex-basis: auto;
    }
}

/* Azioni e layout di stampa delle prove d'esame */
.print-actions {
    margin: 24px 0;
    text-align: center;
}

.print-all-actions {
    margin: 24px 0;
    padding: 16px;
    border: 1px solid #ccc;
    border-radius: 6px;
}

.print-all-actions ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 12px;
}

.print-all-actions .button-link {
    text-decoration: none;
    border: 1px solid #666;
    border-radius: 4px;
}

.print-only {
    display: none;
}

.print-text-block {
    white-space: pre-wrap;
    text-align: left;
}

.print-exam {
    margin-bottom: 32px;
}

@media print {
    @page {
        margin: 15mm;
    }

    body {
        background: #fff;
        color: #000;
        font-size: 11pt;
        text-align: left;
    }

    header,
    footer,
    .no-print,
    .print-actions,
    .print-all-actions,
    details,
    form,
    button {
        display: none !important;
    }

    .print-only {
        display: block !important;
    }

    main,
    .admin-main {
        display: block;
        min-height: 0;
        padding: 0;
        margin: 0;
    }

    .admin-section {
        width: 100%;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: #fff;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: #000;
    }

    .admin-section > section,
    .question-block {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .print-exam {
        break-after: page;
        page-break-after: always;
        margin: 0;
    }

    .print-exam:last-child {
        break-after: auto;
        page-break-after: auto;
    }

    a {
        color: #000;
        text-decoration: none;
    }
}

/* Manuale operativo della piattaforma */
.manuale-piattaforma {
    width: min(980px, calc(100% - 40px));
}

.manuale-piattaforma h2 {
    margin-top: 2em;
    padding-top: 0.35em;
    border-top: 1px solid #ccc;
}

.manuale-piattaforma h3 {
    margin-top: 1.5em;
}

.manuale-indice {
    margin: 1.5em 0 2em;
    padding: 1em 1.25em;
    border: 1px solid #999;
    border-radius: 6px;
    background: #f7f7f7;
}

.manuale-indice h2 {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

.manuale-indice li {
    margin: 0.45em 0;
}

.manuale-piattaforma table {
    margin: 1em 0 1.5em;
}

.manuale-piattaforma th {
    background: #f1f1f1;
}

.manuale-comandi,
.torna-indice {
    margin: 1.5em 0;
}

.manuale-piattaforma :target {
    scroll-margin-top: 1em;
}

@media print {
    .manuale-piattaforma {
        width: 100%;
    }

    .manuale-piattaforma h2,
    .manuale-piattaforma h3 {
        break-after: avoid;
        page-break-after: avoid;
    }

    .manuale-piattaforma table,
    .manuale-piattaforma tr {
        break-inside: avoid;
        page-break-inside: avoid;
    }
}

/* Pannello di assegnazione dei computer d'esame */
.computer-panel > section {
    margin: 1.5em 0;
    padding: 1em;
    border: 1px solid #ccc;
    border-radius: 6px;
}

.computer-panel form {
    margin: 0.75em 0;
}

.computer-panel input[type="text"],
.computer-panel input:not([type]),
.computer-panel select {
    min-height: 42px;
    max-width: 100%;
}

.computer-panel td form + form {
    margin-top: 0.5em;
}

.registration-code {
    border: 3px solid #176b2c !important;
    background: #f3fff5;
}

.registration-code strong {
    font-size: 1.5em;
    letter-spacing: 0.08em;
}

@media print {
    .computer-panel form,
    .computer-panel button {
        display: none !important;
    }
}

/* Evidenziazione accessibile degli esiti nelle prove */
.risposta-selezionata-corretta,
.esito-corretto {
    text-decoration-line: underline;
    text-decoration-color: #176b2c;
    text-decoration-thickness: 3px;
    text-underline-offset: 3px;
}

.risposta-selezionata-errata,
.esito-errato,
.errore-dettato {
    text-decoration-line: underline;
    text-decoration-color: #8b0000;
    text-decoration-thickness: 3px;
    text-underline-offset: 3px;
}

.testo-dettato-evidenziato {
    white-space: pre-wrap;
    text-align: left;
    margin: 1em 0;
}

.errore-dettato-mancante {
    font-weight: bold;
}

.voti-panel .grade-input { width: 5.5em; max-width: 100%; padding: 8px; }
.voti-panel .signature-lines { margin-top: 32px; }
.voti-panel .visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.voti-panel fieldset { margin: 1.5em 0; padding: 1em; }
.voti-panel legend { font-weight: bold; font-size: 1.2em; }
.voti-panel .grade-stats { display:grid; grid-template-columns:repeat(4,minmax(120px,1fr)); gap:12px; margin:20px 0; }
.voti-panel .grade-stats p { margin:0; padding:14px; border:1px solid #aaa; border-radius:6px; text-align:center; }
.voti-panel .grade-filters { display:flex; flex-wrap:wrap; gap:14px; align-items:end; padding:14px; border:1px solid #ccc; border-radius:6px; }
.voti-panel .grade-filters p { margin:0; }
.voti-panel .grade-filters input, .voti-panel .grade-filters select { min-height:42px; max-width:100%; }
.voti-panel .anomaly-box, .voti-panel .finalize-box { margin:20px 0; padding:16px; border:2px solid #8a6500; border-radius:6px; background:#fffbea; }
.voti-panel .notice-ok { padding:12px; border:2px solid #176b2c; }
.voti-panel .notice-error { padding:12px; border:2px solid #8b0000; }
.voti-panel textarea { width:100%; min-height:90px; max-width:100%; }
.voti-panel .sheet-state { border:2px solid #000; padding:8px; text-align:center; font-weight:bold; }
@media screen and (max-width:768px) { .voti-panel .grade-stats { grid-template-columns:repeat(2,minmax(110px,1fr)); } }

@media print {
    .voti-panel .signature-lines { break-inside: avoid; margin-top: 20mm; }
    .voti-panel table { font-size: 9pt; }
    .voti-panel th, .voti-panel td { padding: 5px; }
    .voti-panel .grade-stats, .voti-panel .grade-filters, .voti-panel .anomaly-box { display:none!important; }
    .voti-panel .official-grade-sheet { font-size:10pt; }
}

/* Pannello sistema: collaudo, preparazione, accessi e registro */
.system-panel > section {
    margin: 1.75em 0;
    padding: 1em;
    border: 1px solid #ccc;
    border-radius: 6px;
}

.system-panel .audit-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    align-items: end;
    padding: 1em;
    border: 1px solid #aaa;
    border-radius: 6px;
    background: #f7f7f7;
}

.system-panel .audit-filters p { margin: 0; }
.system-panel .audit-filters input,
.system-panel .audit-filters select { min-height: 42px; max-width: 100%; }
.system-panel .audit-detail { overflow-wrap: anywhere; max-width: 34em; }
.system-panel .notice-ok { font-weight: bold; color: #145523; }
.system-panel .notice-warning { font-weight: bold; color: #704f00; }
.system-panel .notice-error { font-weight: bold; color: #7a0000; }

@media print {
    .system-panel > section:not(#titolo-registro) { break-inside: auto; }
    .system-panel .audit-detail { max-width: none; }
}