/* Shared searchable dropdown activated with the searchable-select class. */
/* Relation tags remain quiet, italic text beside an unchanged customer name. */
.searchable-choice-tag {
    margin-left: 6px;
    color: var(--interface-disabled-field-text);
    font-size: var(--interface-value-size);
    font-style: italic;
    font-weight: 450;
    white-space: nowrap;
    flex-shrink: 0;
}
.searchable-selected-label {
    display: none;
    position: absolute;
    left: 11px;
    right: 48px;
    top: 0;
    bottom: 0;
    align-items: center;
    pointer-events: none;
    font-size: var(--interface-value-size);
    font-weight: 450;
    color: var(--interface-view-field-text);
}
.searchable-selected-label > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.has-selection-tag > .searchable-selected-label { display: flex; }
.has-selection-tag.has-clear-action:focus-within > .searchable-selected-label { right: 80px; }
.has-selection-tag > .searchable-combobox-input { color: transparent !important; caret-color: var(--text); }
.searchable-select-native,.searchable-ledger-select-native{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0!important}.searchable-combobox,.ledger-combobox{position:relative;margin-top:10px}.searchable-combobox-input,.ledger-combobox-input{width:100%;padding-right:48px!important;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1.5 1.5 6 6l4.5-4.5' fill='none' stroke='%23586f82' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"),linear-gradient(var(--border),var(--border));background-repeat:no-repeat,no-repeat;background-position:right 13px center,right 39px center;background-size:12px 8px,1px 56%;cursor:text}

/* All option lists grow with their text and remain at least as wide as their field. */
.searchable-combobox-list,
.ledger-combobox-list {
    position: absolute;
    z-index: 30;
    top: calc(100% + 5px);
    left: 0;
    display: none;
    grid-template-columns: minmax(0, 1fr);
    gap: 3px;
    box-sizing: border-box;
    width: max-content;
    min-width: min(100%, var(--searchable-list-max-width, calc(100vw - 24px)));
    max-width: var(--searchable-list-max-width, calc(100vw - 24px));
    max-height: 260px;
    overflow: auto;
    padding: 5px;
    border: 1px solid var(--border-strong);
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(7, 23, 39, .16);
}

.searchable-combobox.open .searchable-combobox-list,
.ledger-combobox.open .ledger-combobox-list {
    display: grid;
}

/* Dropdown choices share field typography and remain still when hovered. */
.ledger-combobox-option {
    display: grid;
    grid-template-columns: 55px minmax(0, 1fr);
    gap: 8px;
    width: 100%;
    min-width: 0;
    min-height: 40px;
    align-items: center;
    box-sizing: border-box;
    padding: 8px 10px;
    border: 1px solid rgba(18, 57, 93, .07);
    border-radius: 6px;
    background: #fff;
    color: var(--text);
    font-family: inherit;
    font-size: var(--interface-value-size);
    font-style: normal;
    font-weight: 450;
    line-height: 1.5;
    text-align: left;
    box-shadow: none;
    transform: none;
    cursor: pointer;
}

.ledger-combobox-option.is-plain {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ledger-combobox-option.is-empty {
    color: var(--interface-placeholder);
    font-style: italic;
}

.ledger-combobox-option strong {
    color: var(--blue-700);
    font-variant-numeric: tabular-nums;
}

.ledger-combobox-option span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ledger-combobox-option:hover,
.ledger-combobox-option.highlighted {
    border-color: rgba(18, 57, 93, .14);
    background: var(--blue-050);
    color: var(--text) !important;
    box-shadow: none;
    transform: none;
}

.ledger-combobox-empty{padding:14px;color:var(--muted);font-size:12px;text-align:center}
/* Typeable comboboxes reserve a shared, accessible action for clearing their value. */
.searchable-combobox.has-clear-action .searchable-combobox-input{padding-right:80px!important}.searchable-combobox-clear{position:absolute;top:50%;display:flex;visibility:hidden;align-items:center;justify-content:center;width:30px;min-width:30px;height:30px;min-height:30px;padding:0;border:0;border-radius:50%;background:transparent;box-shadow:none;color:#607786;line-height:1;opacity:0;pointer-events:none;cursor:pointer;transform:translateY(-50%);transition:background-color .15s ease,color .15s ease,opacity .12s ease}.searchable-combobox:focus-within>.searchable-combobox-clear{visibility:visible;opacity:1;pointer-events:auto}.searchable-combobox>.searchable-combobox-clear{right:42px}.searchable-combobox-clear:hover{background:#e7eff3;box-shadow:none;color:#17364b;transform:translateY(-50%)}.searchable-combobox-clear:active{transform:translateY(-50%)}.searchable-combobox-clear:focus-visible{outline:3px solid rgba(49,95,121,.22);outline-offset:1px}.searchable-combobox-clear:disabled{background:transparent;color:#93a2ad;cursor:default;opacity:.6}.searchable-combobox-clear[hidden]{display:none}.searchable-combobox-clear svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:2.2}