.select2-container--ltms.select2-container--ltms {
    --select-height: 38px;
    --disabled-bg-color: #eee;
    --border-color: #ced4da;

    .select2-selection--single {
        background-color: #fff;
        border: 1px solid var(--border-color);
        border-radius: 4px;
        height: var(--select-height);
        overflow: clip;

        .select2-selection__rendered {
            color: #444;
            line-height: calc(var(--select-height) - 2px);
            padding-left: 8px;
            font-weight: normal;
        }

        .select2-selection__clear {
            cursor: pointer;
            float: left;
            font-weight: bold;
            height: calc(var(--select-height) - 2px);
            padding: 0 3px;
            overflow: clip;
            display: flex;
            align-items: center;
            justify-content: center;

            &::after {
                content: url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M24 3.2L20.8 0L12 8.93829L3.2 0L0 3.2L8.93829 12L0 20.8L3.2 24L12 15.0617L20.8 24L24 20.8L15.0617 12L24 3.2Z' fill='black'/></svg>");
                display: block;
                width: 10px;
                height: 10px;
                border-radius: 99rem;
            }

            span {
                display: none;
            }

            &:hover {
                background-color: oklch(39.6% 0.141 25.723);

                &::after {
                    content: url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M24 3.2L20.8 0L12 8.93829L3.2 0L0 3.2L8.93829 12L0 20.8L3.2 24L12 15.0617L20.8 24L24 20.8L15.0617 12L24 3.2Z' fill='white'/></svg>");
                }
            }
        }

        .select2-selection__placeholder {
            color: #999;
        }

        .select2-selection__arrow {
            height: calc(var(--select-height) - 2px);
            position: absolute;
            top: 1px;
            right: 1px;
            width: 20px;

            b {
                border-color: #888 transparent transparent transparent;
                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;
                transition: border 0.1s;
            }
        }

        &:has(.select2-selection__clear) .select2-selection__rendered {
            padding-left: 2px;
        }
    }

    .select2-selection--multiple {
        background-color: white;
        border: 1px solid var(--border-color);
        border-radius: 4px;
        cursor: text;
        padding-right: 25px;
        position: relative;
        min-height: var(--select-height);
        display: flex;
        flex-wrap: wrap;
        align-items: center;

        .select2-selection__rendered {
            margin-bottom: 0;
            display: flex;
            gap: 5px;
            flex-wrap: wrap;
            align-items: center;
            min-width: 0;
            margin: 5px;
            margin-right: 1px;
        }

        &.select2-selection--clearable {
            padding-right: 25px;
        }

        .select2-selection__clear {
            position: absolute;
            right: 0;
            top: 0;
            cursor: pointer;
            font-weight: bold;
            height: 100%;
            padding: 0 5px;
            overflow: clip;
            transition: all 0.1s;
            border-top-right-radius: 4px;
            border-bottom-right-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;

            span {
                display: none;
            }

            &::after {
                content: url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M24 3.2L20.8 0L12 8.93829L3.2 0L0 3.2L8.93829 12L0 20.8L3.2 24L12 15.0617L20.8 24L24 20.8L15.0617 12L24 3.2Z' fill='black'/></svg>");
                display: block;
                width: 10px;
                height: 10px;
                border-radius: 99rem;
            }

            &:hover {
                background-color: oklch(39.6% 0.141 25.723);

                &::after {
                    content: url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M24 3.2L20.8 0L12 8.93829L3.2 0L0 3.2L8.93829 12L0 20.8L3.2 24L12 15.0617L20.8 24L24 20.8L15.0617 12L24 3.2Z' fill='white'/></svg>");
                }
            }
        }

        .select2-selection__choice {
            background-color: #e5e5e5;
            border-radius: 1rem;
            box-sizing: border-box;
            padding: 4px 10px 4px 30px;
            position: relative;
            max-width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            vertical-align: bottom;
            white-space: nowrap;
            display: flex;
            align-items: center;

            &:hover,
            &:focus {
                background-color: #e9e9e9;
            }
        }

        .select2-selection__choice__display {
            cursor: default;
            padding-left: 2px;
            padding-right: 5px;
        }

        .select2-selection__choice__remove {
            background-color: transparent;
            border: 1px solid black;
            border-radius: 99px;
            color: #999;
            cursor: pointer;
            font-size: 1em;
            font-weight: bold;
            position: absolute;
            left: 7px;
            width: 1.1rem;
            height: 1.1rem;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.1s;

            span {
                display: none;
            }

            &::after {
                content: url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M24 3.2L20.8 0L12 8.93829L3.2 0L0 3.2L8.93829 12L0 20.8L3.2 24L12 15.0617L20.8 24L24 20.8L15.0617 12L24 3.2Z' fill='black'/></svg>");
                display: block;
                position: absolute;
                width: 8px;
                height: 8px;
                border-radius: 99rem;
            }

            &:hover,
            &:focus {
                background-color: black;

                &::after {
                    content: url("data:image/svg+xml,<svg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'><path d='M24 3.2L20.8 0L12 8.93829L3.2 0L0 3.2L8.93829 12L0 20.8L3.2 24L12 15.0617L20.8 24L24 20.8L15.0617 12L24 3.2Z' fill='white'/></svg>");
                }
            }
        }

        .select2-search--inline {
            display: flex;
            display: inline-flex;
            height: 100%;
            max-width: 100%;
            align-items: center;
            flex-grow: 1;

            .select2-search__field {
                max-width: 100%;
                line-height: 1em;
                margin-left: 3px;
            }
        }
    }

    &.select2-container--disabled {
        .select2-selection--single {
            background-color: var(--disabled-bg-color);
            cursor: not-allowed;

            .select2-selection__clear {
                display: none;
            }
        }

        .select2-selection--multiple {
            background-color: var(--disabled-bg-color);
            cursor: not-allowed;
        }

        .select2-selection__choice__remove {
            display: none;
        }
    }

    &.select2-container--loading-state {
        cursor: wait;

        .select2-selection--single,
        .select2-selection--multiple {
            background-color: var(--disabled-bg-color);
            pointer-events: none;

            &::after {
                animation: select2-loading-spinner-ltms-theme 1s linear infinite;
                border-radius: 50%;
                border: 2px solid transparent;
                border-top-color: #333;
                content: '';
                display: block;
                height: 15px;
                width: 15px;
                position: absolute;
                right: 5px;
                top: 50%;
                transform: translateY(-50%) rotate(0deg);
            }

            .select2-selection__arrow {
                visibility: hidden;
            }
        }

        .select2-selection--multiple {
            .select2-selection__clear {
                display: none;
            }
        }
    }

    &.select2-container--open {
        .select2-selection__arrow b {
            border-color: transparent transparent #888 transparent;
            border-width: 0 4px 5px 4px;
        }

        &.select2-container--above {
            .select2-selection--single,
            .select2-selection--multiple {
                border-top-left-radius: 0;
                border-top-right-radius: 0;
                border-top: 1px solid transparent;
            }
        }

        &.select2-container--below {
            .select2-selection--single,
            .select2-selection--multiple {
                border-bottom-left-radius: 0;
                border-bottom-right-radius: 0;
                border-bottom: 1px solid transparent;
            }
        }
    }

    &.select2-container--focus .select2-selection--multiple {
        outline: 0;
    }

    .select2-search--dropdown .select2-search__field {
        border: 1px solid var(--border-color);
        border-radius: 4px;
        background-color: unset;

        &:focus-visible {
            outline: none;
        }
    }

    .select2-dropdown {
        &.select2-dropdown--above {
            border-bottom: 1px solid var(--border-color);
        }

        &.select2-dropdown--below {
            border-top: 1px solid var(--border-color);
        }
    }

    .select2-search--inline .select2-search__field {
        background: transparent;
        border: none;
        outline: 0;
        box-shadow: none;
        appearance: textfield;
    }

    .select2-results > .select2-results__options {
        max-height: 200px;
        overflow-y: auto;
    }

    .select2-results__option {
        .select2-results__option {
            padding-left: 1em;

            .select2-results__group {
                padding-left: 0;
            }

            .select2-results__option {
                margin-left: -1em;
                padding-left: 2em;

                .select2-results__option {
                    margin-left: -2em;
                    padding-left: 3em;

                    .select2-results__option {
                        margin-left: -3em;
                        padding-left: 4em;

                        .select2-results__option {
                            margin-left: -4em;
                            padding-left: 5em;

                            .select2-results__option {
                                margin-left: -5em;
                                padding-left: 6em;
                            }
                        }
                    }
                }
            }
        }
    }

    .select2-results__option--group {
        padding: 0;
    }

    .select2-results__option--disabled {
        color: #999;
    }

    .select2-results__option--selected {
        background-color: #ddd;
    }

    .select2-results__option--highlighted.select2-results__option--selectable {
        background-color: #007bff;
        color: white;
    }

    .select2-results__group {
        cursor: default;
        display: block;
        padding: 6px;
    }
}

/* Theme for non-initialized select2 */
.select-2,
select.select2 {
    background-color: transparent;
    border-radius: 4px;
    border: 1px solid var(--border-color);
}

@keyframes select2-loading-spinner-ltms-theme {
    0% {
        transform: translateY(-50%) rotate(0deg);
    }

    100% {
        transform: translateY(-50%) rotate(360deg);
    }
}
