/* ====================================
   SELECT2 CSS - VARIABLES Y TEMAS
   ==================================== */

/* Variables CSS para tema claro */
:root {
    /* Colores base */
    --select2-bg-primary: #fff;
    --select2-bg-secondary: #f7f7f7;
    --select2-bg-disabled: #eee;
    --select2-bg-choice: #e4e4e4;
    --select2-bg-hover: #f1f1f1;
    --select2-bg-selected: #ddd;
    --select2-bg-highlighted: #5897fb;
    --select2-bg-highlighted-classic: #3875d7;
    --select2-bg-arrow: #ddd;
    /* Colores de borde */
    --select2-border-color: #aaa;
    --select2-border-focus: #5897fb;
    --select2-border-focus-multiple: #000;
    /* Colores de texto */
    --select2-text-primary: #444;
    --select2-text-secondary: #999;
    --select2-text-disabled: gray;
    --select2-text-highlighted: #fff;
    --select2-text-hover: #333;
    --select2-text-classic-hover: #555;
    --select2-text-arrow: #888;
    /* Dimensiones */
    --select2-height-single: 28px;
    --select2-height-multiple: 32px;
    --select2-height-clear: 26px;
    --select2-height-choice-clear: 20px;
    --select2-height-search: 18px;
    --select2-width-arrow: 20px;
    --select2-border-radius: 4px;
    --select2-z-index-dropdown: 1051;
    --select2-z-index-mask: 99;
    --select2-max-height-results: 200px;
    /* Espaciado */
    --select2-padding-small: 4px;
    --select2-padding-medium: 5px;
    --select2-padding-large: 6px;
    --select2-padding-left: 8px;
    --select2-padding-right: 20px;
    --select2-margin-small: 5px;
    --select2-margin-medium: 10px;
    --select2-margin-large: 20px;
}

/* Variables CSS para tema oscuro */
[data-bs-theme="dark"] {
    /* Colores base oscuros */
    --select2-bg-primary: #2d3748;
    --select2-bg-secondary: #1a202c;
    --select2-bg-disabled: #4a5568;
    --select2-bg-choice: #4a5568;
    --select2-bg-hover: #2d3748;
    --select2-bg-selected: #4a5568;
    --select2-bg-highlighted: #3182ce;
    --select2-bg-highlighted-classic: #2b6cb0;
    --select2-bg-arrow: #4a5568;
    /* Colores de borde oscuros */
    --select2-border-color: #4a5568;
    --select2-border-focus: #3182ce;
    --select2-border-focus-multiple: #e2e8f0;
    /* Colores de texto oscuros */
    --select2-text-primary: #e2e8f0;
    --select2-text-secondary: #a0aec0;
    --select2-text-disabled: #718096;
    --select2-text-highlighted: #fff;
    --select2-text-hover: #f7fafc;
    --select2-text-classic-hover: #cbd5e0;
    --select2-text-arrow: #a0aec0;
}

/* ====================================
   1. CONTENEDOR BASE Y ESTRUCTURA
   ==================================== */

.select2-container {
    box-sizing: border-box;
    display: inline-block;
    margin: 0;
    position: relative;
    vertical-align: middle;

    background-color: var(--select2-bg-primary);
    border: 1px solid var(--select2-border-color);
    border-radius: var(--select2-border-radius);
}

.select2-hidden-accessible {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important
}

.select2-close-mask {
    border: 0;
    margin: 0;
    padding: 0;
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    opacity: 0;
    z-index: var(--select2-z-index-mask);
    background-color: var(--select2-bg-primary);
    filter: alpha(opacity=0)
}

/* ====================================
   2. SELECCIÓN SIMPLE
   ==================================== */

.select2-container .select2-selection--single {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    height: var(--select2-height-single);
    user-select: none;
    -webkit-user-select: none;
}

    .select2-container .select2-selection--single .select2-selection__rendered {
        display: block;
        padding-left: var(--select2-padding-left);
        padding-right: var(--select2-padding-right);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .select2-container .select2-selection--single .select2-selection__clear {
        background-color: rgba(0,0,0,0);
        border: none;
        font-size: 1em
    }

.select2-container[dir=rtl] .select2-selection--single .select2-selection__rendered {
    padding-right: var(--select2-padding-left);
    padding-left: var(--select2-padding-right)
}

/* ====================================
   3. SELECCIÓN MÚLTIPLE
   ==================================== */

.select2-container .select2-selection--multiple {
    box-sizing: border-box;
    cursor: pointer;
    display: block;
    min-height: var(--select2-height-multiple);
    user-select: none;
    -webkit-user-select: none;
}

    .select2-container .select2-selection--multiple .select2-selection__rendered {
        display: inline;
        list-style: none;
        padding: 0
    }

    .select2-container .select2-selection--multiple .select2-selection__clear {
        background-color: rgba(0,0,0,0);
        border: none;
        font-size: 1em
    }

/* ====================================
   4. BÚSQUEDA INLINE
   ==================================== */

.select2-container .select2-search--inline .select2-search__field {
    box-sizing: border-box;
    border: none;
    font-size: 100%;
    margin-top: var(--select2-margin-small);
    margin-left: var(--select2-margin-small);
    padding: 0;
    max-width: 100%;
    resize: none;
    height: var(--select2-height-search);
    vertical-align: bottom;
    font-family: sans-serif;
    overflow: hidden;
    word-break: keep-all
}

    .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
        -webkit-appearance: none
    }

