/* Zineph v3.5 — desk layer (see includes/views/head.php). Loaded after app.css. */

/* ============================================================================
   admin/bookings.php — moved here from the page's inline <style> (v3.1–v3.4).
   ============================================================================ */
.bk-detail { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:1.25rem; }
@media (max-width: 900px) { .bk-detail { grid-template-columns:minmax(0,1fr); } }
.dk-actions { display:flex; gap:0.5rem; flex-wrap:wrap; align-items:center; }
.dk-actions form { display:inline; margin:0; }
.bk-undo { margin-top:0.75rem; padding-top:0.75rem; border-top:1px dashed var(--divider); display:flex; gap:0.4rem; flex-wrap:wrap; align-items:center; }
.bk-client-row { padding:0.6rem 0.5rem; min-height:44px; border-bottom:1px solid var(--divider); cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:0.5rem; }
.bk-client-row:hover, .bk-client-row:focus { background:var(--brand-tint); outline:none; }
.dk-team-cell, .dk-list .dk-col-ref, .dk-list td.right { white-space:nowrap; }
.dk-list .table th, .dk-list .table td { padding-left:0.75rem; padding-right:0.75rem; }
.dk-team-more { display:inline-block; margin-left:0.3rem; padding:0.05rem 0.4rem; border-radius:var(--radius-pill); background:var(--brand-soft); color:var(--brand-dark); font-size:0.72rem; font-weight:600; }
[data-theme="dark"] .dk-team-more { color:var(--brand-light); }
.dk-whencell strong { display:block; font-weight:600; }

/* ===== v3.1 desk booking =====
   Smart per-service therapist panel, service picker, step cards and the
   sticky action bar. Only theme variables are used, so light + dark both work. */
