/* ================================================== */
/* ==          STYLE.CSS - Checklist App           == */
/* ================================================== */

/* --- Basic Reset & Body --- */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    line-height: 1.6;
    background-color: #f4f7f6; /* Sfondo leggermente grigio */
    color: #333;
    padding: 20px; /* Spazio attorno al contenitore */
    font-size: 16px; /* Dimensione base font */
       /* --- NUOVE REGOLE BACKGROUND --- */
       /*background-image: url('../img/sfondo3.jpg'); /* Percorso RELATIVO al file CSS */
       /*background-repeat: repeat; /* 'repeat' (default), 'no-repeat', 'repeat-x', 'repeat-y' */
       /*background-position: center center; /* Posizione iniziale (es. 'top left', 'center center') */
       /*background-attachment: fixed; /* Lo sfondo rimane fisso durante lo scroll */
       /* Opzionale: Imposta un colore di sfondo fallback se l'immagine non carica o è trasparente */
       /*background-color: #f8f9fa; /* Un grigio molto chiaro */
        /* Opzionale: Controllo dimensione sfondo (utile per immagini singole non ripetute) */
       /* background-size: cover; */ /* Copre tutta l'area, potrebbe tagliare l'immagine */
       /* background-size: contain; */ /* Mostra tutta l'immagine,
}

.container {
    max-width: 1200px; /* Larghezza massima del contenuto */
    margin: 0 auto; /* Centra il contenitore */
    background-color: #ffffff; /* Sfondo bianco per il contenuto */
    padding: 25px 40px; /* Padding interno */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); /* Ombra leggera */
    border-radius: 8px; /* Angoli arrotondati */
}

/* --- Headings & HR --- */
h1, h2, h3, h4, h5, h6 {
    color: #004080; /* Blu scuro per le intestazioni */
    margin-bottom: 0.8em;
    margin-top: 1.2em;
}

h1 {
    font-size: 2.2em;
    padding-bottom: 0.4em;
    margin-top: 0;
}
/* Allineamento titolo e bottone gestione domande */
div.flex-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
div.flex-header h2 { /* Se usi h2 invece di h1 */
    margin-bottom: 0;
    margin-top: 0; /* Rimuovi margine sopra H2 se è nel flex-header */
}
div.flex-header a.button-link {
    margin-top: 0; /* Allinea bottone in alto */
    margin-bottom: 5px;
}


h2 { font-size: 1.8em; }
h3 { font-size: 1.4em; margin-bottom: 1em; }

