.e-control, .e-input, .e-toolbar, .e-tbar-btn-text {
    font-family: var(--bs-font-sans-serif) !important;
}

/* ------------------- Syncfusion Grid ------------------- */
.e-grid {
    border: none;
}

    .e-grid .e-control.e-toolbar {
        border-top: none;
        padding: 5px 0 20px 0;
    }

    .e-toolbar .e-toolbar-items,
    .e-grid .e-control.e-toolbar {
        background-color: transparent;
    }

        .e-toolbar .e-toolbar-items .e-toolbar-left .e-toolbar-item:first-child {
            margin-left: 0;
        }

        .e-toolbar .e-toolbar-items:first-child > .e-toolbar-item:last-child,
        .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item:last-child {
            margin-right: 0;
        }

        .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item.e-search-wrapper {
            border-radius: 1.5rem;
            border: 2px solid var(--dark-gray);
            color: var(--dark-gray);
        }

            .e-toolbar .e-toolbar-items:first-child > .e-toolbar-right .e-toolbar-item.e-search-wrapper:active {
                border-color: black;
                color: black;
            }

        .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn {
            height: calc(70% - 10px);
            border-radius: 1.5rem;
            background-color: white;
        }

                .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:hover,
                .e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn:active,
                .e-toolbar .e-tbar-btn:focus,
                .e-toolbar .e-tbar-btn:active {
                    color: black;
                    border-color: white !important;
                }

    .e-grid .e-filtermenudiv {
        margin: -21px -7px;
    }

    .e-grid .e-add::before, .e-grid-menu .e-add::before,
    .e-grid .e-edit::before, .e-grid-menu .e-edit::before,
    .e-grid .e-delete::before, .e-grid-menu .e-delete::before,
    .e-grid .e-update::before, .e-grid-menu .e-update::before,
    .e-grid .e-cancel::before, .e-grid-menu .e-cancel::before,
    .e-grid .e-icon-filter::before, .e-grid-menu .e-icon-filter::before,
    .e-grid .e-excelexport::before, .e-grid-menu .e-excelexport::before {
        content: "";
        background-size: 20px 20px;
        display: inline-block;
        width: 20px;
        height: 20px;
    }

    .e-grid .e-add::before, .e-grid-menu .e-add::before {
        background-image: url("../images/Iconographie/OCT-Icone-S-Plus.png");
    }

    .e-grid .e-edit::before, .e-grid-menu .e-edit::before {
        background-image: url("../images/Iconographie/OCT-Icone-S-Modifier.png");
    }

    .e-grid .e-delete::before, .e-grid-menu .e-delete::before {
        background-image: url("../images/Iconographie/OCT-Icone-S-Poubelle.png");
    }

    .e-grid .e-update::before, .e-grid-menu .e-update::before {
        background-image: url("../images/Iconographie/OCT-Icone-S-Sauvergarder.png");
    }

    .e-grid .e-cancel::before, .e-grid-menu .e-cancel::before {
        background-image: url("../images/Iconographie/OCT-Icone-S-Annuler.png");
    }

    .e-grid .e-icon-filter::before, .e-grid-menu .e-icon-filter::before {
        background-image: url("../images/Iconographie/OCT-Icone-S-Chevron-Bas.png");
    }

    .e-grid .e-excelexport::before, .e-grid-menu .e-excelexport::before {
        background-image: url("../images/Iconographie/OCT-Icone-S-Télécharger.png");
    }

    .e-grid .e-gridheader {
        /*border: none;*/
        border: 2px solid;
        border-color: var(--light-gray);
        /* Top left radius */
        border-top-left-radius: 15px;
        -webkit-border-top-left-radius: 15px;
        -moz-border-radius-topleft: 15px;
        /* Top right radius */
        border-top-right-radius: 15px;
        -webkit-border-top-right-radius: 15px;
        -moz-border-radius-topright: 15px;
    }

    .e-grid .e-gridcontent {
        /*border: none;*/
        border: 2px solid;
        border-color: var(--light-gray);
        /* Bottom left radius */
        border-bottom-left-radius: 15px;
        -webkit-border-bottom-left-radius: 15px;
        -moz-border-radius-bottomleft: 15px;
        /* Bottom right radius */
        border-bottom-right-radius: 15px;
        -webkit-border-bottom-right-radius: 15px;
        -moz-border-radius-bottomright: 15px;
    }