/* ====================================
   5. DROPDOWN Y RESULTADOS
   ==================================== */

.select2-dropdown {
    background-color: var(--select2-bg-primary);
    border: 1px solid var(--select2-border-color);
    border-radius: var(--select2-border-radius);
    box-sizing: border-box;
    display: block;
    position: absolute;
    left: -100000px;
    width: 100%;
    z-index: var(--select2-z-index-dropdown)
}

.select2-results {
    display: block
}

.select2-results__options {
    list-style: none;
    margin: 0;
    padding: 0
}

.select2-results__option {
    padding: var(--select2-padding-large);
    user-select: none;
    -webkit-user-select: none
}

.select2-results__option--selectable {
    cursor: pointer
}

/* Estados del dropdown */
.select2-container--open .select2-dropdown {
    left: 0
}

.select2-container--open .select2-dropdown--above {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

.select2-container--open .select2-dropdown--below {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

/* ====================================
   6. BÚSQUEDA EN DROPDOWN
   ==================================== */

.select2-search--dropdown {
    display: block;
    padding: var(--select2-padding-small)
}

    .select2-search--dropdown .select2-search__field {
        padding: var(--select2-padding-small);
        width: 100%;
        box-sizing: border-box
    }

        .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
            -webkit-appearance: none
        }

    .select2-search--dropdown.select2-search--hide {
        display: none
    }

/* ====================================
   7. TEMA DEFAULT
   ==================================== */

/* Selección simple - Default */
.select2-container--default .select2-selection--single {
    background-color: var(--select2-bg-primary);
    border: 1px solid var(--select2-border-color);
    border-radius: var(--select2-border-radius);
}

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: var(--select2-text-primary);
        line-height: var(--select2-height-single)
    }

    .select2-container--default .select2-selection--single .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
        height: var(--select2-height-clear);
        margin-right: var(--select2-margin-large);
        padding-right: 0px
    }

    .select2-container--default .select2-selection--single .select2-selection__placeholder {
        color: var(--select2-text-secondary)
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: var(--select2-height-clear);
        position: absolute;
        top: 1px;
        right: 1px;
        width: var(--select2-width-arrow)
    }

        .select2-container--default .select2-selection--single .select2-selection__arrow b {
            border-color: var(--select2-text-arrow) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
            border-style: solid;
            border-width: 5px 4px 0 4px;
            height: 0;
            left: 50%;
            margin-left: -4px;
            margin-top: -2px;
            position: absolute;
            top: 50%;
            width: 0
        }

/* RTL para Default single */
.select2-container--default[dir=rtl] .select2-selection--single .select2-selection__clear {
    float: left
}

.select2-container--default[dir=rtl] .select2-selection--single .select2-selection__arrow {
    left: 1px;
    right: auto
}

/* Estados Default single */
.select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: var(--select2-bg-disabled);
    cursor: default
}

    .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
        display: none
    }

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: rgba(0,0,0,0) rgba(0,0,0,0) var(--select2-text-arrow) rgba(0,0,0,0);
    border-width: 0 4px 5px 4px
}

/* Selección múltiple - Default */
.select2-container--default .select2-selection--multiple {
    background-color: var(--select2-bg-primary);
    border: 1px solid var(--select2-border-color);
    border-radius: var(--select2-border-radius);
    cursor: text;
    padding-bottom: var(--select2-padding-medium);
    padding-right: var(--select2-padding-medium);
    position: relative
}

    .select2-container--default .select2-selection--multiple.select2-selection--clearable {
        padding-right: 25px
    }

    .select2-container--default .select2-selection--multiple .select2-selection__clear {
        cursor: pointer;
        font-weight: bold;
        height: var(--select2-height-choice-clear);
        margin-right: var(--select2-margin-medium);
        margin-top: var(--select2-margin-small);
        position: absolute;
        right: 0;
        padding: 1px
    }

    .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: var(--select2-bg-choice);
        border: 1px solid var(--select2-border-color);
        border-radius: var(--select2-border-radius);
        box-sizing: border-box;
        display: inline-block;
        margin-left: var(--select2-margin-small);
        margin-top: var(--select2-margin-small);
        padding: 0;
        padding-left: var(--select2-padding-right);
        position: relative;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        vertical-align: bottom;
        white-space: nowrap
    }

    .select2-container--default .select2-selection--multiple .select2-selection__choice__display {
        cursor: default;
        padding-left: 2px;
        padding-right: var(--select2-padding-medium)
    }

    .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
        background-color: rgba(0,0,0,0);
        border: none;
        border-right: 1px solid var(--select2-border-color);
        border-top-left-radius: var(--select2-border-radius);
        border-bottom-left-radius: var(--select2-border-radius);
        color: var(--select2-text-secondary);
        cursor: pointer;
        font-size: 1em;
        font-weight: bold;
        padding: 0 4px;
        position: absolute;
        left: 0;
        top: 0
    }

        .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover, .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus {
            background-color: var(--select2-bg-hover);
            color: var(--select2-text-hover);
            outline: none
        }