/* Stile specifico per l'intestazione Area nella Checklist */
h4 {
    font-size: 1.2em;
    background-color: #e0efff;
    padding: 10px 15px;
    border-left: 5px solid #0056b3;
    margin-top: 25px;
    border-radius: 4px;
    margin-bottom: 0;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

hr { border: 0; height: 1px; background-color: #ccc; margin: 30px 0; }

/* --- Links & Buttons --- */
a { color: #0056b3; text-decoration: none; transition: color 0.2s ease; }
a:hover { color: #003d80; text-decoration: underline; }
.button-link, .action-links a, button[type="submit"] { display: inline-block; padding: 10px 18px; background-color: #0056b3; color: white !important; text-decoration: none; border: none; border-radius: 5px; cursor: pointer; font-size: 1em; margin-right: 10px; margin-bottom: 15px; transition: background-color 0.2s ease, box-shadow 0.2s ease; box-shadow: 0 1px 3px rgba(0,0,0,0.1); vertical-align: middle; }
.button-link:hover, .action-links a:hover, button[type="submit"]:hover { background-color: #004080; text-decoration: none; box-shadow: 0 2px 5px rgba(0,0,0,0.2); }
.button-link.save, button[type="submit"] { background-color: #0056b3; }
.button-link.save:hover, button[type="submit"]:hover { background-color: #004080; }
.button-link.cancel { background-color: #6c757d; }
.button-link.cancel:hover { background-color: #5a6268; }
.action-links a.edit { background-color: #ffc107; color: #212529 !important; }
.action-links a.edit:hover { background-color: #e0a800; }
.action-links a.delete { background-color: #dc3545; }
.action-links a.delete:hover { background-color: #c82333; }

/* --- Tables (Generali) --- */
table { width: 100%; border-collapse: collapse; margin-bottom: 25px; font-size: 0.95em; }
th, td { border: 1px solid #dee2e6; padding: 12px 15px; text-align: left; vertical-align: top; }
th { background-color: #e9ecef; font-weight: 600; color: #495057; padding: 10px 15px; }
table:not(.checklist-table) tbody tr:nth-child(odd) { background-color: #f8f9fa; }
tbody tr:hover { background-color: #e9ecef !important; }
.action-links a { margin-bottom: 5px; padding: 5px 10px; font-size: 0.9em; display: inline-block; }

/* --- Forms (Generali) --- */
label { display: block; margin-bottom: 6px; font-weight: 600; color: #495057; font-size: 0.95em; }
input[type="text"], input[type="date"],input[type="password"], input[type="number"], select, textarea { width: 100%; padding: 10px 12px; border: 1px solid #ced4da; border-radius: 4px; font-size: 1em; margin-bottom: 15px; transition: border-color 0.2s ease, box-shadow 0.2s ease; line-height: normal; }
textarea { min-height: 80px; line-height: 1.5; vertical-align: top; }
input:focus, select:focus, textarea:focus { border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25); }
fieldset { border: 1px solid #ccc; border-radius: 5px; padding: 15px 25px; margin-bottom: 25px; background-color: #fdfdfd; }
legend { font-weight: 600; color: #004080; padding: 0 10px; font-size: 1.2em; margin-left: 5px; }

/* --- Feedback Messages --- */
.message { padding: 15px 20px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 5px; font-size: 1em; }
.message.error { color: #721c24; background-color: #f8d7da; border-color: #f5c6cb; }
.message.success { color: #155724; background-color: #d4edda; border-color: #c3e6cb; }

/* --- Footer --- */
footer { text-align: center; margin-top: 30px; font-size: 0.9em; color: #6c757d; }

/* --- Form di Ricerca (index.php) --- */
.search-form { margin-bottom: 25px; background-color: #f8f9fa; padding: 15px 20px; border-radius: 5px; border: 1px solid #e9ecef; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.search-form label { margin-bottom: 0; font-weight: normal; }
.search-form input[type="text"] { flex-grow: 1; min-width: 200px; margin-bottom: 0; padding: 8px 10px; font-size: 0.95em; }
.search-form .button-link { margin-bottom: 0; padding: 8px 15px; font-size: 0.95em; }

/* --- Info Risultati Paginazione (index.php) --- */
.results-info { margin-bottom: 15px; font-style: italic; color: #555; font-size: 0.9em; }

/* --- Paginazione (index.php) --- */
.pagination { margin-top: 30px; text-align: center; }
.pagination ul { display: inline-block; padding-left: 0; margin: 0; list-style: none; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.pagination li { display: inline; }
.pagination li a, .pagination li span { color: #0056b3; float: left; padding: 8px 16px; font-size: 0.9em; text-decoration: none; transition: background-color .3s; border: 1px solid #ddd; margin-left: -1px; }
.pagination li:first-child a, .pagination li:first-child span { border-top-left-radius: 4px; border-bottom-left-radius: 4px; }
.pagination li:last-child a, .pagination li:last-child span { border-top-right-radius: 4px; border-bottom-right-radius: 4px; }
.pagination li a:hover { background-color: #f0f0f0; color: #003d80; }
.pagination li.active span { background-color: #0056b3; color: white; border-color: #0056b3; cursor: default; }
.pagination li.disabled span { color: #adb5bd; background-color: #f8f9fa; border-color: #ddd; cursor: default; }
.pagination li.ellipsis span { padding: 8px 10px; border-left: none; border-right: none; color: #6c757d; }


/* ======================================== */
/* ==     INDEX TABLE SPECIFIC STYLES    == */
/* ======================================== */

/* Stili per Stato Checklist nella tabella Commesse */
.status-compilata { color: #155724; font-weight: bold; white-space: nowrap; display: block; /* Mette data sotto */ }
.status-compilata small { font-weight: normal; font-size: 0.9em; color: #555; }
.status-non-compilata { color: #6c757d; font-style: italic; white-space: nowrap; }

/* Aggiusta padding/larghezza colonna stato checklist se necessario */
table:not(.checklist-table) th:nth-child(6), /* Colonna Stato Checklist Header */
table:not(.checklist-table) td:nth-child(6) { /* Colonna Stato Checklist Dati */
   /* width: 15%; */ /* Esempio: imposta larghezza se serve */
   text-align: center;
   vertical-align: middle; /* Allinea meglio lo stato al centro */
}


/* ======================================== */
/* ==          CHECKLIST STYLES          == */
/* ======================================== */

/* === Stili per Intestazione Checklist (Fieldset con Grid) === */
.checklist-header-fieldset { background-color: #eef4f8; border: 1px solid #bce8f1; padding: 15px 20px; }
.checklist-header-fieldset legend { background-color: #d1ecf1; color: #0c5460; padding: 5px 15px; border: 1px solid #bce8f1; border-radius: 4px; font-size: 1.1em; font-weight: bold; }
.header-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px 25px; align-items: end; }
.header-item { margin-bottom: 0; }
.header-item label { margin-bottom: 4px; font-size: 0.9em; font-weight: bold; }
.header-item input[type="text"],
.header-item input[type="date"],
.header-item select { width: 100%; margin-bottom: 0; padding: 8px 10px; font-size: 0.95em; }

/* === Stili Tabella Checklist Compattata === */
table.checklist-table { margin-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; border-top: none; table-layout: fixed; width: 100%; font-size: 0.88em; border-collapse: collapse; }
table.checklist-table th, table.checklist-table td { padding: 5px 8px; vertical-align: middle; line-height: 1.3; word-wrap: break-word; border: 1px solid #e0e0e0; hyphens: auto; }
table.checklist-table th { background-color: #e9ecef; font-weight: bold; text-align: center; font-size: 0.9em; padding: 4px 6px; }

/* Larghezze Colonne Checklist */


/* Stile per il select nella colonna Risposta */
table.checklist-table td:nth-child(4) select.risposta-select {
    width: 100%;
    padding: 4px 6px;
    font-size: 0.8em;
    margin-bottom: 0;
    border: 1px solid #ced4da;
    border-radius: 4px;
    min-height: 30px;
    box-sizing: border-box;
    line-height: normal;
    -webkit-appearance: none; -moz-appearance: none; appearance: none;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%236c757d%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'); /* Freccia grigia */
    background-repeat: no-repeat;
    background-position: right .5em top 50%, 0 0;
    background-size: .5em auto, 100%;
    padding-right: 1.8em;
}
table.checklist-table td:nth-child(4) select.risposta-select:focus {
     border-color: #80bdff; outline: 0; box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

/* Stili Input/Textarea interni alla Checklist (con altezza uniforme) */
table.checklist-table td textarea,
table.checklist-table td input[type="text"],
table.checklist-table td input[type="date"] {
    padding: 6px 8px;
    font-size: 0.95em;
    margin-bottom: 0;
    width: 99%;
    border-width: 1px;
    display: block;
    min-height: 30px;
    box-sizing: border-box;
}
table.checklist-table td textarea {
    line-height: 1.3;
    resize: vertical;
    min-height: 30px; /* Altezza minima textarea */
}

/* === Classi per Colorare le Righe Checklist === */
.checklist-row.risposta-si { background-color: #f8d7da !important; }
.checklist-row.risposta-no { background-color: #d4edda !important; }
.checklist-row.risposta-nonso { background-color: #fff3cd !important; }
.checklist-row.risposta-na { background-color: #e9ecef !important; }

/* Rimuovi hover default quando la riga è colorata */
/*tbody tr.risposta-si:hover,
tbody tr.risposta-no:hover,
tbody tr.risposta-nonso:hover,
tbody tr.risposta-na:hover {
    background-color: inherit !important;
}*/

table tbody tr.row-critical-open,
   table tbody tr.row-critical-open:nth-child(odd),
   table tbody tr.row-critical-open:hover { background-color: #f8d7da; } 

.update-date-cell {    font-size: 10px;   }

   .status-select {    font-size: 12px;   }

.testo-domanda  {    font-size: 10px;   }

.entro-cell {    font-size: 10px;   }


/* assets/css/style.css */

/* ... (Altro CSS) ... */

/* Larghezze colonne Checklist Table */
.checklist-table th:nth-child(1), /* ID */
.checklist-table td:nth-child(1) {
    width: 3%;
    min-width: 40px; /* Aggiungi min-width se necessario */
}

.checklist-table th:nth-child(2), /* Responsabile */
.checklist-table td:nth-child(2) {
    width: 8%; /* Potresti dover aggiustare queste % */
}

.checklist-table th:nth-child(3), /* Domanda */
.checklist-table td:nth-child(3) {
    width: 25%;
}

.checklist-table th:nth-child(4), /* Risposta */
.checklist-table td:nth-child(4) {
    width: 10%;
    min-width: 100px; /* I radio button + label occupano spazio */
}

.checklist-table th:nth-child(5), /* Attività */
.checklist-table td:nth-child(5) {
    width: 15%;
}

.checklist-table th:nth-child(6), /* Chi */
.checklist-table td:nth-child(6) {
    width: 8%;
}

.checklist-table th:nth-child(7), /* Entro il */
.checklist-table td:nth-child(7) {
    width: 8%;
    min-width: 110px; /* Il campo data occupa spazio */
}

/* --- COLONNA STATO --- */
.checklist-table th:nth-child(8), /* Stato */
.checklist-table td:nth-child(8) {
    /* Prova con una % leggermente maggiore o un min-width */
    width: 3%;        /* Es. aumentata da 3% a 6% */
    min-width: 100px; /* Es. Imposta una larghezza minima in pixel */
                      /* Scegli una delle due (width o min-width) o usale insieme */
                      /* Aggiusta questo valore finché il select non sta comodo */
}
/* Stile specifico per il select dentro la cella stato */
.checklist-table td:nth-child(8) select {
     width: 100%; /* Fai prendere al select tutta la larghezza della cella */
     padding: 4px 6px; /* Riduci padding se necessario */
     font-size: 0.8em; /* Riduci font se necessario */
     min-width: 80px; /* Potrebbe servire un min-width anche sul select stesso */
}
/* --- FINE COLONNA STATO --- */


.checklist-table th:nth-child(9), /* Note */
.checklist-table td:nth-child(9) {
    width: 15%;
}

.checklist-table th:nth-child(10), /* Data Agg. */
.checklist-table td:nth-child(10) {
    width: 8%;
    min-width: 90px; /* La data occupa spazio */
    white-space: nowrap; /* Evita che la data vada a capo */
}

/* Rendi la tabella 'fixed' se vuoi che le larghezze siano rispettate più rigidamente,
   ma potrebbe tagliare il contenuto se non c'è abbastanza spazio. */
/* .checklist-table { table-layout: fixed; } */

/* === Stile per Cella Nascosta (Campi Condizionali) === */

.hidden-cell {
    visibility: hidden; /* Inizia solo con questo */
    /* display: none; */ /* O prova solo con questo */
}


.hidden-cell-js {
    display: none !important; /* Nasconde completamente l'elemento e lo rimuove dal flusso */
}

.main-header {
    background-color: #f8f9fa; /* Sfondo leggermente grigio */
    padding: 10px 0;
    border-bottom: 1px solid #dee2e6;
    margin-bottom: 30px; /* Spazio sotto l'header */
}

.header-container {
    display: flex;
    justify-content: space-between; /* Logo a sx, nav a dx */
    align-items: center; /* Allinea verticalmente */
    flex-wrap: wrap; /* Permetti wrap su mobile */
    padding-top: 0; /* Rimuovi padding default .container */
    padding-bottom: 0;
}

.logo-area h1 {
    font-size: 1.8em; /* Riduci dimensione H1 nell'header */
    margin: 0; /* Rimuovi margini H1 */
    color: #0056b3; /* Colore logo/titolo */
}

.user-nav {
    display: flex;
    align-items: center;
    gap: 15px; /* Spazio tra elementi nav */
    font-size: 0.9em;
}

.user-nav span {
    color: #495057; /* Colore testo benvenuto */
    margin-right: 5px; /* Spazio prima dei bottoni */
}

.user-nav .button-link.header-button {
    padding: 6px 12px; /* Padding ridotto per bottoni header */
    font-size: 0.9em; /* Font ridotto */
    margin-bottom: 0; /* Rimuovi margine inferiore */
}


/* Rinomina il container del contenuto principale */
.main-content {
    /* Rimuovi padding superiore se l'header ha già padding */
    /* padding-top: 0; */
}

* Esempio colori (da personalizzare) */
/*
/*.row-critical-open { background-color: #f8d7da !important; /* Rosso chiaro */ }
/*.row-closed-ok { background-color: #d4edda !important; /* Verde chiaro */ }
/*.row-closed-ko { background-color: #fff3cd !important; /* Giallo/Arancio chiaro */ }
/*.row-open-normal { /* Puoi lasciare il default o usare un colore neutro */ }


/* Prova con !important */
.row-critical-open { background-color: #f8d7da !important; }
.row-closed-ok { background-color: #d4edda !important; }
.row-closed-ko { background-color: #fff3cd !important; }
.row-open-normal { background-color: #e9ecef !important; } 

.commessa-details-header {
    background-color: #f8f9fa;
    border: 1px solid #e9ecef;
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 5px;
}
.commessa-details-header p {
    margin: 5px 0;
    font-size: 0.95em;
}
.commessa-details-header p strong {
    min-width: 150px; /* Allinea un po' le label */
    display: inline-block;
}

.action-icons {
    text-align: center; /* Centra le icone nella cella se sono poche */
    white-space: nowrap; /* Evita che le icone vadano a capo */
}

.icon-link {
    display: inline-block; /* Permette padding e margini */
    padding: 6px 8px;      /* Padding attorno all'icona */
    margin: 0 3px;         /* Piccolo spazio tra le icone */
    border-radius: 4px;
    transition: background-color 0.2s ease, transform 0.1s ease;
    line-height: 1; /* Per allineare bene l'SVG se ha dimensioni strane */
    vertical-align: middle; /* Allinea bene con altro testo se presente */
}

.icon-link svg {
    width: 1em;  /* Dimensione icona relativa al font-size del link */
    height: 1em; /* Dimensione icona relativa al font-size del link */
    vertical-align: -0.125em; /* Aggiustamento verticale fine per SVG */
    fill: white; /* Colore dell'icona SVG (se fill="currentColor" è nell'SVG) */
}

.icon-link:hover {
    transform: translateY(-1px); /* Leggero effetto al passaggio del mouse */
}

/* Colori specifici come richiesto */
.icon-link.icon-checklist {
    background-color: #0056b3; /* Blu per Checklist */
}
.icon-link.icon-checklist:hover {
    background-color: #004080;
}

.icon-link.icon-edit {
    background-color: #ffc107; /* Giallo per Modifica */
}
.icon-link.icon-edit:hover {
    background-color: #e0a800;
}
/* Se vuoi che l'icona SVG per modifica sia scura su sfondo giallo: */
.icon-link.icon-edit svg {
    fill: #212529; /* Nero/Grigio scuro per contrasto su giallo */
}


.icon-link.icon-delete {
    background-color: #dc3545; /* Rosso per Elimina */
}
.icon-link.icon-delete:hover {
    background-color: #c82333;
}


* {
    box-sizing: border-box;
}


.checklist-table {
    width: 100%;
    table-layout: fixed; /* Cruciale */
    border-collapse: collapse;
    margin-bottom: 20px; /* Spazio sotto la tabella */
}

.checklist-table th,
.checklist-table td {
    border: 1px solid #ccc;
    padding: 6px 8px; /* Padding base per le celle */
    vertical-align: top;
    word-break: break-word; /* Permette al testo di andare a capo */
    font-size: 0.9em; /* Leggermente più piccolo per più contenuto */
}

.checklist-table th {
    background-color: #e9ecef;
    font-weight: bold;
    text-align: center;
}

/* Definisci la larghezza per ogni colonna (esempio, da aggiustare) */
.checklist-table th:nth-child(1), .checklist-table td:nth-child(1) { width: 4%; }  /* ID */
.checklist-table th:nth-child(2), .checklist-table td:nth-child(2) { width: 8%; } /* Responsabile */
.checklist-table th:nth-child(3), .checklist-table td:nth-child(3) { width: 22%; } /* Domanda */
.checklist-table th:nth-child(4), .checklist-table td:nth-child(4) { width: 7%; }  /* Risposta (select) */
.checklist-table th:nth-child(5), .checklist-table td:nth-child(5) { width: 15%; } /* Attività (textarea) */
.checklist-table th:nth-child(6), .checklist-table td:nth-child(6) { width: 10%; } /* Chi (input text) */
.checklist-table th:nth-child(7), .checklist-table td:nth-child(7) { width: 10%; }  /* Entro il (input date) */
.checklist-table th:nth-child(8), .checklist-table td:nth-child(8) { width: 7%; }  /* Stato (select) */
.checklist-table th:nth-child(9), .checklist-table td:nth-child(9) { width: 18%; } /* Note (textarea) */
.checklist-table th:nth-child(10),.checklist-table td:nth-child(10){ width: 7%; text-align: center; } /* Data Agg. */

/* Stili per gli input dentro le celle per farli adattare */
.checklist-table td input[type="text"],
.checklist-table td input[type="date"],
.checklist-table td select,
.checklist-table td textarea {
    width: 100%;
    box-sizing: border-box; /* Molto importante! */
    padding: 4px; /* Padding minimo */
    font-size: 0.95em; /* Relativo al font della cella */
    border: 1px solid #ccc;
    border-radius: 3px;
}

.checklist-table td textarea {
    min-height: 30px; /* Altezza minima per i textarea */
    resize: vertical; /* Permetti solo resize verticale */
}

/* Specifico per la cella "Entro il" e il suo input */
.checklist-table td.entro-cell input[type="date"] {
    /* Potrebbe non servire più min-width:0 se width:100% e box-sizing funzionano */
    /* min-width: 0; */
}

.checklist-table td.update-date-cell {
    font-size: 0.85em; /* Ancora più piccolo per la data agg. */
    white-space: normal; /* Permetti alla data di andare a capo se necessario */
}


.row-nonso {
    background-color: #fff3cd !important; /* Giallo chiaro (Bootstrap warning color) */
    /* color: #856404; */ /* Testo scuro per contrasto, se necessario */
}