/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY3VzdG9tLmNzcyIsInNvdXJjZXMiOlsiY3VzdG9tLnNjc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IiJ9 */

.nunito-<uniquifier> {
  font-family: "Nunito", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

/* INIZIO COLORI */

:root {
  --primary-color: #4ec5d9;             /* celeste (navbar) */
  --secondary-color: #f99d18;           /* arancione (bottoni) */
  --light-secondary-color: #e9ae58;     /* arancione spento */
  --text-color: #30507b;                /* blu scuro (testo) */
}


.bg-color-white{
    background-color: #fff;
}

.text-blu{
    color: var(--text-color);
}

.bg-primary-color{
    background-color: var(--primary-color);
}

.text-primary-color{
    color: var(--primary-color);
}

.bg-secondary-color{
    background-color: var(--secondary-color) !important;
}

.text-secondary-color{
    color: var(--secondary-color);
}

.bg-secondary-light{
    background-color: var(--light-secondary-color) !important;
}

.bg-text-color{
    background-color: var(--text-color);
}

/* FINE COLORI */



/*  UTILS   */

            /*  BTN WARNING PERSONALE. Il btn warning è sovrascritto dal primary  */
.my-btn-warning {
    background-color: var(--secondary-color) !important;
    border-color: #ffa426 !important;
    color: #fff !important;
}

.btn-no-hover,
.btn-no-hover:hover,
.btn-no-hover:focus,
.btn-no-hover:active,
.btn-no-hover:visited {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}

/*  FINE UTILS   */


/*  INIZIO FORM CONTROL  */


.theme-white .form-control:focus {
    border-color: #3ABAF4;
}

/* Imposta il container come flex */
.grid-checkbox {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
}

/* Ogni checkbox (la sua wrapping div) verrà disposta in una griglia */
.grid-checkbox .form-check {
    flex: 0 0 23%;  /* per 4 elementi per riga; se ne vuoi 3 usa ad esempio 30% */
    margin: 0.5%;
    text-align: center;
    font-size: 1.1rem; /* Ingrandisce il testo */
    font-weight: bold;
    color: var(--text-color);
}

/* Personalizza il checkbox (ingrandisce l'input) */
.grid-checkbox .form-check input[type="checkbox"] {
    transform: scale(0);  /* Ingrandisce il checkbox */
    margin-right: 0.5rem;
}

/* Personalizza l'etichetta per farla apparire come un pulsante */
.grid-checkbox .form-check label {
    display: block;
    padding: 0.8rem;  /* Aumenta il padding */
    border: 1px solid #ccc;
    border-radius: 4px;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

/* Stile per i checkbox selezionati */
.grid-checkbox .form-check input[type="checkbox"]:checked + label {
    background-color: var(--primary-color);
    color: #fff;
}

#div_id_template_screening .form-label{
    color: var(--text-color);
    font-weight: bold;
    font-size: 1.5rem;
    margin-bottom: 0.8rem;
    padding-left: 0.8rem;
}

#id_template_screening select{
    margin: 0.5%;
}

#div_id_template_screening select option{
    margin-left: 0.5%;
    font-weight: bold;
    color: var(--text-color);
}


#div_id_template_visita .form-label{
    color: var(--text-color);
    font-weight: bold;
    font-size: 1.5rem;
    margin-bottom: 0.8rem;
    padding-left: 0.8rem;
}

#id_template_visita select{
    margin: 0.5%;
}

#div_id_template_visita select option{
    margin-left: 0.5%;
    font-weight: bold;
    color: var(--text-color);
}

#div_id_data .form-label{
    color: var(--text-color);
    font-weight: bold;
    font-size: 1.5rem;
    margin-bottom: 0.8rem;
    padding-left: 0.8rem;
}

#div_id_data input{
    margin-left: 0.5%;
    font-weight: bold;
    color: var(--text-color);
}

#div_id_tipo_parametri .form-label{
    color: var(--text-color);
    font-weight: bold;
    padding-left: 0.8rem;
}

/*  FINE FORM CONTROL  */


/*  INIZIO BASE.HTML  */

.theme-white .navbar {
    background-color: var(--primary-color);
}

.main-sidebar .sidebar-brand a {
    text-decoration: none;
    text-transform: none;
    letter-spacing: 3px;
    font-weight: 700;
    font-size: 23px;
    vertical-align: bottom;
    color: #000;
}



/*  FINE BASE.HTML  */


/*  INIZIO LOGIN.HTML  */

.theme-white .card.card-primary {
    border-top: 2px solid #3ABAF4;
}

