/**
 * Select2 fixes — bootstrap-5 theme + RTL (admin, user, guest, public).
 * Loaded after vendor theme and panel CSS in all layouts.
 */

.select2-container {
    width: 100% !important;
    max-width: 100%;
}

/* Single select (panels use theme: bootstrap-5, not default) */
.select2-container--bootstrap-5 .select2-selection--single {
    border: 2px solid #e9ecef !important;
    border-radius: 10px !important;
    min-height: 45px;
    padding: 0.3rem 2rem 0.3rem 0.5rem;
}

.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    line-height: 1.5;
    color: #4a5568;
    padding-right: 0;
    padding-left: 0;
}

.select2-container--bootstrap-5[dir="rtl"] .select2-selection--single {
    padding: 0.3rem 0.5rem 0.3rem 2rem;
}

.select2-container--bootstrap-5[dir="rtl"] .select2-selection--single .select2-selection__rendered {
    text-align: right;
}

/* Multiple select — inline chips, compact height */
.select2-container--bootstrap-5 .select2-selection--multiple {
    border: 2px solid #e9ecef !important;
    border-radius: 10px !important;
    min-height: calc(1.5em + 0.75rem + 2px);
    height: auto !important;
    padding: 0.35rem 2rem 0.35rem 0.65rem;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered {
    display: flex !important;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    align-content: flex-start;
    gap: 0.375rem;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
    display: inline-flex !important;
    flex-direction: row;
    align-items: center;
    float: none !important;
    margin: 0 !important;
    max-width: calc(100% - 0.5rem);
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
    position: static;
    flex-shrink: 0;
    order: -1;
    margin-right: 0.35rem;
    margin-left: 0;
}

/* Bootstrap-5 theme forces search to full width — keeps chips on one row when possible */
.select2-container--bootstrap-5 .select2-selection--multiple .select2-search {
    display: inline-flex !important;
    width: auto !important;
    flex: 1 1 5rem;
    min-width: 5rem;
    height: auto !important;
    margin: 0;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-search .select2-search__field {
    width: 100% !important;
    min-width: 5rem;
    height: 1.5rem !important;
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
    outline: none;
    box-shadow: none;
}

.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__clear {
    position: absolute;
    top: 50%;
    right: 0.65rem;
    left: auto;
    transform: translateY(-50%);
    margin: 0;
    z-index: 2;
}

/* RTL */
.select2-container--bootstrap-5[dir="rtl"] .select2-selection--multiple {
    padding: 0.35rem 0.65rem 0.35rem 2rem;
}

.select2-container--bootstrap-5[dir="rtl"] .select2-selection--multiple .select2-selection__rendered .select2-selection__choice .select2-selection__choice__remove {
    order: 1;
    margin-right: 0;
    margin-left: 0.35rem;
}

.select2-container--bootstrap-5[dir="rtl"] .select2-selection--multiple .select2-search .select2-search__field {
    text-align: right;
}

.select2-container--bootstrap-5[dir="rtl"] .select2-selection--multiple .select2-selection__clear {
    right: auto;
    left: 0.65rem;
}

.select2-container--bootstrap-5[dir="rtl"] .select2-dropdown,
.select2-container--bootstrap-5[dir="rtl"] .select2-results__option {
    text-align: right;
}

/* Dropdown */
.select2-dropdown {
    border: 2px solid #e9ecef !important;
    border-radius: 10px !important;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.select2-results__option--selected {
    background-color: var(--primary-color, #4361ee) !important;
    color: #fff !important;
}

.select2-results__option--highlighted,
.select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #f0f2f5 !important;
    color: #4a5568 !important;
}

.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection {
    border-color: #86b7fe !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}
