/* --- Codice esistente --- */
a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Responsive font size */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles using flexbox */
html, body {
    height: 100%;
    margin: 0;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.main-content {
    flex: 1 0 auto;
    padding-bottom: 60px;
}

.footer {
    flex-shrink: 0;
    height: 60px;
    line-height: 60px;
    background: #f8f9fa;
    width: 100%;
    white-space: nowrap;
    border-top: 1px solid #e5e5e5;
    text-align: center;
}

/* Box e stile personalizzato */
.welcome-box {
    background: linear-gradient(90deg, #b71c1c, #7f0000);
    box-shadow: 0 4px 8px rgba(0,0,0,0.3);
    border-radius: 0.5rem;
    color: white;
    font-weight: 700;
    padding: 1.5rem 1.5rem;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.6);
}

.new-report-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: white;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    border-radius: 0.5rem;
    color: #333;
    font-weight: 700;
    padding: 1.5rem;
}


@media (max-width: 576px) {
    .new-report-box {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
    }

    .new-report-box > div {
        width: 100%;
        justify-content: space-between;
    }
}

    /* Pulsanti dentro .new-report-box */
    .new-report-box button {
        padding: 5px 12px;
        border-radius: 6px;
        font-size: 12px;
        cursor: pointer;
        box-shadow: none;
        border-width: 1px;
        border-style: solid;
        transition: box-shadow 0.3s ease, transform 0.2s ease;
    }

/* Colori specifici pulsanti */
#schermoIntero {
    background-color: white;
    color: #333333;
    border-color: #ccc;
}

#saveAsReportBtn, #exportOptionsBtn{
    background-color: #e6f9e6;
    color: #2a7a2a;
    border-color: #2a7a2a;
}

#toggleModeBtn, #MakeIstituzionaleBtn {
    background-color: #ffe5e5;
    color: #b30000;
    border-color: #b30000;
}

#CondividReportBtn {
    background-color: #e6f2ff;
    color: #007bff;
    border-color: #007bff;
}

button[onclick="deleteSelectedReports()"] {
    background-color: #d3d3d3;
    color: #555555;
    border-color: #555555;
    border-radius: 4px;
    /*font-size: 14px;*/
    padding: 5px 10px;
}

/* Effetto rilievo al passaggio del mouse su tutto il pulsante */
.new-report-box button:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
    transform: translateY(-2px);
}

/* --- Layout griglia e lista aggiornato --- */

/* GRID VIEW - container impostato con riga flessibile o griglia */
#report-container.grid-view {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}



    #report-container.grid-view .report-item {
        flex: 0 0 100%;  resetta a 100% per sicurezza 
        max-width: 100%;
        display: block;
        margin-bottom: 0;
    }

 /*2 card per riga su tablet*/ 
@media (min-width: 576px) {
    #report-container.grid-view .report-item {
        flex: 0 0 50%;
        max-width: 50%;
    }
}


/* Su desktop, 3 card fisse per riga */
@media (min-width: 992px) {
    #report-container.grid-view .report-item {
        flex: 0 0 300px;
        max-width: 300px;
    }
}



/* LIST VIEW */
#report-container.list-view {
    display: block;
}

    #report-container.list-view .report-item {
        width: 100%;
        display: block;
        margin-bottom: 1rem;
    }

    #report-container.list-view .card {
        width: 100%;
        display: block;
        padding: 1rem;
        border: 1px solid #e0e0e0;
        border-radius: 0.5rem;
        background-color: #fff;
        box-shadow: 0 2px 6px rgba(0,0,0,0.05);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

        /* Effetto al passaggio */
        #report-container.list-view .card:hover {
            transform: translateY(-3px);
            box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        }

    /* Corpo della card in lista: contenuto verticale centrato */
    #report-container.list-view .card-body {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

        /* Limita larghezza del paragrafo per evitare righe troppo lunghe */
        #report-container.list-view .card-body p {
            max-width: 100%; /* oppure 80ch se vuoi limitarla visivamente */
        }


/* Pulsanti toggle attivi */
.btn-view-toggle.active {
    background-color: #e60000;
    color: white;
}

/* Overrides Bootstrap row/col per lista e griglia se usi row/col */
#report-container.list-view .row > div[class*="col-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
}

/*#report-container.grid-view .row > div[class*="col-"] {
    flex: none !important;
    max-width: none !important;
}*/

/* GRID-VIEW: 3 colonne fisse su desktop */
#report-container.grid-view .row > div[class*="col-"] {
    flex: 0 0 33.3333% !important;
    max-width: 33.3333% !important;
}

    /* Margine tra le card */
    #report-container.grid-view .row > div[class*="col-"] > .card {
        margin-bottom: 1rem;
    }


