/**
 * Copyright © Zhik Pty Ltd. All rights reserved.
 * See LICENSE.txt for license details.
 *
 * Select2 Library Overrides
 * Generic Select2 customizations used across Portal and ForwardOrder modules
 */

/* ============================================
   SELECT2 CONTAINER CUSTOMIZATION
   ============================================ */

.select2-container--default .select2-selection--single {
    border: 1px solid #000 !important;
    border-radius: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px !important;
    padding-left: 12px;
    padding-right: 50px; /* Space for arrow + clear button */
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px !important;
    right: 8px;
}

/* ============================================
   CLEAR BUTTON (X) STYLING
   ============================================ */

.select2-container--default .select2-selection--single .select2-selection__clear {
    height: 38px !important;
    line-height: 38px !important;
    font-size: 18px;
    color: #999;
    cursor: pointer;
    padding: 0 5px;
}

.select2-container--default .select2-selection--single .select2-selection__clear:hover {
    color: #333;
}

/* ============================================
   CREATABLE SELECT "CREATE [TEXT]" INDICATOR
   ============================================ */

.select2-create-indicator {
    color: #0b0b0b;
    font-weight: bold;
}

.select2-create-indicator strong {
    font-weight: 600;
}

/* ============================================
   DROPDOWN RESULTS STYLING
   ============================================ */

.select2-results__option {
    padding: 0px 6px !important;
}

.select2-container--default .select2-results__option[aria-selected] {
    border-left: 4px solid transparent;
}

/* Remove persistent highlighted styles - no visual "stuck" highlight */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: transparent !important;
    border-left: none !important;
    color: inherit !important;
}

/* Hover-only highlight - appears only when mouse is over item */
.select2-container--default .select2-results__option:hover {
    background-color: #f9f9f9 !important;
    border-left: 3px solid #000 !important;
}

/* Selected item style - shows which item is currently selected */
.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: #00ffcf !important;
    font-weight: 600;
}

.select2-container--default .select2-results__option[aria-disabled=true] {
    color: #999;
}

/* ============================================
   FOCUS STATES
   ============================================ */

.select2-container--default.select2-container--focus .select2-selection--single {
    /* Commented out - no visible border change on focus */
    /* border-color: #1979c3; */
    /* box-shadow: 0 0 0 1px #1979c3; */
}

.select2-container--default.select2-container--open .select2-selection--single {
    /* Commented out - no visible border change when open */
    /* border-color: #1979c3; */
}

.select2-selection:focus {
    /* Commented out - no outline on focus */
    /* outline: 2px solid #1979c3; */
    /* outline-offset: 2px; */
}

/* ============================================
   DROPDOWN CONTAINER
   ============================================ */

.select2-dropdown {
    border: 1px solid #c2c2c2;
    border-radius: 3px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    z-index: 9999;
}

/* ============================================
   LOADING/DISABLED STATE
   ============================================ */

.select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #f5f5f5;
    cursor: not-allowed;
    opacity: 0.6;
}

/* ============================================
   Z-INDEX MANAGEMENT
   ============================================ */

.select2-container--open {
    z-index: 9999;
}

/* ============================================
   MOBILE RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
    .select2-container {
        font-size: 16px; /* Prevent zoom on iOS */
    }

    .select2-dropdown {
        max-height: 300px;
    }
}