﻿/*Surcharge bootstrap modal*/
.modal {
    border-radius: 0.75rem !important;
    font-size: 0.875rem;
}

    .modal .modal-header {
        padding: 0.5rem 1rem;
        background-color: #F7F8F9;
    }

        .modal .modal-header .close {
            padding: 1.5rem 1rem;
            margin: -1rem;
            color: #C2C8D2;
            opacity: 1;
            font-weight: 500;
        }

        .modal .modal-header .modal-title {
            margin: auto !important;
        }

    /* en tete pour les modal avec plusieurs volets*/

    .modal .modal-body-header {
        color: #6F7B86;
    }

        .modal .modal-body-header .menu-onglet {
            height: 40px;
            display: flex;
            margin-bottom: 2px;
        }

            .modal .modal-body-header .menu-onglet:hover {
                cursor: pointer;
            }

        .modal .modal-body-header .menu-number,
        .modal .modal-body-header .menu-check {
            font-size: 1.375rem;
            font-weight: 600;
        }

        .modal .modal-body-header .menu-titre {
            font-size: 0.9rem;
            font-weight: 500;
        }

        .modal .modal-body-header .menu-separation-horizontal {
            border-top: 1.5px solid #6F7B86;
            width: 50px;
            margin-left: 5px;
            margin-right: 5px;
        }

        .modal .modal-body-header .menu-separation-vertical {
            font-size: 1.625rem;
            font-weight: 200;
            margin-left: 1.75rem;
            margin-right: 1.75rem;
            color: #D8DBDE;
        }
    /*Fenêtre Modal de confirmation*/

    /*En tete modal */
    .modal .btn-close-no-header {
        font-size: 2rem;
        font-weight: 400;
        text-align: right;
        margin-right: 8px;
        margin-bottom: 0;
    }

.modal-confirm {
    z-index: 1070;
}

    .modal-confirm a.modal-close,
    .modal-confirm a.modal-close:hover,
    .modal-confirm a.modal-close:visited {
        color: #424242;
        text-decoration: none;
        display: block;
        margin-top: 10px;
    }

    .modal-confirm .modal-dialog {
        width: 500px;
    }

    .modal-confirm.modal-confirm-large .modal-dialog {
        width: 600px;
    }

    .modal-confirm .message-confirmation {
        padding: 25px 20px 15px;
    }

    .modal-confirm .message-action {
        padding: 20px;
    }

    .modal-confirm .message-btn {
        padding-top: 15px;
        padding-bottom: 15px;
    }

        .modal-confirm .message-btn div {
            width: 40%;
            margin: auto;
        }

            .modal-confirm .message-btn div:first-child {
                padding-bottom: 10px;
            }

@media (max-width:767px) {

    .modal-confirm .modal-dialog,
    .modal-confirm.modal-confirm-large .modal-dialog {
        width: 100% !important;
    }

    .modal-confirm {
        height: auto;
    }
}

.modal-backdrop ~ .modal-backdrop {
    z-index: 1050;
}

/*Fin Fenêtre Modal de confirmation*/

/*Correction padding right en responsive*/
.modal-open {
    padding-right: 0px !important;
}

/* responsive */

@media (max-width: 767.98px) {
    .modal {
        padding-right: 0 !important;
    }

    .modal-dialog {
        margin: 0;
        min-height: 100%;
        height: auto;
        align-items: inherit;
        max-width: inherit;
    }
}


/*Surcharge modal xl et lg*/
/*Creation style modal xxl*/
@media (min-width: 576px) {
    .modal-xxl,
    .modal-xl,
    .modal-lg {
        max-width: 100% !important;
    }

}

@media (min-width: 992px) {
    .modal-lg,
    .modal-xl {
        max-width: 950px !important;
    }
}

@media (min-width: 1200px) {
    .modal-xl {
        max-width: 1140px !important;
    }

    .modal-xxl {
        max-width: 1600px !important;
    }
}