.e-grid .e-btn, .e-css.e-btn {
    background-color: white;
    border-color: white;
}


.e-input-group.e-search.e-input-focus:not(.e-success):not(.e-warning):not(.e-error),
.e-input-group.e-search.e-input-focus:active:not(.e-success):not(.e-warning):not(.e-error),
.e-input-group.e-search.e-input-focus:focus:not(.e-success):not(.e-warning):not(.e-error) {
    border: none;
    border-bottom: 2px solid;
    border-radius: 0;
    border-color: transparent !important;
    box-shadow: none;
}

.e-grid .e-toolbar-items .e-toolbar-item.e-search-wrapper .e-search {
    align-items: center;
}

.e-grid .e-pager {
    background: transparent;
    border-top: transparent;
    display: inline-flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding-top: 1.5rem;
}

    .e-grid .e-pager .e-parentmsgbar {
        order: 1;
    }

    .e-grid .e-pager .e-pagercontainer {
        order: 2;
    }

        .e-grid .e-pager .e-pagercontainer .e-firstpage,
        .e-grid .e-pager .e-pagercontainer .e-prevpage,
        .e-grid .e-pager .e-pagercontainer .e-firstpagedisabled,
        .e-grid .e-pager .e-pagercontainer .e-prevpagedisabled,
        .e-grid .e-pager .e-pagercontainer .e-nextpage,
        .e-grid .e-pager .e-pagercontainer .e-lastpage,
        .e-grid .e-pager .e-pagercontainer .e-nextpagedisabled,
        .e-pager .e-pagercontainer .e-lastpagedisabled,
        .e-grid .e-pager .e-pagercontainer .e-numericitem {
            color: black;
            background-color: transparent;
            border-right: none;
        }

            .e-grid .e-pager .e-pagercontainer .e-numericitem.e-currentitem {
                background-color: white;
                border-right: none;
                border-radius: 1.5rem;
                color: black;
                margin: 0 0.75rem;
                box-shadow: 0 0 0.5rem rgb(0 0 0 / 8%);
            }

        .e-grid .e-pager .e-pagercontainer .e-firstpage:hover,
        .e-grid .e-pager .e-pagercontainer .e-prevpage:hover,
        .e-grid .e-pager .e-pagercontainer .e-nextpage:hover,
        .e-grid .e-pager .e-pagercontainer .e-lastpage:hover,
        .e-grid .e-pager .e-spacing.e-numericitem:not(.e-active):not(.e-np):not(.e-pp):hover {
            background-color: var(--dark-gray);
        }

    .e-grid .e-pager .e-pagesizes {
        order: 3;
    }

    .e-grid .e-pager .e-pagesizes .e-pagerdropdown {
        background-color: white;
        border-radius: 1.5rem;
    }

        .e-grid .e-pager .e-pagerdropdown .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) {
            border-bottom: none;
        }

    .e-grid .e-pager .e-constant,
    .e-grid .e-pager div.e-parentmsgbar,
    .e-grid .e-pager .e-pagercontainer .e-numericitem {
        color: black;
        font-family: var(--bs-font-sans-serif);
        font-size: 1.3rem;
        font-weight: 900;
    }

    .e-grid .e-pager .e-pagercontainer {
        background-color: transparent;
        border-color: transparent;
    }

    .e-grid .e-pager .e-icon-next::before,
    .e-grid-menu .e-icon-next::before,
    .e-grid .e-pager .e-icon-prev::before,
    .e-grid-menu .e-icon-prev::before,
    .e-grid .e-pager .e-icon-last::before,
    .e-grid-menu .e-icon-last::before,
    .e-grid .e-pager .e-icon-first::before,
    .e-grid-menu .e-icon-first::before {
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
    }

    .e-grid .e-pager .e-icon-last::before,
    .e-grid-menu .e-icon-last::before,
    .e-grid .e-pager .e-icon-first::before,
    .e-grid-menu .e-icon-first::before {
        font-size: 1.2rem;
    }

    .e-grid .e-pager .e-icon-next::before,
    .e-grid-menu .e-icon-next::before {
        content: "\f061";
    }

    .e-grid .e-pager .e-icon-prev::before,
    .e-grid-menu .e-icon-prev::before {
        content: "\f060";
    }

    .e-grid .e-pager .e-icon-last::before,
    .e-grid-menu .e-icon-last::before {
        content: "\f101";
    }

    .e-grid .e-pager .e-icon-first::before,
    .e-grid-menu .e-icon-first::before {
        content: "\f100";
    }

