/* v620: GLOBAL dropdown menu for every <select> (see js/297). v619: booking-status dropdown = custom menu (popover on desktop/iPad, bottom sheet on phones). Remove this link + js/297 to roll back to the native <select>. */
/* the native select stays in the DOM (it carries the onchange) but no longer receives pointer events; the badge opens our menu instead */
.avl-status-badge.is-editable>select,.avl-detail-status.is-editable>select,.ucx-status.is-editable>select,
.avl-status-badge .avl-status-overlay-select{pointer-events:none!important}
.avl-status-badge.is-editable,.avl-detail-status.is-editable,.ucx-status.is-editable{cursor:pointer;-webkit-tap-highlight-color:transparent}
.avl-status-badge.sm-open .avl-status-caret,.avl-detail-status.sm-open .avl-status-caret,.ucx-status.sm-open .ucx-caret{transform:translateY(-50%) rotate(180deg)}
.avl-status-caret,.ucx-caret{transition:transform .2s cubic-bezier(.2,.8,.2,1)}

.sm-layer{position:fixed;inset:0;z-index:2147483600;pointer-events:none}
.sm-layer.is-on{pointer-events:auto}
.sm-backdrop{position:absolute;inset:0;background:rgba(8,20,38,.0);transition:background .22s ease}
.sm-layer.is-sheet.is-on .sm-backdrop{background:rgba(8,20,38,.45);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}

.sm-menu{--sm-bg:#fff;--sm-ink:#0B2038;--sm-mut:#6B7A8D;--sm-line:rgba(11,32,56,.09);--sm-hover:#F3F6FA;--sm-gold:#CEA577;
  position:absolute;min-width:208px;max-width:calc(100vw - 16px);box-sizing:border-box;padding:6px;
  background:var(--sm-bg);color:var(--sm-ink);border:1px solid var(--sm-line);border-radius:16px;
  box-shadow:0 18px 44px -12px rgba(11,32,56,.36),0 4px 12px rgba(11,32,56,.10);
  opacity:0;transform:translateY(-6px) scale(.96);transform-origin:var(--sm-ox,50%) var(--sm-oy,0);
  transition:opacity .16s ease,transform .2s cubic-bezier(.2,.9,.25,1.1);font-family:inherit;outline:0}
