/* ==========================================================================
   SSO IWIMA — Select2 SSO Overrides
   Menyelaraskan Select2 (krajee-bs5) agar senada dengan .form-control
   & .form-select pada custom.css
   ========================================================================== */

/* -------------------------------------------------
   Analisa perbedaan (ringkas)
   -------------------------------------------------
   .form-control/.form-select (custom.css:214)
     - border-radius: 0.5rem | Select2 krajee-bs5: 0.25rem
     - padding: 0.6rem 0.85rem | Select2 single: 0.375rem 0.5rem + height 2.25rem
     - border: 1px solid #ced4da | Select2: sama tapi + inset shadow
     - transition: var(--sso-transition) | Select2: border-color 0.15s ease-in-out
     - focus: border-color var(--sso-primary) + shadow 0 0 0 .25rem rgba(13,110,253,.15)
              Select2: #86b7fe + shadow rgba(13,110,253,.25) (lebih pekat)
     - placeholder: #6c757d | Select2: #999
     - dropdown shadow: tidak ada | Select2: 0 .375rem .75rem rgba(13,110,253,.25)
     - results highlight: bootstrap primary #0d6efd (sama) tapi selected #d9edf7/#31708f tua
   => Override di bawah menstandarisasi radius, padding, shadow, warna.
*/

/* Base — hilangkan inset shadow & samakan radius/transition */
.select2-container--krajee-bs5 .select2-selection {
    border-radius: 0.5rem !important;
    border: 1px solid #ced4da !important;
    box-shadow: none !important;
    transition: var(--sso-transition) !important;
    background-color: #fff !important;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Single — tinggi & padding senada .form-control (0.6rem 0.85rem) */
.select2-container--krajee-bs5 .select2-selection--single {
    height: calc(1.5em + 1.2rem + 2px) !important; /* 1.5em line-height + 0.6*2 padding + 2px border */
    min-height: calc(1.5em + 1.2rem + 2px) !important;
    padding: 0.6rem 2.5rem 0.6rem 0.85rem !important;
    line-height: 1.5 !important;
    display: flex !important;
    align-items: center !important;
    background-position: right 0.85rem center !important;
    background-size: 16px 12px !important;
}

.select2-container--krajee-bs5 .select2-selection--single .select2-selection__rendered {
    color: #212529 !important;
    padding: 0 !important;
    line-height: 1.5 !important;
    font-size: 1rem;
}

.select2-container--krajee-bs5 .select2-selection--single .select2-selection__placeholder {
    color: #6c757d !important;
    opacity: 0.75;
}

/* Arrow disembunyikan (krajee) — tetap, tapi pastikan tidak ganggu padding */

/* Multiple — senada tinggi minimal form-control */
.select2-container--krajee-bs5 .select2-selection--multiple {
    min-height: calc(1.5em + 1.2rem + 2px) !important;
    padding: 0.2rem 0.5rem !important;
    border-radius: 0.5rem !important;
    line-height: 1.5;
}

.select2-container--krajee-bs5 .select2-selection--multiple .select2-selection__rendered {
    padding: 0 !important;
}

.select2-container--krajee-bs5 .select2-selection--multiple .select2-selection__placeholder {
    color: #6c757d !important;
    margin-top: 0.35rem !important;
    margin-left: 0.35rem !important;
}

.select2-container--krajee-bs5 .select2-selection--multiple .select2-selection__choice {
    background: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.4rem !important;
    color: #495057 !important;
    font-size: 0.85rem !important;
    padding: 0.15rem 0.35rem 0.15rem 0.25rem !important;
    margin: 0.25rem 0 0 0.35rem !important;
    line-height: 1.4 !important;
}

.select2-container--krajee-bs5 .select2-selection--multiple .select2-selection__choice__remove {
    color: #6c757d !important;
    opacity: 0.7 !important;
    font-size: 1rem !important;
    line-height: 1 !important;
    padding-right: 0.2rem !important;
}

.select2-container--krajee-bs5 .select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #dc3545 !important;
    opacity: 1 !important;
}

.select2-container--krajee-bs5 .select2-search--inline .select2-search__field {
    font-family: inherit !important;
    font-size: 1rem !important;
    margin: 0.35rem 0 0 0.35rem !important;
    padding: 0 !important;
    color: #212529;
}

/* Focus / Open — samakan dengan .form-control:focus (custom.css:221) */
.select2-container--krajee-bs5.select2-container--open:not(.select2-container--disabled) .select2-selection,
.select2-container--krajee-bs5:not(.select2-container--disabled) .select2-selection:focus,
.select2-container--krajee-bs5.select2-container--focus .select2-selection {
    border-color: var(--sso-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.15) !important;
    outline: 0 !important;
}

.select2-container--krajee-bs5.select2-container--open.select2-container--below .select2-selection,
.select2-container--krajee-bs5.select2-container--open.select2-container--above .select2-selection {
    border-color: var(--sso-primary) !important;
}

/* Dropdown — radius & shadow senada .card / .grid-view */
.select2-container--krajee-bs5:not(.select2-container--disabled) .select2-dropdown {
    border-color: #ced4da !important;
    border-radius: 0.5rem !important;
    box-shadow: var(--sso-card-shadow, 0 4px 14px rgba(0,0,0,0.05)) !important;
    overflow: hidden !important;
    margin-top: 4px !important;
    border: 1px solid rgba(0,0,0,0.06) !important;
}

.select2-container--krajee-bs5.select2-container--open .select2-dropdown--below,
.select2-container--krajee-bs5.select2-container--open .select2-dropdown--above {
    border-radius: 0.5rem !important;
}

