/* PS LOV: extends input.css; does not change the legacy LOV. */
.ps-lov {
    position: relative;
    display: flow-root;
}
.ps-lov .ps-field__control { isolation: isolate; }
.ps-lov__panel {
    display: none;
    position: absolute;
    top: calc(100% + 5px);
    right: 0;
    left: 0;
    z-index: 1;
    box-sizing: border-box;
    background: var(--color-surface-card);
    border: var(--secondary-border);
    border-radius: var(--border-radius);
    box-shadow: 0 8px 24px rgba(0,0,0,.15);
    overflow-y: auto;
    overscroll-behavior: contain;
    overflow-anchor: none;
    touch-action: pan-y;
    max-height: min(320px, var(--ps-lov-available-height, 320px));
}
.ps-lov.is-open { z-index: var(--zindex-lov, 150); }
.ps-lov.is-open .ps-lov__panel { display: block; }
.ps-lov__list { padding: 4px 0; margin: 0; list-style: none; }
.ps-lov__option {
    display: block;
    padding: 12px 16px;
    color: var(--color-text-primary);
    cursor: pointer;
    text-align: right;
    font-size: var(--fs-body-md);
}
.ps-lov__option:hover,
.ps-lov__option[aria-selected="true"] {
    background: var(--color-surface-muted);
    color: var(--color-link);
}
.ps-lov__status {
    padding: 14px 16px;
    text-align: right;
    color: var(--color-text-secondary);
    font-size: var(--fs-body-sm);
}
.ps-lov__option:focus-visible { outline: 2px solid var(--color-link); outline-offset: -2px; }

/* Dim the background while the mobile LOV is temporarily lifted.
   This sits under the top-layer popover; in fallback browsers, under its z-index. */
.ps-lov__backdrop {
    position: fixed;
    inset: 0;
    background: var(--color-surface-card);
    z-index: calc(var(--zindex-lov, 150) - 1);
    pointer-events: auto;
}

/* While the mobile keyboard is in use, lift only this field above page content.
   No document scrolling, no edits to the sticky/fixed header. */
.ps-field.ps-lov.is-floating {
    position: fixed;
    top: calc(var(--header-height, 0px) + var(--ps-lov-view-top, 0px) + 4px);
    bottom: auto;
    left: var(--ps-lov-left, 12px);
    right: var(--ps-lov-right, 12px);
    width: auto;
    max-width: none;
    min-width: 0;
    margin: 0;
    padding: 0 8px 4px;
    border: 1px solid transparent;
    border-radius: var(--border-radius);
    box-sizing: border-box;
    background: var(--color-surface-card);
    box-shadow: 0 10px 32px rgba(0, 0, 0, .2);
    overflow: visible;
    z-index: var(--zindex-lov, 150);
}
.ps-lov.is-floating .ps-field__input { box-sizing: border-box; }
/* Place results AFTER the shared PSField help message, without covering it. */
.ps-lov.is-floating .ps-lov__panel {
    top: calc(100% + var(--ps-lov-support-height, 0px) + 5px);
    left: -8px;
    right: -8px;
    max-height: min(320px, var(--ps-lov-available-height, 320px));
}
.ps-lov.is-floating .ps-field__support {
    background: var(--color-surface-card);
}

@media (prefers-reduced-motion: reduce) {
    .ps-lov__panel { scroll-behavior: auto; }
}
