.c-filter.is-dark-mode .ui-select--simple .ts-wrapper {
    width: 100%;
}

.c-filter.is-dark-mode .ui-select--simple .ts-wrapper .ts-control {
    height: var(--select-button-height);
    min-height: var(--select-button-height);
    padding-left: var(--select-button-padding-left);
    padding-right: calc(2 * var(--select-button-padding-right));
    font-size: var(--select-button-font-size);
    border: 1px solid var(--select-button-border-color);
    background-color: var(--select-button-background);
    border-radius: var(--select-button-radius);
    color: var(--select-button-color);
    box-shadow: none;
    cursor: pointer;
    position: relative;
}

.c-filter.is-dark-mode .ui-select--simple .ts-wrapper .ts-control::after {
    content: " ";
    display: block;
    position: absolute;
    top: 50%;
    margin-top: -1px;
    transform: rotate(0deg) translateY(-50%);
    transform-origin: 50% 0%;
    right: var(--select-button-padding-right);
    width: var(--select-button-icon-arrow-size);
    height: var(--select-button-icon-arrow-size);
    background-image: var(--select-button-icon-arrow);
    background-size: var(--select-button-icon-arrow-size);
    background-repeat: no-repeat;
    background-position: center;
    transition: transform var(--tr);
    will-change: transform;
    pointer-events: none;
    border: 0;
    margin-left: 0;
}

.c-filter.is-dark-mode .ui-select--simple .ts-wrapper .ts-control .ts-input,
.c-filter.is-dark-mode .ui-select--simple .ts-wrapper .ts-control input {
    font-size: var(--select-button-font-size);
    color: var(--select-button-color);
}

.c-filter.is-dark-mode .ui-select--simple .ts-wrapper .ts-control .item,
.c-filter.is-dark-mode .ui-select--simple .ts-wrapper .ts-control .ts-placeholder {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--select-button-active-color);
}

.c-filter.is-dark-mode .ui-select--simple .ts-wrapper.dropdown-active .ts-control::after {
    transform: rotate(180deg) translateY(-50%);
}

body:has(.c-filter.is-dark-mode) .ts-dropdown {
    background-color: #2b2930;
    border: 1px solid #535158;
    border-radius: 8px;
    margin-top: 4px;
    box-shadow: none;
    z-index: 100;
}

body:has(.c-filter.is-dark-mode) .ts-dropdown .ts-dropdown-content {
    padding-top: 10px;
    padding-bottom: 10px;
    scrollbar-width: thin;
    scrollbar-color: #ccc transparent;
}

body:has(.c-filter.is-dark-mode) .ts-dropdown .option {
    font-size: 14px;
    padding: 8px 16px;
    cursor: pointer;
    color: #fff;
}

body:has(.c-filter.is-dark-mode) .ts-dropdown .option.active {
    background-color: #535158;
    color: #fff;
}