/* RTL para Default multiple */
.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice {
    margin-left: var(--select2-margin-small);
    margin-right: auto
}

.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice__display {
    padding-left: var(--select2-padding-medium);
    padding-right: 2px
}

.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__choice__remove {
    border-left: 1px solid var(--select2-border-color);
    border-right: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: var(--select2-border-radius);
    border-bottom-right-radius: var(--select2-border-radius)
}

.select2-container--default[dir=rtl] .select2-selection--multiple .select2-selection__clear {
    float: left;
    margin-left: var(--select2-margin-medium);
    margin-right: auto
}

/* Estados Default multiple */
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: solid var(--select2-border-focus-multiple) 1px;
    outline: 0
}

.select2-container--default.select2-container--disabled .select2-selection--multiple {
    background-color: var(--select2-bg-disabled);
    cursor: default
}

.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
    display: none
}

/* Estados abierto Default */
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

/* Búsqueda Default */
.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--select2-border-color)
}

.select2-container--default .select2-search--inline .select2-search__field {
    background: rgba(0,0,0,0);
    border: none;
    outline: 0;
    box-shadow: none;
    -webkit-appearance: textfield
}

/* Resultados Default */
.select2-container--default .select2-results > .select2-results__options {
    max-height: var(--select2-max-height-results);
    overflow-y: auto
}

.select2-container--default .select2-results__option .select2-results__option {
    padding-left: 1em
}

    .select2-container--default .select2-results__option .select2-results__option .select2-results__group {
        padding-left: 0
    }

    .select2-container--default .select2-results__option .select2-results__option .select2-results__option {
        margin-left: -1em;
        padding-left: 2em
    }

        .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
            margin-left: -2em;
            padding-left: 3em
        }

            .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
                margin-left: -3em;
                padding-left: 4em
            }

                .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
                    margin-left: -4em;
                    padding-left: 5em
                }

                    .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
                        margin-left: -5em;
                        padding-left: 6em
                    }

.select2-container--default .select2-results__option--group {
    padding: 0
}

.select2-container--default .select2-results__option--disabled {
    color: var(--select2-text-secondary)
}

.select2-container--default .select2-results__option--selected {
    background-color: var(--select2-bg-selected)
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--select2-bg-highlighted);
    color: var(--select2-text-highlighted)
}

.select2-container--default .select2-results__group {
    cursor: default;
    display: block;
    padding: var(--select2-padding-large)
}

/* ====================================
   8. TEMA CLASSIC
   ==================================== */

/* Selección simple - Classic */
.select2-container--classic .select2-selection--single {
    background-color: var(--select2-bg-secondary);
    border: 1px solid var(--select2-border-color);
    border-radius: var(--select2-border-radius);
    outline: 0;
    background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%);
    background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%);
    background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFFFF", endColorstr="#FFEEEEEE", GradientType=0)
}

    .select2-container--classic .select2-selection--single:focus {
        border: 1px solid var(--select2-border-focus)
    }

    .select2-container--classic .select2-selection--single .select2-selection__rendered {
        color: var(--select2-text-primary);
        line-height: var(--select2-height-single)
    }

    .select2-container--classic .select2-selection--single .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
        height: var(--select2-height-clear);
        margin-right: var(--select2-margin-large)
    }

    .select2-container--classic .select2-selection--single .select2-selection__placeholder {
        color: var(--select2-text-secondary)
    }

    .select2-container--classic .select2-selection--single .select2-selection__arrow {
        background-color: var(--select2-bg-arrow);
        border: none;
        border-left: 1px solid var(--select2-border-color);
        border-top-right-radius: var(--select2-border-radius);
        border-bottom-right-radius: var(--select2-border-radius);
        height: var(--select2-height-clear);
        position: absolute;
        top: 1px;
        right: 1px;
        width: var(--select2-width-arrow);
        background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
        background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
        background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFEEEEEE", endColorstr="#FFCCCCCC", GradientType=0)
    }

        .select2-container--classic .select2-selection--single .select2-selection__arrow b {
            border-color: var(--select2-text-arrow) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
            border-style: solid;
            border-width: 5px 4px 0 4px;
            height: 0;
            left: 50%;
            margin-left: -4px;
            margin-top: -2px;
            position: absolute;
            top: 50%;
            width: 0
        }

