
    /* Ensure Select2 input field inherits theme colors */
    .select2-container--default .select2-selection--single {
        background-color: inherit !important;
        border: 1px solid inherit !important;
        color: inherit !important;
        height: 38px !important;
    }

    /* ✅ Fix the issue where selected text stays black */
    .select2-container--default .select2-selection__rendered {
        color: inherit !important;  /* This will ensure text color follows theme */
    }

    /* ✅ Prevent transparent dropdown & ensure it matches the theme */
    .select2-dropdown {
        background-color: var(--bs-body-bg, white) !important;
        border: 1px solid var(--bs-border-color, #ced4da) !important;
        color: var(--bs-body-color, #212529) !important;
    }

    /* ✅ Ensure dropdown options follow theme */
    .select2-results__option {
        background-color: var(--bs-body-bg, white) !important;
        color: var(--bs-body-color, #212529) !important;
    }

    /* ✅ Hover effect should match theme */
    .select2-results__option--highlighted {
        background-color: var(--bs-primary, #007bff) !important;
        color: white !important;
    }

    /* ✅ Ensure the search box inside Select2 follows theme */
    .select2-search__field {
        background-color: var(--bs-body-bg, white) !important;
        color: var(--bs-body-color, #212529) !important;
        border: 1px solid var(--bs-border-color, #ced4da) !important;
    }