.sm-layer.is-on .sm-menu{opacity:1;transform:none}
.sm-head{display:none}
.sm-list{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}
.sm-list{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.sm-item{display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;border:0;background:transparent;color:inherit;
  font:inherit;font-size:12.5px;font-weight:800;letter-spacing:.35px;text-align:left;padding:8px 10px;border-radius:11px;cursor:pointer;
  position:relative;transition:background .12s ease,transform .12s ease}
.sm-item:hover,.sm-item.is-focus{background:var(--sm-hover)}
.sm-item:active{transform:scale(.985)}
.sm-ic{flex:none;width:26px;height:26px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-size:11px;background:var(--bg);color:var(--fg);box-shadow:0 0 0 1px var(--bd) inset}
.sm-lbl{flex:1;min-width:0;white-space:nowrap}
.sm-chk{flex:none;width:18px;height:18px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-size:9px;background:var(--sm-gold);color:#fff;opacity:0;transform:scale(.4);transition:opacity .15s,transform .2s cubic-bezier(.2,.9,.3,1.4)}
.sm-item.is-current{background:linear-gradient(90deg,color-mix(in srgb,var(--fg) 9%,transparent),transparent)}
.sm-item.is-current .sm-chk{opacity:1;transform:none}
.sm-item.is-current::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:3px;border-radius:3px;background:var(--fg)}
.sm-sep{height:1px;margin:3px 8px;background:var(--sm-line)}

/* colour keys = same palette as the pill (css/22) */
.sm-item[data-k=vacant]{--bg:#EAF2F8;--fg:#365D84;--bd:#D7DEE7}
.sm-item[data-k=booked]{--bg:#F1C84B;--fg:#7A5600;--bd:#E7C86B}
.sm-item[data-k=booked] .sm-ic,.sm-item[data-k=contracted] .sm-ic,.sm-item[data-k=deposit] .sm-ic,.sm-item[data-k=leased] .sm-ic,.sm-item[data-k=on-hold] .sm-ic,.sm-item[data-k=out-of-market] .sm-ic{color:#fff}
.sm-item[data-k=contracted]{--bg:#36A269;--fg:#177245;--bd:#9FD2B2}
.sm-item[data-k=deposit]{--bg:#E67E22;--fg:#9C5210;--bd:#F0B27A}
.sm-item[data-k=leased]{--bg:#D9534F;--fg:#A62F27;--bd:#F1A9A0}
.sm-item[data-k=on-hold]{--bg:#E4BE75;--fg:#8A5A0A;--bd:#E4BE75}
.sm-item[data-k=out-of-market]{--bg:#98A2B3;--fg:#667085;--bd:#D1D5DB}
.sm-item[data-k=vacant] .sm-ic{box-shadow:0 0 0 1px #D7DEE7 inset}

[data-theme="dark"] .sm-menu{--sm-bg:#18222F;--sm-ink:#EAEEF3;--sm-mut:#98A3B3;--sm-line:rgba(255,255,255,.10);--sm-hover:#223044;
  box-shadow:0 20px 48px -10px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.04)}
[data-theme="dark"] .sm-item[data-k=vacant] .sm-ic{background:#2A3B52;color:#9CC0E4}

/* phones: bottom sheet */
.sm-layer.is-sheet .sm-menu{left:0;right:0;bottom:0;top:auto;width:100%;min-width:0;max-width:none;border-radius:22px 22px 0 0;border-bottom:0;
  padding:8px 12px calc(14px + env(safe-area-inset-bottom,0px));transform:translateY(100%);opacity:1;
  transition:transform .3s cubic-bezier(.22,.9,.25,1);box-shadow:0 -14px 40px rgba(8,20,38,.28)}
.sm-layer.is-sheet.is-on .sm-menu{transform:none}
.sm-layer.is-sheet .sm-head{display:block;text-align:center;padding:2px 0 8px}
.sm-grab{display:block;width:40px;height:4px;border-radius:4px;background:var(--sm-line);margin:2px auto 10px;background:rgba(11,32,56,.18)}
[data-theme="dark"] .sm-grab{background:rgba(255,255,255,.25)}
.sm-ttl{font-size:13px;font-weight:800;color:var(--sm-ink);letter-spacing:.2px}
.sm-sub{font-size:11.5px;color:var(--sm-mut);margin-top:2px;font-weight:600}
.sm-layer.is-sheet .sm-item{font-size:15px;padding:12px 12px;border-radius:14px;gap:14px;min-height:52px}
.sm-layer.is-sheet .sm-ic{width:34px;height:34px;font-size:14px}
.sm-layer.is-sheet .sm-chk{width:22px;height:22px;font-size:11px}
.sm-layer.is-sheet .sm-list{gap:4px}

/* neutral (non-status) selects */
.sm-item.sm-plain{font-size:13.5px;font-weight:600;letter-spacing:0;padding:9px 12px}
.sm-item.sm-plain .sm-lbl{white-space:normal;overflow-wrap:anywhere;line-height:1.3}
.sm-item.sm-plain.is-current{color:var(--sm-ink);font-weight:800;--fg:var(--sm-gold)}
.sm-item.is-placeholder{color:var(--sm-mut);font-style:italic;font-weight:500}
.sm-item.is-disabled,.sm-item[disabled]{opacity:.38;cursor:not-allowed}
.sm-item[hidden],.sm-group[hidden],.sm-none[hidden]{display:none}
.sm-group{padding:10px 12px 4px;font-size:10.5px;font-weight:800;letter-spacing:.9px;text-transform:uppercase;color:var(--sm-mut)}
.sm-none{padding:16px;text-align:center;color:var(--sm-mut);font-size:13px}
.sm-find{position:relative;margin:2px 2px 6px}
.sm-find i{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:12px;color:var(--sm-mut);pointer-events:none}
.sm-search{width:100%;box-sizing:border-box;height:38px;border-radius:11px;border:1px solid var(--sm-line);background:var(--sm-hover);color:var(--sm-ink);
  padding:0 12px 0 34px;font:inherit;font-size:14px;outline:0;-webkit-appearance:none;appearance:none}
.sm-search:focus{border-color:var(--sm-gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--sm-gold) 25%,transparent)}
.sm-layer.is-sheet .sm-search{height:44px;font-size:16px}
.sm-layer.is-sheet .sm-list{max-height:min(58vh,440px)}
.sm-layer.is-sheet .sm-item.sm-plain{font-size:16px;min-height:48px}
@media (prefers-reduced-motion:reduce){.sm-menu,.sm-backdrop,.sm-chk,.avl-status-caret,.ucx-caret{transition:none!important}}

/* v621: phones/small screens - the list drops from the field itself (no bottom sheet); only bigger touch targets */
.sm-layer.is-touch .sm-menu{min-width:min(220px,calc(100vw - 16px));border-radius:14px}
.sm-layer.is-touch .sm-item{font-size:14.5px;min-height:44px;padding:10px 12px;gap:12px}
.sm-layer.is-touch .sm-item.sm-plain{font-size:15px;min-height:44px}
.sm-layer.is-touch .sm-ic{width:30px;height:30px;font-size:13px}
.sm-layer.is-touch .sm-chk{width:20px;height:20px;font-size:10px}
.sm-layer.is-touch .sm-search{height:42px;font-size:16px}
.sm-layer.is-touch .sm-group{padding:10px 12px 4px}
