/* Fix pour forcer l'affichage des modals Bulma */

/* Forcer l'affichage des modals actifs */
.modal.is-active {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 999999 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    overflow: auto !important;
}

/* S'assurer que le background est visible */
.modal.is-active .modal-background {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(10, 10, 10, 0.86) !important;
    z-index: -1 !important;
}

/* S'assurer que le contenu du modal est visible et centré */
.modal.is-active .modal-content,
.modal.is-active .modal-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    max-height: calc(100vh - 40px) !important;
    overflow: auto !important;
    margin: 0 auto !important;
    z-index: 1 !important;
}

/* Fix spécifique pour modal-card */
.modal.is-active .modal-card {
    width: 100% !important;
    max-width: 960px !important; /* Augmenté de 640px à 960px */
}

/* Animation d'ouverture */
.modal.is-active {
    animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Fix pour mobile */
@media screen and (max-width: 768px) {
    .modal.is-active .modal-card,
    .modal.is-active .modal-content {
        width: 100% !important;
        margin: 0 !important;
        max-width: none !important;
        max-height: 100vh !important;
    }
}

/* S'assurer que les boutons de fermeture sont cliquables */
.modal .modal-close,
.modal .cdclient-calendrier-close-modal,
.modal .delete {
    cursor: pointer !important;
    z-index: 2 !important;
}

/* Override d'éventuels display:none sur le modal */
#modal-single-event {
    display: none;
}

#modal-single-event.is-active {
    display: flex !important;
}