/* Quick search (window.VestedQuickSearch, static/shared/quickSearch.js), 2026-10-18.
   The slim top bar on every staff page except Home (WORKSPACE_NAV_SCOPE D5), and the
   result list and owner card both search boxes share. The look is the CRM top bar's,
   moved here when it became the Platform's one bar (vqs- = the box, vtop- = the bar).
   Brand tokens only, so a firm's theme applies. */

/* The bar: fixed beside the menu column, above the scrolling content. renderNav /
   showPage set body.vtop-on (staff, not previewing a client, not on Home), which
   also moves #content-area down by the bar's height. */
.vtop { display:none; position:fixed; top:0; right:0; left:var(--ws-nav-w, 236px); height:56px; z-index:900;
  align-items:center; justify-content:flex-end; padding:0 1.75rem;
  background:#fff; border-bottom:1px solid var(--border, #E4E5E3); font-family:var(--brand-font-body, 'DM Sans', sans-serif); }
body.vtop-on .vtop { display:flex; }
body.vtop-on .content-area { margin-top:56px; height:calc(100vh - 56px); }

.vqs { position:relative; }
.vqs-icon { position:absolute; left:11px; top:50%; transform:translateY(-50%); color:#848484; font-size:15px; pointer-events:none; }
.vqs-input { width:320px; padding:8px 30px 8px 33px; border:1px solid #CFD0CC; border-radius:8px; font:inherit; font-size:13px;
  color:var(--brand-ink, #0B2339); background:#F4F5F5; box-sizing:border-box; margin:0; }
.vqs-input:focus { outline:none; border-color:var(--brand-accent, #008D95); background:#fff; box-shadow:0 0 0 3px rgba(var(--brand-accent-rgb, 0, 141, 149), .15); }
.vqs-input:focus + .vqs-kbd, .vqs-input:not(:placeholder-shown) + .vqs-kbd { display:none; }
.vqs-kbd { position:absolute; right:9px; top:50%; transform:translateY(-50%); font:600 11px/1 var(--brand-font-body, 'DM Sans', sans-serif); color:#848484;
  border:1px solid #CFD0CC; border-radius:4px; padding:2px 6px; background:#fff; pointer-events:none; }
.vqs-results { display:none; position:absolute; top:calc(100% + 6px); right:0; width:400px; max-width:calc(100vw - 32px); background:#fff;
  border:1px solid var(--border, #E4E5E3); border-radius:10px; box-shadow:0 10px 28px rgba(11,35,57,.14); max-height:420px; overflow-y:auto; z-index:100020; text-align:left; }
.vqs-row { display:flex; align-items:center; gap:10px; padding:9px 14px; cursor:pointer; border-bottom:1px solid var(--border, #E4E5E3); }
.vqs-row:last-child { border-bottom:none; }
.vqs-row:hover, .vqs-row.on { background:#F1F2F2; }
.vqs-av { width:30px; height:30px; border-radius:50%; background:var(--brand-ink, #0B2339); color:#fff; display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:600; flex-shrink:0; }
.vqs-main { flex:1; min-width:0; }
.vqs-name { font-size:13px; font-weight:600; color:var(--brand-ink, #0B2339); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.vqs-sub { font-size:11px; color:#56636E; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:1px; }
.vqs-tag { font-size:9.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; border-radius:5px; padding:2px 6px; flex-shrink:0; }
.vqs-tag.client { color:var(--brand-accent, #008D95); background:rgba(var(--brand-accent-rgb, 0, 141, 149), .12); }
.vqs-tag.lead { color:#9a5b00; background:rgba(198,122,0,.14); }
.vqs-go { font-size:11px; color:#848484; flex-shrink:0; }
.vqs-msg { padding:14px 16px; font-size:12.5px; color:#56636E; text-align:center; }
.vqs-note { padding:8px 14px; font-size:11px; color:#56636E; background:#F1F2F2; border-top:1px solid var(--border, #E4E5E3); }

/* Another adviser's person: the pop-out card (hangs under whichever box opened it). */
.vqs-card-host { position:relative; }
.vqs-card { position:absolute; top:calc(100% + 6px); right:0; width:340px; max-width:calc(100vw - 32px); background:#fff; border:1px solid var(--border, #E4E5E3);
  border-radius:10px; box-shadow:0 10px 28px rgba(11,35,57,.16); padding:16px; z-index:100021; text-align:left; color:var(--brand-ink, #0B2339); }
.vqs-card-x { position:absolute; top:8px; right:8px; border:none; background:none; color:#848484; font-size:15px; cursor:pointer; padding:4px; border-radius:6px; line-height:1; }
.vqs-card-x:hover { background:#F1F2F2; color:var(--brand-ink, #0B2339); }
.vqs-card-head { display:flex; align-items:center; gap:10px; padding-right:22px; }
.vqs-card-head .vqs-tag { display:inline-block; margin-top:4px; }
.vqs-card-lock { margin:12px 0; padding:9px 11px; font-size:12px; line-height:1.45; color:#56636E; background:#F1F2F2; border-radius:8px; }
.vqs-card-label { font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#848484; margin-bottom:6px; }
.vqs-card-owner { padding:8px 0; border-top:1px solid var(--border, #E4E5E3); font-size:12.5px; }
.vqs-card-label + .vqs-card-owner { border-top:none; padding-top:0; }
.vqs-card-oname { font-size:13.5px; font-weight:600; }

/* Phone: the menu is a drawer, and the fixed hamburger sits top-left (10px + 40px),
   so the bar spans the width, clears it, and the box takes the rest of the row. */
@media (max-width:768px) {
  .vtop { left:0; padding:0 12px 0 62px; }
  .vqs-top { flex:1; }
  .vqs-top .vqs-input { width:100%; }
  .vqs-kbd { display:none; }
}