/* Hover generico */
.card-hover {
    transition: border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
    border: none;
}

    /* Card rossa al passaggio del mouse */
    .card-hover:hover {
        border: 2px solid #dc3545;
        transform: translateY(-5px);
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }

    /* Card verde al passaggio del mouse */
    .card-hover.border-success:hover {
        border: 2px solid #198754;
        transform: translateY(-5px);
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }

/* Pallino verde accanto al titolo */
/* Pallino generico */
.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

/* Pallino rosso per card rosse */
.dot-red {
    background-color: #dc3545;
}

/* Pallino verde per card verdi */
.dot-green {
    background-color: #198754;
}

/* Accensione titolo: rosso */
.card-hover:hover .card-title-text {
    color: #dc3545;
    transition: color 0.3s;
    font-weight: 700;
}

/* Accensione titolo: verde (solo su card verdi) */
.card-hover.border-success:hover .card-title-text {
    color: #198754;
}

/* Icona in alto a destra: default grigia */
.card .bi-box-arrow-up-right {
    color: gray;
    transition: color 0.3s ease;
}

/* Icona rossa su hover */
.card-hover:hover .bi-box-arrow-up-right {
    color: #dc3545;
}

/* Icona verde su hover (solo su card verdi) */
.card-hover.border-success:hover .bi-box-arrow-up-right {
    color: #198754;
}

.back-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 6px;
    color: #333;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor: pointer;
    text-decoration: none;
}

    .back-arrow:hover {
        background-color: #f8d7da; /* rosso chiaro pastello */
        color: #a71d2a; /* rosso scuro per la freccia */
        text-decoration: none;
    }

#loginBtn {
    transition: all 0.2s ease-in-out;
}

    /* Effetto rilievo al passaggio del mouse (solo se abilitato) */
    #loginBtn:hover:enabled {
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.25);
        transform: translateY(-2px);
    }

    /* Cursor divieto da disabilitato */
    #loginBtn:disabled {
        cursor: not-allowed !important;
        opacity: 0.65;
        box-shadow: none;
        transform: none;
    }

.btn-danger:hover {
    background-color: #c82333; /* un rosso più scuro per l'effetto rilievo */
    box-shadow: 0 4px 8px rgba(0,0,0,0.2); /* ombra per effetto "sollevato" */
    transform: translateY(-2px); /* leggero spostamento verso l’alto */
    transition: all 0.3s ease;
}

.form-check-input:checked {
    background-color: #198754 !important; /* verde */
    border-color: #198754 !important;
}

.form-check-input:focus {
    border-color: #198754 !important;
    box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.25) !important;
}

.form-check-label {
    color: #198754 !important;
}


#report-container.grid-view {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
}
/* Corpo della card: estende per riempire lo spazio verticale */
/*#report-container.grid-view .card-body {
    flex-grow: 1;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}*/
/* Corpo card griglia e lista */
#report-container .card-body.fixed-card-body {
    flex-grow: 1;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 201.13px !important;
    max-height: 320px !important;
    overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* opzionale */
}

/* Descrizione: limita le righe visualizzate */
#report-container.grid-view .card-text {
    overflow: visible;
    text-overflow: clip;
    display: block;
    -webkit-line-clamp: unset;
    -webkit-box-orient: initial;
    line-height: 1.35;
    max-height: none;
    margin-bottom: 0.5rem;
}

#report-container .card-body.fixed-card-body .card-meta {
    margin-top: auto;
    display: block;
    width: 100%;
}


.my-section-wrapper {
    display: flex;
    flex-direction: column;
}
#saveAsModal .dropdown-menu {
    z-index: 1056 !important;
    position: absolute !important;
}

