/* THRS V14.18 — Leaves Premium Open Dropdown Menus
   Scoped controls and portal menus. Original React selects remain in DOM.
   JS enhancements affect no other THRS routes. */
html[data-theme="light"] :is(.thrs-page-leaves,.thrs-leave-select-popup) {
 --lv18d-bg:#ffffff;--lv18d-raised:#f6f9fd;--lv18d-hover:#edf4fa;
 --lv18d-ink:#15324e;--lv18d-muted:#536a82;--lv18d-border:#cfdde9;
 --lv18d-gold:#a77431;--lv18d-strong:#b9863c;
 --lv18d-shadow:0 23px 53px rgba(9,34,61,.18),0 4px 10px rgba(9,34,61,.05);
 --lv18d-ring:0 0 0 3px rgba(184,134,65,.20);
 color-scheme:light;
}
html[data-theme="dark"] :is(.thrs-page-leaves,.thrs-leave-select-popup) {
 --lv18d-bg:#142f49;--lv18d-raised:#1b3b58;--lv18d-hover:#244b69;
 --lv18d-ink:#f0f7ff;--lv18d-muted:#c3d4e4;--lv18d-border:#54748e;
 --lv18d-gold:#f0cd91;--lv18d-strong:#efc781;
 --lv18d-shadow:0 23px 54px rgba(0,6,19,.59),inset 0 1px 0 rgba(255,255,255,.07);
 --lv18d-ring:0 0 0 3px rgba(233,190,124,.24);
 color-scheme:dark;
}
/* Keep React select as the source of truth, visually concealed only after
   the new, functional button has been added. Do not display:none the native
   required employee select: it must remain validatable by the browser. */