/* Dropdown border saat open — jangan transparan */
.select2-container--krajee-bs5.select2-container--open.select2-container--below .select2-selection,
.select2-container--krajee-bs5.select2-container--open.select2-container--above .select2-selection {
    border-bottom-color: var(--sso-primary) !important;
    border-top-color: var(--sso-primary) !important;
}

/* Search field di dropdown */
.select2-container--krajee-bs5 .select2-search--dropdown .select2-search__field {
    border-radius: 0.5rem !important;
    border: 1px solid #ced4da !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.9rem !important;
    box-shadow: none !important;
    transition: var(--sso-transition);
}

.select2-container--krajee-bs5 .select2-search--dropdown .select2-search__field:focus {
    border-color: var(--sso-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(13,110,253,0.15) !important;
    outline: 0 !important;
}

.select2-container--krajee-bs5 .select2-search--dropdown .select2-search__field::placeholder {
    color: #6c757d !important;
}

/* Results */
.select2-container--krajee-bs5 .select2-results__option {
    padding: 0.5rem 0.85rem !important;
    font-size: 0.9rem !important;
    color: #212529 !important;
    background: #fff !important;
    transition: var(--sso-transition);
}

.select2-container--krajee-bs5 .select2-results__option--highlighted[aria-selected] {
    background-color: var(--sso-primary, #0d6efd) !important;
    color: #fff !important;
}

.select2-container--krajee-bs5 .select2-results__option--selected,
.select2-container--krajee-bs5 .select2-results__option[aria-selected="true"] {
    background-color: rgba(13, 110, 253, 0.12) !important;
    color: var(--sso-primary, #0d6efd) !important;
    font-weight: 500;
}

/* Loading / disabled */
.select2-container--krajee-bs5 .select2-results__option[aria-disabled="true"] {
    color: #6c757d !important;
    background: #fff !important;
}

.select2-container--krajee-bs5 .select2-results__option.loading-results,
.select2-container--krajee-bs5 .load-more {
    color: #6c757d !important;
    font-style: italic !important;
}

/* Group header */
.select2-container--krajee-bs5 .select2-results__group {
    background-color: #f8f9fa !important;
    color: #495057 !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.5rem 0.85rem !important;
    border-top: 1px solid rgba(0,0,0,0.06) !important;
    border-bottom: 1px solid rgba(0,0,0,0.06) !important;
}

/* Disabled state */
.select2-container--krajee-bs5.select2-container--disabled .select2-selection,
.select2-container--krajee-bs5.select2-container--disabled .select2-selection--multiple .select2-selection__choice {
    background-color: #e9ecef !important;
    opacity: 1 !important;
    cursor: not-allowed !important;
}

/* Invalid / Valid — selaras Bootstrap 5 */
select.is-invalid + .select2-container--krajee-bs5 .select2-selection,
.has-error .select2-container--krajee-bs5 .select2-selection,
.select2-container--krajee-bs5.is-invalid .select2-selection {
    border-color: #dc3545 !important;
}

.has-error .select2-container--open .select2-selection,
.has-error .select2-container--krajee-bs5.select2-container--focus .select2-selection,
select.is-invalid + .select2-container--krajee-bs5.select2-container--focus .select2-selection,
.select2-container--krajee-bs5.is-invalid.select2-container--focus .select2-selection {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.15) !important;
}

select.is-valid + .select2-container--krajee-bs5 .select2-selection,
.has-success .select2-container--krajee-bs5 .select2-selection,
.select2-container--krajee-bs5.is-valid .select2-selection {
    border-color: #198754 !important;
}

.has-success .select2-container--open .select2-selection,
.has-success .select2-container--krajee-bs5.select2-container--focus .select2-selection,
select.is-valid + .select2-container--krajee-bs5.select2-container--focus .select2-selection,
.select2-container--krajee-bs5.is-valid.select2-container--focus .select2-selection {
    border-color: #198754 !important;
    box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.15) !important;
}

/* Yii2 ActiveForm error — .is-invalid pada select hidden */
.form-group.has-error .select2-container--krajee-bs5 .select2-selection {
    border-color: #dc3545 !important;
}

/* Clear button */
.select2-container--krajee-bs5 .select2-selection__clear {
    color: #6c757d !important;
    opacity: 0.6 !important;
    font-weight: 600 !important;
}

.select2-container--krajee-bs5 .select2-selection__clear:hover {
    color: #343a40 !important;
    opacity: 1 !important;
}

/* Toggle all (krajee addl) */
.select2-container--krajee-bs5 .s2-togall-button {
    color: var(--sso-primary, #0d6efd) !important;
    font-size: 0.85rem !important;
    padding: 0.35rem 0.6rem !important;
}

/* Small / Large control support — sesuaikan radius */
.input-sm.select2-container--krajee-bs5 .select2-selection--single,
.input-group-sm .select2-container--krajee-bs5 .select2-selection--single,
.input-lg.select2-container--krajee-bs5 .select2-selection--single,
.input-group-lg .select2-container--krajee-bs5 .select2-selection--single {
    border-radius: 0.5rem !important;
}

/* Pastikan Select2 di dalam .form-group tidak menambah margin aneh */
.form-group .select2-container--krajee-bs5 {
    width: 100% !important;
    display: block !important;
}

/* Animasi halus */
.select2-container--krajee-bs5,
.select2-container--krajee-bs5 .select2-selection,
.select2-container--krajee-bs5 .select2-dropdown,
.select2-container--krajee-bs5 .select2-results__option {
    transition: var(--sso-transition);
}