/* RTL para Classic single */
.select2-container--classic[dir=rtl] .select2-selection--single .select2-selection__clear {
    float: left
}

.select2-container--classic[dir=rtl] .select2-selection--single .select2-selection__arrow {
    border: none;
    border-right: 1px solid var(--select2-border-color);
    border-radius: 0;
    border-top-left-radius: var(--select2-border-radius);
    border-bottom-left-radius: var(--select2-border-radius);
    left: 1px;
    right: auto
}

/* Estados Classic single */
.select2-container--classic.select2-container--open .select2-selection--single {
    border: 1px solid var(--select2-border-focus)
}

    .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
        background: rgba(0,0,0,0);
        border: none
    }

        .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
            border-color: rgba(0,0,0,0) rgba(0,0,0,0) var(--select2-text-arrow) rgba(0,0,0,0);
            border-width: 0 4px 5px 4px
        }

.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%);
    background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%);
    background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFFFF", endColorstr="#FFEEEEEE", GradientType=0)
}

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%);
    background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%);
    background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFEEEEEE", endColorstr="#FFFFFFFF", GradientType=0)
}

/* Selección múltiple - Classic */
.select2-container--classic .select2-selection--multiple {
    background-color: var(--select2-bg-primary);
    border: 1px solid var(--select2-border-color);
    border-radius: var(--select2-border-radius);
    cursor: text;
    outline: 0;
    padding-bottom: var(--select2-padding-medium);
    padding-right: var(--select2-padding-medium)
}

    .select2-container--classic .select2-selection--multiple:focus {
        border: 1px solid var(--select2-border-focus)
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__clear {
        display: none
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__choice {
        background-color: var(--select2-bg-choice);
        border: 1px solid var(--select2-border-color);
        border-radius: var(--select2-border-radius);
        display: inline-block;
        margin-left: var(--select2-margin-small);
        margin-top: var(--select2-margin-small);
        padding: 0
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__choice__display {
        cursor: default;
        padding-left: 2px;
        padding-right: var(--select2-padding-medium)
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
        background-color: rgba(0,0,0,0);
        border: none;
        border-top-left-radius: var(--select2-border-radius);
        border-bottom-left-radius: var(--select2-border-radius);
        color: var(--select2-text-arrow);
        cursor: pointer;
        font-size: 1em;
        font-weight: bold;
        padding: 0 4px
    }

        .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
            color: var(--select2-text-classic-hover);
            outline: none
        }

/* RTL para Classic multiple */
.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice {
    margin-left: var(--select2-margin-small);
    margin-right: auto
}

.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice__display {
    padding-left: var(--select2-padding-medium);
    padding-right: 2px
}

.select2-container--classic[dir=rtl] .select2-selection--multiple .select2-selection__choice__remove {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    border-top-right-radius: var(--select2-border-radius);
    border-bottom-right-radius: var(--select2-border-radius)
}

/* Estados Classic multiple */
.select2-container--classic.select2-container--open .select2-selection--multiple {
    border: 1px solid var(--select2-border-focus)
}

.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0
}

/* Búsqueda Classic */
.select2-container--classic .select2-search--dropdown .select2-search__field {
    border: 1px solid var(--select2-border-color);
    outline: 0
}

.select2-container--classic .select2-search--inline .select2-search__field {
    outline: 0;
    box-shadow: none
}

/* Dropdown Classic */
.select2-container--classic .select2-dropdown {
    background-color: var(--select2-bg-primary);
    border: 1px solid rgba(0,0,0,0)
}

.select2-container--classic .select2-dropdown--above {
    border-bottom: none
}

.select2-container--classic .select2-dropdown--below {
    border-top: none
}

/* Resultados Classic */
.select2-container--classic .select2-results > .select2-results__options {
    max-height: var(--select2-max-height-results);
    overflow-y: auto
}

.select2-container--classic .select2-results__option--group {
    padding: 0
}

.select2-container--classic .select2-results__option--disabled {
    color: var(--select2-text-disabled)
}

.select2-container--classic .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--select2-bg-highlighted-classic);
    color: var(--select2-text-highlighted)
}

.select2-container--classic .select2-results__group {
    cursor: default;
    display: block;
    padding: var(--select2-padding-large)
}

.select2-container--classic.select2-container--open .select2-dropdown {
    border-color: var(--select2-border-focus)
}
