.sidebar-body {
    overflow-y: auto;
    padding: 15px;
    box-sizing: border-box;

    /* Hide scrollbar initially */
    scrollbar-width: none; /* Firefox */
}
.sidebar-body::-webkit-scrollbar {
    width: 3px; /* Thin scrollbar width */
}

/* Hide scrollbar for WebKit browsers initially */
.sidebar-body::-webkit-scrollbar {
    display: none; /* Hide scrollbar initially */
}

/* Show scrollbar only when hovering over the sidebar */
.sidebar-body:hover {
    scrollbar-width: thin; /* Firefox */
}

/* Show scrollbar only on hover for WebKit browsers */
.sidebar-body:hover::-webkit-scrollbar {
    display: block; /* Show scrollbar on hover */
}

/* Styling for the scrollbar when it is shown */
.sidebar-body::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #a29bfe, #6c5ce7);
    border-radius: 10px;
}

.sidebar-body::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #6c5ce7, #a29bfe);
}

.sidebar-body::-webkit-scrollbar-track {
    background-color: #f0f0f0;
    border-radius: 10px;
}

* Scrollbar is hidden by default unless there is an overflow and hover */
.sidebar-body:not(.overflow) {
    overflow-y: hidden; /* Prevent scrollbars if no overflow */
}

/* If there is overflow, enable hover-based scrollbar visibility */
.sidebar-body.overflow {
    scrollbar-width: none; /* Firefox */
}

.sidebar-body.overflow:hover {
    scrollbar-width: thin; /* Firefox */
}

/* WebKit browsers will only show scrollbar on hover if overflow exists */
.sidebar-body.overflow:hover::-webkit-scrollbar {
    display: block; /* Show scrollbar on hover if overflow */
}
.gray{
    background-color: #dddddd !important;
}

/* custom css to fix ui */
.main-wrapper .page-wrapper {
    background: #dadada !important;
}
.card {
    background-color: #e7e7e7 !important;
}
.page-breadcrumb .breadcrumb {
    background: #dadada !important;
}
.table th, .table td {
    border-top: 1px solid #d2d2d2 !important;
}
.form-control, select, .email-compose-fields .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--single .select2-search__field, .typeahead, .tt-query, .tt-hint {
    border: 1px solid #d7d7d7 !important;
}
select.form-control, select, .email-compose-fields .select2-container--default select.select2-selection--multiple, .select2-container--default select.select2-selection--single, .select2-container--default .select2-selection--single select.select2-search__field, select.typeahead, select.tt-query, select.tt-hint {
    border: 1px solid #d7d7d7 !important;
}
.border, .dropify-wrapper, .dropzone {
    border: 1px solid #d7d7d7 !important;
}
.form-control, select, .email-compose-fields .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--single .select2-search__field, .typeahead, .tt-query, .tt-hint {
    border: 1px solid #dedede !important;
}