.e-control,
.e-grid,
.e-treegrid,
.e-toolbar,
.e-dialog,
.e-dropdownlist,
.e-combobox,
.e-multiselect,
.e-tab,
.e-accordion,
.e-treeview,
.e-datepicker,
.e-timepicker,
.e-radiobutton,
.e-checkbox,
.e-pager,
.e-float-text,
.e-btn {
    font-family: var(--font-family) !important;
}

/* autofill fix cross browser (per evitare che metta lo sfondo chiaro) */
.e-input-group:-webkit-autofill,
.e-float-input input:-webkit-autofill {
    -webkit-text-fill-color: #f8f9fa !important;
    transition: background-color 5000s ease-in-out 0s;
}

.e-input-group input:-moz-autofill,
.e-float-input input:-moz-autofill {
    -moz-text-fill-color: #f8f9fa !important;
}
/* ------------------------------------------------------------------- */

.e-control-wrapper {
    height: calc(3.5rem + calc(var(--bs-border-width) * 2));
    min-height: calc(3.5rem + calc(var(--bs-border-width) * 2));
    border-radius: 5px !important;
}

    .e-control-wrapper:not(.e-multiselect):not(.e-upload):not(.style-grid):not(span.e-control-wrapper):focus,
    .e-control-wrapper:not(.e-multiselect):not(.e-upload):not(.style-grid):not(:placeholder-shown):not(span.e-control-wrapper),
    .e-multiselect:focus,
    .e-multiselect:not(:placeholder-shown) {
        padding-top: 1.625rem;
        padding-bottom: .6rem;
    }

/* le due regole precedenti non valgono per le dropdownlist di paginazione delle grid */
.e-pagerdropdown .e-control-wrapper {
    height: initial !important;
    min-height: initial !important;
    padding-top: initial !important;
    padding-bottom: initial !important;
}

.e-control-wrapper > input {
    border: none !important;
    font-size: 1rem !important;
}

.e-control-wrapper > .e-float-text {
    left: 0;
    z-index: 2;
    max-width: 100%;
    height: 100%;
    padding: .75rem .75rem !important;
    overflow: hidden;
    --bs-text-opacity: 1;
    color: #ffcc00 !important;
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
    border: none;
    line-height: var(--bs-body-line-height) !important;
    transform-origin: left bottom !important;
}

.e-multi-select-wrapper > .e-searcher > .e-float-text {
    left: .25rem !important;
    z-index: 2;
    max-width: 100%;
    height: 100%;
    overflow: hidden;
    --bs-text-opacity: 1;
    color: #ffcc00 !important;
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
    border: none;
    line-height: var(--bs-body-line-height) !important;
    transform-origin: left bottom !important;
}

    .e-multi-select-wrapper > .e-searcher > .e-float-text.e-label-bottom {
        top: -1.625rem !important;
    }

    .e-multi-select-wrapper > .e-searcher > .e-float-text.e-label-top {
        transform: translate3d(0, -18px, 0) scale(0.92) !important;
    }

.e-float-text {
    font-size: var(--bs-body-font-size) !important;
}

    .e-float-text.e-label-top {
        font-size: .85rem !important;
    }

.e-multi-select-wrapper .e-chips-close.e-close-hooker,
.e-input-group.e-control-wrapper .e-clear-icon,
.e-input-group.e-control-wrapper .e-input-group-icon {
    color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
}

    .e-multi-select-wrapper .e-chips-close.e-close-hooker::before {
        font-size: 12px !important;
        top: 0;
    }

.e-multi-select-wrapper .e-delim-values {
    -webkit-text-fill-color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
    color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
    font-size: var(--bs-body-font-size) !important;
}

.e-popup.e-multi-select-list-wrapper.e-checkbox .e-list-item.e-active {
    background-color: #e0e0e0 !important;
}

/* casella di ricerca multiselect */
span.e-control-wrapper {
    background-color: white !important;
}

/* big checkbox with gray border */
.style-big.e-checkbox-wrapper .e-frame {
    height: 40px !important;
    width: 40px !important;
    line-height: 40px !important;
}

    /* green background color with white icon when checked */
    .style-big.e-checkbox-wrapper .e-frame.e-check, .style-big.e-checkbox-wrapper:hover .e-frame.e-check, .style-big.e-checkbox-wrapper .e-checkbox:focus + .e-frame.e-check {
        background-color: green !important;
        color: white !important;
    }

.style-big.e-checkbox-wrapper .e-label {
    font-size: medium;
    line-height: 24px;
    margin-right: 40px; /* larghezza checkbox */
    color: white !important;
}

.style-big.style-grid.e-checkbox-wrapper .e-label {
    color: #ffcc00 !important;
}

/* center the check mark inside the checkbox */
.style-big .e-icons.e-frame.e-check {
    padding: 0 !important;
    font-size: 32px;
}