.e-contextmenu-wrapper {
    position: static;
}

.e-popup.e-popup-open.e-dialog.custom-dialog {
    visibility: hidden;
}

.e-grid .e-gridheader .e-fltr-icon .e-sortfilterdiv {
    margin-right: 20px;
}

.e-excel-ascending, .e-excel-descending {
    white-space: nowrap;
}

.e-contextmenu-wrapper ul .e-menu-item, .e-contextmenu-container ul .e-menu-item {
    padding: 5px 5px;
}

/* ------------------- Syncfusion Dropdown ------------------- */
.e-input-group,
.e-input-group.e-success,
.e-input-group.e-warning,
.e-input-group.e-error,
.e-input-group.e-control-wrapper,
.e-input-group.e-control-wrapper.e-success,
.e-input-group.e-control-wrapper.e-warning,
.e-input-group.e-control-wrapper.e-error {
    border: none;
    border-bottom: 2px solid var(--light-gray);
    border-radius: 0;
    background-color: transparent;
}
    .e-autocomplete  {
        padding-left: 0 !important;
    }

    .e-input-group:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-control-wrapper:not(.e-disabled):active:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-control-wrapper.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
        border: none;
        border-bottom: 2px solid;
        border-radius: 0;
        border-color: var(--black) !important;
        box-shadow: none;
    }

    .e-input-group:not(.e-success):not(.e-warning):not(.e-error),
    .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error) {
        border: none;
        border-bottom: 2px solid var(--light-gray);
        border-radius: 0;
    }


    .e-input-group .form-group .auto-search.form-control {
        padding-left: 2.1rem;
    }

.icon-autocomplete {
    position: relative !important;
    left: -20% !important;
    top: 10% !important;
    border: 0 !important;
}

.e-dropdownbase .e-list-item {
    text-indent: 0;
    padding: 0 20px;
}

.e-input-group:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left).e-disabled,
.e-input-group.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error).e-disabled .e-input-in-wrap,
.e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left).e-disabled,
.e-input-group.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error).e-disabled .e-input-in-wrap {
    background-color: var(--bs-gray-light);
    color: black;
    border: 0;
    border-bottom: 2px solid #F0F3F6;
}

.e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon,
.e-input-group.e-disabled.e-ddl .e-control.e-dropdownlist ~ .e-input-group-icon,
.e-control.e-dropdownlist .e-input-group.e-disabled.e-ddl .e-input-group-icon,
.e-control.e-dropdownlist .e-input-group.e-ddl .e-input-group-icon {
    content: "";
    background-size: 20px 20px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-image: url(../images/Iconographie/OCT-Icone-S-Chevron-Bas.png);
    background-position: center;
}

.e-ddl.e-input-group.e-control-wrapper .e-ddl-icon::before {
    content: "";
}
.e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:active,
.e-input-group:not(.e-disabled) .e-control.e-dropdownlist ~ .e-ddl-icon:hover,
.e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-ddl-icon:active,
.e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-ddl-icon:hover,
.e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active,
.e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:hover,
.e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
.e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:hover {
    content: "";
    background-size: 20px 20px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    background-image: url(../images/Iconographie/OCT-Icone-S-Chevron-Bas.png);
    background-position: center;
}

