/*

Overlay (.modal-backdrop): Sfondo semi-trasparente per il modal overlay.

Dialogo principale (.modal-dialog): Dimensioni e centratura del modal.

Contenuto del modal (.modal-content): Stile di base, con bordi arrotondati e ombra.

Header (.modal-header): Linea di separazione, titolo e stile per il pulsante di chiusura.

Body (.modal-body): Spaziatura e stile del testo.

Footer (.modal-footer): Layout dei pulsanti e colori per i pulsanti primario e secondario.

Responsivo: Adeguamento del layout su dispositivi mobili.

*/



/* Modal Overlay */

.modal-backdrop {

    background-color: rgba(0, 0, 0, 0.5); /* Sfondo scuro semi-trasparente */

}



/* Modal Window */

.modal-dialog {

    max-width: 600px; /* Larghezza massima */

    margin: 1.75rem auto; /* Centra il modal */

}



.modal-content {

    border-radius: 8px; /* Angoli arrotondati */

    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); /* Ombra leggera */

    border: none; /* Rimuove il bordo */

    padding: 1rem; /* Padding interno */

    background-color: #ffffff; /* Sfondo bianco */

    background-color: var(--cBianco); 

}



/* Modal Header */

.modal-header {

    border-bottom: 0px solid #e0e0e0; /* Separatore */

    padding-bottom: 1rem;

    display: flex;

    justify-content: space-between;

    align-items: center;

}



.modal-title {

    font-size: 1.25rem;

    font-weight: 700;

}



.modal-header .btn-close {

    opacity: 0.6; /* Pulsante di chiusura semi-trasparente */

}



.modal-header .btn-close:hover {

    opacity: 1; /* Opacità completa al passaggio del mouse */

}



/* Modal Body */

.modal-body {

    /* padding: 1.5rem; */

    color: #333333; /* Colore del testo */

    color: var(--cNero);

    font-size: 1rem;

    line-height: 1.6;

}



/* Modal Footer */

.modal-footer {

    border-top: 0px solid #e0e0e0; /* Separatore */

    padding-top: 1rem;

    display: flex;

    justify-content: flex-end;

}



.modal-footer .btn {

    padding: 0.5rem 1.25rem;

    border-radius: 4px;

    font-weight: 500;

}



/* Primary Button Style */

.modal-footer .btn-primary {

    /* background-color: #007bff;

    border-color: #007bff;

    color: #ffffff;

    color: var(--cBianco);  */

}



.modal-footer .btn-primary:hover {

    /* background-color: #0056b3;

    border-color: #0056b3; */

}



/* Secondary Button Style */

.modal-footer .btn-secondary {

    /* background-color: #6c757d;

    border-color: #6c757d;

    color: #ffffff;

    color: var(--cBianco);  */

}



.modal-footer .btn-secondary:hover {

    /* background-color: #5a6268;

    border-color: #545b62; */

}



/* Responsive adjustments */

@media (max-width: 576px) {

    .modal-dialog {

        max-width: 90%; /* Riduce la larghezza su schermi piccoli */

    }

}