/* Styling for disabled Select2 element */
.select2-container--disabled .select2-selection {
    background-color: #e9ecef !important; /* Matches Bootstrap's disabled input background color */
    opacity: 1;
}
.select2-container--default .select2-selection--single {
    padding: 10px; /* Custom padding */
    height: auto; /* Auto height to accommodate padding */
    border-color: #f2f2f2;   
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.3; /* Adjust line height for better alignment */
    padding: 0; /* Reset padding for inner rendered element */
    color: #6c757d;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%; /* Make the arrow take the full height */
    right: 10px; /* Custom position for the arrow */
}
.select2-container--default .select2-selection--multiple {
    height: auto; /* Auto height to accommodate padding */
    border-color: #f2f2f2;   
    padding: 2px; /* Custom padding */
}
/* Custom styles for Select2 invalid state */
.select2-container--default.is-invalid .select2-selection {
    border-color: #dc3545; /* Bootstrap's danger color */
}