.ombox-tree-select {
    position: relative;
    font-size: var(--widget-font-size, 14px);
    line-height: var(--widget-line-height, 1.571);
    z-index: 1;
}

.ombox-tree-select.is-open {
    z-index: 1200;
}

.ombox-tree-select-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: stretch;
}

.ombox-tree-select-trigger,
.ombox-tree-select-search {
    width: 100%;
    min-height: var(--widget-control-min-height, 38px);
    height: var(--widget-control-min-height, 38px);
    font-size: var(--widget-font-size, 14px);
    line-height: var(--widget-line-height, 1.571);
    box-sizing: border-box;
}

.ombox-tree-select-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--widget-control-padding-y, 7px) var(--widget-control-padding-x, 12px);
    background: var(--color-white, #fff);
    color: var(--color-text-primary, #1e293b);
    border: var(--border-width-thin, 1px) solid var(--color-border, #d7dde5);
    border-radius: var(--widget-control-radius, var(--radius-md, 8px));
    text-align: left;
}

.ombox-tree-select-control:has(.ombox-tree-select-search-toggle) .ombox-tree-select-trigger,
.ombox-tree-select-control:has(.ombox-tree-select-search-toggle) .ombox-tree-select-search {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.ombox-tree-select-search-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--widget-control-min-height, 38px);
    min-height: var(--widget-control-min-height, 38px);
    height: var(--widget-control-min-height, 38px);
    border: var(--border-width-thin, 1px) solid var(--color-border, #d7dde5);
    border-left: 0;
    border-radius: 0 var(--widget-control-radius, var(--radius-md, 8px)) var(--widget-control-radius, var(--radius-md, 8px)) 0;
    color: var(--color-text-muted);
    background: var(--color-white, #fff);
}

.ombox-tree-select-search-toggle:hover,
.ombox-tree-select-search-toggle:focus {
    color: var(--color-primary);
    outline: 0;
}

.ombox-tree-select.is-invalid .ombox-tree-select-trigger,
.ombox-tree-select.is-invalid .ombox-tree-select-search,
.ombox-tree-select.is-invalid .ombox-tree-select-search-toggle,
.ombox-tree-select[aria-invalid="true"] .ombox-tree-select-trigger,
.ombox-tree-select[aria-invalid="true"] .ombox-tree-select-search,
.ombox-tree-select[aria-invalid="true"] .ombox-tree-select-search-toggle {
    border-color: var(--color-border, #dee2e6);
    box-shadow: none;
}

.ombox-tree-select.is-searching .ombox-tree-select-trigger {
    display: none;
}

.ombox-tree-select-search[hidden] {
    display: none;
}

.ombox-tree-select-menu {
    position: absolute;
    z-index: 1080;
    top: calc(100% + 4px);
    left: 0;
    min-width: 100%;
    max-height: 280px;
    display: none;
    overflow: auto;
    background: var(--color-white, #fff);
    border: var(--border-width-thin, 1px) solid var(--color-border, #d7dde5);
    border-radius: var(--radius-md, 8px);
    box-shadow: var(--shadow-lg, 0 16px 38px rgba(15, 23, 42, .16));
}

.ombox-tree-select.is-open .ombox-tree-select-menu {
    display: block;
}

.ombox-tree-select-menu ul {
    list-style: none;
    margin: 0;
    padding: var(--space-1);
}

.ombox-tree-select-menu ul ul {
    padding-left: var(--space-4);
}

.ombox-tree-select-option {
    width: 100%;
    min-height: var(--widget-option-min-height, 36px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    background: var(--color-white, #fff);
    color: var(--color-text-secondary, #475467);
    border: 0;
    border-radius: var(--radius-sm);
    text-align: left;
}

.ombox-tree-select-option small {
    color: var(--color-text-muted);
    font-size: var(--widget-small-font-size, 12px);
    line-height: var(--widget-small-line-height, 1.5);
}

.ombox-tree-select-node-hidden {
    display: none;
}

.ombox-tree-select-option:hover,
.ombox-tree-select-option[aria-selected="true"] {
    background: var(--color-primary-light, #e8f2ff);
    color: var(--color-primary, #2563eb);
}

body.eye-protection .ombox-tree-select-trigger,
body.eye-protection .ombox-tree-select-search,
body.eye-protection .ombox-tree-select-search-toggle,
body.eye-protection .ombox-tree-select-menu {
    background: #faf8f3;
    border-color: #d9cbb8;
}

body.eye-protection .ombox-tree-select-search-toggle {
    color: #6b5d4f;
}