.e-input-group.e-disabled .e-input-group-icon,
.e-input-group.e-control-wrapper.e-disabled .e-input-group-icon {
    background-color: var(--bs-gray-light);
}

.e-popup.e-ddl .e-dropdownbase {
    overflow-y: scroll;
}

input.e-input,
.e-input-group input,
.e-input-group.e-control-wrapper input,
.e-input-group input.e-input,
.e-input-group.e-control-wrapper input.e-input {
    height: 22px;
    align-self: center;
}

/* ------------------- Syncfusion Dialog ------------------- */
.e-dialog {
    background-color: transparent;
    border: 0;
    border-radius: 1.5rem;
}

    .e-dialog .e-dlg-header-content {
        flex-shrink: 0;
        align-items: center;
        justify-content: space-between;
        padding: 1.5rem 1.5rem;
        border-bottom: 0 solid var(--bs-gray-dark);
        border-top-left-radius: 1.5rem;
        border-top-right-radius: 1.5rem;
        background-color: var(--bs-blue) !important;
    }

    .e-dialog .e-dlg-header {
        font-weight: bolder;
        white-space: normal;
        width: 92%;
    }

    .e-dialog .e-btn .e-btn-icon.e-icon-dlg-close {
        vertical-align: top;
    }

.e-btn.e-flat.e-primary, .e-css.e-btn.e-flat.e-primary {
    font-size: 1.5rem;
    color: var(--bs-black);
    background-color: var(--bs-blue);
    border-color: var(--bs-blue);
    font-weight: 700;
    line-height: 1.5;
    padding: 1rem 1.1rem;
    border-radius: 1.5rem;
}
    .e-btn.e-flat.e-primary:hover, .e-css.e-btn.e-flat.e-primary:hover {
        color: var(--bs-black);
        background-color: #96a6fb;
        border-color: #8fa1fb;
    }

.e-btn.e-flat, .e-css.e-btn.e-flat {
    font-size: 1.5rem;
    color: var(--bs-black);
    background-color: var(--bs-gray-light);
    border-color: var(--bs-gray-light);
    font-weight: 700;
    line-height: 1.5;
    padding: 1rem 1.1rem;
    border-radius: 1.5rem;
}

    .e-btn.e-flat:hover, .e-css.e-btn.e-flat:hover {
        color: var(--bs-black);
        background-color: #f2f5f7;
        border-color: #f2f4f7;
        box-shadow: 0 0 1rem rgba(0, 0, 0, 0.075);
    }

/* ------------------- Syncfusion Error message ------------------- */
.e-tooltip-wrap .e-arrow-tip.e-tip-top {
    visibility: hidden;
}

.e-tooltip-wrap.e-griderror, .e-control.e-tooltip-wrap.e-popup.e-griderror {
    background-color: #fecfc7;
    transform: translate(0px, 20px);
    padding: 0.5rem 0.5rem;
    margin-bottom: 1rem;
    border: 2px solid #fc8872;
    border-radius: 1.5rem;
    width: auto !important;
}

.e-error {
    color: black !important;
    font-family: var(--bs-font-sans-serif) !important;
    font-weight: 400 !important;
}

    .e-error::before {
        content: "";
        background-size: 20px 20px;
        display: inline-block;
        width: 20px;
        height: 20px;
        background-image: url("../images/Iconographie/OCT-Icone-L-Attention-Danger.png");
        vertical-align: top;
        margin-right: 0.5rem;
    }

/* ------------------- Syncfusion Tooltips ------------------- */

.e-tooltip-wrap.e-popup {
    white-space: pre-wrap;
    background-color: var(--bs-blue-light);
    border-width: 2px;
    border-radius: 1.5rem;
    padding: 1rem;
}

.e-tooltip-wrap .e-tip-content {
    font-size: 1.4rem;
    font-family: var(--bs-font-sans-serif);
    font-style: normal;
    font-weight: 400;
    color: black;
}