html[data-theme] .thrs-page-leaves select.thrs-leave-select-native,
html[data-theme] body:has(.thrs-page-leaves) .thrs-modal-card select.thrs-leave-select-native {
 position:absolute !important;
 width:1px !important;min-width:1px !important;max-width:1px !important;
 height:1px !important;min-height:1px !important;
 padding:0 !important;margin:0 !important;
 opacity:0 !important;clip-path:inset(50%) !important;
 pointer-events:none !important;
 overflow:hidden !important;
 border:0 !important;box-shadow:none !important;
}
html[data-theme] .thrs-page-leaves .thrs-leave-select-trigger,
html[data-theme] body:has(.thrs-page-leaves) .thrs-modal-card .thrs-leave-select-trigger {
 display:flex !important;
 align-items:center !important;
 justify-content:space-between !important;
 width:100% !important;min-width:0 !important;
 min-height:40px !important;
 padding:7px 10px 7px 13px !important;
 gap:11px !important;
 background:linear-gradient(130deg,var(--lv18d-bg),var(--lv18d-raised)) !important;
 color:var(--lv18d-ink) !important;
 border:1px solid var(--lv18d-border) !important;
 border-radius:11px !important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 2px 8px rgba(8,36,63,.04) !important;
 font:inherit !important;font-size:12px !important;font-weight:750 !important;
 text-align:start !important;line-height:1.4 !important;cursor:pointer !important;
 transition:box-shadow .18s,border-color .18s,background .18s !important;
}
html[data-theme] .thrs-page-leaves .thrs-leave-select-trigger:hover,
html[data-theme] body:has(.thrs-page-leaves) .thrs-modal-card .thrs-leave-select-trigger:hover {
 border-color:var(--lv18d-gold) !important;
 background:var(--lv18d-raised) !important;
 box-shadow:0 4px 13px rgba(11,42,68,.09) !important;
}
html[data-theme] .thrs-page-leaves .thrs-leave-select-trigger[aria-expanded="true"],
html[data-theme] .thrs-page-leaves .thrs-leave-select-trigger:focus-visible,
html[data-theme] body:has(.thrs-page-leaves) .thrs-modal-card .thrs-leave-select-trigger[aria-expanded="true"],
html[data-theme] body:has(.thrs-page-leaves) .thrs-modal-card .thrs-leave-select-trigger:focus-visible {
 border-color:var(--lv18d-gold) !important;
 outline:none !important;box-shadow:var(--lv18d-ring) !important;
}
html[data-theme] .thrs-leave-select-trigger .thrs-premium-select-trigger__value {
 color:var(--lv18d-ink) !important;
 min-width:0 !important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
 font-size:12px !important;font-weight:760 !important;
}
html[data-theme] .thrs-leave-select-trigger[data-empty="true"] .thrs-premium-select-trigger__value {
 color:var(--lv18d-muted) !important;
}
html[data-theme] .thrs-leave-select-trigger .thrs-premium-select-trigger__chevron {
 flex:0 0 26px !important;
 width:26px !important;height:26px !important;
 border-radius:8px !important;
 background:color-mix(in srgb,var(--lv18d-gold) 11%,var(--lv18d-raised)) !important;
 border:1px solid color-mix(in srgb,var(--lv18d-gold) 32%,var(--lv18d-border)) !important;
 color:var(--lv18d-gold) !important;
}
html[data-theme] body:has(.thrs-page-leaves) .thrs-modal-card .thrs-leave-select-trigger {
 min-height:43px !important;
}
/* Portal listbox renders outside cards and dialogs to avoid clipping. */
html[data-theme] .thrs-leave-select-popup {
 position:fixed !important;z-index:6350 !important;
 background:linear-gradient(158deg,var(--lv18d-bg),var(--lv18d-raised)) !important;
 color:var(--lv18d-ink) !important;
 border:1px solid color-mix(in srgb,var(--lv18d-gold) 40%,var(--lv18d-border)) !important;
 border-radius:16px !important;
 box-shadow:var(--lv18d-shadow) !important;
 overflow:hidden !important;
 direction:inherit !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-popup__head{
 border-bottom:1px solid var(--lv18d-border) !important;
 background:color-mix(in srgb,var(--lv18d-gold) 4%,var(--lv18d-bg)) !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-popup__head strong {
 font-size:12px !important;font-weight:880 !important;
 color:var(--lv18d-ink) !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-popup__head span {
 background:color-mix(in srgb,var(--lv18d-gold) 12%,var(--lv18d-bg)) !important;
 color:var(--lv18d-gold) !important;
 border-color:color-mix(in srgb,var(--lv18d-gold) 37%,var(--lv18d-border)) !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-search {
 background:var(--lv18d-bg) !important;color:var(--lv18d-ink) !important;
 -webkit-text-fill-color:var(--lv18d-ink) !important;
 border:1px solid var(--lv18d-border) !important;
 border-radius:10px !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-search::placeholder {
 color:var(--lv18d-muted) !important;
 -webkit-text-fill-color:var(--lv18d-muted) !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-search:focus {
 border-color:var(--lv18d-gold) !important;
 box-shadow:var(--lv18d-ring) !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-popup__list {
 scrollbar-color:var(--lv18d-gold) transparent;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-option {
 color:var(--lv18d-ink) !important;
 background:transparent !important;
 border-radius:10px !important;
 border:1px solid transparent !important;
 font-size:12px !important;font-weight:700 !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-option:is(:hover,.is-highlighted,:focus-visible){
 background:var(--lv18d-hover) !important;
 border-color:var(--lv18d-border) !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-option[aria-selected="true"]{
 background:color-mix(in srgb,var(--lv18d-gold) 14%,var(--lv18d-raised)) !important;
 border:1px solid color-mix(in srgb,var(--lv18d-gold) 53%,var(--lv18d-border)) !important;
 font-weight:900 !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-option[aria-selected="true"]::after{
 color:#122c45 !important;
 background:linear-gradient(130deg,#f9dfad,#d5a65c) !important;
 box-shadow:0 2px 7px rgba(128,83,30,.12) !important;
}
html[data-theme] .thrs-leave-select-popup .thrs-premium-select-no-results {
 color:var(--lv18d-muted) !important;
}

/* The Leave status select is a direct child of an existing flex toolbar.
   Match its original 200px field footprint; do not move neighboring search. */
html[data-theme] .thrs-page-leaves>div:has(>input.form-input):has(>select.form-select)>.thrs-leave-select-trigger{
 width:200px !important;
 max-width:100% !important;
 flex:0 1 200px !important;
}
html[data-theme] .thrs-page-leaves>div:has(>input.form-input):has(>select.form-select)>select.thrs-leave-select-native{
 max-width:1px !important;
}
html[data-theme] body:has(.thrs-page-leaves) .thrs-modal-card .thrs-leave-select-trigger{
 min-height:45px !important;
}
/* Keep the existing browser-validated required leave type as a focusable
   one-pixel native source; all selection events are forwarded to React. */
@media(max-width:600px){
 html[data-theme] .thrs-page-leaves>div:has(>input.form-input):has(>select.form-select)>.thrs-leave-select-trigger{
  flex:1 1 200px !important;
 }
}
