/* 柔感下拉（select-soft）· 老板端 / 打手端共用
 *
 * 设计取向：把「硬边框 + 系统蓝底选项」换成一层软面。做法是
 *   圆角放大 → 描边降对比并用顶亮底暗的渐变 → 背景半透明 + 模糊 → 阴影柔化扩散
 *   → 面板独立浮层（不再借系统 UI，所以蓝色高亮条彻底消失）→ 动效统一缓出。
 * 只依赖页面已有的 --surface/--line/--text/--accent 等 token，两端不用各写一份。
 *
 * ⚠ 原生 <select> 没有被隐藏，它就是可见的触发器：required 校验、FormData、
 *   既有 change 事件全部照旧；本文件只负责把它「画软」，并给浮层让出右侧箭头位。
 */
.ss{position:relative;display:block}

/* ---------- 收起态：框体 ---------- */
.ss select.ss-on{
  appearance:none;-webkit-appearance:none;
  width:100%;display:block;cursor:pointer;
  min-height:46px;padding:11px 38px 11px 14px;
  font-size:13px;line-height:1.5;color:var(--text);
  border:1px solid transparent;border-radius:14px;
  background:
    linear-gradient(180deg,#1a2740b8,#121d31c4) padding-box,
    linear-gradient(180deg,#ffffff24,#ffffff0a) border-box;
  box-shadow:0 1px 0 #ffffff0f inset,0 6px 18px -12px #000000a8;
  transition:border-radius .18s ease,box-shadow .18s ease,background .18s ease;
}
.ss select.ss-on:hover{
  background:
    linear-gradient(180deg,#1e2d4ac4,#152238cc) padding-box,
    linear-gradient(180deg,#ffffff30,#ffffff10) border-box;
}
.ss select.ss-on:focus-visible,.ss.is-open select.ss-on{
  outline:none;
  background:
    linear-gradient(180deg,#20304fd0,#16243cd0) padding-box,
    linear-gradient(180deg,rgba(var(--accent-rgb),.42),#ffffff12) border-box;
  box-shadow:0 0 0 4px rgba(var(--accent-rgb),.07),0 10px 26px -14px #000000b3;
}
.ss select.ss-on[disabled]{opacity:.5;cursor:not-allowed}
/* 没选东西时不要拿正文色假装「有值」 */
.ss select.ss-on.ss-unset{color:#93a6c0}

.ss .ss-caret{
  position:absolute;right:13px;top:50%;translate:0 -50%;
  width:16px;height:16px;pointer-events:none;color:var(--muted);
  transition:rotate .2s ease,color .2s ease;
}
.ss.is-open .ss-caret{rotate:180deg;color:var(--accent)}

/* ---------- 展开态：浮层面板 ---------- */
.ss-panel{
  position:fixed;z-index:220;
  display:flex;flex-direction:column;gap:8px;
  padding:9px;border-radius:18px;
  border:1px solid #ffffff1f;
  background:linear-gradient(180deg,#18243cf2,#111b2cf5);
  backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);
  box-shadow:0 30px 70px -24px #000000e6,0 0 0 1px #00000040,0 1px 0 #ffffff14 inset;
  transform-origin:top center;
  animation:ssPop .19s cubic-bezier(.22,1,.36,1);
  overflow:hidden;
}
.ss-panel.ss-up{transform-origin:bottom center;animation-name:ssPopUp}
@keyframes ssPop{from{opacity:0;translate:0 -7px;scale:.985 .96}to{opacity:1;translate:0 0;scale:1}}
@keyframes ssPopUp{from{opacity:0;translate:0 7px;scale:.985 .96}to{opacity:1;translate:0 0;scale:1}}

.ss-search{position:relative;flex:none}
.ss-search input{
  width:100%;box-sizing:border-box;
  min-height:40px;padding:9px 12px 9px 34px;
  font-size:13px;color:var(--text);
  border:1px solid #ffffff1a;border-radius:12px;
  background:#0a1220a6;outline:none;
  transition:border-color .16s,box-shadow .16s;
}
.ss-search input:focus{border-color:rgba(var(--accent-rgb),.38);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.06)}
.ss-search input::placeholder{color:#667791}
.ss-search .icon{position:absolute;left:11px;top:50%;translate:0 -50%;width:15px;height:15px;color:var(--muted);pointer-events:none}

.ss-list{
  margin:0;padding:0 3px 0 0;list-style:none;
  overflow-y:auto;overscroll-behavior:contain;
  max-height:min(46vh,340px);scrollbar-width:thin;
}
.ss-opt{
  width:100%;display:flex;align-items:center;gap:10px;text-align:left;
  min-height:44px;padding:9px 11px;margin:2px 0;border:0;border-radius:12px;
  background:transparent;color:var(--text);font-size:13px;line-height:1.45;
  cursor:pointer;transition:background .14s,color .14s;
}
.ss-opt .ss-main{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-opt .ss-sub{display:block;font:10px/1.6 var(--mono);color:var(--quiet);letter-spacing:.3px}
.ss-opt .ss-mark{flex:none;width:16px;height:16px;color:var(--accent);opacity:0;transition:opacity .14s}
.ss-opt i{font-style:normal;color:var(--accent);font-weight:600}
.ss-opt:hover,.ss-opt.is-active{background:#ffffff0d}
/* 占位项（“请选择卡 / 不限 / 全部席位”）：弱色不抢视线，它不是一个真答案 */
.ss-opt.ss-ph{color:var(--quiet)}
.ss-opt.ss-ph:hover{background:#ffffff06}
/* 选中：左侧细条 + 淡底，不铺整条饱和色（系统蓝条就是这么来的） */
.ss-opt.is-sel{background:linear-gradient(90deg,rgba(var(--accent-rgb),.13),rgba(var(--accent-rgb),.03));box-shadow:2px 0 0 0 rgba(var(--accent-rgb),.75) inset}
.ss-opt.is-sel .ss-mark{opacity:1}
.ss-opt[disabled]{opacity:.4;cursor:not-allowed}
.ss-empty{padding:18px 12px;text-align:center;font-size:12px;color:var(--quiet)}
.ss-foot{flex:none;padding:7px 11px 3px;font:9px/1.5 var(--mono);letter-spacing:.6px;color:var(--quiet);border-top:1px solid #ffffff0d}

@media (prefers-reduced-motion:reduce){
  .ss-panel,.ss select.ss-on,.ss .ss-caret,.ss-opt{animation:none;transition:none}
}

/* —— 2026-10-02 老板令：点击/触摸时系统原生的蓝色高亮块（tap highlight）全端关闭 —— */
html{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent}
a,button,input,select,textarea,label,[role="button"],img{-webkit-tap-highlight-color:transparent}
a:focus,button:focus,input:focus,select:focus,textarea:focus,[role="button"]:focus{outline:none}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role="button"]:focus-visible{outline:2px solid rgba(126,197,255,.75);outline-offset:2px}