/* ════════════════════════════════════════════════════════════════════
   Booking · DESKTOP  —  scoped stylesheet
   Source: views/booking/fastboy-booking-v8-fullview-locked.html  <style>
   Every rule scoped under `.booking-desk`.
   Edge-case decisions:
     • :root / html / body (bare)  → collapsed to `.booking-desk`
       (CSS vars + base typography/bg now live on the container).
     • body::before (decorative gradient, position:fixed) → STRIPPED so it
       can't bleed over the rest of the dashboard; handled in embed CSS if needed.
     • @media / @keyframes preludes untouched; selectors inside @media are
       scoped, keyframe selectors (0%/from/to) are not.
   Do NOT hand-edit — regenerate via tools/regenerate-booking.py if the source changes.
   ════════════════════════════════════════════════════════════════════ */

.booking-desk{
  --ink:#1B1B2B;--ink-soft:#6B6A7B;--ink-faint:#9A99AB;
  --line:#ECEAF1;--line-soft:#F2F1F6;
  --purple:#7C3AED;--purple-soft:#F3ECFD;
  --green:#16A06A;--green-soft:#E4F6EE;
  --bg:#F4F2F8;--card:#FFFFFF;
  --acc:#7C3AED;            /* booking accent — changes with theme */
  --acc-soft:#F3ECFD;
  --disp:'Plus Jakarta Sans'; /* preview heading font — changes with theme */
}
.booking-desk *{margin:0;padding:0;box-sizing:border-box}
.booking-desk button,.booking-desk a,.booking-desk [onclick],.booking-desk [role='button']{cursor:pointer}
.booking-desk :disabled,.booking-desk [disabled],.booking-desk [aria-disabled='true']{cursor:not-allowed!important}
.booking-desk{font-family:'Plus Jakarta Sans',sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;min-height:100vh}
.booking-desk .app{position:relative;z-index:1;display:grid;grid-template-columns:1fr;min-height:100vh}

/* MAIN */
.booking-desk .main{padding:20px 26px 28px;min-width:0}