.dk-back { display:inline-block; margin-bottom:1rem; padding:0.25rem 0; }
.dk-form { display:block; }
.dk-cols { display:grid; grid-template-columns:minmax(0, 1fr) 340px; gap:1.25rem; align-items:start; }
.dk-main { display:flex; flex-direction:column; gap:1rem; min-width:0; }
.dk-side { position:sticky; top:calc(var(--header-h) + 1rem); min-width:0; }
@media (max-width: 1100px) { .dk-cols { grid-template-columns:minmax(0, 1fr); } .dk-side { position:static; } }
.dk-link { background:none; border:0; padding:0; color:var(--brand-dark); font:inherit; font-size:0.8125rem; font-weight:500; text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
[data-theme="dark"] .dk-link { color:var(--brand); }
.dk-warn { color:var(--warning); }
.dk-empty { padding:0.9rem 1rem; border:1px dashed var(--border-2); border-radius:var(--radius-sm); color:var(--ink-muted); font-size:0.85rem; }
.dk-alert { display:block; margin:0 0 0.75rem; }
.dk-alert .dk-next { margin-top:0.5rem; white-space:normal; text-align:left; }

/* Step cards */
.dk-step { overflow:visible; }
.dk-step__head { width:100%; min-height:56px; display:flex; align-items:center; gap:0.75rem; padding:0.9rem 1.25rem; background:none; border:0; text-align:left; cursor:pointer; color:var(--ink); border-radius:var(--radius-md); }
.dk-step__head:focus-visible { outline:2px solid var(--brand); outline-offset:-2px; }
.dk-step__num { flex:none; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; background:var(--brand-soft); color:var(--brand-dark); font-size:0.85rem; font-weight:600; }
.dk-step.is-done .dk-step__num { background:var(--success-soft); color:var(--success); }
.dk-step__title { flex:none; font-family:var(--font-display); font-size:1.2rem; }
.dk-step__sum { flex:1; min-width:0; text-align:right; font-size:0.8125rem; color:var(--ink-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dk-step__chev { flex:none; width:18px; height:18px; color:var(--ink-4); transition:transform 0.2s; }
.dk-step.is-collapsed .dk-step__chev { transform:rotate(-90deg); }
.dk-step__body { padding:0.25rem 1.25rem 1.25rem; }
.dk-step.is-collapsed .dk-step__body { display:none; }

/* Client */
.dk-results { max-height:260px; overflow-y:auto; margin-top:0.5rem; }
.dk-picked-client { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; padding:0.6rem 0.75rem 0.6rem 0.9rem; background:var(--brand-tint); border-radius:var(--radius-sm); }
.dk-picked-client__who { min-width:0; display:flex; flex-direction:column; }
.dk-newclient { gap:0.6rem; }

/* Services picker */
.dk-pills { display:flex; flex-wrap:wrap; gap:0.4rem; margin-bottom:0.6rem; }
.dk-pills:empty { display:none; }
.dk-pill { display:inline-flex; align-items:center; gap:0.4rem; min-height:36px; padding:0.25rem 0.6rem 0.25rem 0.8rem; border:0; border-radius:var(--radius-pill); background:var(--brand-soft); color:var(--brand-dark); font-size:0.8125rem; font-weight:500; cursor:pointer; }
[data-theme="dark"] .dk-pill { color:var(--brand-light); }
.dk-pill__x { font-size:1.05rem; line-height:1; opacity:0.7; }
.dk-cats { flex-wrap:nowrap; overflow-x:auto; margin:0.6rem 0; padding:2px 2px 6px; scrollbar-width:thin; -webkit-overflow-scrolling:touch; }
.dk-cats .chip { flex:none; white-space:nowrap; }
.dk-cats__n:not(:empty) { display:inline-grid; place-items:center; min-width:18px; height:18px; margin-left:0.35rem; padding:0 0.3rem; border-radius:var(--radius-pill); background:var(--brand); color:#fff; font-size:0.7rem; font-weight:600; }
.dk-svc-list { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:0.5rem; max-height:430px; overflow-y:auto; padding:2px; }
.dk-svc-cat { grid-column:1 / -1; margin-top:0.5rem; font-size:0.7rem; font-weight:600; letter-spacing:0.09em; text-transform:uppercase; color:var(--ink-muted); }
.dk-svc-cat:first-child { margin-top:0; }
.dk-svc-none { grid-column:1 / -1; padding:1rem 0; }
.dk-svc { position:relative; display:flex; align-items:center; gap:0.7rem; min-height:58px; padding:0.55rem 0.75rem; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); cursor:pointer; transition:border-color 0.15s, background 0.15s; }
.dk-svc input { position:absolute; opacity:0; width:1px; height:1px; }
.dk-svc:hover { border-color:var(--brand); }
.dk-svc:focus-within { box-shadow:0 0 0 3px var(--brand-soft); }
.dk-svc.is-on { border-color:var(--brand); background:var(--brand-tint); }
.dk-svc__tick { flex:none; width:22px; height:22px; border-radius:50%; border:1.5px solid var(--border-2); display:grid; place-items:center; font-size:0.75rem; color:transparent; }
.dk-svc.is-on .dk-svc__tick { background:var(--brand); border-color:var(--brand); color:#fff; }
.dk-svc__body { flex:1; min-width:0; display:flex; flex-direction:column; }
.dk-svc__name { font-size:0.9rem; font-weight:500; color:var(--ink); }
.dk-svc__meta { font-size:0.78rem; color:var(--ink-muted); }
.dk-svc__price { flex:none; font-size:0.85rem; font-weight:500; white-space:nowrap; color:var(--ink-2); }
.dk-svc-done { display:none; margin-top:0.75rem; }

/* Team & time panel */
.dk-team.is-loading .dk-dyn { opacity:0.5; transition:opacity 0.15s 0.1s; pointer-events:none; }
.dk-team.is-empty .dk-when, .dk-team.is-empty .dk-custom, .dk-team.is-empty .dk-teamhead { display:none; }
.dk-when { display:flex; gap:0.5rem; align-items:center; flex-wrap:wrap; margin-bottom:0.75rem; }
.dk-when .chip { min-height:40px; }
.dk-when .input { flex:1 1 160px; width:auto; max-width:220px; }
.dk-timehead { font-size:0.9rem; margin-bottom:0.25rem; }
.dk-timehead:empty { display:none; }
.dk-tgroup { margin-top:0.6rem; }
.dk-tgroup__name { margin-bottom:0.3rem; font-size:0.7rem; font-weight:600; letter-spacing:0.09em; text-transform:uppercase; color:var(--ink-muted); }
.dk-trow { display:flex; flex-wrap:wrap; gap:0.4rem; }
.dk-trow .slot { flex:none; min-width:84px; min-height:40px; padding:0.35rem 0.6rem; display:inline-flex; flex-direction:column; align-items:center; justify-content:center; line-height:1.2; }
.slot__tag { font-size:0.6rem; font-weight:600; letter-spacing:0.07em; text-transform:uppercase; color:var(--success); }
.slot.selected .slot__tag { color:inherit; opacity:0.85; }
.slot--first:not(.selected) { border-color:var(--success); }
.dk-offgrid { margin-top:0.5rem; }
.dk-custom { display:flex; align-items:center; gap:0.5rem; flex-wrap:wrap; margin-top:0.75rem; }
.dk-custom .input { width:auto; flex:0 1 140px; }
.dk-teamhead { display:flex; align-items:baseline; justify-content:space-between; gap:0.75rem; margin-top:1.25rem; padding-top:1rem; border-top:1px solid var(--divider); }
.dk-teamhead h4 { font-size:1rem; font-weight:500; }
.dk-block { margin-top:0.75rem; padding:0.85rem; border:1px solid var(--border); border-radius:var(--radius-md); background:var(--surface-2); transition:box-shadow 0.3s; }
.dk-block--flash { box-shadow:0 0 0 3px var(--brand-soft), 0 0 0 4px var(--brand); }
.dk-block__head { display:flex; align-items:baseline; justify-content:space-between; gap:0.25rem 0.75rem; flex-wrap:wrap; margin-bottom:0.6rem; }
.dk-block__svc { display:flex; align-items:center; gap:0.5rem; font-weight:600; color:var(--ink); }
.dk-block__n { flex:none; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; background:var(--ink); color:var(--bg); font-size:0.7rem; }
.dk-block__time { font-size:0.8125rem; font-weight:500; color:var(--brand-dark); font-variant-numeric:tabular-nums; }
[data-theme="dark"] .dk-block__time { color:var(--brand); }
.dk-block__hint { margin-top:0.5rem; font-size:0.75rem; color:var(--ink-muted); }
.dk-ths { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:0.5rem; }
.dk-th { display:flex; align-items:flex-start; gap:0.6rem; width:100%; min-height:64px; padding:0.65rem 0.7rem; text-align:left; border:1.5px solid var(--border); border-radius:var(--radius-sm); background:var(--surface); color:var(--ink); cursor:pointer; transition:border-color 0.15s, box-shadow 0.15s, opacity 0.15s; }
.dk-th:hover { border-color:var(--brand); opacity:1; }
.dk-th:focus-visible { outline:2px solid var(--brand); outline-offset:1px; }
.dk-th.is-on { border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft); }
.dk-th.is-dim { border-style:dashed; background:transparent; opacity:0.7; }
.dk-th__radio { flex:none; width:18px; height:18px; margin-top:0.3rem; border-radius:50%; border:1.5px solid var(--border-2); background:var(--surface); }
.dk-th.is-on .dk-th__radio { border-color:var(--brand); background:radial-gradient(circle, var(--brand) 0 45%, var(--surface) 50%); }
.dk-th .avatar { flex:none; margin-top:0.05rem; }
.dk-th__body { flex:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:0.25rem; }
.dk-th__name { display:flex; align-items:center; gap:0.4rem; flex-wrap:wrap; font-size:0.92rem; font-weight:600; }
.dk-tag { padding:0.1rem 0.45rem; border-radius:var(--radius-pill); background:var(--brand); color:#fff; font-size:0.62rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; }
.dk-tag--pin { background:var(--ink); color:var(--bg); }
.dk-tag--line { background:transparent; color:var(--ink-muted); box-shadow:inset 0 0 0 1px var(--border-2); }
.dk-th__line { display:flex; align-items:center; gap:0.4rem; flex-wrap:wrap; }
.dk-state { display:inline-flex; align-items:center; gap:0.3rem; padding:0.12rem 0.5rem; border-radius:var(--radius-pill); font-size:0.74rem; font-weight:600; text-align:left; }
.dk-state::before { content:''; flex:none; width:6px; height:6px; border-radius:50%; background:currentColor; }
.dk-state--free_now   { background:var(--success-soft); color:var(--success); }
.dk-state--free_later { background:var(--info-soft);    color:var(--info); }
.dk-state--busy       { background:var(--warning-soft); color:var(--warning); }
.dk-state--full       { background:var(--danger-soft);  color:var(--danger); }
.dk-state--off        { background:var(--surface-3);    color:var(--ink-muted); }
.dk-th__next, .dk-th__meta { font-size:0.75rem; color:var(--ink-muted); }
.dk-th__fit { font-size:0.76rem; font-weight:500; }
.dk-th__fit--ok { color:var(--success); }
.dk-th__fit--no { color:var(--warning); }
.dk-th__seen { font-size:0.75rem; font-weight:500; color:var(--brand-dark); }
[data-theme="dark"] .dk-th__seen { color:var(--brand-light); }
.dk-who { margin-top:0.85rem; line-height:1.5; }
.dk-who:empty { display:none; }
.dk-who strong { color:var(--ink-2); font-weight:600; }

/* Visit plan (review) */
.dk-plan { list-style:none; margin:0; padding:0; }
.dk-plan li { display:flex; gap:0.75rem; align-items:baseline; padding:0.55rem 0; border-bottom:1px dashed var(--divider); }
.dk-plan li:first-child { padding-top:0; }
.dk-plan__t { flex:none; width:11em; font-size:0.8rem; font-weight:600; color:var(--brand-dark); font-variant-numeric:tabular-nums; white-space:nowrap; }
[data-theme="dark"] .dk-plan__t { color:var(--brand); }
.dk-plan__m { flex:1; min-width:0; display:flex; flex-direction:column; }
.dk-plan__svc { font-size:0.9rem; font-weight:500; color:var(--ink); }
.dk-plan__who { font-size:0.8rem; color:var(--ink-muted); }
.dk-plan__foot { display:flex; justify-content:space-between; align-items:baseline; gap:0.75rem; padding-top:0.7rem; font-size:0.85rem; color:var(--ink-2); }
.dk-plan__foot strong { font-family:var(--font-display); font-size:1.15rem; font-weight:500; color:var(--ink); }
.dk-plan__note { margin-top:0.5rem; }
.dk-review .dk-alert { margin:0.75rem 0 0; }

/* Sticky action bar */
.dk-bar { position:sticky; bottom:var(--sh-tabbar-h, 0px); z-index:15; display:flex; align-items:center; gap:0.75rem; margin-top:1rem;
          padding:0.7rem 1rem calc(0.7rem + env(safe-area-inset-bottom, 0px));
          background:var(--surface); border:1px solid var(--border); border-bottom:0;
          border-radius:var(--radius-md) var(--radius-md) 0 0; box-shadow:0 -6px 24px rgba(60, 25, 40, 0.10); }
.dk-bar__info { flex:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:0.1rem; padding:0; background:none; border:0; text-align:left; color:var(--ink); font:inherit; }
button.dk-bar__info { cursor:pointer; min-height:44px; justify-content:center; }
.dk-bar__l1 { max-width:100%; font-size:0.95rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dk-bar__l1.is-todo { color:var(--brand-dark); }
[data-theme="dark"] .dk-bar__l1.is-todo { color:var(--brand); }
.dk-bar__l2 { max-width:100%; font-size:0.78rem; color:var(--ink-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dk-bar__l2:empty { display:none; }
.dk-bar__go { flex:none; }
.dk-bar__go.is-waiting { opacity:0.6; }
.dk-bar--detail { display:none; }
@media (max-width: 900px) {
  .dk-bar { margin:1rem -1.25rem -1.25rem; border-left:0; border-right:0; border-radius:0; }
  .dk-bar--detail { display:flex; }
  .dk-bar__cancel { display:none; }
  .dk-bar .btn { min-height:48px; }
  .dk-pill { min-height:44px; }
  .dk-when .chip { min-height:44px; }
  .dk-link { display:inline-flex; align-items:center; min-height:44px; }
  .dk-alert .dk-link, .dk-timehead .dk-link { min-height:0; display:inline; }
}
@media (max-width: 640px) {
  .dk-step__head { padding:0.8rem 1rem; }
  .dk-step__body { padding:0.25rem 1rem 1rem; }
  .dk-step__title { font-size:1.1rem; }
  .dk-svc-list { grid-template-columns:minmax(0, 1fr); max-height:none; overflow:visible; }
  .dk-svc-done { display:flex; }
  .dk-when .input { max-width:none; }
  /* Times scroll sideways in three short rows instead of a long wall of buttons */
  .dk-trow { flex-wrap:nowrap; overflow-x:auto; margin:0 -1rem; padding:2px 1rem 6px; scroll-snap-type:x proximity; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
  .dk-trow::-webkit-scrollbar { display:none; }
  .dk-trow .slot { min-height:46px; scroll-snap-align:start; scroll-margin-left:1rem; }
  .dk-ths { grid-template-columns:minmax(0, 1fr); }
  .dk-block { padding:0.75rem; }
  .dk-bar { gap:0.5rem; padding-left:0.85rem; padding-right:0.85rem; }
  .dk-bar .btn-lg { padding-left:1rem; padding-right:1rem; font-size:0.9rem; }
  .dk-bar__l1 { font-size:0.88rem; }
  #nb-bar-total { display:none; }
  .dk-custom .input { flex:1 1 120px; }
}

/* Booking detail: visit plan */
.dk-visit-head { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; flex-wrap:wrap; margin-bottom:0.5rem; }
.dk-visit { list-style:none; margin:0; padding:0; }
.dk-visit__row { display:flex; gap:0.9rem; align-items:flex-start; padding:0.75rem 0; border-bottom:1px solid var(--divider); }
.dk-visit__row:last-child { border-bottom:0; }
.dk-visit__time { flex:none; width:5.6em; display:flex; flex-direction:column; font-variant-numeric:tabular-nums; }
.dk-visit__time strong { font-size:0.9rem; font-weight:600; color:var(--brand-dark); }
[data-theme="dark"] .dk-visit__time strong { color:var(--brand); }
.dk-visit__time span { font-size:0.75rem; color:var(--ink-muted); }
.dk-visit__main { flex:1; min-width:0; }
.dk-visit__svc { font-weight:500; color:var(--ink); }
.dk-visit__who { display:flex; align-items:center; gap:0.4rem; flex-wrap:wrap; margin-top:0.25rem; font-size:0.85rem; }
.dk-visit__side { flex:none; display:flex; flex-direction:column; align-items:flex-end; gap:0.2rem; text-align:right; }
.dk-visit__price { font-weight:500; white-space:nowrap; }

/* Reschedule / change-therapist modal */
.dk-modal { max-width:680px; }
.dk-modal .modal__foot { position:sticky; bottom:0; z-index:2; }
.dk-modal .modal__head { position:sticky; top:0; z-index:2; background:var(--surface); }
.dk-rs-sum { margin-top:1.25rem; padding-top:1rem; border-top:1px solid var(--divider); }
.dk-rs-sum h4 { font-size:1rem; font-weight:500; margin-bottom:0.5rem; }
@media (max-width: 640px) {
  .modal-backdrop:has(.dk-modal) { padding:0; align-items:flex-end; }
  .dk-modal { max-height:94vh; max-height:94dvh; border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
  .dk-modal .modal__body { padding:1rem; }
  .dk-modal .modal__foot { padding-bottom:calc(1rem + env(safe-area-inset-bottom, 0px)); }
  .dk-modal .modal__foot .btn { flex:1; }
  .dk-visit__row { flex-wrap:wrap; gap:0.25rem 0.75rem; }
  .dk-visit__side { flex-basis:100%; flex-direction:row; justify-content:space-between; align-items:center; padding-left:calc(5.6em + 0.75rem); }
}

/* ============================================================================
   v3.5 — desk screens on phones + group bookings (class prefix dk-)
   ============================================================================ */

/* ---- Bookings list: search + filters + new booking ---- */
.dk-lbar { margin-bottom:0.75rem; }
.dk-lbar__row { display:flex; gap:0.5rem; align-items:center; flex-wrap:wrap; }
.dk-search { position:relative; flex:1 1 240px; max-width:360px; min-width:0; }
.dk-search svg { position:absolute; left:0.8rem; top:50%; width:16px; height:16px; transform:translateY(-50%); color:var(--ink-muted); pointer-events:none; }
.dk-search .input { width:100%; padding-left:2.3rem; }
.dk-ftoggle { display:none; }
.dk-ftoggle svg { width:16px; height:16px; }
.dk-fcount { display:inline-grid; place-items:center; min-width:18px; height:18px; padding:0 0.3rem; border-radius:var(--radius-pill); background:var(--brand); color:#fff; font-size:0.7rem; font-weight:600; }
.dk-newbtn { margin-left:auto; white-space:nowrap; }
.dk-lbar__more { display:flex; gap:0.5rem 0.75rem; flex-wrap:wrap; align-items:flex-end; margin-top:0.6rem; }
.dk-fld { display:flex; flex-direction:column; gap:0.2rem; font-size:0.7rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-muted); }
.dk-fld .select, .dk-fld .input { width:auto; min-width:160px; letter-spacing:normal; text-transform:none; font-weight:400; }
.dk-apply { display:none; }
.dk-tabs { flex-wrap:nowrap; overflow-x:auto; margin:0 0 1rem; padding:2px 2px 6px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.dk-tabs::-webkit-scrollbar { display:none; }
.dk-tabs .chip { flex:none; white-space:nowrap; }
.dk-tabs__clear { border-style:dashed; }
.dk-none { padding:3rem 1rem; }
.dk-party { display:inline-flex; align-items:center; gap:0.25rem; margin-left:0.35rem; padding:0.05rem 0.45rem; border-radius:var(--radius-pill); background:var(--info-soft); color:var(--info); font-size:0.72rem; font-weight:600; line-height:1.5; vertical-align:middle; white-space:nowrap; }
.dk-party__i { width:13px; height:13px; flex:none; }

/* Phone cards (the table is used on larger screens) */
.dk-cards { display:none; list-style:none; margin:0; padding:0; }
.dk-cards > li + li { margin-top:0.6rem; }
.dk-card { display:flex; flex-direction:column; gap:0.3rem; padding:0.85rem 1rem; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); color:var(--ink); text-decoration:none; -webkit-tap-highlight-color:transparent; }
.dk-card:active, .dk-card:focus-visible { background:var(--brand-tint); border-color:var(--brand); outline:none; }
.dk-card.is-new { box-shadow:inset 3px 0 0 var(--brand); }
.dk-card__top { display:flex; justify-content:space-between; align-items:center; gap:0.5rem; }
.dk-card__when { min-width:0; font-size:0.82rem; color:var(--ink-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dk-card__when strong { margin-right:0.3rem; font-size:1.05rem; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums; }
.dk-card__client { display:flex; align-items:center; flex-wrap:wrap; gap:0.25rem; font-size:1rem; font-weight:600; }
.dk-card__client .dk-party { margin-left:0.15rem; }
.dk-card__svc { font-size:0.85rem; color:var(--ink-2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere; }
.dk-card__foot { display:flex; justify-content:space-between; align-items:baseline; gap:0.75rem; margin-top:0.15rem; padding-top:0.4rem; border-top:1px dashed var(--divider); font-size:0.8rem; color:var(--ink-muted); }
.dk-card__team { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dk-card__amt { flex:none; white-space:nowrap; font-weight:500; color:var(--ink-2); }
.dk-card__amt.is-due { color:var(--warning); font-weight:600; }

@media (max-width: 640px) {
  .dk-lbar__row { flex-wrap:wrap; }
  .dk-search { flex:1 1 0; max-width:none; }
  .dk-search .input { font-size:16px; min-height:46px; }
  .dk-ftoggle { display:inline-flex; gap:0.35rem; min-height:46px; padding:0 0.8rem; }
  .dk-newbtn { order:3; flex:1 1 100%; margin-left:0; min-height:48px; font-size:0.95rem; }
  .dk-lbar__more { display:none; flex-direction:column; align-items:stretch; gap:0.6rem; padding:0.85rem; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); }
  .dk-lbar__more.is-open { display:flex; }
  .dk-fld .select, .dk-fld .input { width:100%; min-width:0; font-size:16px; min-height:44px; }
  .dk-apply { display:inline-flex; }
  .dk-tabs { margin:0 -1.25rem 0.75rem; padding:2px 1.25rem 6px; }
  .dk-tabs .chip { min-height:40px; display:inline-flex; align-items:center; }
  .dk-listcard { background:transparent; border:0; box-shadow:none; }
  .dk-listcard .dk-none { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); }
  .dk-list { display:none; }
  .dk-cards { display:block; }
}

/* ---- New booking: people (group bookings) ---- */
.dk-main > .dk-team { display:flex; flex-direction:column; gap:1rem; min-width:0; }
.dk-help { margin:0 0 0.25rem; }
.dk-teamhead--bare { margin-top:0; padding-top:0; border-top:0; justify-content:flex-end; }
.dk-solo { display:flex; align-items:center; justify-content:space-between; gap:0.75rem; margin-bottom:0.9rem; padding:0.7rem 0.9rem; border:1px dashed var(--border-2); border-radius:var(--radius-md); }
.dk-solo__txt { display:flex; flex-direction:column; gap:0.1rem; min-width:0; }
.dk-addp { flex:none; }
.dk-people > .dk-addp { margin:0.15rem 0 1rem; }
.dk-people__head { display:flex; flex-direction:column; gap:0.1rem; margin-bottom:0.6rem; }
.dk-person { margin-bottom:0.5rem; padding:0.6rem 0.7rem; border:1.5px solid var(--border); border-radius:var(--radius-md); background:var(--surface); transition:border-color 0.15s, box-shadow 0.15s; }
.dk-person.is-active { border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-soft); }
.dk-person.is-empty:not(.is-active) { border-style:dashed; }
.dk-person__top { display:flex; align-items:center; gap:0.5rem; }
.dk-pnum { flex:none; width:26px; height:26px; border-radius:50%; display:inline-grid; place-items:center; background:var(--ink); color:var(--bg); font-size:0.78rem; font-weight:600; line-height:1; }
.dk-person.is-active .dk-pnum { background:var(--brand); color:#fff; }
.dk-person__name { flex:1; min-width:0; }
.dk-person__rm { flex:none; }
.dk-person__svcs { display:flex; flex-wrap:wrap; gap:0.35rem; margin:0.5rem 0 0.35rem; }
.dk-person__none { font-size:0.8rem; font-weight:500; color:var(--warning); }
.dk-person__foot { display:flex; align-items:center; gap:0.35rem; flex-wrap:wrap; }
.dk-person__now { padding:0 0.35rem; font-size:0.8rem; font-weight:600; color:var(--brand-dark); }
[data-theme="dark"] .dk-person__now { color:var(--brand); }
.dk-person__sum { margin-left:auto; font-size:0.8rem; color:var(--ink-muted); white-space:nowrap; }
.dk-forwho { display:flex; align-items:center; gap:0.45rem; flex-wrap:wrap; margin-bottom:0.6rem; padding:0.55rem 0.75rem; border-radius:var(--radius-sm); background:var(--brand-tint); font-size:0.9rem; }
.dk-forwho .dk-pnum { background:var(--brand); color:#fff; width:22px; height:22px; font-size:0.72rem; }

/* Team blocks / plan per person */
.dk-person-h { display:flex; align-items:center; gap:0.5rem; flex-wrap:wrap; margin-top:1.1rem; padding-top:0.9rem; border-top:1px solid var(--divider); }
.dk-person-h:first-child { margin-top:0; padding-top:0; border-top:0; }
.dk-person-h strong { font-size:1rem; }
.dk-person-h__t { font-size:0.8rem; color:var(--ink-muted); font-variant-numeric:tabular-nums; }
.dk-block--guest { margin-top:0.6rem; }
.slot__end { font-size:0.62rem; font-weight:500; color:var(--ink-muted); }
.slot.selected .slot__end { color:inherit; opacity:0.85; }
.dk-flow { display:flex; flex-direction:column; gap:0.15rem; margin-bottom:0.75rem; padding:0.6rem 0.75rem; border-radius:var(--radius-sm); font-size:0.82rem; }
.dk-flow strong { font-size:0.88rem; }
.dk-flow span { color:var(--ink-2); }
.dk-flow--together { background:var(--success-soft); color:var(--success); }
.dk-flow--stagger { background:var(--info-soft); color:var(--info); }
.dk-plan__person { display:flex; align-items:center; gap:0.45rem; margin:0.85rem 0 0.4rem; font-size:0.92rem; }
.dk-plan__person:first-of-type { margin-top:0.25rem; }
.dk-plan__person .dk-pnum { width:22px; height:22px; font-size:0.72rem; }
.dk-plan__sub { margin-left:auto; font-size:0.82rem; color:var(--ink-muted); white-space:nowrap; }
.dk-plan__wait { margin:-0.15rem 0 0.35rem; font-size:0.75rem; color:var(--info); }

/* ---- New booking on phones: one step at a time ---- */
.dk-wiz { margin:-0.25rem 0 0.9rem; }
.dk-wiz[hidden] { display:none; }
.dk-wiz__top { display:flex; align-items:center; gap:0.35rem; }
.dk-wiz__back { flex:none; width:44px; height:44px; margin-left:-0.6rem; display:grid; place-items:center; border:0; border-radius:50%; background:none; color:var(--ink); cursor:pointer; }
.dk-wiz__back:active { background:var(--brand-tint); }
.dk-wiz__back svg { width:22px; height:22px; }
.dk-wiz__title { display:flex; flex-direction:column; min-width:0; line-height:1.2; }
.dk-wiz__count { font-size:0.68rem; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-muted); }
.dk-wiz__title strong { font-family:var(--font-display); font-size:1.4rem; font-weight:500; color:var(--ink); }
.dk-wiz__dots { display:flex; gap:0.3rem; margin:0.55rem 0 0; padding:0; list-style:none; }
.dk-wiz__dot { flex:1; min-width:0; }
.dk-wiz__dot button { position:relative; display:block; width:100%; height:24px; padding:0; border:0; background:none; font-size:0; color:transparent; cursor:pointer; }
.dk-wiz__dot button::before { content:''; position:absolute; left:0; right:0; top:50%; height:5px; margin-top:-2.5px; border-radius:3px; background:var(--border-2); }
.dk-wiz__dot.is-done button::before { background:var(--brand-light); }
.dk-wiz__dot.is-current button::before { background:var(--brand); }
.dk-wiz__dot button:disabled { cursor:default; }
.dk-wiz__lab { display:none; }
.dk-form.is-wizard .dk-step:not(.is-current) { display:none; }
.dk-form.is-wizard .dk-step__head { display:none; }
.dk-form.is-wizard .dk-step__body { padding-top:1rem; }
.dk-form.is-wizard .dk-step.is-collapsed .dk-step__body { display:block; }
.dk-form.is-wizard .dk-svc-done { display:none; }
.dk-form.is-wizard .dk-side { display:none; }
.dk-form.is-wizard[data-step="4"] .dk-side { display:block; order:-1; }
.dk-form.is-wizard .dk-bar__go { min-width:7.5rem; }
.dk-form.is-wizard .dk-person__name { font-size:16px; }
@media (max-width: 640px) {
  .dk-solo { flex-wrap:wrap; }
  .dk-solo .dk-addp { flex:1 1 100%; min-height:44px; }
  .dk-people > .dk-addp { width:100%; min-height:46px; }
  .dk-person__foot .btn { min-height:40px; }
  .dk-cols { gap:1rem; }
  .dk-plan__t { width:auto; min-width:8.2em; }
}

/* ---- Booking detail ---- */
.dk-detail-when { font-size:1.5rem; margin-top:0.25rem; }
.dk-gp { margin-top:0.65rem; padding:0 0.85rem; border:1px solid var(--border); border-radius:var(--radius-md); }
.dk-gp__head { display:flex; align-items:center; gap:0.5rem; flex-wrap:wrap; padding:0.6rem 0 0.5rem; border-bottom:1px solid var(--divider); }
.dk-gp__name { font-size:0.98rem; }
.dk-gp__t { font-size:0.8rem; color:var(--ink-muted); font-variant-numeric:tabular-nums; }
.dk-gp__sub { margin-left:auto; font-weight:500; white-space:nowrap; }
.dk-gp .dk-visit__row:last-child { border-bottom:0; }
.dk-paygroup { margin-bottom:0.75rem; padding:0.6rem 0.8rem; border-radius:var(--radius-sm); background:var(--surface-2); font-size:0.85rem; }
.dk-paygroup__h { margin-bottom:0.3rem; font-weight:600; }
.dk-paygroup__row { display:flex; justify-content:space-between; gap:0.75rem; padding:0.2rem 0; border-top:1px dashed var(--divider); }
.dk-paygroup__row:first-of-type { border-top:0; }
.dk-paygroup__who { min-width:0; overflow-wrap:anywhere; }
@media (max-width: 640px) {
  .dk-detail-when { font-size:1.25rem; }
  .bk-detail .card__head { flex-wrap:wrap; gap:0.5rem; }
  .dk-actions { gap:0.5rem; }
  .dk-actions > form, .dk-actions > .btn, .dk-actions > a.btn { flex:1 1 calc(50% - 0.25rem); }
  .dk-actions > form .btn, .dk-actions > .btn, .dk-actions > a.btn { width:100%; min-height:48px; font-size:0.9rem; }
  .dk-actions > span { margin-left:0 !important; width:100%; }
  .dk-actions > span > form, .dk-actions > span > .btn { flex:1 1 calc(50% - 0.25rem); }
  .dk-actions > span .btn { width:100%; min-height:46px; }
  .bk-undo .btn { min-height:44px; }
  .dk-gp { padding:0 0.7rem; }
  .dk-bar--detail .btn { padding-left:0.9rem; padding-right:0.9rem; }

  /* Modals become bottom sheets with the buttons always in reach */
  .modal-backdrop:has(.dk-sheet) { padding:0; align-items:flex-end; }
  .dk-sheet { display:flex; flex-direction:column; max-height:92vh; max-height:92dvh; overflow:hidden; border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
  .dk-sheet > form { display:flex; flex-direction:column; flex:1; min-height:0; }
  .dk-sheet .modal__head { padding:1rem; }
  .dk-sheet .modal__body, #payment-modal .dk-sheet .modal__body { flex:1; min-height:0; max-height:none; overflow-y:auto; padding:1rem; }
  .dk-sheet .modal__foot { padding:0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom, 0px)); }
  .dk-sheet .modal__foot .btn { flex:1; min-height:48px; }
  .dk-sheet .input, .dk-sheet .select, .dk-modal .input { font-size:16px; }
  .dk-sheet .pb-mini .input { width:96px; }
}
@media (max-width: 640px) {
  .dk-gp__t { order:3; flex-basis:100%; padding-left:calc(26px + 0.5rem); margin-top:-0.35rem; }
  .dk-visit__side .dk-link { white-space:nowrap; }
  .dk-gp .dk-visit__side { padding-left:0; }
  .dk-gp .dk-visit__time { width:5.8em; white-space:nowrap; }
}
/* The shell uses 1rem page padding on phones: bars and chip rows bleed to the edge by that much. */
@media (max-width: 640px) {
  .dk-bar { margin-left:-1rem; margin-right:-1rem; margin-bottom:-1rem; }
  .dk-tabs { margin-left:-1rem; margin-right:-1rem; padding-left:1rem; padding-right:1rem; }
}
.dk-flowtag { display:inline-block; padding:0.05rem 0.5rem; border-radius:var(--radius-pill); font-size:0.72rem; font-weight:600; white-space:nowrap; vertical-align:middle; }
.dk-flowtag.is-together { background:var(--success-soft); color:var(--success); }
.dk-flowtag.is-stagger { background:var(--info-soft); color:var(--info); }
.dk-plan__foot strong { white-space:nowrap; }
.dk-confirm-client { margin-bottom:0.9rem; padding:0.55rem 0.75rem; border-radius:var(--radius-sm); background:var(--brand-tint); font-size:0.88rem; font-weight:500; }
.dk-confirm-client[hidden] { display:none; }
.dk-today { padding:0.75rem; }

/* ---- Calendar ---- */
@media (max-width: 640px) {
  .dk-calbar { gap:0.5rem !important; }
  .dk-calnav { flex-wrap:wrap; width:100%; }
  .dk-caltitle { flex:1 1 100%; order:5; margin:0.35rem 0 0 !important; font-size:1.15rem; }
  .dk-caltools { width:100%; gap:0.5rem; }
  .dk-caltools .chips { flex:1 1 100%; flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
  .dk-caltools .chips .chip { flex:none; min-height:40px; display:inline-flex; align-items:center; }
  .dk-caltools .input { flex:1 1 0; min-width:0; font-size:16px; }
  .dk-legend { gap:0.4rem 0.75rem !important; font-size:0.8rem; }
}
.dk-card:hover, .dk-card:visited { color:var(--ink); }