.section-hidden {
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.report-section {
    width: 1248px;
    margin: 0 auto;
    height: auto; /* oppure semplicemente ometti height/min-height */
    min-height: unset; /* rimuove eventuali min-height */
}


@font-face {
    font-family: 'Montserrat';
    src: url('/montserrat/Montserrat-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900; /* supporta il range dei pesi */
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('/montserrat/Montserrat-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: italic;
}

body {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 400;
}

* {
    font-family: 'Montserrat', sans-serif !important;
}

/*.fixed-card-body {
    width: 403.33px !important;
    height: 201.13px !important;
    overflow: hidden !important;
}
*/

#report-container .card-body.fixed-card-body {
    flex-grow: 1 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 201.13px !important;
    max-height: 320px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
}

.tab-btn:focus {
    box-shadow: none; /* rimuove l’ombra azzurra di Bootstrap */
    outline: none; /* rimuove il bordo di focus */
}

/* ============================
   TABELLA COMPATIBILITÀ 
   ============================ */

.table-wrapper {
    position: relative;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    background: white;
}

.table-wrapper {
    width: 100%; /* deve essere limitato */
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    background: white;
}

.table-scroll {
    overflow-x: auto;
    max-width: 100%;
    width: 100%; /* aggiunto per sicurezza */
    position: relative;
}

/* --- Sticky prima colonna (corpo) --- */
.sticky-col-1 {
    position: sticky;
    left: 0;
    z-index: 4; /* sotto l'header */
    background: #f8f9fa;
}

/* --- Sticky seconda colonna (corpo) --- */
.sticky-col-2 {
    position: sticky;
    left: 50px; /* larghezza della prima colonna */
    z-index: 3;
    background: #f8f9fa;
}

/* --- Sticky prima colonna nell'header --- */
thead .sticky-col-1 {
    position: sticky;
    top: 0; /* necessario per l'header */
    left: 0;
    z-index: 10; /* sopra tutte le celle */
    background: #f1f3f5;
    border-bottom: 2px solid #dee2e6;
    min-width: 50px;
    max-width: 50px;
}

/* --- Sticky seconda colonna nell'header --- */
thead .sticky-col-2 {
    position: sticky;
    top: 0; /* necessario per l'header */
    left: 50px; /* larghezza prima colonna */
    z-index: 9;
    background: #f1f3f5;
    border-bottom: 2px solid #dee2e6;
    min-width: 150px;
}

/* --- Sticky header generale --- */
thead th:not(.sticky-col-1):not(.sticky-col-2) {
    position: sticky;
    top: 0;
    background: #f1f3f5;
    z-index: 8;
    border-bottom: 2px solid #dee2e6;
}

/* --- Sticky footer --- */
.sticky-footer {
    position: sticky;
    bottom: 0;
    z-index: 6;
    background: #fff;
    padding: 0.5rem 1rem;
    border-top: 1px solid #dee2e6;
    display: flex;
    justify-content: space-between;
}

/* Rimuove il bold a TUTTA la riga dell’header compatibilità */
#compatibility-table thead th {
    font-weight: normal !important;
}

#compatibility-table td.sticky-col-2 {
    font-weight: normal !important;
}
#compatibility-table td.sticky-col-2,
#compatibility-table th.sticky-col-2 {
    font-weight: normal !important; /* mantiene il testo normale */
    white-space: nowrap; /* impedisce il ritorno a capo */
    text-align: left; /* opzionale, se vuoi allineare a sinistra */
}

/* Spunta verde per le celle compatibili */
#compatibility-table td:not(.sticky-col-1):not(.sticky-col-2) {
    color: #198754; /* verde Trenitalia */
    font-weight: bold; /* opzionale, se vuoi evidenziare la spunta */
    font-size: 1rem; /* puoi regolare la dimensione della spunta */
    text-align: center;
}

/* Mantiene le intestazioni delle colonne non sticky su una riga */
#compatibility-table thead th:not(.sticky-col-1):not(.sticky-col-2) {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis; /* se troppo lungo, mostra ... */
}
/* ======================
   MISURE – larghezza colonne
   ====================== */


#tab-measures table {
    table-layout: auto !important; /* permette alla colonna di espandersi davvero */
}

    #tab-measures table th:first-child,
    #tab-measures table td:first-child {
        white-space: nowrap !important; /* mai andare a capo */
        width: auto !important; /* lascia espandere */
        max-width: none !important; /* nessun limite */
    }

/* ======================
   NOTE – larghezza colonne
   ====================== */
#tab-notes table {
    table-layout: auto !important; /* permette alla colonna di espandersi davvero */
}

    #tab-notes table th:first-child,
    #tab-notes table td:first-child {
        white-space: nowrap !important; /* mai andare a capo */
        width: auto !important; /* lascia espandere */
        max-width: none !important; /* nessun limite */
    }

#tab-notes td:nth-child(2) {
    white-space: pre-wrap; /* mantiene ritorni a capo e spazi multipli */
    word-break: break-word; /* evita che una riga troppo lunga superi la larghezza */
}

/* ======================
   dimensioni – larghezza colonne
   ====================== */
/* Impedisce il ritorno a capo nella colonna Attributo del tab Dimensioni */
#tab-dimensions table td:nth-child(3),
#tab-dimensions table th:nth-child(3) {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis; /* se il testo è troppo lungo, mostra "..." */
}
#tab-dimensions table td:nth-child(1),
#tab-dimensions table th:nth-child(1) {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis; /* se il testo è troppo lungo, mostra "..." */
}
#tab-dimensions table td:nth-child(2),
#tab-dimensions table th:nth-child(2) {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis; /* se il testo è troppo lungo, mostra "..." */
}