.booking-desk .cols{display:grid;grid-template-columns:minmax(0,1fr) 300px 320px;gap:18px;align-items:start}
.booking-desk .panel.rev{padding:0;overflow:hidden;background:#fff;border:1px solid #E4E1EA;height:min(80vh,760px);min-height:560px}
.booking-desk .proto-frame{display:block;width:100%;height:100%;min-height:0;border:0;border-radius:16px;background:#fff}
.booking-desk .proto-frame.proto-full{position:fixed;inset:0;width:100vw;height:100vh;min-height:0;z-index:99999;border-radius:0}
.booking-desk .panel{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 2px rgba(20,18,30,.03),0 18px 40px -28px rgba(20,18,30,.25)}

/* Customize panel */
.booking-desk .cust{padding:18px}
.booking-desk .cust .ch{display:flex;align-items:flex-start}
.booking-desk .cust h2{font-size:17px;font-weight:800;letter-spacing:-.3px}
.booking-desk .cust .reset{margin-left:auto;display:inline-flex;align-items:center;gap:5px;color:var(--ink-faint);font-size:12.5px;font-weight:600;cursor:pointer}
.booking-desk .cust .reset svg{width:13px;height:13px}
.booking-desk .cust .desc{font-size:13px;color:var(--ink-soft);margin:5px 0 14px;line-height:1.4}
.booking-desk .seg{display:flex;background:var(--line-soft);border-radius:11px;padding:4px;margin-bottom:14px}
.booking-desk .seg button{flex:1;border:0;background:none;font-family:inherit;font-size:13.5px;font-weight:600;color:var(--ink-soft);padding:8px;border-radius:8px;cursor:pointer}
.booking-desk .seg button.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.08)}
.booking-desk .cust .hint{font-size:12.5px;color:var(--ink-soft);line-height:1.45;margin-bottom:14px}
.booking-desk .themes{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.booking-desk .theme{border:1.5px solid var(--line);border-radius:13px;padding:9px;cursor:pointer;position:relative;transition:.15s}
.booking-desk .theme:hover{border-color:#D8D2E6}
.booking-desk .theme.sel{border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 16%,transparent)}
.booking-desk .theme .sw{display:flex;gap:5px;height:46px;margin-bottom:9px}
.booking-desk .theme .sw span{border-radius:8px}
.booking-desk .theme .sw .a{flex:1.5}.booking-desk .theme .sw .b,.booking-desk .theme .sw .c{flex:1}
.booking-desk .theme .nm{font-size:13.5px;font-weight:700;line-height:1.2}
.booking-desk .theme .ty{font-size:11.5px;color:var(--ink-faint);margin-top:1px}
.booking-desk .theme .check{position:absolute;top:-7px;right:-7px;width:22px;height:22px;border-radius:50%;background:var(--acc);display:none;place-items:center;box-shadow:0 3px 7px rgba(0,0,0,.2)}
.booking-desk .theme.sel .check{display:grid}
.booking-desk .theme .check svg{width:12px;height:12px;color:#fff}
/* seasonal theme thumbnails */
.booking-desk .theme .sthumb{height:68px;border-radius:10px;margin-bottom:9px;background-size:cover;background-position:center;position:relative;overflow:hidden}
.booking-desk .theme .sthumb .sparkles{position:absolute;inset:0;opacity:.6}

/* seasonal mode on device screen */
.booking-desk .screen.seasonal{position:relative}
.booking-desk .screen.seasonal::before{content:"";position:absolute;inset:0;z-index:0;background:var(--season-bg,none);background-size:cover;background-position:center;border-radius:inherit}
.booking-desk .screen.seasonal::after{content:"";position:absolute;inset:0;z-index:1;background:var(--season-overlay,rgba(255,255,255,.55));border-radius:inherit}
.booking-desk .screen.seasonal>*{position:relative;z-index:2}
/* glass morphism for LIGHT seasonal themes (Easter, Summer) */
.booking-desk .screen.seasonal .stage{background:transparent}
.booking-desk .screen.seasonal .opt,.booking-desk .screen.seasonal .svc-card{background:rgba(255,255,255,.72);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-color:rgba(255,255,255,.5)}
.booking-desk .screen.seasonal .opt.sel,.booking-desk .screen.seasonal .svc-card.sel{background:rgba(255,255,255,.85)}
.booking-desk .screen.seasonal .date,.booking-desk .screen.seasonal .time{background:rgba(255,255,255,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-color:rgba(22,20,35,.13)}
.booking-desk .screen.seasonal .date.sel{background:#fff;border-color:var(--acc)}
.booking-desk .screen.seasonal .time.sel{background:var(--acc);border-color:var(--acc);color:#fff}
.booking-desk .screen.seasonal .field input,.booking-desk .screen.seasonal .field .fsel,.booking-desk .screen.seasonal .iinput{background:rgba(255,255,255,.75);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-color:rgba(255,255,255,.5)}
.booking-desk .screen.seasonal .foot{background:rgba(255,255,255,.8);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:rgba(255,255,255,.4)}
.booking-desk .screen.seasonal .opt.mini{background:rgba(255,255,255,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.booking-desk .screen.seasonal .selfpay,.booking-desk .screen.seasonal .seatbar,.booking-desk .screen.seasonal .dep-summary{background:rgba(255,255,255,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-color:rgba(255,255,255,.4)}
.booking-desk .screen.seasonal .success{background:rgba(255,255,255,.75);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:16px;margin:3px;padding:24px 7px}
.booking-desk .screen.seasonal .ichip{background:rgba(255,255,255,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.booking-desk .screen.seasonal .pay-chip{background:rgba(255,255,255,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.booking-desk .screen.seasonal .wallet-ready{background:rgba(255,255,255,.7);backdrop-filter:blur(6px)}
.booking-desk .screen.seasonal .card-fields .field input{background:rgba(255,255,255,.8)}
.booking-desk .screen.seasonal .empty{background:rgba(255,255,255,.5);border-radius:14px;margin:10px;backdrop-filter:blur(8px)}
.booking-desk .screen.seasonal .svc-summary{background:rgba(255,255,255,.75);backdrop-filter:blur(8px)}

/* ===== DARK seasonal themes (Christmas, Valentine) ===== */
.booking-desk .screen.seasonal.dark .stage h3{color:#fff}
.booking-desk .screen.seasonal.dark .stage .sub{color:rgba(255,255,255,.65)}
.booking-desk .screen.seasonal.dark .slabel{color:rgba(255,255,255,.6)}
.booking-desk .screen.seasonal.dark .field label,.booking-desk .screen.seasonal.dark .ilabel{color:rgba(255,255,255,.7)}
.booking-desk .screen.seasonal.dark .svc-cat-label{color:rgba(255,255,255,.5)}
/* cards — frosted dark glass */
.booking-desk .screen.seasonal.dark .opt,.booking-desk .screen.seasonal.dark .svc-card{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.15);color:#fff}
.booking-desk .screen.seasonal.dark .opt .nm,.booking-desk .screen.seasonal.dark .svc-nm{color:#fff}
.booking-desk .screen.seasonal.dark .opt .mt,.booking-desk .screen.seasonal.dark .svc-meta{color:rgba(255,255,255,.6)}
.booking-desk .screen.seasonal.dark .svc-meta b{color:#fff}
.booking-desk .screen.seasonal.dark .opt .ic{background:rgba(255,255,255,.1);color:rgba(255,255,255,.8)}
.booking-desk .screen.seasonal.dark .opt .tick{border-color:rgba(255,255,255,.25)}
.booking-desk .screen.seasonal.dark .opt.sel,.booking-desk .screen.seasonal.dark .svc-card.sel{background:rgba(255,255,255,.2);border-color:var(--acc)}
.booking-desk .screen.seasonal.dark .opt.sel .tick{background:var(--acc);border-color:var(--acc)}
.booking-desk .screen.seasonal.dark .svc-tog{border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.5)}
.booking-desk .screen.seasonal.dark .opt.mini{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15);color:#fff}
.booking-desk .screen.seasonal.dark .opt.mini .nm{color:#fff}
/* date/time — dark glass */
.booking-desk .screen.seasonal.dark .date{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15)}
.booking-desk .screen.seasonal.dark .date .dow{color:rgba(255,255,255,.55)}
.booking-desk .screen.seasonal.dark .date .dd{color:#fff}
.booking-desk .screen.seasonal.dark .date .mo{color:rgba(255,255,255,.45)}
.booking-desk .screen.seasonal.dark .date.sel{background:rgba(255,255,255,.2);border-color:var(--acc)}
.booking-desk .screen.seasonal.dark .date.sel .dd{color:#fff}
.booking-desk .screen.seasonal.dark .time{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15);color:#fff}
.booking-desk .screen.seasonal.dark .time.sel{background:var(--acc);border-color:var(--acc);color:#fff}
.booking-desk .screen.seasonal.dark .time.off{opacity:.3;color:rgba(255,255,255,.4)}
/* inputs */
.booking-desk .screen.seasonal.dark .field input,.booking-desk .screen.seasonal.dark .field .fsel,.booking-desk .screen.seasonal.dark .iinput{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15);color:#fff}
.booking-desk .screen.seasonal.dark .field input::placeholder,.booking-desk .screen.seasonal.dark .iinput::placeholder{color:rgba(255,255,255,.35)}
/* chips */
.booking-desk .screen.seasonal.dark .ichip{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.7)}
.booking-desk .screen.seasonal.dark .ichip.on{background:var(--acc);border-color:var(--acc);color:#fff}
.booking-desk .screen.seasonal.dark .stab{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.6)}
.booking-desk .screen.seasonal.dark .stab.on{background:var(--acc);border-color:var(--acc);color:#fff}
/* footer — dark frosted glass, not white */
.booking-desk .screen.seasonal.dark .foot{background:rgba(20,18,14,.7);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-color:rgba(255,255,255,.08)}
.booking-desk .screen.seasonal.dark .foot-info span{color:rgba(255,255,255,.75)}
.booking-desk .screen.seasonal.dark .btn.ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.8)}
.booking-desk .screen.seasonal.dark .btn.primary{box-shadow:0 8px 20px -8px rgba(0,0,0,.5)}
/* deposit/payment */
.booking-desk .screen.seasonal.dark .dep-summary{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12)}
.booking-desk .screen.seasonal.dark .dep-row{color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.1)}
.booking-desk .screen.seasonal.dark .dep-row b{color:#fff}
.booking-desk .screen.seasonal.dark .dep-due span{color:rgba(255,255,255,.5)}
.booking-desk .screen.seasonal.dark .dep-secure{color:rgba(255,255,255,.4);border-color:rgba(255,255,255,.08)}
.booking-desk .screen.seasonal.dark .pay-chip{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.7)}
.booking-desk .screen.seasonal.dark .pay-chip.on{background:var(--acc);border-color:var(--acc);color:#fff}
.booking-desk .screen.seasonal.dark .card-fields .field input{background:rgba(255,255,255,.1);color:#fff}
.booking-desk .screen.seasonal.dark .wallet-ready{background:rgba(22,160,106,.15);color:#5EE0A8}
.booking-desk .screen.seasonal.dark .selfpay{background:rgba(255,255,255,.08);color:rgba(255,255,255,.7)}
.booking-desk .screen.seasonal.dark .seatbar{background:rgba(255,255,255,.08)}
.booking-desk .screen.seasonal.dark .seatbar .big{color:var(--acc)}
.booking-desk .screen.seasonal.dark .seatbar small{color:rgba(255,255,255,.5)}
.booking-desk .screen.seasonal.dark .stepper button{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15);color:#fff}
/* success */
.booking-desk .screen.seasonal.dark .success{background:rgba(20,18,14,.65)}
.booking-desk .screen.seasonal.dark .success h3{color:#fff}
.booking-desk .screen.seasonal.dark .success>p{color:rgba(255,255,255,.6)}
.booking-desk .screen.seasonal.dark .summary{border-color:rgba(255,255,255,.1)}
.booking-desk .screen.seasonal.dark .summary .r{border-color:rgba(255,255,255,.08);color:rgba(255,255,255,.8)}
.booking-desk .screen.seasonal.dark .summary .r span{color:rgba(255,255,255,.5)}
.booking-desk .screen.seasonal.dark .summary .r b{color:#fff}
.booking-desk .screen.seasonal.dark .sbtns .btn.ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.7)}
/* empty state */
.booking-desk .screen.seasonal.dark .empty{background:rgba(255,255,255,.05);color:rgba(255,255,255,.4)}
.booking-desk .screen.seasonal.dark .empty svg{color:rgba(255,255,255,.3)}
.booking-desk .screen.seasonal.dark .svc-summary{background:rgba(255,255,255,.1);color:var(--acc)}
/* insurance elig */
.booking-desk .screen.seasonal.dark .elig{background:rgba(22,160,106,.12);color:#5EE0A8}

/* Booking review panel */
.booking-desk .rev{padding:18px}
.booking-desk .rev .rh{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.booking-desk .rev h2{font-size:17px;font-weight:800;letter-spacing:-.3px;flex:none}
.booking-desk .viewtog{margin-left:auto;display:flex;gap:6px;background:#fff;border:1px solid var(--line);border-radius:11px;padding:4px}
.booking-desk .viewtog button{display:inline-flex;align-items:center;justify-content:center;border:0;background:none;font-family:inherit;padding:8px 11px;border-radius:8px;cursor:pointer;color:var(--ink-soft)}
.booking-desk .viewtog button svg{width:16px;height:16px}
.booking-desk .viewtog button.on{background:#23222F;color:#fff}

/* business catalog — vertical nav list in the left sidebar (compact) */
.booking-desk .bizpick{margin-bottom:2px}
.booking-desk .catlabel{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--ink-faint);margin:8px 2px 2px}
.booking-desk .catlabel:first-child{margin-top:0}
.booking-desk .chiprow{display:flex;flex-direction:column;gap:0}
.booking-desk .bchip{width:100%;border:0;background:none;border-radius:8px;padding:5px 10px;font-size:12.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;transition:.14s;display:flex;align-items:center;gap:8px;text-align:left;line-height:1.15}
.booking-desk .bchip::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.32;flex:none}
.booking-desk .bchip:hover{background:var(--line-soft);color:var(--ink)}
.booking-desk .bchip.on{background:var(--acc-soft);color:var(--acc)}
.booking-desk .bchip.on::before{opacity:1}
.booking-desk .bchip .ins{width:12px;height:12px;opacity:.85;margin-left:auto;flex:none}

/* device frames */
.booking-desk .stage-wrap{display:flex;flex-direction:column;align-items:center;background:linear-gradient(180deg,#F6F4FB,#EFEDF6);border-radius:18px;padding:32px 18px 22px;border:1px solid var(--line)}
.booking-desk .device{position:relative;background:#17171d;transition:width .28s,border-radius .28s,padding .28s;box-shadow:0 40px 80px -40px rgba(20,18,30,.65)}
.booking-desk .device .screen{background:#fff;overflow:hidden;display:flex;flex-direction:column;position:relative}

/* MOBILE — iPhone 15 · 393×852 → scaled to 274×594 screen */
.booking-desk .device.mobile{width:296px;border-radius:50px;padding:11px;box-shadow:0 40px 80px -40px rgba(20,18,30,.65),inset 0 0 0 2px #2c2c36}
.booking-desk .device.mobile .screen{border-radius:39px;height:594px}
.booking-desk .device.mobile .dev-top{padding-top:36px}
/* success screen has no header — add top clearance so centered title clears the notch */
.booking-desk .device.mobile .success{padding-top:40px}
.booking-desk .device.mobile .screen.seasonal .success{margin-top:28px;padding-top:22px}
.booking-desk .device.mobile .foot{padding-bottom:26px}

/* TABLET — iPad 10th gen · 820×1180 → scaled to 416×598 screen */
.booking-desk .device.tablet{width:446px;border-radius:34px;padding:15px;box-shadow:0 40px 80px -40px rgba(20,18,30,.65),inset 0 0 0 2px #2c2c36}
.booking-desk .device.tablet .screen{border-radius:18px;height:598px}
.booking-desk .device.tablet .dev-top{padding-top:22px}

/* DESKTOP — 1280×800 → scaled to ~720×450 screen */
.booking-desk .device.desktop{width:100%;max-width:760px;border-radius:14px;background:#fff;border:1px solid var(--line);padding:0;box-shadow:0 30px 70px -34px rgba(20,18,30,.4)}
.booking-desk .device.desktop .screen{border-radius:0 0 13px 13px;height:450px}
.booking-desk .device.desktop .stage>*{max-width:560px;margin-left:auto;margin-right:auto}
.booking-desk .device.desktop .foot{max-width:592px;margin:0 auto;width:100%}

/* scrollable stage + sticky footer */
.booking-desk .device .screen{display:flex;flex-direction:column}
.booking-desk .device .screen #devtop{flex:none}
.booking-desk .device .screen .stage{flex:1;overflow-y:auto;min-height:0}
.booking-desk .device .screen #devfoot{flex:none;position:sticky;bottom:0;background:#fff;z-index:3}

/* slim scrollbar */
.booking-desk .stage::-webkit-scrollbar{width:4px}
.booking-desk .stage::-webkit-scrollbar-track{background:transparent;margin:8px 0}
.booking-desk .stage::-webkit-scrollbar-thumb{background:rgba(0,0,0,.12);border-radius:4px}
.booking-desk .stage::-webkit-scrollbar-thumb:hover{background:rgba(0,0,0,.22)}
.booking-desk .stage{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.12) transparent}

/* decorations (shown per device) */
.booking-desk .cam,.booking-desk .island,.booking-desk .home,.booking-desk .b-vol1,.booking-desk .b-vol2,.booking-desk .b-pow,.booking-desk .chrome{display:none}
.booking-desk .device.tablet .cam{display:block;position:absolute;top:7px;left:50%;transform:translateX(-50%);width:7px;height:7px;border-radius:50%;background:#34343f;z-index:6}
.booking-desk .device.tablet .b-pow{display:block;position:absolute;top:-3px;right:60px;width:48px;height:3px;border-radius:3px;background:#2c2c36}
.booking-desk .device.tablet .b-vol1{display:block;position:absolute;right:-3px;top:66px;width:3px;height:58px;border-radius:3px;background:#2c2c36}
.booking-desk .device.mobile .island{display:block;position:absolute;top:21px;left:50%;transform:translateX(-50%);width:92px;height:25px;border-radius:18px;background:#0a0a0d;z-index:6}
.booking-desk .device.mobile .home{display:block;position:absolute;bottom:15px;left:50%;transform:translateX(-50%);width:116px;height:5px;border-radius:5px;background:rgba(15,15,20,.3);z-index:6}
.booking-desk .device.mobile .b-pow{display:block;position:absolute;right:-3px;top:150px;width:3px;height:66px;border-radius:3px;background:#2c2c36}
.booking-desk .device.mobile .b-vol1{display:block;position:absolute;left:-3px;top:116px;width:3px;height:40px;border-radius:3px;background:#2c2c36}
.booking-desk .device.mobile .b-vol2{display:block;position:absolute;left:-3px;top:164px;width:3px;height:40px;border-radius:3px;background:#2c2c36}
.booking-desk .device.desktop .chrome{display:flex;align-items:center;gap:7px;height:44px;padding:0 15px;background:#F1EFF6;border-bottom:1px solid var(--line);border-radius:14px 14px 0 0}
.booking-desk .chrome .tl{width:11px;height:11px;border-radius:50%}
.booking-desk .chrome .tl.r{background:#FF5F57}.booking-desk .chrome .tl.y{background:#FEBC2E}.booking-desk .chrome .tl.g{background:#28C840}
.booking-desk .chrome .url{flex:1;margin-left:8px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:12px;color:var(--ink-soft);display:flex;align-items:center;gap:7px;max-width:360px}
.booking-desk .chrome .url svg{width:12px;height:12px;color:var(--ink-faint);flex:none}
.booking-desk .devcap{margin-top:16px;font-size:12px;font-weight:600;color:var(--ink-faint)}
.booking-desk .devcap b{color:var(--ink-soft)}
.booking-desk .dev-top{background:linear-gradient(135deg,var(--acc),color-mix(in srgb,var(--acc) 65%,#000));color:#fff;padding:16px 20px 18px}
.booking-desk .dev-top .biz{font-family:var(--disp);font-weight:700;font-size:18px;letter-spacing:-.2px}
.booking-desk .dev-top .sl{font-size:12px;opacity:.85;margin-top:1px}
.booking-desk .prog{position:relative;display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding:0 5px}
.booking-desk .prog::before{content:"";position:absolute;left:10px;right:10px;top:50%;transform:translateY(-50%);height:2px;background:rgba(255,255,255,.3);z-index:0}
.booking-desk .prog .pfill{position:absolute;left:10px;top:50%;transform:translateY(-50%);height:2px;border-radius:2px;background:#fff;z-index:1;transition:width .3s ease}
.booking-desk .prog .st{position:relative;z-index:2}
.booking-desk .prog .st .ball{display:block;width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.35)}
.booking-desk .prog .st.done .ball,.booking-desk .prog .st.cur .ball{background:#fff}
.booking-desk .prog .st.cur .ball{box-shadow:0 0 0 4px rgba(255,255,255,.25)}
.booking-desk .prog-cur{text-align:left;font-size:11.5px;margin-top:10px;opacity:.9}
.booking-desk .prog-cur span{opacity:.8}
.booking-desk .prog-cur b{font-weight:700;opacity:1}

.booking-desk .stage{padding:20px;min-height:0}
.booking-desk .stage h3{font-family:var(--disp);font-size:18px;font-weight:700;letter-spacing:-.3px;margin-bottom:3px}
.booking-desk .stage .sub{font-size:12.5px;color:var(--ink-soft);margin-bottom:15px}
.booking-desk .anim{animation:slide .32s cubic-bezier(.2,.7,.3,1)}
@keyframes slide{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}

.booking-desk .opt{display:flex;align-items:center;gap:13px;border:1.5px solid var(--line);border-radius:14px;padding:14px;margin-bottom:10px;cursor:pointer;transition:.14s;background:#fff}
.booking-desk .opt:hover{border-color:#D8D2E6;transform:translateY(-1px)}
.booking-desk .opt.sel{border-color:var(--acc);background:var(--acc-soft)}
.booking-desk .opt .av{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;font-size:16px;position:relative;overflow:hidden}
.booking-desk .opt .av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.booking-desk .opt .av.round{border-radius:50%}
.booking-desk .opt .ic{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;background:var(--acc-soft);color:var(--acc)}
.booking-desk .opt .ic svg{width:21px;height:21px}
.booking-desk .opt .nm{font-size:14.5px;font-weight:700;line-height:1.2}
.booking-desk .opt .mt{font-size:12px;color:var(--ink-soft);margin-top:2px}
.booking-desk .opt .rt{margin-left:auto;font-size:12px;font-weight:700;color:var(--acc);display:flex;align-items:center;gap:3px}
.booking-desk .opt .rec{display:inline-block;margin-top:6px;font-size:9.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--acc);background:var(--acc-soft);padding:3px 9px;border-radius:20px}
.booking-desk .opt .tick{margin-left:auto;width:22px;height:22px;border-radius:50%;border:2px solid var(--line);flex:none;display:grid;place-items:center}
.booking-desk .opt.sel .tick{background:var(--acc);border-color:var(--acc)}
.booking-desk .opt.sel .tick svg{width:12px;height:12px;color:#fff}
.booking-desk .opt .tick svg{display:none}.booking-desk .opt.sel .tick svg{display:block}

.booking-desk .grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.booking-desk .opt.mini{flex-direction:column;align-items:flex-start;gap:6px;margin:0}
.booking-desk .opt.mini .ic{margin-bottom:2px}

/* date/time */
.booking-desk .dates{display:flex;gap:7px;overflow-x:auto;margin:0 -20px 16px;padding:4px 20px 10px}
.booking-desk .date{border:1.5px solid var(--line);border-radius:11px;padding:8px 0;min-width:48px;text-align:center;cursor:pointer;flex:none;transition:.14s}
.booking-desk .date:hover:not(.sel){border-color:var(--acc)}
.booking-desk .date.sel{border-color:var(--acc);background:var(--acc-soft)}
.booking-desk .date .dow{font-size:10px;color:var(--ink-faint);font-weight:600}
.booking-desk .date .dd{font-size:16px;font-weight:800;margin:1px 0}
.booking-desk .date .mo{font-size:9px;color:var(--ink-faint)}
/* calendar trigger card + bottom-sheet picker */
.booking-desk .date.cal-trigger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:48px;border-style:dashed;color:var(--acc);font-weight:700}
.booking-desk .date.cal-trigger:hover{border-color:var(--acc);background:var(--acc-soft)}
.booking-desk .date.cal-trigger svg{width:18px;height:18px}
.booking-desk .date.cal-trigger .cal-lbl{font-size:9.5px}
.booking-desk .cal-sheet-bg{position:absolute;inset:0;background:rgba(20,18,30,.45);opacity:0;pointer-events:none;transition:opacity .25s;z-index:20;display:flex;align-items:flex-end}
.booking-desk .cal-sheet-bg.show{opacity:1;pointer-events:auto}
.booking-desk .cal-sheet{width:100%;background:#fff;border-radius:22px 22px 0 0;transform:translateY(100%);transition:transform .32s cubic-bezier(.2,.8,.25,1);padding:8px 18px 20px;box-shadow:0 -12px 34px -12px rgba(0,0,0,.3)}
.booking-desk .cal-sheet-bg.show .cal-sheet{transform:none}
.booking-desk .cal-handle{width:40px;height:4px;border-radius:4px;background:var(--line);margin:6px auto 14px}
.booking-desk .cal-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:10px}
.booking-desk .cal-title{font-weight:800;font-size:19px;color:var(--ink);letter-spacing:-.3px}
.booking-desk .cal-navs{display:flex;gap:8px}
.booking-desk .cal-nav{width:38px;height:32px;border-radius:10px;border:0;background:var(--acc);cursor:pointer;color:#fff;display:grid;place-items:center;transition:.14s}
.booking-desk .cal-nav svg{width:15px;height:15px}
.booking-desk .cal-nav:hover{filter:brightness(1.08)}
.booking-desk .cal-nav:disabled{opacity:.35;cursor:not-allowed}
.booking-desk .cal-week{display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:4px}
.booking-desk .cal-week span{text-align:center;font-size:12px;font-weight:700;color:var(--ink);padding:6px 0}
.booking-desk .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.booking-desk .cal-cell{aspect-ratio:1;display:grid;place-items:center;font-size:14px;font-weight:600;border-radius:12px;cursor:pointer;color:var(--ink)}
.booking-desk .cal-cell.empty{visibility:hidden;cursor:default}
.booking-desk .cal-cell:not(.empty):not(.past):hover{background:var(--acc-soft)}
.booking-desk .cal-cell.past{color:var(--ink-faint);opacity:.35;cursor:not-allowed}
.booking-desk .cal-cell.today{box-shadow:inset 0 0 0 1.5px var(--acc);color:var(--acc);font-weight:800}
.booking-desk .cal-cell.sel{background:var(--acc);color:#fff;box-shadow:none;font-weight:800}
.booking-desk .cal-close{width:100%;margin-top:16px;padding:11px;border:0;border-radius:11px;background:var(--line-soft);font-family:inherit;font-weight:700;font-size:13px;cursor:pointer;color:var(--ink)}
.booking-desk .cal-close:hover{background:var(--line)}
.booking-desk .slabel{font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-bottom:9px}
.booking-desk .times{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.booking-desk .time{border:1.5px solid var(--line);border-radius:11px;padding:10px 0;text-align:center;font-size:13px;font-weight:600;cursor:pointer;transition:.14s}
.booking-desk .time:hover:not(.sel):not(.off){background:var(--acc-soft);border-color:var(--acc-soft)}
.booking-desk .time.sel{border-color:var(--acc);background:var(--acc);color:#fff}
.booking-desk .time.off{opacity:.4;text-decoration:line-through;cursor:not-allowed}

/* seats */
.booking-desk .seatbar{background:var(--acc-soft);border-radius:13px;padding:14px;margin-bottom:16px;display:flex;align-items:center;gap:12px}
.booking-desk .seatbar .big{font-family:var(--disp);font-size:24px;font-weight:700;color:var(--acc)}
.booking-desk .seatbar small{font-size:12px;color:var(--ink-soft);display:block}
.booking-desk .stepper{margin-left:auto;display:flex;align-items:center;gap:14px}
.booking-desk .stepper button{width:36px;height:36px;border-radius:10px;border:1.5px solid var(--line);background:#fff;font-size:20px;cursor:pointer;color:var(--ink)}
.booking-desk .stepper b{font-size:18px;min-width:22px;text-align:center}

/* inputs */
.booking-desk .field{margin-bottom:13px}
.booking-desk .field label{font-size:12.5px;font-weight:700;color:var(--ink-soft);display:block;margin-bottom:6px}
.booking-desk .field input{width:100%;border:1.5px solid var(--line);border-radius:11px;padding:12px 14px;font-family:inherit;font-size:14px;outline:0}
.booking-desk .field input:focus{border-color:var(--acc)}
.booking-desk .field .fsel{width:100%;border:1.5px solid var(--line);border-radius:11px;padding:12px 14px;font-family:inherit;font-size:14px;outline:0;background:#fff;color:var(--ink);cursor:pointer}
.booking-desk .field .fsel:focus{border-color:var(--acc)}
.booking-desk .elig{display:flex;align-items:center;gap:8px;background:var(--green-soft);color:var(--green);border-radius:11px;padding:11px 13px;font-size:12.5px;font-weight:700;margin-top:2px}
.booking-desk .elig svg{width:16px;height:16px;flex:none}
.booking-desk .elig.warn{background:var(--amber-soft);color:var(--amber)}
.booking-desk .selfpay{background:var(--acc-soft);border-radius:11px;padding:13px;font-size:12.5px;color:var(--ink-soft);line-height:1.5}

/* footer */
.booking-desk .foot{display:flex;flex-direction:column;gap:9px;padding:13px 20px 15px;border-top:1px solid var(--line)}
.booking-desk .foot-row{display:flex;gap:11px}
.booking-desk .foot-info{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:700;color:var(--acc);padding:0 2px}
.booking-desk .foot-info b{color:var(--acc)}
.booking-desk .btn{flex:1;border:0;border-radius:12px;padding:13px;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:.15s}
.booking-desk .btn.ghost{background:#fff;border:1.5px solid var(--line);color:var(--ink-soft);flex:0 0 auto;padding:13px 20px}
.booking-desk .btn.primary{background:var(--acc);color:#fff;box-shadow:0 10px 22px -10px var(--acc)}
.booking-desk .btn.primary:disabled{opacity:.4;box-shadow:none;cursor:not-allowed}
.booking-desk .btn.primary:hover:not(:disabled){filter:brightness(1.05)}

/* empty */
.booking-desk .empty{padding:60px 20px;text-align:center;color:var(--ink-faint)}
.booking-desk .empty svg{width:46px;height:46px;margin-bottom:14px;opacity:.6}
.booking-desk .empty p{font-size:14px}

/* success */
.booking-desk .success{padding:34px 8px;text-align:center}
.booking-desk .success .chk{width:74px;height:74px;border-radius:50%;background:var(--green-soft);display:grid;place-items:center;margin:0 auto 18px;animation:pop .5s cubic-bezier(.2,.9,.3,1.4)}
@keyframes pop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
.booking-desk .success .chk svg{width:38px;height:38px;color:var(--green)}
.booking-desk .success h3{font-family:var(--disp);font-size:22px;font-weight:700;margin-bottom:5px}
.booking-desk .success>p{font-size:13.5px;color:var(--ink-soft);margin-bottom:20px}
.booking-desk .summary{text-align:left;border:1px solid var(--line);border-radius:14px;padding:4px 11px;margin-bottom:18px}
.booking-desk .summary .r{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 0;border-bottom:1px dashed var(--line);font-size:12px}
.booking-desk .summary .r:last-child{border:0}
.booking-desk .summary .r span{color:var(--ink-soft);white-space:nowrap}
.booking-desk .summary .r b{font-weight:700;text-align:right;white-space:nowrap}
.booking-desk .summary .r.id b{font-family:'Poppins';color:var(--acc)}
.booking-desk .sbtns{display:flex;gap:11px}

/* RIGHT column — Sidebar Information Area */
.booking-desk .rcol{display:flex;flex-direction:column;gap:18px;align-self:stretch}
.booking-desk .promo{padding:18px;display:flex;flex-direction:column;min-height:0}
.booking-desk .promo h2,.booking-desk .activity h2{font-size:16px;font-weight:800;letter-spacing:-.3px}
.booking-desk .promo .sub2{font-size:12.5px;color:var(--ink-soft);margin:3px 0 14px}
/* AI promotion cards (compact, clickable) */
.booking-desk .aicard{border-radius:11px;padding:9px 11px;display:flex;align-items:center;gap:10px;margin-bottom:8px;cursor:pointer;transition:.15s}
.booking-desk .aicard:last-child{margin-bottom:0}
.booking-desk .aicard:hover{transform:translateY(-1px);box-shadow:0 10px 22px -14px rgba(20,18,30,.4)}
.booking-desk .aicard.amber{background:linear-gradient(120deg,#FDEFD8,#FBE4C4)}
.booking-desk .aicard.rose{background:linear-gradient(120deg,#FCE6EC,#FAD7E0)}
.booking-desk .aicard .pic{width:32px;height:32px;border-radius:9px;flex:none;display:grid;place-items:center}
.booking-desk .aicard.amber .pic{background:rgba(232,130,26,.18);color:#C9741A}
.booking-desk .aicard.rose .pic{background:rgba(224,70,122,.18);color:#C73C70}
.booking-desk .aicard .pic svg{width:16px;height:16px}
.booking-desk .aicard .t{flex:1;min-width:0}
.booking-desk .aicard .t b{font-size:12.5px;font-weight:700;display:block;line-height:1.25;color:var(--ink)}
.booking-desk .aicard .cta{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;margin-top:2px}
.booking-desk .aicard.amber .cta{color:#B5680F}
.booking-desk .aicard.rose .cta{color:#B83464}
.booking-desk .aicard .cta svg{width:12px;height:12px}
/* Business Activity */
.booking-desk .activity{padding:18px;display:flex;flex-direction:column;flex:1;min-height:0}
.booking-desk .activity h2{margin-bottom:4px}
.booking-desk .sec-label{font-size:10px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--ink-faint);margin:15px 0 9px}
/* compact booking cards */
.booking-desk .bk{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:10px;padding:7px 10px;margin-bottom:6px;background:#fff}
.booking-desk .bk:last-child{margin-bottom:0}
.booking-desk .bk .av{width:28px;height:28px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;font-size:11px}
.booking-desk .bk .info{flex:1;min-width:0}
.booking-desk .bk .info b{font-size:12.5px;font-weight:700;display:block;line-height:1.2}
.booking-desk .bk .info span{display:block;font-size:11px;color:var(--ink-faint)}
.booking-desk .bk .info .bk-svc{font-size:11.5px;font-weight:600;color:var(--ink);margin:1px 0;line-height:1.3}
.booking-desk .bk .pill{font-size:10px;font-weight:700;padding:2px 8px;border-radius:20px;white-space:nowrap;flex:none}
.booking-desk .bk .pill.ok{background:var(--green-soft);color:var(--green)}
.booking-desk .bk .pill.up{background:var(--acc-soft);color:var(--acc)}
.booking-desk .bk .pill.done{background:#F1EFF6;color:#6B6A7B}
/* today schedule — interactive */
.booking-desk .sched{margin-top:2px}
.booking-desk .slot{display:flex;gap:9px;align-items:flex-start;position:relative}
.booking-desk .slot .tm{width:38px;flex:none;font-size:10.5px;color:var(--ink-faint);font-weight:600;text-align:right;padding-top:9px}
.booking-desk .slot .ev{flex:1;border-radius:10px;padding:8px 11px;margin-bottom:6px;border-left:3px solid;cursor:pointer;transition:.13s;position:relative;user-select:none}
.booking-desk .slot .ev:hover{filter:brightness(.96)}
.booking-desk .slot .ev b{font-size:12.5px;font-weight:700;display:block;line-height:1.25}
.booking-desk .slot .ev span{display:block;font-size:11px;color:var(--ink-soft)}
.booking-desk .slot .ev .ev-svc{font-size:11.5px;font-weight:600;color:var(--ink);margin-top:2px;line-height:1.3}
.booking-desk .slot .ev .ev-time{margin-top:1px}
.booking-desk .ev.past .ev-svc,.booking-desk .ev.ev-done .ev-svc{color:#6B6B76;font-weight:500}
.booking-desk .ev.up .ev-svc{color:#15493A}
.booking-desk .ev.ev-cancel .ev-svc{color:#B0B0B8;text-decoration:line-through}
.booking-desk .ev.past{background:#F1F1F4;border-color:#C6C6CE}
.booking-desk .ev.past b{color:#6B6B76}
.booking-desk .ev.up{background:var(--green-soft);border-color:var(--green)}
.booking-desk .ev.up b{color:#15493A}
.booking-desk .ev.ev-done{background:#F4F4F7;border-color:#C6C6CE;opacity:.7}
.booking-desk .ev.ev-done b{text-decoration:line-through;color:#9A9AAB}
/* ===== Business Activity · Booking Manager mini-app ===== */
.booking-desk .ba-app{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:14px;background:#fff;margin-top:10px;display:flex;flex-direction:column;flex:1;min-height:0}
/* Booking Management header + full-view */
.booking-desk .bm-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:2px}
.booking-desk .bm-fullbtn,.booking-desk .bn-showall{display:inline-flex;align-items:center;gap:4px;padding:6px 11px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:11px;font-weight:700;cursor:pointer;white-space:nowrap;flex:none}
.booking-desk .bm-fullbtn:hover,.booking-desk .bn-showall:hover{background:var(--line-soft);border-color:var(--ink-faint)}
.booking-desk .bm-fullbtn svg,.booking-desk .bn-showall svg{width:12px;height:12px}
.booking-desk .bm-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;background:rgba(20,18,30,.5);padding:24px}
.booking-desk .bm-modal.on{display:flex}
.booking-desk .bm-modal-box{width:min(94vw,1040px);height:min(88vh,720px);background:#fff;border-radius:18px;box-shadow:0 30px 80px rgba(20,16,26,.42);display:flex;flex-direction:column;overflow:hidden}
.booking-desk .bm-modal-h{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line);flex:none}
.booking-desk .bm-modal-h h3{font-size:16px;font-weight:800;letter-spacing:-.3px}
.booking-desk .bm-modal-x{width:30px;height:30px;border-radius:50%;background:#F1EFF5;border:0;display:grid;place-items:center;cursor:pointer;color:var(--ink-soft)}
.booking-desk .bm-modal-x:hover{background:#E7E4ED}
.booking-desk .bm-modal-x svg{width:14px;height:14px}
.booking-desk .bm-slot{flex:1;min-height:0;padding:18px;display:flex}
/* the mini-app stretched to desktop proportions inside the modal */
.booking-desk .ba-app.ba-full{margin-top:0;border:0;border-radius:0;flex:1}
.booking-desk .ba-app.ba-full .ba-scroll,.booking-desk .ba-app.ba-full .ba-cal{padding-left:14px;padding-right:14px}
.booking-desk .ba-app.ba-full .ba-sheet{max-width:520px;left:50%;transform:translateX(-50%) translateY(112%);border-radius:18px 18px 0 0}
.booking-desk .ba-app.ba-full .ba-sheet.on{transform:translateX(-50%) translateY(0)}
.booking-desk #baListView,.booking-desk #baCalView{display:flex;flex-direction:column;flex:1;min-height:0}
.booking-desk .ba-tabs{display:flex;border-bottom:1px solid var(--line)}
.booking-desk .ba-tab{flex:1;text-align:center;padding:11px 0 9px;font-size:13px;font-weight:700;color:var(--ink-faint);cursor:pointer;position:relative}
.booking-desk .ba-tab.on{color:var(--purple)}
.booking-desk .ba-tab.on::after{content:"";position:absolute;left:18%;right:18%;bottom:-1px;height:2px;background:var(--purple);border-radius:2px}
.booking-desk .ba-tools{display:flex;align-items:center;gap:7px;padding:10px}
.booking-desk .ba-date{flex:1;display:flex;align-items:center;gap:7px;min-width:0;border:1px solid var(--line);border-radius:9px;padding:8px 9px;font-size:11.5px;font-weight:600;color:var(--ink);cursor:pointer;background:#fff}
.booking-desk .ba-date svg{width:14px;height:14px;color:var(--ink-soft);flex:none}
.booking-desk .ba-date span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* segmented */
.booking-desk .ba-seg{display:flex;gap:8px;padding:0 10px 10px}
.booking-desk .ba-seg button{flex:1;padding:8px 0;border-radius:9px;font-size:12px;font-weight:700;cursor:pointer;border:1.5px solid transparent;background:#EDEBF1;color:var(--ink-soft);transition:.15s}
.booking-desk .ba-seg button.on{background:#fff;border-color:var(--purple);color:var(--purple)}
/* list */
.booking-desk .ba-scroll{flex:1;min-height:0;overflow-y:auto;padding:0 10px 12px;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.13) transparent}
.booking-desk .ba-scroll::-webkit-scrollbar{width:4px}
.booking-desk .ba-scroll::-webkit-scrollbar-thumb{background:rgba(0,0,0,.13);border-radius:4px}
.booking-desk .ba-month{font-size:12.5px;font-weight:800;color:var(--ink);margin:12px 0 5px}
.booking-desk .ba-month.first{margin-top:2px}
.booking-desk .ba-grp-h{display:flex;align-items:center;justify-content:space-between;font-size:11.5px;font-weight:700;color:var(--ink-soft);padding:7px 2px;cursor:pointer;border-bottom:1px solid var(--line-soft)}
.booking-desk .ba-grp-h svg{width:14px;height:14px;transition:transform .2s}
.booking-desk .ba-grp.closed .ba-grp-h svg{transform:rotate(-180deg)}
.booking-desk .ba-grp.closed .ba-grp-body{display:none}
.booking-desk .ba-grp-body{padding-top:8px}
.booking-desk .ba-row{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:10px;padding:9px 11px 9px 9px;margin-bottom:7px;background:#fff;position:relative;overflow:hidden}
.booking-desk .ba-row::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:4px;border-radius:3px;background:#E8A23D}
.booking-desk .ba-row .ba-main{flex:1;min-width:0;padding-left:5px}
.booking-desk .ba-row .ba-nm{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.booking-desk .ba-row .ba-sub{font-size:11px;color:var(--ink-faint);margin-top:2px}
.booking-desk .ba-row .ba-right{display:flex;flex-direction:column;align-items:flex-end;gap:5px;flex:none}
.booking-desk .ba-row .ba-tm{font-size:12px;font-weight:700;color:var(--ink)}
.booking-desk .ba-badge{font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:20px;white-space:nowrap}
.booking-desk .ba-badge.new{background:#FBEFD3;color:#B7791F}
.booking-desk .ba-badge.confirmed{background:#E4F6EE;color:#16A06A}
.booking-desk .ba-badge.canceled{background:#FBE4E4;color:#D14343}
.booking-desk .ba-badge.done{background:#E6EDFB;color:#3B6FE0}
.booking-desk .ba-badge.edited{background:#EFEEF3;color:#8A8896}
.booking-desk .ba-row.s-confirmed::before{background:#16A06A}
.booking-desk .ba-row.s-canceled::before{background:#D14343}
.booking-desk .ba-row.s-done::before{background:#3B6FE0}
.booking-desk .ba-empty{text-align:center;color:var(--ink-faint);font-size:12px;padding:26px 0}
/* calendar timeline */
.booking-desk .ba-cal{padding:10px 6px 14px;flex:1;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.13) transparent}
.booking-desk .ba-cal::-webkit-scrollbar{width:4px}.booking-desk .ba-cal::-webkit-scrollbar-thumb{background:rgba(0,0,0,.13);border-radius:4px}
.booking-desk .ba-tl{position:relative}
.booking-desk .ba-tlabel{position:absolute;left:0;width:48px;white-space:nowrap;font-size:9.5px;color:var(--ink-faint);font-weight:600;transform:translateY(-6px)}
.booking-desk .ba-tlabel.hr{font-size:11px;color:var(--ink);font-weight:800}
.booking-desk .ba-area{position:absolute;left:54px;right:2px;top:0}
.booking-desk .ba-gl{position:absolute;left:0;right:0;border-top:1px solid var(--line-soft)}
.booking-desk .ba-apt{position:absolute;border-radius:8px;border-left:3px solid;padding:4px 7px;overflow:hidden;cursor:pointer;box-sizing:border-box;transition:filter .12s}
.booking-desk .ba-apt:hover{filter:brightness(.97)}
.booking-desk .ba-apt.green{background:#CBEDDA;border-color:#16A06A}
.booking-desk .ba-apt.gray{background:#E0E0E6;border-color:#AFAFB9}
.booking-desk .ba-apt .ti{font-size:11px;font-weight:700;line-height:1.25;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.booking-desk .ba-apt.compact .ti{-webkit-line-clamp:1}
.booking-desk .ba-apt .sub{display:flex;justify-content:space-between;gap:5px;margin-top:4px;padding-top:4px;border-top:1px solid rgba(0,0,0,.09);color:var(--ink-soft);font-size:9px;font-weight:600}
.booking-desk .ba-apt .sub .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.booking-desk .ba-apt .sub .ph{white-space:nowrap;flex:none}
.booking-desk .ba-now{position:absolute;left:0;right:0;display:flex;align-items:center;z-index:4;pointer-events:none}
.booking-desk .ba-now .dot{width:8px;height:8px;border-radius:50%;background:#F2811C;flex:none;margin-left:-4px}
.booking-desk .ba-now .ln{flex:1;height:2px;background:#F2811C}
/* appointment detail rows */
.booking-desk .ba-dt{display:flex;justify-content:space-between;gap:12px;padding:11px 2px;border-bottom:1px solid var(--line-soft);font-size:13px}
.booking-desk .ba-dt:last-child{border-bottom:0}
.booking-desk .ba-dt span{color:var(--ink-faint)}
.booking-desk .ba-dt b{font-weight:700;color:var(--ink);text-align:right}
/* FAB */
/* ===== bottom sheets ===== */
.booking-desk .ba-mask{position:absolute;inset:0;background:rgba(20,18,30,.42);opacity:0;visibility:hidden;transition:.22s;z-index:20}
.booking-desk .ba-mask.on{opacity:1;visibility:visible}
.booking-desk .ba-sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:18px 18px 0 0;padding:8px 16px 16px;transform:translateY(112%);transition:transform .27s cubic-bezier(.3,.85,.4,1);z-index:21;max-height:90%;overflow-y:auto;scrollbar-width:thin;box-shadow:0 -16px 40px -20px rgba(20,18,30,.4)}
.booking-desk .ba-sheet.on{transform:translateY(0)}
.booking-desk .ba-grab{width:34px;height:4px;border-radius:4px;background:#D8D6DF;margin:2px auto 12px}
.booking-desk .ba-sh-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.booking-desk .ba-sh-h h4{font-size:16px;font-weight:800;letter-spacing:-.3px}
.booking-desk .ba-sh-x{width:26px;height:26px;border-radius:50%;background:#F1EFF5;display:grid;place-items:center;cursor:pointer;color:var(--ink-soft)}
.booking-desk .ba-sh-x svg{width:12px;height:12px}
/* date picker */
.booking-desk .ba-dp-mn{font-size:14px;font-weight:800;margin:12px 0 8px}
.booking-desk .ba-dp-wk,.booking-desk .ba-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}
.booking-desk .ba-dp-wk{font-size:11px;font-weight:600;color:var(--ink-faint);padding-bottom:7px;border-bottom:1px solid var(--line-soft);margin-bottom:4px}
.booking-desk .ba-dp-grid{row-gap:3px}
.booking-desk .ba-dp-d{position:relative;height:34px;display:grid;place-items:center;font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer;border-radius:9px;margin:0 1px}
.booking-desk .ba-dp-d.mut{color:transparent;pointer-events:none}
.booking-desk .ba-dp-d.rng{background:#EFE9FD;border-radius:0;margin:0}
.booking-desk .ba-dp-d.sel{background:var(--purple);color:#fff;border-radius:9px}
.booking-desk .ba-dp-d .cnt{position:absolute;top:0;right:2px;background:#E8503A;color:#fff;font-size:8px;font-weight:700;min-width:13px;height:13px;border-radius:7px;display:grid;place-items:center;padding:0 2px;z-index:2}
.booking-desk .ba-dp-d.today{box-shadow:inset 0 0 0 1.5px var(--purple);color:var(--purple);font-weight:800}
.booking-desk .ba-dp-d.today.sel{box-shadow:none;color:#fff}
.booking-desk .ba-dp-range{text-align:center;font-size:12.5px;font-weight:700;margin:2px 0 8px}
.booking-desk .ba-dp-range b{color:var(--purple)}
.booking-desk .ba-dp-quick{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:9px}
.booking-desk .ba-dp-quick button{padding:8px;border-radius:10px;background:#EFE9FD;color:var(--purple);font-size:12px;font-weight:700;border:0;cursor:pointer}
.booking-desk .ba-dp-quick button.on{background:var(--purple);color:#fff}
.booking-desk .ba-dp-go{width:100%;padding:11px;border-radius:11px;background:var(--purple);color:#fff;font-size:14px;font-weight:700;border:0;cursor:pointer}
.booking-desk #baSheetDate{display:flex;flex-direction:column;overflow:hidden}
.booking-desk #baDP{flex:1;overflow-y:auto;min-height:0;scrollbar-width:thin}
.booking-desk #baDP::-webkit-scrollbar{width:4px}.booking-desk #baDP::-webkit-scrollbar-thumb{background:rgba(0,0,0,.13);border-radius:4px}
.booking-desk .ba-dp-foot{flex:none;border-top:1px solid var(--line-soft);padding-top:10px;margin-top:6px}
.booking-desk .ba-cal-foot{flex:none;display:flex;gap:10px;padding-top:10px;margin-top:6px;border-top:1px solid var(--line-soft)}
.booking-desk .ba-cal-foot button{flex:1;padding:11px;border-radius:11px;font-size:13px;font-weight:700;cursor:pointer;border:0}
.booking-desk .ba-cal-foot .today{background:#EFE9FD;color:var(--purple)}
.booking-desk .ba-cal-foot .go{background:var(--purple);color:#fff}
.booking-desk #baSheetCalDate{display:flex;flex-direction:column;overflow:hidden}
.booking-desk #baCalDP{flex:1;overflow-y:auto;min-height:0;scrollbar-width:thin}
.booking-desk #baCalDP::-webkit-scrollbar{width:4px}.booking-desk #baCalDP::-webkit-scrollbar-thumb{background:rgba(0,0,0,.13);border-radius:4px}
.booking-desk .ev.ev-cancel{background:#FEF2F2;border-color:#FCA5A5;opacity:.65}
.booking-desk .ev.ev-cancel b{text-decoration:line-through;color:#B0B0B8}
.booking-desk .ev-badge{display:inline-block;font-size:9.5px;font-weight:700;padding:1px 6px;border-radius:8px;margin-left:6px;vertical-align:middle}
.booking-desk .ev-badge.done-b{background:#E5E5EC;color:#6B6B76}
.booking-desk .ev-badge.cancel-b{background:#FEE2E2;color:#DC2626}
/* popover menu */
.booking-desk .spop{position:absolute;right:0;top:calc(100% + 3px);background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px -8px rgba(20,18,30,.22);padding:5px;z-index:30;min-width:158px;display:none}
.booking-desk .spop.show{display:block;animation:spopIn .16s cubic-bezier(.2,.8,.3,1.1)}
@keyframes spopIn{from{opacity:0;transform:translateY(6px) scale(.96)}to{opacity:1;transform:none}}
.booking-desk .spop button{display:flex;align-items:center;gap:8px;width:100%;border:0;background:none;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--ink);padding:7px 10px;border-radius:8px;cursor:pointer;text-align:left;transition:.1s}
.booking-desk .spop button:hover{background:var(--line-soft)}
.booking-desk .spop button svg{width:13px;height:13px;flex:none;color:var(--ink-soft)}
.booking-desk .spop hr{border:0;border-top:1px solid var(--line);margin:4px 0}
.booking-desk .spop button.danger{color:#DC2626}
.booking-desk .spop button.danger svg{color:#DC2626}
/* slide-down detail panel */
.booking-desk .ev-detail{overflow:hidden;max-height:0;transition:max-height .25s ease;margin-bottom:0}
.booking-desk .ev-detail.open{max-height:200px;margin-bottom:6px}
.booking-desk .ev-detail-inner{background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 13px;font-size:12px;display:flex;flex-direction:column;gap:7px}
.booking-desk .ev-detail-inner .drow{display:flex;gap:8px;align-items:center;color:var(--ink-soft)}
.booking-desk .ev-detail-inner .drow svg{width:13px;height:13px;flex:none;color:var(--ink-faint)}
.booking-desk .ev-detail-inner .drow b{color:var(--ink);font-weight:600}
.booking-desk .ev-detail-inner .dbtns{display:flex;gap:7px;margin-top:2px}
.booking-desk .ev-detail-inner .dbtns button{flex:1;border:1.5px solid var(--line);background:#fff;border-radius:8px;padding:6px;font-family:inherit;font-size:11.5px;font-weight:700;cursor:pointer;color:var(--ink-soft);transition:.13s}
.booking-desk .ev-detail-inner .dbtns button:hover{border-color:var(--acc);color:var(--acc)}
.booking-desk .ev-detail-inner .dbtns button.red:hover{border-color:#DC2626;color:#DC2626}
.booking-desk .nowline{display:flex;align-items:center;gap:7px;margin:1px 0 7px;padding-left:47px}
.booking-desk .nowline .dot{width:9px;height:9px;border-radius:50%;background:#F2992E;flex:none}
.booking-desk .nowline .ln{flex:1;height:2px;background:#F2992E;border-radius:2px;opacity:.55}
.booking-desk .nowline .lbl{font-size:10px;font-weight:700;color:#E0821A;letter-spacing:.3px}
/* modal */
.booking-desk .modal-bg{position:fixed;inset:0;background:rgba(20,18,30,.45);backdrop-filter:blur(2px);display:none;align-items:center;justify-content:center;z-index:1500;padding:20px}
.booking-desk .modal-bg.show{display:flex}
.booking-desk .modal{background:#fff;border-radius:18px;max-width:380px;width:100%;box-shadow:0 40px 90px -28px rgba(20,18,30,.55);overflow:hidden;animation:mpop .28s cubic-bezier(.2,.8,.3,1.05)}
@keyframes mpop{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
.booking-desk .mhead{padding:18px 20px;display:flex;align-items:flex-start;gap:12px;border-bottom:1px solid var(--line)}
.booking-desk .mhead .pic{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center}
.booking-desk .mhead .pic svg{width:21px;height:21px}
.booking-desk .mhead h3{font-size:16px;font-weight:800;letter-spacing:-.3px;line-height:1.25}
.booking-desk .mhead p{font-size:12.5px;color:var(--ink-soft);margin-top:3px;line-height:1.45}
.booking-desk .mhead .mx{margin-left:auto;flex:none;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;cursor:pointer;color:var(--ink-faint)}
.booking-desk .mhead .mx:hover{background:var(--line-soft)}
.booking-desk .mhead .mx svg{width:16px;height:16px}
.booking-desk .mbody{padding:18px 20px}
.booking-desk .mstats{display:flex;gap:10px;margin-bottom:14px}
.booking-desk .mstat{flex:1;background:var(--acc-soft);border-radius:12px;padding:11px;text-align:center}
.booking-desk .mstat b{font-size:18px;font-weight:800;display:block;color:var(--acc);line-height:1}
.booking-desk .mstat span{font-size:10.5px;color:var(--ink-soft);display:block;margin-top:4px}
.booking-desk .mprev-label{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--ink-faint);margin-bottom:6px}
.booking-desk .mprev{background:var(--line-soft);border-radius:12px;padding:12px 13px;font-size:13px;line-height:1.5;color:var(--ink);margin-bottom:16px}
.booking-desk .mbtns{display:flex;gap:10px}
/* --- plan activation inside promo modal --- */
.booking-desk .mlock{display:flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;color:var(--ink-faint);margin-bottom:12px}
.booking-desk .mlock svg{width:13px;height:13px;flex:none}
.booking-desk .plans{display:flex;flex-direction:column;gap:9px}
.booking-desk .plan{display:flex;align-items:center;gap:11px;border:1.5px solid var(--line);border-radius:13px;padding:12px 13px;cursor:pointer;transition:.14s}
.booking-desk .plan:hover{border-color:var(--acc)}
.booking-desk .plan.on{border-color:var(--acc);background:var(--acc-soft)}
.booking-desk .plan-radio{width:18px;height:18px;border-radius:50%;border:2px solid var(--line);flex:none;display:grid;place-items:center}
.booking-desk .plan.on .plan-radio{border-color:var(--acc)}
.booking-desk .plan.on .plan-radio::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--acc)}
.booking-desk .plan-info{flex:1;min-width:0}
.booking-desk .plan-name{font-size:13.5px;font-weight:700;display:flex;align-items:center;gap:6px;flex-wrap:wrap;line-height:1.2}
.booking-desk .plan-star{color:#F5A623}
.booking-desk .plan-tag{font-size:9px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--acc);background:#fff;border:1px solid var(--acc);padding:1px 6px;border-radius:20px}
.booking-desk .plan.on .plan-tag{background:var(--acc);color:#fff;border-color:var(--acc)}
.booking-desk .plan-staff{font-size:11.5px;color:var(--ink-soft);margin-top:2px}
.booking-desk .plan-price{text-align:right;flex:none}
.booking-desk .plan-price b{font-size:17px;font-weight:800;color:var(--ink)}
.booking-desk .plan-price span{font-size:11px;color:var(--ink-faint)}
.booking-desk .mdone{text-align:center;padding:32px 24px 24px}
.booking-desk .mdone .mdone-ic{width:60px;height:60px;border-radius:50%;background:var(--green-soft);color:var(--green);display:grid;place-items:center;margin:0 auto 14px}
.booking-desk .mdone .mdone-ic svg{width:30px;height:30px}
.booking-desk .mdone h3{font-size:18px;font-weight:800;letter-spacing:-.3px}
.booking-desk .mdone p{font-size:13px;color:var(--ink-soft);margin:7px 0 18px;line-height:1.5}
.booking-desk .substep{display:flex;align-items:center;gap:8px;margin:0 0 14px}
.booking-desk .substep .sdot{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;color:var(--ink-soft);background:#EFEDF5;border:1px solid var(--line);flex:none}
.booking-desk .substep .sdot.on{background:var(--acc);color:#fff;border-color:var(--acc)}
.booking-desk .substep .sline{flex:1;height:2px;background:var(--line);max-width:52px}
.booking-desk .subnote{font-size:13px;color:var(--ink-soft);margin:0 0 16px;line-height:1.45}
.booking-desk .subfield{margin-bottom:14px}
.booking-desk .subfield label{display:block;font-size:13px;font-weight:700;color:var(--ink);margin-bottom:7px}
.booking-desk .subfield input{width:100%;box-sizing:border-box;border:1.5px solid var(--line);background:#F7F6FA;border-radius:11px;padding:13px 14px;font-family:inherit;font-size:13.5px;color:var(--ink);outline:none;transition:.14s}
.booking-desk .subfield input::placeholder{color:var(--ink-faint)}
.booking-desk .subfield input:focus{border-color:var(--acc);background:#fff}
.booking-desk .btn.cta-grad{background:linear-gradient(90deg,#7C3AED,#EC4899);color:#fff;box-shadow:0 10px 22px -10px rgba(124,58,237,.7)}
.booking-desk .fab{position:fixed;right:26px;bottom:24px;width:56px;height:56px;border-radius:50%;background:linear-gradient(150deg,#9B5CF6,#7C3AED);display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 28px -8px rgba(124,58,237,.6);z-index:5}
.booking-desk .fab svg{width:24px;height:24px;color:#fff}
.booking-desk .fab .d{position:absolute;top:5px;right:6px;width:11px;height:11px;border-radius:50%;background:#F23DA0;border:2px solid #fff}

/* intake step */
.booking-desk .ifield{margin-bottom:13px}
.booking-desk .ilabel{font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-bottom:7px}
.booking-desk .ichips{display:flex;flex-wrap:wrap;gap:7px}
.booking-desk .ichip{display:inline-block;border:1.5px solid var(--line);border-radius:20px;padding:7px 14px;font-size:13px;font-weight:600;color:var(--ink-soft);cursor:pointer;transition:.14s;background:#fff;user-select:none}
.booking-desk .ichip:hover{border-color:var(--acc);color:var(--acc)}
.booking-desk .ichip.on{background:var(--acc);border-color:var(--acc);color:#fff}
.booking-desk .iinput{width:100%;border:1.5px solid var(--line);border-radius:11px;padding:11px 14px;font-family:inherit;font-size:13.5px;outline:0;background:#fff;color:var(--ink)}
.booking-desk .iinput:focus{border-color:var(--acc)}
.booking-desk .iinput::placeholder{color:var(--ink-faint)}

/* multi-service: category tabs */
.booking-desk .svc-tabs{display:flex;gap:6px;overflow-x:auto;margin:0 -20px 14px;padding:0 20px 4px;-webkit-overflow-scrolling:touch}
.booking-desk .svc-tabs::-webkit-scrollbar{display:none}
.booking-desk .stab{display:inline-block;white-space:nowrap;border:1.5px solid var(--line);border-radius:20px;padding:6px 13px;font-size:12px;font-weight:600;color:var(--ink-soft);cursor:pointer;transition:.14s;background:#fff;flex:none}
.booking-desk .stab:hover{border-color:var(--acc);color:var(--acc)}
.booking-desk .stab.on{background:var(--acc);border-color:var(--acc);color:#fff}
.booking-desk .svc-cat-label{font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--ink-faint);margin:12px 0 7px}
.booking-desk .svc-cat-label:first-of-type{margin-top:0}
/* multi-service cards */
.booking-desk .svc-card{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);border-radius:13px;padding:11px 13px;margin-bottom:8px;cursor:pointer;transition:.14s;background:#fff}
.booking-desk .svc-card:hover{border-color:#D8D2E6}
.booking-desk .svc-card.sel{border-color:var(--acc);background:var(--acc-soft)}
.booking-desk .svc-info{flex:1;min-width:0}
.booking-desk .svc-nm{font-size:13.5px;font-weight:700;line-height:1.2}
.booking-desk .svc-meta{font-size:11.5px;color:var(--ink-soft);margin-top:2px}
.booking-desk .svc-meta b{color:var(--ink);font-weight:700}
.booking-desk .svc-tog{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--line);flex:none;display:grid;place-items:center;transition:.14s;color:var(--ink-faint)}
.booking-desk .svc-tog svg{width:14px;height:14px}
.booking-desk .svc-tog.on{background:var(--acc);border-color:var(--acc);color:#fff}
/* selected summary bar */
.booking-desk .svc-summary{position:sticky;bottom:0;background:var(--acc-soft);border-radius:11px;padding:10px 14px;font-size:12.5px;font-weight:700;color:var(--acc);text-align:center;margin-top:6px}
.booking-desk .svc-summary b{color:var(--acc)}

/* deposit step */
.booking-desk .dep-summary{border:1.5px solid var(--line);border-radius:13px;padding:4px 14px;margin-bottom:4px}
.booking-desk .dep-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed var(--line);font-size:13px;color:var(--ink)}
.booking-desk .dep-row:last-child{border:0}
.booking-desk .dep-row b{font-weight:700}
.booking-desk .dep-hi{background:var(--acc-soft);margin:0 -14px;padding:10px 14px;border-radius:0}
.booking-desk .dep-hi span,.booking-desk .dep-hi b{color:var(--acc);font-weight:700}
.booking-desk .dep-due span{font-weight:500}
.booking-desk .pay-methods{display:flex;gap:8px;margin-bottom:14px}
.booking-desk .pay-chip{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;border:1.5px solid var(--line);border-radius:11px;padding:10px 6px;font-size:12.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;transition:.14s;background:#fff}
.booking-desk .pay-chip svg{width:17px;height:17px;flex:none}
.booking-desk .pay-chip:hover{border-color:var(--acc);color:var(--acc)}
.booking-desk .pay-chip.on{border-color:var(--acc);background:var(--acc);color:#fff}
.booking-desk .pay-chip.on svg{color:#fff;fill:#fff}
.booking-desk .card-fields{animation:slide .25s cubic-bezier(.2,.7,.3,1)}
.booking-desk .wallet-ready{display:flex;align-items:center;gap:8px;background:var(--green-soft);color:var(--green);border-radius:11px;padding:11px 13px;font-size:12.5px;font-weight:700;margin-bottom:12px}
.booking-desk .wallet-ready svg{width:16px;height:16px;flex:none}
.booking-desk .dep-secure{display:flex;align-items:center;justify-content:center;gap:6px;font-size:11px;font-weight:600;color:var(--ink-faint);margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}
.booking-desk .dep-secure svg{width:13px;height:13px}

/* ===== AI CHAT BOOKING (in-device) ===== */
/* floating trigger bubble inside the preview screen */
.booking-desk .aibubble{position:absolute;right:12px;bottom:88px;z-index:8;display:none;align-items:center;gap:8px;background:linear-gradient(135deg,#9B5CF6,var(--acc));color:#fff;border:0;padding:10px 14px 10px 12px;border-radius:30px;font-family:inherit;font-weight:700;font-size:12.5px;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:0 12px 26px -8px rgba(124,58,237,.6);animation:bubIn .4s cubic-bezier(.2,.8,.3,1.3)}
.booking-desk .aibubble:hover{transform:translateY(-2px)}
.booking-desk .aibubble.dragging{cursor:grabbing;transform:scale(1.04);box-shadow:0 16px 34px -8px rgba(124,58,237,.7)}
/* keep the bubble floating even under the seasonal `.screen.seasonal>*` rule */
.booking-desk .device .screen .aibubble{position:absolute;z-index:9}
/* mobile: collapse to an icon-only round FAB to save space */
.booking-desk .device.mobile .aibubble{padding:0;width:46px;height:46px;border-radius:50%;justify-content:center;gap:0}
.booking-desk .device.mobile .aibubble .ab-label{display:none}
.booking-desk .device.mobile .aibubble svg{width:21px;height:21px}
.booking-desk .aibubble svg{width:18px;height:18px;flex:none}
.booking-desk .aibubble .pdot{position:absolute;top:-3px;right:-2px;width:12px;height:12px;border-radius:50%;background:#F23DA0;border:2px solid #fff}
@keyframes bubIn{from{opacity:0;transform:translateY(10px) scale(.9)}to{opacity:1;transform:none}}

/* chat header */
.booking-desk .chat-head{background:linear-gradient(135deg,var(--acc),color-mix(in srgb,var(--acc) 65%,#000));color:#fff;padding:14px 16px}
.booking-desk .chat-back{display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.16);border:0;color:#fff;font-family:inherit;font-weight:600;font-size:12px;padding:6px 12px;border-radius:20px;cursor:pointer;margin-bottom:12px;transition:.13s}
.booking-desk .chat-back:hover{background:rgba(255,255,255,.3)}
.booking-desk .chat-back svg{width:14px;height:14px}
.booking-desk .chat-id{display:flex;align-items:center;gap:11px}
.booking-desk .chat-ava{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.18);display:grid;place-items:center;flex:none}
.booking-desk .chat-ava svg{width:20px;height:20px;color:#fff}
.booking-desk .chat-ttl{font-family:var(--disp);font-weight:700;font-size:15px;line-height:1.1}
.booking-desk .chat-sub{font-size:11px;opacity:.88;margin-top:3px;display:flex;align-items:center;gap:6px}
.booking-desk .chat-sub::before{content:"";width:6px;height:6px;border-radius:50%;background:#5EE0A8;display:inline-block}

/* messages */
.booking-desk .chat-msgs{padding:16px 14px 10px;display:flex;flex-direction:column;gap:9px}
.booking-desk .msg{max-width:84%;font-size:13px;line-height:1.5;padding:10px 13px;border-radius:16px;overflow-wrap:anywhere;animation:msgIn .26s cubic-bezier(.2,.8,.3,1.1)}
@keyframes msgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.booking-desk .msg.ai{align-self:flex-start;background:#F1EFF6;color:var(--ink);border-bottom-left-radius:5px}
.booking-desk .msg.user{align-self:flex-end;background:var(--acc);color:#fff;border-bottom-right-radius:5px;font-weight:600}
.booking-desk .msg.ai b{color:var(--acc)}
.booking-desk .msg-typing{align-self:flex-start;background:#F1EFF6;border-radius:16px;border-bottom-left-radius:5px;padding:13px 15px;display:flex;gap:4px}
.booking-desk .msg-typing i{width:7px;height:7px;border-radius:50%;background:var(--ink-faint);display:block;animation:td 1s infinite}
.booking-desk .msg-typing i:nth-child(2){animation-delay:.16s}.booking-desk .msg-typing i:nth-child(3){animation-delay:.32s}
@keyframes td{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* in-chat summary card */
.booking-desk .chat-summary{align-self:stretch;background:#fff;border:1.5px solid var(--line);border-radius:14px;padding:3px 14px;margin:3px 0;animation:msgIn .3s}
.booking-desk .chat-summary .cr{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed var(--line);font-size:12.5px}
.booking-desk .chat-summary .cr:last-child{border:0}
.booking-desk .chat-summary .cr span{color:var(--ink-soft)}
.booking-desk .chat-summary .cr b{font-weight:700;text-align:right;color:var(--ink)}
.booking-desk .chat-summary .cr.tot b{color:var(--acc)}

/* footer: quick replies + input */
.booking-desk .chat-foot{padding:10px 12px 14px;border-top:1px solid var(--line);background:#fff}
.booking-desk .qhint{font-size:10px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--ink-faint);margin:0 2px 7px}
.booking-desk .qreplies{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:9px;max-height:124px;overflow-y:auto}
.booking-desk .qchip{border:1.5px solid var(--acc);background:var(--acc-soft);color:var(--acc);border-radius:20px;padding:8px 13px;font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;transition:.13s;white-space:nowrap}
.booking-desk .qchip:hover{background:var(--acc);color:#fff}
.booking-desk .qchip.on{background:var(--acc);color:#fff}
.booking-desk .qchip .qm{opacity:.65;font-weight:500;margin-left:5px}
.booking-desk .qchip.cont{width:100%;justify-content:center;text-align:center;background:var(--acc);color:#fff}
.booking-desk .qchip.cont:disabled{opacity:.45;cursor:not-allowed;background:var(--acc-soft);color:var(--acc)}
.booking-desk .chat-input{display:flex;align-items:center;gap:8px}
.booking-desk .chat-input input{flex:1;min-width:0;border:1.5px solid var(--line);border-radius:22px;padding:11px 15px;font-family:inherit;font-size:13.5px;outline:0;background:#fff;color:var(--ink)}
.booking-desk .chat-input input:focus{border-color:var(--acc)}
.booking-desk .chat-send{width:40px;height:40px;flex:none;border:0;border-radius:50%;background:var(--acc);display:grid;place-items:center;cursor:pointer;box-shadow:0 7px 15px -6px var(--acc)}
.booking-desk .chat-send svg{width:17px;height:17px;color:#fff}
.booking-desk .chat-skip{background:none;border:0;color:var(--ink-faint);font-family:inherit;font-size:12px;font-weight:600;cursor:pointer;padding:6px;text-decoration:underline;flex:none}
.booking-desk .chat-done{display:flex;gap:9px}

/* desktop: undo step-centering so chat aligns left/right */
.booking-desk .device.desktop .stage.chat-msgs>*{max-width:84%;margin-left:0;margin-right:0}
.booking-desk .device.desktop .stage.chat-msgs>.msg.user{margin-left:auto}
.booking-desk .device.desktop .stage.chat-msgs>.chat-summary{max-width:none}

/* seasonal glass adjustments for chat */
.booking-desk .screen.seasonal .chat-msgs{background:transparent}
.booking-desk .screen.seasonal .msg.ai{background:rgba(255,255,255,.8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.booking-desk .screen.seasonal .chat-foot{background:rgba(255,255,255,.85);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:rgba(255,255,255,.4)}
.booking-desk .screen.seasonal .chat-summary{background:rgba(255,255,255,.8);backdrop-filter:blur(8px)}
.booking-desk .screen.seasonal.dark .msg.ai{background:rgba(255,255,255,.14);color:#fff}
.booking-desk .screen.seasonal.dark .msg.ai b{color:#fff}
.booking-desk .screen.seasonal.dark .msg-typing{background:rgba(255,255,255,.14)}
.booking-desk .screen.seasonal.dark .chat-foot{background:rgba(20,18,14,.72);border-color:rgba(255,255,255,.1)}
.booking-desk .screen.seasonal.dark .chat-input input{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);color:#fff}
.booking-desk .screen.seasonal.dark .chat-input input::placeholder{color:rgba(255,255,255,.4)}
.booking-desk .screen.seasonal.dark .chat-summary{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.15)}
.booking-desk .screen.seasonal.dark .chat-summary .cr{border-color:rgba(255,255,255,.1)}
.booking-desk .screen.seasonal.dark .chat-summary .cr span{color:rgba(255,255,255,.6)}
.booking-desk .screen.seasonal.dark .chat-summary .cr b{color:#fff}
.booking-desk .screen.seasonal.dark .chat-skip{color:rgba(255,255,255,.5)}

@media(max-width:1180px){
  .booking-desk .app{grid-template-columns:1fr}
  .booking-desk .cols{grid-template-columns:1fr}
}
/* ===== Booking Notification ===== */
.booking-desk .bn-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:5px}
.booking-desk .bn-h2{font-size:15px;font-weight:800;letter-spacing:-.3px;line-height:1.15;white-space:nowrap}
.booking-desk .bn-sub2{font-size:12px;color:var(--ink-soft);margin:0 0 8px;display:flex;align-items:center;gap:7px;flex-wrap:wrap;line-height:1.3}
.booking-desk .bn-badge{white-space:nowrap;font-size:9.5px;font-weight:800;background:var(--purple-soft);color:var(--purple);padding:3px 8px;border-radius:20px;line-height:1;flex:none}
.booking-desk #bnList{flex:1;min-height:0;overflow-y:auto;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.13) transparent}
.booking-desk #bnList::-webkit-scrollbar{width:4px}
.booking-desk #bnList::-webkit-scrollbar-thumb{background:rgba(0,0,0,.13);border-radius:4px}
.booking-desk .bn-card{position:relative;display:flex;gap:9px;padding:9px 11px;border:1px solid var(--line);border-radius:11px;margin-bottom:6px;background:#fff}
.booking-desk .bn-card:last-child{margin-bottom:0}
.booking-desk .bn-card.read{background:#FBFAFD;border-color:#EEEAF2}
.booking-desk .bn-card.bn-pulse{border-color:var(--purple);animation:bnPulse 1.6s ease-in-out infinite}
@keyframes bnPulse{0%{box-shadow:0 0 0 0 rgba(124,58,237,.32)}70%{box-shadow:0 0 0 9px rgba(124,58,237,0)}100%{box-shadow:0 0 0 0 rgba(124,58,237,0)}}
@media (prefers-reduced-motion:reduce){.booking-desk .bn-card.bn-pulse{animation:none}}
.booking-desk .bn-ico{width:30px;height:30px;flex:none;border-radius:8px;background:var(--purple-soft);color:var(--purple);display:grid;place-items:center}
.booking-desk .bn-ico svg{width:16px;height:16px}
.booking-desk .bn-body{flex:1;min-width:0}
.booking-desk .bn-title{font-size:12.5px;font-weight:800;color:var(--purple);letter-spacing:-.2px}
.booking-desk .bn-text{font-size:11.5px;color:var(--ink-soft);line-height:1.35;margin:2px 0 0;padding-right:11px}
.booking-desk .bn-text b{color:var(--ink);font-weight:700}
.booking-desk .bn-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.booking-desk .bn-ago{font-size:10.5px;color:#9B97A6}
.booking-desk .bn-confirm{background:var(--purple);color:#fff;border:0;border-radius:8px;padding:6px 13px;font-size:11.5px;font-weight:700;cursor:pointer}
.booking-desk .ba-confirm{width:100%;margin-top:16px;background:var(--purple);color:#fff;border:0;border-radius:11px;padding:13px;font-size:14px;font-weight:800;cursor:pointer}
.booking-desk .ba-confirm:hover{filter:brightness(1.07)}
.booking-desk .bn-read svg{width:13px;height:13px;vertical-align:-2px;margin-right:2px}
.booking-desk .bn-confirm:hover{filter:brightness(1.07)}
.booking-desk .bn-read{font-size:11px;font-weight:700;color:#9B97A6;display:inline-flex;align-items:center;gap:3px}
.booking-desk .bn-dot{position:absolute;top:9px;right:10px;width:8px;height:8px;border-radius:50%;background:var(--purple);box-shadow:0 0 0 3px var(--purple-soft)}
.booking-desk .bn-empty{font-size:12px;color:var(--ink-soft);text-align:center;padding:20px 0}
.booking-desk .panel.promo.bn-flash{animation:bnFlash .9s ease}
@keyframes bnFlash{0%{box-shadow:0 0 0 0 rgba(124,58,237,.4)}100%{box-shadow:0 0 0 8px rgba(124,58,237,0)}}
.booking-desk .bn-modal{position:fixed;inset:0;z-index:1000;display:none;align-items:center;justify-content:center;background:rgba(20,18,30,.5);padding:24px}
.booking-desk .bn-modal.on{display:flex}
.booking-desk .bn-modal-box{width:min(94vw,620px);height:min(86vh,680px);background:#fff;border-radius:18px;box-shadow:0 30px 80px rgba(20,16,26,.42);display:flex;flex-direction:column;overflow:hidden}
.booking-desk .bn-modal-h{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);flex:none}
.booking-desk .bn-modal-h h3{font-size:16px;font-weight:800;letter-spacing:-.3px}
.booking-desk .bn-modal-count{font-size:11.5px;color:var(--ink-soft)}
.booking-desk .bn-modal-x{width:30px;height:30px;border-radius:50%;background:#F1EFF5;border:0;display:grid;place-items:center;cursor:pointer;color:var(--ink-soft)}
.booking-desk .bn-modal-x svg{width:14px;height:14px}
.booking-desk .bn-modal-list{flex:1;min-height:0;overflow-y:auto;padding:16px 18px}
/* ===== Booking Details modal (redesigned to match app) ===== */
.booking-desk .bd-modal{position:fixed;inset:0;z-index:1100;display:none;align-items:center;justify-content:center;background:rgba(20,18,30,.5);padding:20px}
.booking-desk .bd-modal.on{display:flex}
.booking-desk .bd-box{width:min(420px,96vw);height:min(90vh,812px);background:#fff;border-radius:22px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(20,16,26,.45)}
.booking-desk .bd-head{display:flex;align-items:center;gap:8px;padding:16px 16px 14px;background:#fff;flex:none;border-bottom:1px solid var(--line)}
.booking-desk .bd-head h3{flex:1;text-align:center;font-size:17px;font-weight:800;color:var(--ink);padding-left:30px}
.booking-desk .bd-body{flex:1;min-height:0;overflow-y:auto;padding:16px}
.booking-desk .bd-title{font-size:20px;font-weight:800;color:var(--ink);margin:0 0 12px}
.booking-desk .bd-datebtn{width:100%;display:flex;align-items:center;justify-content:center;gap:9px;border:1.5px solid var(--purple);background:#fff;color:var(--purple);border-radius:12px;padding:14px;font-size:15px;font-weight:800;cursor:pointer;margin-bottom:16px}
.booking-desk .bd-datebtn svg{width:18px;height:18px}
.booking-desk .bd-sec-lbl{font-size:14px;font-weight:600;color:var(--ink-soft);margin:0 0 8px}
.booking-desk .bd-cust2{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:16px;box-shadow:0 3px 8px rgba(20,16,26,.04)}
.booking-desk .bd-cust2 .nm{font-size:18px;font-weight:800;color:var(--ink)}
.booking-desk .bd-cust2 .ph{display:inline-flex;align-items:center;gap:7px;margin-top:4px;font-size:14px;font-weight:600;color:var(--ink-faint);text-decoration:none}
.booking-desk .bd-cust2 .ph svg{width:16px;height:16px}
.booking-desk .bd-cust2 .ph:hover{color:var(--purple)}
.booking-desk .bd-group{background:#F1EFF5;border-radius:16px;padding:16px}
.booking-desk .bd-group .bd-sec-lbl:first-child{margin-top:0}
.booking-desk .bd-pick{width:100%;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:13px;padding:16px;cursor:pointer;margin-bottom:18px;text-align:left;box-shadow:0 3px 8px rgba(20,16,26,.04)}
.booking-desk .bd-pick-val{flex:1;font-size:17px;font-weight:800;color:var(--ink)}
.booking-desk .bd-chev{width:20px;height:20px;color:var(--ink-soft);flex:none}
.booking-desk .bd-pick-svcinfo{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.booking-desk .bd-pick-svcinfo b{font-size:16px;font-weight:800;color:var(--ink);line-height:1.25}
.booking-desk .bd-pill{align-self:flex-start;background:#EDEBF3;color:var(--ink-soft);font-size:12px;font-weight:700;border-radius:7px;padding:4px 9px}
.booking-desk .bd-pr{font-size:16px;font-weight:800;color:var(--purple)}
.booking-desk .bd-pick-ph{flex:1;font-size:15px;font-weight:700;color:var(--ink-faint)}
.booking-desk .bd-av{width:42px;height:42px;border-radius:11px;background:#A7A4C6;color:#fff;display:grid;place-items:center;font-size:18px;font-weight:800;flex:none;position:relative;overflow:hidden}
.booking-desk .bd-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.booking-desk .bd-av svg{width:24px;height:24px}
.booking-desk .bd-note-in{width:100%;border:1px solid var(--line);border-radius:13px;padding:14px 16px;font-size:14px;font-family:inherit;outline:none;background:#fff}
.booking-desk .bd-note-in:focus{border-color:var(--purple)}
.booking-desk .bd-foot{display:flex;flex-direction:column;gap:10px;padding:14px 16px;background:#fff;flex:none;box-shadow:0 -8px 18px -12px rgba(20,16,26,.18)}
.booking-desk .bd-foot-row{display:flex;gap:10px}
.booking-desk .bd-foot-row button{flex:1;border-radius:12px;padding:13px 6px;font-size:14px;font-weight:800;cursor:pointer;border:1.5px solid}
.booking-desk .bd-btn-save{background:var(--purple);border-color:var(--purple)!important;color:#fff}
.booking-desk .bd-btn-confirm{background:#fff;border-color:#16A37B!important;color:#16A37B}
.booking-desk .bd-btn-cancel{background:#fff;border-color:#E5484D!important;color:#E5484D}
.booking-desk .bd-foot-row button:hover{filter:brightness(1.04)}
.booking-desk .bd-btn-done{width:100%;border:0;background:#2F6BFF;color:#fff;border-radius:12px;padding:14px;font-size:15px;font-weight:800;cursor:pointer}
.booking-desk .bd-btn-done:hover{filter:brightness(1.05)}
/* date picker */
.booking-desk .bd-dp-box{background:#fff;border-radius:24px;display:flex;flex-direction:column;overflow:hidden;width:min(420px,96vw);box-shadow:0 30px 80px rgba(20,16,26,.45)}
.booking-desk .bd-dp-top{background:var(--purple);color:#fff;padding:18px 20px 16px;flex:none}
.booking-desk .bd-dp-top .t{font-size:15px;font-weight:700;opacity:.92}
.booking-desk .bd-dp-nav{display:flex;align-items:center;justify-content:space-between;margin-top:12px}
.booking-desk .bd-dp-nav b{font-size:20px;font-weight:800}
.booking-desk .bd-dp-nav button{width:46px;height:42px;border-radius:11px;border:1.5px solid rgba(255,255,255,.7);background:transparent;color:#fff;font-size:20px;cursor:pointer;display:grid;place-items:center}
.booking-desk .bd-dp-wk{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:14px 14px 4px;flex:none}
.booking-desk .bd-dp-wk span{text-align:center;font-size:13px;font-weight:800;color:var(--ink)}
.booking-desk .bd-dp-wk .we{color:#E5484D}
.booking-desk .bd-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:4px 14px 10px;overflow-y:auto;overflow-x:hidden;min-height:0;align-content:start}
.booking-desk .bd-dp-cell{height:42px;min-width:0;display:grid;place-items:center;border-radius:11px;background:#F1EFF5;font-size:15px;font-weight:700;color:var(--ink);cursor:pointer}
.booking-desk .bd-dp-cell.empty{background:transparent;cursor:default}
.booking-desk .bd-dp-cell.sel{background:var(--purple);color:#fff}
.booking-desk .bd-dp-foot{display:flex;gap:12px;padding:12px 16px 16px;flex:none}
.booking-desk .bd-dp-foot button{flex:1;border-radius:12px;padding:14px;font-size:15px;font-weight:800;cursor:pointer}
.booking-desk .bd-dp-cancel{background:#fff;border:1.5px solid var(--purple);color:var(--purple)}
.booking-desk .bd-dp-ok{background:var(--purple);border:0;color:#fff}
/* time + staff list items */
.booking-desk .bd-opt{display:flex;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--line);border-radius:13px;padding:15px 16px;margin-bottom:10px;cursor:pointer;font-size:16px;font-weight:700;color:var(--ink)}
.booking-desk .bd-opt.un{opacity:.6;cursor:not-allowed;color:var(--ink-faint);background:#FAFAFC}
.booking-desk .bd-opt.un:hover{border-color:var(--line);background:#FAFAFC}
.booking-desk .bd-un{font-size:11.5px;font-weight:800;color:#E5484D;background:#FCEBEC;border-radius:7px;padding:3px 9px}
.booking-desk .bd-opt:hover{border-color:var(--purple);background:#FBFAFE}
.booking-desk .bd-opt.sel{border-color:var(--purple);background:var(--purple-soft);color:var(--purple)}
.booking-desk .bd-staff-item{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:12px 14px;margin-bottom:12px;cursor:pointer;box-shadow:0 3px 8px rgba(20,16,26,.05)}
.booking-desk .bd-staff-item:hover{border-color:var(--purple);background:#FBFAFE}
.booking-desk .bd-staff-item.sel{border-color:var(--purple);background:var(--purple-soft)}
.booking-desk .bd-staff-nm{font-size:16px;font-weight:800;color:var(--ink)}
.booking-desk .bd-svc-inp{cursor:pointer;background:#fff}
.booking-desk .bd-svc-inp:focus{border-color:var(--purple)}
/* ===== Service picker ===== */
.booking-desk .svp-modal{position:fixed;inset:0;z-index:1200;display:none;align-items:center;justify-content:center;background:rgba(20,18,30,.55);padding:20px}
/* framed mode: confine Booking Details + its popups to the mobile phone preview */
.booking-desk .fb-framed{padding:0!important}
.booking-desk .fb-framed>*{width:100%!important;height:100%!important;max-width:none!important;border-radius:26px}
.booking-desk .fb-compact>*{width:min(340px,86vw)!important;height:min(86vh,640px)!important;max-width:none!important}
.booking-desk .svp-modal.on{display:flex}
.booking-desk .svp-box{width:min(440px,96vw);height:min(88vh,740px);background:#fff;border-radius:24px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(20,16,26,.45)}
.booking-desk .svp-head{display:flex;align-items:center;gap:8px;padding:20px 18px 10px;flex:none}
.booking-desk .svp-head h3{flex:1;text-align:center;font-size:18px;font-weight:800;color:var(--ink);padding-left:30px}
.booking-desk .svp-x{width:30px;height:30px;flex:none;border-radius:50%;background:#F1EFF5;border:0;cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}
.booking-desk .svp-x svg{width:14px;height:14px}
.booking-desk .svp-list{flex:1;min-height:0;overflow-y:auto;padding:6px 16px 8px}
.booking-desk .svp-cat{background:#35CFA0;color:#fff;font-weight:800;font-size:16px;letter-spacing:-.2px;padding:15px 18px;border-radius:14px;margin:10px 0 12px}
.booking-desk .svp-item{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--line);border-radius:15px;padding:12px 14px;margin-bottom:12px;cursor:pointer;box-shadow:0 3px 8px rgba(20,16,26,.05)}
.booking-desk .svp-item:hover{border-color:var(--purple);background:#FBFAFE}
.booking-desk .svp-av{width:54px;height:54px;border-radius:13px;background:#A7A4C6;color:#fff;display:grid;place-items:center;font-size:24px;font-weight:800;flex:none}
.booking-desk .svp-info{flex:1;min-width:0}
.booking-desk .svp-nm{font-size:15px;font-weight:800;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.booking-desk .svp-dur{font-size:13px;color:var(--ink-faint);margin-top:3px}
.booking-desk .svp-price{font-size:17px;font-weight:800;color:var(--purple);flex:none}
.booking-desk .svp-search{flex:none;display:flex;align-items:center;gap:10px;margin:6px 16px 18px;background:#F2F0F7;border-radius:15px;padding:13px 16px}
.booking-desk .svp-search svg{width:18px;height:18px;color:var(--purple);flex:none}
.booking-desk .svp-search input{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:15px;color:var(--ink);font-family:inherit}
.booking-desk .svp-empty{text-align:center;color:var(--ink-soft);font-size:13px;padding:30px 0}
/* ===== Full-view calendar (Booking Management) ===== */
.booking-desk .fv-modal{position:fixed;inset:0;z-index:1000;display:none;background:rgba(20,18,30,.5);padding:16px}
.booking-desk .fv-modal.on{display:flex}
.booking-desk .fv-box{margin:auto;width:min(96vw,1260px);height:min(94vh,840px);background:#fff;border-radius:20px;box-shadow:0 30px 80px rgba(20,16,26,.45);display:flex;flex-direction:column;overflow:hidden;position:relative}
.booking-desk .fv-bar{display:flex;align-items:center;gap:10px;padding:13px 16px;flex:none;border-bottom:1px solid var(--line)}
.booking-desk .fv-bar .sp{flex:1}
.booking-desk .fv-btn{display:inline-flex;align-items:center;gap:7px;background:#3B6EF6;color:#fff;border:0;border-radius:11px;padding:10px 14px;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;white-space:nowrap;position:relative}
.booking-desk .fv-btn svg{width:16px;height:16px}
.booking-desk .fv-btn.ghost{background:#fff;color:var(--ink);border:1px solid var(--line)}
.booking-desk .fv-btn.sq{padding:10px}
.booking-desk .fv-nav{display:flex;align-items:center;gap:6px}
.booking-desk .fv-arr{width:34px;height:34px;border-radius:9px;background:#EFEDF4;border:0;cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}
.booking-desk .fv-arr:hover{background:#E5E2EC}.booking-desk .fv-arr svg{width:16px;height:16px}
.booking-desk .fv-today{background:#15808A;color:#fff;border:0;border-radius:9px;padding:9px 15px;font-weight:800;font-size:13px;cursor:pointer}
.booking-desk .fv-today.off{background:#EFEDF4;color:var(--ink-soft)}
.booking-desk .fv-date{display:inline-flex;align-items:center;gap:9px;font-size:16px;font-weight:800;color:var(--ink);cursor:pointer;padding:6px 10px;border-radius:9px;position:relative}
.booking-desk .fv-date:hover{background:#F4F2F8}.booking-desk .fv-date svg{width:18px;height:18px;color:#3B6EF6}
.booking-desk .fv-close{width:34px;height:34px;border-radius:9px;background:#EFEDF4;border:0;cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}
.booking-desk .fv-close:hover{background:#E5E2EC}.booking-desk .fv-close svg{width:16px;height:16px}
.booking-desk .fv-chips{display:flex;gap:8px;flex-wrap:wrap;padding:11px 16px 12px;flex:none}
.booking-desk .fv-chip{font-size:12.5px;font-weight:700;padding:6px 13px;border-radius:999px}
.booking-desk .fv-scroll{flex:1;min-height:0;overflow:auto;position:relative}
.booking-desk .fv-inner{min-width:max-content}
.booking-desk .fv-head{display:flex;position:sticky;top:0;z-index:6;background:#fff;box-shadow:0 1px 0 var(--line)}
.booking-desk .fv-railh{width:72px;flex:none;position:sticky;left:0;z-index:7;background:#fff;display:grid;place-items:center;padding:10px 0}
.booking-desk .fv-clk{width:30px;height:30px;border-radius:50%;background:#6B6878;color:#fff;display:grid;place-items:center}.booking-desk .fv-clk svg{width:16px;height:16px}
.booking-desk .fv-colh{flex:1;min-width:152px;padding:10px 8px 12px}
.booking-desk .fv-colh .card{border:1px solid var(--line);border-top:4px solid;border-radius:12px;padding:13px 8px;font-weight:800;font-size:14px;cursor:pointer;background:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.booking-desk .fv-colh .card:hover{box-shadow:0 4px 12px rgba(20,16,26,.1)}
.booking-desk .fv-body{display:flex;position:relative}
.booking-desk .fv-rail{width:72px;flex:none;position:sticky;left:0;z-index:4;background:#fff}
.booking-desk .fv-railin{position:relative}
.booking-desk .fv-railin .hr{position:absolute;left:0;right:7px;text-align:right;font-size:11.5px;color:var(--ink-faint);transform:translateY(-7px);white-space:nowrap}
.booking-desk .fv-railin .hr.big{font-size:12.5px;font-weight:800;color:var(--ink-soft)}
.booking-desk .fv-col{flex:1;min-width:152px;position:relative;border-left:1px solid var(--line);background:repeating-linear-gradient(to bottom,transparent 0,transparent 159px,#DAD7E2 159px,#DAD7E2 160px),repeating-linear-gradient(to bottom,transparent 0,transparent 39px,#F0EEF4 39px,#F0EEF4 40px)}
.booking-desk .fv-closed,.booking-desk .ba-closed{position:absolute;left:0;right:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(135deg,rgba(120,116,134,.06) 0 7px,rgba(120,116,134,.14) 7px 14px)}
.booking-desk .up-modal{position:fixed;inset:0;background:rgba(18,14,28,.55);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;z-index:1400;padding:20px}
.booking-desk .up-modal.on{display:flex}
.booking-desk .up-box{width:432px;max-width:100%;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 26px 64px rgba(18,14,28,.45);animation:upIn .22s ease}
@keyframes upIn{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.booking-desk .up-hero{position:relative;padding:28px 26px 22px;background:linear-gradient(135deg,#7C3AED,#C026A8);color:#fff;text-align:center}
.booking-desk .up-x{position:absolute;top:14px;right:14px;width:30px;height:30px;border:0;border-radius:9px;background:rgba(255,255,255,.18);color:#fff;cursor:pointer;display:grid;place-items:center}
.booking-desk .up-x svg{width:16px;height:16px}.booking-desk .up-x:hover{background:rgba(255,255,255,.3)}
.booking-desk .up-ic{width:56px;height:56px;margin:0 auto 13px;border-radius:17px;background:rgba(255,255,255,.16);display:grid;place-items:center}
.booking-desk .up-ic svg{width:31px;height:31px;color:#fff}
.booking-desk .up-hero h3{margin:0;font-size:20px;font-weight:800;letter-spacing:-.2px}
.booking-desk .up-hero p{margin:8px auto 0;font-size:13px;opacity:.92;line-height:1.55;max-width:330px}
.booking-desk .up-body{padding:18px 24px 22px}
.booking-desk .up-feat{display:flex;align-items:flex-start;gap:11px;padding:8px 0;font-size:13.5px;color:var(--ink);line-height:1.4}
.booking-desk .up-feat svg{width:18px;height:18px;color:#9333EA;flex:none;margin-top:1px}.booking-desk .up-feat b{font-weight:700}
.booking-desk .up-acts{display:flex;gap:10px;margin-top:0}
.booking-desk .up-acts button{flex:1;padding:13px;border-radius:13px;font-size:14px;font-weight:700;cursor:pointer;border:0}
.booking-desk .up-acts .later{background:#F1EFF5;color:var(--ink-soft)}.booking-desk .up-acts .later:hover{background:#E9E6F0}
.booking-desk .up-acts .go{background:linear-gradient(135deg,#7C3AED,#C026A8);color:#fff;box-shadow:0 10px 22px rgba(124,58,237,.38)}.booking-desk .up-acts .go:hover{filter:brightness(1.05)}
.booking-desk .fv-blk{position:absolute;left:5px;right:5px;border-radius:9px;padding:5px 9px;overflow:hidden;cursor:pointer;color:#1c1830;border-left:3px solid;box-shadow:0 1px 4px rgba(20,16,26,.14)}
.booking-desk .fv-blk .bt{font-size:10.5px;font-weight:700;opacity:.75}
.booking-desk .fv-blk .bn{font-size:12.5px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.booking-desk .fv-blk .bs{font-size:11.5px;opacity:.82;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.booking-desk .fv-blk .bp{font-size:10.5px;opacity:.66;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.booking-desk .fv-now{position:absolute;left:72px;right:0;height:0;border-top:2px solid #E5484D;z-index:5;pointer-events:none}
.booking-desk .fv-now .nd{position:absolute;left:-1px;top:-5px;width:9px;height:9px;border-radius:50%;background:#E5484D}
.booking-desk .fv-fab{position:absolute;right:18px;bottom:18px;width:52px;height:52px;border-radius:50%;background:#3B6EF6;color:#fff;border:0;cursor:pointer;display:grid;place-items:center;box-shadow:0 10px 26px rgba(59,110,246,.45);z-index:9}.booking-desk .fv-fab svg{width:24px;height:24px}
.booking-desk .fv-sbtn{position:absolute;left:50%;transform:translateX(-50%);width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--line);box-shadow:0 6px 16px rgba(20,16,26,.16);cursor:pointer;display:grid;place-items:center;color:#3B6EF6;z-index:9}
.booking-desk .fv-sbtn svg{width:16px;height:16px}.booking-desk .fv-up{top:128px}.booking-desk .fv-down{bottom:14px}
/* popovers */
.booking-desk .fv-pop{position:absolute;z-index:30;top:54px;background:#fff;border-radius:16px;box-shadow:0 20px 56px rgba(20,16,26,.3);border:1px solid var(--line);display:none;width:300px;overflow:hidden}
.booking-desk .fv-pop.on{display:block}
.booking-desk .fv-pop-h{display:flex;align-items:center;gap:10px;padding:13px 14px}
.booking-desk .fv-pop-h .fv-search{flex:1;display:flex;align-items:center;gap:7px;background:#F2F0F7;border-radius:10px;padding:8px 11px}
.booking-desk .fv-pop-h .fv-search svg{width:15px;height:15px;color:var(--ink-faint);flex:none}
.booking-desk .fv-pop-h .fv-search input{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:13px;font-family:inherit;color:var(--ink)}
.booking-desk .fv-save{background:#3B6EF6;color:#fff;border:0;border-radius:10px;padding:9px 15px;font-weight:800;font-size:13px;cursor:pointer}
.booking-desk .fv-save:disabled{background:#E7E5EE;color:#A6A4B4;cursor:default}
.booking-desk .fv-poplist{max-height:330px;overflow-y:auto;padding:0 14px 12px}
.booking-desk .fv-row{display:flex;align-items:center;gap:12px;padding:11px 2px;border-bottom:1px solid var(--line-soft);cursor:pointer}
.booking-desk .fv-row:last-child{border-bottom:0}
.booking-desk .fv-cb{width:22px;height:22px;border-radius:6px;border:2px solid #C9C6D6;flex:none;display:grid;place-items:center;background:#fff}
.booking-desk .fv-cb.on{background:#3B6EF6;border-color:#3B6EF6}
.booking-desk .fv-cb svg{width:13px;height:13px;color:#fff;display:none}.booking-desk .fv-cb.on svg{display:block}
.booking-desk .fv-av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:14px;flex:none;position:relative;overflow:hidden}
.booking-desk .fv-av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.booking-desk .fv-av.un{background:#E7E6EE;color:#9A99AB}.booking-desk .fv-av.un svg{width:18px;height:18px}
.booking-desk .fv-row .nm{flex:1;font-weight:700;font-size:14px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.booking-desk .fv-sdot{width:9px;height:9px;border-radius:50%;flex:none}
.booking-desk .fv-row.head{border-bottom:0;cursor:default;padding-top:2px}
.booking-desk .fv-row .dotlbl{display:flex;align-items:center;gap:10px;flex:1}
.booking-desk .fv-on{color:#3B6EF6;font-weight:800;font-size:12.5px}
/* view menu */
.booking-desk .fv-menu{position:absolute;z-index:30;top:54px;right:0;background:#fff;border-radius:14px;box-shadow:0 18px 50px rgba(20,16,26,.28);border:1px solid var(--line);display:none;padding:8px;min-width:180px}
.booking-desk .fv-menu.on{display:block}
.booking-desk .fv-mi{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;cursor:pointer;font-size:14px;font-weight:700;color:var(--ink)}
.booking-desk .fv-mi:hover{background:#F4F2F8}.booking-desk .fv-mi.on{color:#3B6EF6}
.booking-desk .fv-mi svg{width:18px;height:18px;color:var(--ink-soft)}.booking-desk .fv-mi.on svg{color:#3B6EF6}
.booking-desk .fv-mi .ck{margin-left:auto;color:#3B6EF6;display:none}.booking-desk .fv-mi.on .ck{display:block}
/* date picker */
.booking-desk .fv-dp{position:absolute;z-index:30;top:54px;left:0;background:#fff;border-radius:16px;box-shadow:0 18px 50px rgba(20,16,26,.28);border:1px solid var(--line);display:none;padding:14px;width:312px}
.booking-desk .fv-dp.on{display:block}
.booking-desk .fv-dp-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.booking-desk .fv-dp-h .my{display:flex;gap:30px;font-size:15px;font-weight:800;color:var(--ink)}
.booking-desk .fv-dp-h button{width:30px;height:30px;border-radius:8px;border:0;background:#F1EFF5;cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}
.booking-desk .fv-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.booking-desk .fv-dp-grid .wd{font-size:12px;font-weight:800;color:var(--ink-soft);padding:6px 0}
.booking-desk .fv-dp-grid .dy{padding:8px 0;font-size:13.5px;font-weight:600;color:var(--ink);border-radius:50%;cursor:pointer;position:relative}
.booking-desk .fv-dp-grid .dy:hover{background:#F1EFF5}
.booking-desk .fv-dp-grid .dy.mut{color:#C9C6D6}
.booking-desk .fv-dp-grid .dy.today{background:#E5484D;color:#fff}
.booking-desk .fv-dp-grid .dy .bd{position:absolute;top:5px;right:14px;width:6px;height:6px;border-radius:50%;background:#3B6EF6}
.booking-desk .fv-dp-grid .dy.today .bd{background:#fff}
/* staff profile */
.booking-desk .fv-sp{position:fixed;inset:0;z-index:1300;display:none;background:rgba(20,18,30,.55);padding:18px}
.booking-desk .fv-sp.on{display:flex}
.booking-desk .fv-sp-box{margin:auto;width:min(460px,96vw);max-height:min(90vh,812px);background:#fff;border-radius:22px;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 30px 80px rgba(20,16,26,.45)}
.booking-desk .fv-sp-h{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line);flex:none}
.booking-desk .fv-sp-h h3{font-size:19px;font-weight:800}
.booking-desk .fv-sp-h button{border:0;background:none;cursor:pointer;color:#E5484D}.booking-desk .fv-sp-h button svg{width:22px;height:22px}
.booking-desk .fv-sp-body{padding:20px;overflow-y:auto}
.booking-desk .fv-sp-top{display:flex;align-items:center;gap:18px;margin-bottom:18px}
.booking-desk .fv-sp-ava{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:36px;font-weight:800;flex:none;position:relative;overflow:hidden}
.booking-desk .fv-sp-ava>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.booking-desk .fv-sp-ava .live{position:absolute;right:5px;bottom:5px;width:18px;height:18px;border-radius:50%;background:#16A37B;border:3px solid #fff}
.booking-desk .fv-sp-top h4{font-size:24px;font-weight:800}
.booking-desk .fv-sp-top .av{color:var(--ink-soft);font-size:14px;margin-top:3px}
.booking-desk .fv-sp-stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}
.booking-desk .fv-st{border-radius:16px;padding:16px 18px}
.booking-desk .fv-st .k{font-size:12px;font-weight:800;letter-spacing:.4px}
.booking-desk .fv-st .v{font-size:24px;font-weight:800;margin-top:6px}
.booking-desk .fv-sp-sched h5{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;letter-spacing:.5px;color:var(--ink-soft);margin-bottom:12px}
.booking-desk .fv-sp-sched h5 svg{width:16px;height:16px}
.booking-desk .fv-day{display:flex;align-items:center;gap:14px;border:1px solid var(--line);border-radius:14px;padding:13px 14px;margin-bottom:10px}
.booking-desk .fv-day.off{opacity:.5}
.booking-desk .fv-day .db{width:42px;height:30px;border-radius:9px;background:#F1EFF5;display:grid;place-items:center;font-size:12px;font-weight:800;color:var(--ink-soft);flex:none}
.booking-desk .fv-day.cur .db{background:#3B6EF6;color:#fff}
.booking-desk .fv-day .dn{flex:1;font-size:15px;font-weight:800;color:var(--ink)}
.booking-desk .fv-day .dh{display:flex;align-items:center;gap:8px;color:var(--ink-soft)}
.booking-desk .fv-day .dh .tm{background:#F4F2F8;border-radius:8px;padding:6px 10px;font-size:12px;font-weight:700;color:var(--ink-soft)}
.booking-desk .fv-day .dayoff{font-size:12px;font-weight:800;letter-spacing:.5px;color:var(--ink-faint)}
.booking-desk .fv-sp-foot{display:flex;gap:12px;padding:16px 20px;border-top:1px solid var(--line);flex:none}
.booking-desk .fv-sp-foot button{flex:1;border-radius:13px;padding:14px;font-size:15px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:inherit}
.booking-desk .fv-sp-foot .edit{background:#EFEDF4;border:0;color:var(--ink)}
.booking-desk .fv-sp-foot .block{background:#3B6EF6;border:0;color:#fff}
.booking-desk .fv-sp-foot button svg{width:18px;height:18px}
.booking-desk .ba-apt,.booking-desk .fv-blk{cursor:grab}
.booking-desk .ba-apt.fb-dragging,.booking-desk .fv-blk.fb-dragging{cursor:grabbing;z-index:60;box-shadow:0 14px 30px -10px rgba(20,16,26,.42);opacity:.97}
.booking-desk .fb-flyer{font-family:inherit;box-sizing:border-box;transform-origin:0 0}
@keyframes fbArrive{0%{opacity:0;transform:translateY(-10px) scale(.95)}60%{opacity:1}100%{opacity:1;transform:none}}
.booking-desk .bn-card.fb-arrive{animation:fbArrive .44s cubic-bezier(.2,.8,.3,1.25) both}
@keyframes fbDrop{0%{opacity:0;transform:scale(.84)}55%{opacity:1;transform:scale(1.06)}100%{opacity:1;transform:scale(1)}}
.booking-desk .ba-apt.fb-drop,.booking-desk .fv-blk.fb-drop{animation:fbDrop .55s cubic-bezier(.2,.8,.3,1.3) both;box-shadow:0 0 0 3px rgba(22,160,106,.3),0 10px 24px -8px rgba(22,160,106,.5);z-index:6}
@keyframes fbBadgePop{0%{transform:scale(1)}40%{transform:scale(1.4)}100%{transform:scale(1)}}
.booking-desk .bn-badge.fb-pop{animation:fbBadgePop .46s cubic-bezier(.2,.8,.3,1.5)}

/* =====================================================================
   Booking Details — redesigned to match mockup (image)
   Accent mirrors the Booking Page Review (pink #E8336D)
   ===================================================================== */
.booking-desk .bd-head .bd-back{width:32px;height:32px;flex:none;border-radius:50%;background:#F1EFF5;border:0;cursor:pointer;display:grid;place-items:center;color:var(--ink)}
.booking-desk .bd-head .bd-back:hover{background:#E7E4EE}
.booking-desk .bd-head .bd-back svg{width:18px;height:18px}
.booking-desk .bd-head.bd2-head h3{padding-left:0;padding-right:32px}

.booking-desk .bd2-titlerow{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}
.booking-desk .bd2-biz{font-size:21px;font-weight:800;color:var(--ink);letter-spacing:-.4px;line-height:1.15;min-width:0}
.booking-desk .bd2-badge{font-size:12.5px;font-weight:700;padding:5px 12px;border-radius:999px;white-space:nowrap;flex:none}
.booking-desk .bd2-badge.st-new{background:#FFF1DD;color:#B26A00}
.booking-desk .bd2-badge.st-confirmed{background:#E4F6EF;color:#16A06A}
.booking-desk .bd2-badge.st-canceled{background:#FDEBE6;color:#E5484D}
.booking-desk .bd2-badge.st-done{background:#E7F0FF;color:#2F6BFF}

.booking-desk .bd2-cust{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px 16px;margin-bottom:14px;box-shadow:0 3px 8px rgba(20,16,26,.04)}
.booking-desk .bd2-cust-nm{font-size:16px;font-weight:800;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.booking-desk .bd2-cust-ph{font-size:15px;font-weight:700;color:var(--ink);text-decoration:underline;text-underline-offset:3px;white-space:nowrap;flex:none}
.booking-desk .bd2-cust-ph:hover{color:#E8336D}

.booking-desk .bd2-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:14px;box-shadow:0 3px 8px rgba(20,16,26,.04)}
.booking-desk .bd2-card-h{font-size:16px;font-weight:800;color:var(--ink);margin-bottom:13px}
.booking-desk .bd2-lbl{font-size:13px;font-weight:600;color:var(--ink-soft);margin-bottom:7px}
.booking-desk .bd2-fieldbox{display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:11px;padding:13px 14px;font-size:15px;font-weight:700;color:var(--ink);cursor:pointer;background:#fff;min-width:0;transition:border-color .15s}
.booking-desk .bd2-fieldbox>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.booking-desk .bd2-fieldbox svg{flex:none;width:18px;height:18px;color:var(--ink-soft)}
.booking-desk .bd2-fieldbox:hover{border-color:#E8336D}
.booking-desk .bd2-fieldbox.is-ph>span{color:var(--ink-faint);font-weight:600}
.booking-desk .bd2-chev{width:18px;height:18px;color:var(--ink-soft)}

.booking-desk .bd2-dt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.booking-desk .bd2-field{min-width:0}

.booking-desk .bd2-srow{display:flex;align-items:flex-end;gap:8px;margin-bottom:12px}
.booking-desk .bd2-srow-fields{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:10px}
.booking-desk .bd2-sfield{min-width:0}
.booking-desk .bd2-del{flex:none;width:38px;height:46px;border:0;background:none;cursor:pointer;display:grid;place-items:center;color:#E5484D;border-radius:10px}
.booking-desk .bd2-del:hover{background:#FDEBE6}
.booking-desk .bd2-del svg{width:20px;height:20px}

.booking-desk .bd2-add{width:100%;display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:14px;font-size:15px;font-weight:800;color:var(--ink);background:#fff;cursor:pointer;margin-top:2px;transition:.15s}
.booking-desk .bd2-add:hover{border-color:#E8336D;color:#E8336D}
.booking-desk .bd2-add svg{width:18px;height:18px}

.booking-desk .bd2-note{width:100%;border:1px solid var(--line);border-radius:11px;padding:14px;font-size:14px;font-family:inherit;outline:none;background:#fff;color:var(--ink)}
.booking-desk .bd2-note:focus{border-color:#E8336D}
.booking-desk .bd2-note::placeholder{color:var(--ink-faint)}

.booking-desk .bd2-foot{display:flex;gap:12px}
.booking-desk .bd2-btn{flex:1;border-radius:12px;padding:14px 6px;font-size:15px;font-weight:800;cursor:pointer;border:1.5px solid;font-family:inherit}
.booking-desk .bd2-btn.cancel{background:#fff;border-color:#E5484D;color:#E5484D}
.booking-desk .bd2-btn.cancel:hover{background:#FDEBE6}
.booking-desk .bd2-btn.update{background:#16A06A;border-color:#16A06A;color:#fff}
.booking-desk .bd2-btn.update:hover{filter:brightness(1.06)}

/* ---- Booking-review-style bottom-sheet pickers (date / time / service / staff) ---- */
.booking-desk #svpModal.on,.booking-desk #bdDateModal.on,.booking-desk #bdTimeModal.on,.booking-desk #bdStaffModal.on{align-items:flex-end}
.booking-desk #svpModal .svp-box,.booking-desk #bdTimeModal .svp-box,.booking-desk #bdStaffModal .svp-box,.booking-desk #bdDateModal .bd-dp-box{
  height:auto;max-height:88%;border-radius:22px 22px 0 0;animation:bdSheetUp .26s cubic-bezier(.2,.8,.2,1)}
@keyframes bdSheetUp{from{transform:translateY(24px)}to{transform:none}}
/* keep sheet height auto even when confined to the phone frame */
.booking-desk #svpModal.fb-framed .svp-box,.booking-desk #svpModal.fb-compact .svp-box,
.booking-desk #bdTimeModal.fb-framed .svp-box,.booking-desk #bdTimeModal.fb-compact .svp-box,
.booking-desk #bdStaffModal.fb-framed .svp-box,.booking-desk #bdStaffModal.fb-compact .svp-box,
.booking-desk #bdDateModal.fb-framed .bd-dp-box,.booking-desk #bdDateModal.fb-compact .bd-dp-box{
  height:auto!important;max-height:88%!important;width:100%!important;border-radius:22px 22px 0 0!important}
/* grabber */
.booking-desk #svpModal .svp-box::before,.booking-desk #bdTimeModal .svp-box::before,.booking-desk #bdStaffModal .svp-box::before,.booking-desk #bdDateModal .bd-dp-box::before{
  content:"";display:block;width:42px;height:4px;border-radius:999px;background:#E3E0E8;margin:10px auto 2px;flex:none}

/* service picker → review look */
.booking-desk #svpModal .svp-cat{background:none;color:var(--ink-soft);font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;padding:13px 4px 7px;margin:0;border-radius:0}
.booking-desk #svpModal .svp-item{border-radius:12px;margin-bottom:10px}
.booking-desk #svpModal .svp-item:hover{border-color:#F6C9D8;background:#FDEFF4}
.booking-desk #svpModal .svp-item.sel{border-color:#E8336D;background:#FDEFF4}
.booking-desk #svpModal .svp-av{border-radius:12px;width:52px;height:52px;font-size:22px;background:linear-gradient(135deg,#ff9ec0,#E8336D)}
.booking-desk #svpModal .svp-price{color:#E8336D}
.booking-desk #svpModal .svp-search{background:#F6F3F7}
.booking-desk #svpModal .svp-search svg{color:#E8336D}

/* time picker → grouped slot grid */
.booking-desk #bdTimeModal .bd-slot-group{margin-bottom:16px}
.booking-desk #bdTimeModal .bd-slot-group h5{font-size:11px;font-weight:800;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em;margin:0 0 9px}
.booking-desk #bdTimeModal .bd-slot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.booking-desk #bdTimeModal .bd-slot{border:1px solid var(--line);border-radius:10px;padding:11px 4px;font-size:13px;font-weight:700;text-align:center;cursor:pointer;color:var(--ink);transition:.12s}
.booking-desk #bdTimeModal .bd-slot:hover:not(.dis):not(.on){background:#FDEFF4;border-color:#F6C9D8}
.booking-desk #bdTimeModal .bd-slot.on{background:#E8336D;border-color:#E8336D;color:#fff}
.booking-desk #bdTimeModal .bd-slot.dis{color:#CFCAD3;background:#FAFAFB;cursor:not-allowed;text-decoration:line-through;pointer-events:none}

/* staff picker → review look */
.booking-desk #bdStaffModal .bd-staff-item:hover{border-color:#F6C9D8;background:#FDEFF4}
.booking-desk #bdStaffModal .bd-staff-item.sel{border-color:#E8336D;background:#FDEFF4}
.booking-desk #bdStaffModal .bd-av{border-radius:12px;background:linear-gradient(135deg,#ff9ec0,#E8336D)}
.booking-desk #bdStaffModal .svp-search{background:#F6F3F7}
.booking-desk #bdStaffModal .svp-search svg{color:#E8336D}

/* date picker → review look (white head, pink select) */
.booking-desk #bdDateModal .bd-dp-top{background:#fff;color:var(--ink);padding:4px 18px 6px;flex:none}
.booking-desk #bdDateModal .bd-dp-top .t{color:var(--ink);font-size:17px;font-weight:800;opacity:1}
.booking-desk #bdDateModal .bd-dp-nav b{color:var(--ink);font-size:16px}
.booking-desk #bdDateModal .bd-dp-nav button{width:38px;height:38px;border:1px solid var(--line);color:var(--ink);font-size:18px}
.booking-desk #bdDateModal .bd-dp-nav button:hover{background:var(--line-soft)}
.booking-desk #bdDateModal .bd-dp-cell{background:#F6F3F7}
.booking-desk #bdDateModal .bd-dp-grid{flex:1 1 auto;min-height:0}
.booking-desk #bdDateModal .bd-dp-cell.sel{background:#E8336D;color:#fff}
.booking-desk #bdDateModal .bd-dp-cancel{border-color:#E8336D;color:#E8336D}
.booking-desk #bdDateModal .bd-dp-ok{background:#E8336D}

/* ---- Cancel-booking warning popup ---- */
.booking-desk .bd-warn{position:fixed;inset:0;z-index:1300;display:none;align-items:center;justify-content:center;background:rgba(20,18,30,.5);padding:24px}
.booking-desk .bd-warn.on{display:flex}
.booking-desk .bd-warn-box{width:min(380px,94vw);background:#fff;border-radius:20px;padding:24px 22px 20px;text-align:center;box-shadow:0 30px 80px rgba(20,16,26,.45);animation:upIn .22s ease}
.booking-desk .bd-warn.fb-framed .bd-warn-box,.booking-desk .bd-warn.fb-compact .bd-warn-box{width:min(90%,360px)!important;height:auto!important}
.booking-desk .bd-warn-ic{width:54px;height:54px;border-radius:16px;background:#FDEBE6;color:#E5484D;display:grid;place-items:center;margin:0 auto 14px}
.booking-desk .bd-warn-ic svg{width:28px;height:28px}
.booking-desk .bd-warn-box h3{font-size:18px;font-weight:800;color:var(--ink);margin-bottom:8px}
.booking-desk .bd-warn-box p{font-size:13.5px;line-height:1.5;color:var(--ink-soft);margin-bottom:18px}
.booking-desk .bd-warn-foot{display:flex;gap:10px}
.booking-desk .bd-warn-foot button{flex:1;border-radius:12px;padding:13px;font-size:14px;font-weight:800;cursor:pointer;border:1.5px solid;font-family:inherit}
.booking-desk .bd-warn-keep{background:#fff;border-color:var(--line);color:var(--ink)}
.booking-desk .bd-warn-keep:hover{background:var(--line-soft)}
.booking-desk .bd-warn-go{background:#E5484D;border-color:#E5484D;color:#fff}
.booking-desk .bd-warn-go:hover{filter:brightness(1.05)}

/* Upsell toast — replaces the up-box modal. z-index above the fullview phone (99999). */
.booking-desk .up-toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,12px);max-width:min(86vw,420px);background:rgba(18,14,28,.94);color:#fff;font-size:13.5px;font-weight:700;line-height:1.4;padding:11px 18px;border-radius:999px;box-shadow:0 12px 32px rgba(18,14,28,.34);opacity:0;pointer-events:none;z-index:100050;text-align:center;transition:opacity .2s ease,transform .2s ease}
.booking-desk .up-toast.on{opacity:1;transform:translate(-50%,0)}