.login-card {
    display: flex;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.login-image {
    width: 90%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.login-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.login-wrapper {
    display: flex;
    height: 100vh;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.card {
    overflow: hidden;
}

/*  FINE LOGIN.HTML  */


/*  PASSWORD RESET  */


.bg-color-card{
    background-color: #dce8e8;   /* Colorore Medio-Chiaro 8/10 */

    /* #f2f5f5;   Colore Chiaro 10/10
       #d1e3e3;   Colorore Scuro 6/10
    */
}

.h-55vh-custom {
    height: 40vh !important;
}


/*  PASSWORD RESET  */


/*  INIZIO PAZIENTE_DETAIL.HTML - PAZIENTE DETTAGLIO  */

.color-label{
    color: var(--text-color);
    font-weight: bold;
}

.nav-tabs .nav-item {
    margin-right: 20px;  /* Spazio tra le tab */
}

.nav-tabs .nav-link {
    border-radius: 15px; /* Smussa solo gli angoli superiori */
    border: 1px solid transparent;
}

.nav-tabs .nav-link.active {
    background-color: var(--secondary-color); /* Sfondo corretto */
    border-color: var(--secondary-color) var(--secondary-color) transparent; /* Evita il triangolo */
}

.nav-tabs .nav-link:not(.active) {
    background-color: var(--light-secondary-color); /* Sfondo delle tab non attive */
    border-color: transparent;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    border-radius: 15px;
}

.bold-label {
    font-weight: bold;
    font-size: 1rem;
}

.normal-label {
    font-weight: normal;
    font-size: 14px;
}

.border-aderenza-shadow{
    border-radius: 10px; /* Border-radius tipico dei Django Forms */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3); /* Ombra più scura */
    padding: 0.375rem 0.75rem; /* Padding dei campi di input Django */
    background-color: #fff; /* Sfondo */
    transition: box-shadow 0.2s ease-in-out, border 0.2s ease-in-out;
}

/*  FINE PAZIENTE_DETAIL.HTML - PAZIENTE DETTAGLIO  */


/*  INIZIO PAZIENTE_CONFRONTO_PARZIALE.HTML - PAZIENTE DETTAGLIO  */

#confronto-container .card .card-header{
    border-bottom-color: #fff;

}

#confronto-container .card {
    background-color: color-mix(in srgb, var(--text-color) 25%, transparent);
}

/*  FINE PAZIENTE_CONFRONTO_PARZIALE.HTML - PAZIENTE DETTAGLIO  */


/*  INIZIO DATATABLE - PAZIENTE_LIST  */

#pazienti-datatable-list {
    width: 100% !important;
    table-layout: auto;  /* le colonne si adattano */
}

#pazienti-datatable-list td{
    text-align: center !important; /* Centra il testo */
    font-size: 16px !important;    /* Dimensione del carattere */
    vertical-align: middle !important; /* Centra verticalmente */
    font-weight: bold !important;
}

.custom-header-table th{
    text-align: center !important;
    font-size: 16px !important;
    vertical-align: middle !important;
    font-weight: bold !important;
}

table.table-bordered.dataTable th, table.table-bordered.dataTable td {
    border-bottom-width: 2px;
    border-color: #dee2e6 !important;
}


/*  FINE DATATABLE - PAZIENTE_LIST  */

/*  INIZIO DATATABLE - TEMPLATE_SCREENING  */


#template-screaning-table td{
    text-align: center !important; /* Centra il testo */
    font-size: 16px !important;    /* Dimensione del carattere */
    vertical-align: middle !important; /* Centra verticalmente */
    font-weight: bold !important;
}

.custom-header-table th{
    text-align: center !important;
    font-size: 16px !important;
    vertical-align: middle !important;
    font-weight: bold !important;
}

/*  FINE DATATABLE - TEMPLATE_SCREENING  */

/* ALBERTO */
.timeline-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

.timeline-item {
display: flex;
align-items: center;
gap: 20px;
margin-bottom: 20px;
}

.timeline-progress {
flex: 1;
position: relative;
height: 40px;
background-color: #e0e0e0;
border-radius: 5px;
overflow: hidden;
}

.timeline-progress-bar {
height: 100%;
background-color: #4caf50;
transition: width 0.3s ease;
}

.timeline-dots {
display: flex;
justify-content: space-between;
position: absolute;
top: 50%;
left: 0;
right: 0;
transform: translateY(-50%);
}

.timeline-dots .dot {
width: 10px;
height: 10px;
background-color: #ccc;
border-radius: 50%;
}

.timeline-content {
    flex-grow: 1;
}

.timeline-time {
    display: block;
    font-weight: bold;
}

.timeline-status {
    display: block;
    color: #007bff;
    font-weight: bold;
}

.timeline-details {
    display: block;
    color: #666;
}
.timeline-status-name {
margin-top: 5px;
font-weight: bold;
font-size: 14px;
text-align: left;
}
.dot-container {
display: flex;
flex-direction: column;
align-items: center;
}
.dot {
width: 10px;
height: 10px;
background-color: #ccc;
border-radius: 50%;
margin-bottom: 5px;
}

.dot-label {
font-size: 12px;
color: #333;
white-space: nowrap;
}

.card-dashboard-custom {
color : white;
background-color : #4ec5d9;
}

.card-dashboard-custom-grey {
color : white;
background-color : #E0E0E0;
}

.text-custom-azzurro {
color: #4ec5d9;
}

.text-custom-black {
color: black;
}

.progressbar-color {
    background-color: #f99d18; /* Colore di sfondo */
    border-radius: 10px;
}

/* FINE ALBERTO */