/* KAYCO Item Master v13n — "find it and send it": instant search (search.js), Send menu (send.js), bulk select (bulk.js). Tokens: im.css :root. */

/* ---------- instant search ---------- */
.ux-sugg :focus-visible { outline:2px solid var(--plum); outline-offset:2px; }
.ux-sugg .im-so { cursor:pointer; }
.ux-sugg .im-so.is-act { background:var(--plum-50); box-shadow:inset 3px 0 0 var(--plum); }
.ux-so-item .im-so-ph { width:48px; height:48px; }
.ux-so-codes { display:flex; flex-wrap:wrap; gap:2px 10px; margin-top:1px; font-size:11.5px; color:var(--ink-500); }
.ux-so-codes .im-mono { white-space:nowrap; }
.ux-sg-h { display:flex; align-items:center; justify-content:space-between; padding-right:6px; }
.ux-sg-clear { padding:4px 6px; border-radius:8px; font-size:12.5px; font-weight:600; color:var(--ink-500); transition:color .12s, background .12s; }
.ux-sg-clear:hover { color:var(--ink-900); background:var(--mist); }
.ux-rec-o { display:flex; flex:1; min-width:0; align-items:center; gap:10px; padding:9px 10px; font-size:14px; font-weight:500; color:var(--ink-700); cursor:pointer; }
.im-rec.is-act { box-shadow:inset 3px 0 0 var(--plum); }
.ux-sg-empty { padding:14px 16px 4px; font-size:13px; line-height:1.5; color:var(--ink-500); }
.ux-sg-bar { display:none; }
@media (min-width:768px) { .ux-sugg { min-width:520px; } .ux-sugg .im-sugg-scroll { max-height:min(72vh, 660px); } }
/* phones: a full-width sheet under the search field */
.ux-sugg.is-sheet { position:fixed; left:0; right:0; top:var(--sg-top, 112px); bottom:var(--tabbar-h, 0px); animation:none; max-width:none; border-radius:18px 18px 0 0; box-shadow:0 0 0 1px var(--line), 0 -12px 32px -18px rgba(27,24,31,.35); }
.ux-sugg.is-sheet .im-sugg-scroll { max-height:none; }
.ux-sugg.is-sheet .ux-sg-bar { display:flex; flex:none; align-items:center; justify-content:space-between; padding:6px 8px 6px 16px; border-bottom:1px solid var(--line); font-size:12.5px; font-weight:600; color:var(--ink-500); }
.ux-sg-close { height:36px; padding:0 12px; border-radius:999px; font-size:13.5px; font-weight:600; color:var(--plum); }
.ux-sg-close:hover { background:var(--plum-50); }
.ux-sugg.is-sheet .im-sugg-all { flex:none; }

/* ---------- Send (item page) ---------- */
.ux-send { position:relative; display:flex; }
.ux-send-btn { width:100%; }
.ux-send-ch { margin-right:-4px; opacity:.8; }
.ip-acts > .ux-send { flex-basis:100%; }
@media (min-width:640px) { .ip-acts > .ux-send { flex:none; } }
.ux-menu { left:0; right:auto; width:340px; }
.ux-mi { display:flex; align-items:center; gap:12px; width:100%; padding:8px 10px; border-radius:12px; font-size:14px; text-align:left; transition:background .12s; }
.ux-mi:hover, .ux-mi:focus-visible { background:var(--plum-50); outline:none; }
.ux-mi:focus-visible { box-shadow:inset 0 0 0 2px var(--plum); }
.ux-mi[aria-disabled=true] { cursor:not-allowed; }
.ux-mi[aria-disabled=true] .ux-mi-l { color:var(--ink-400); }
.ux-mi[aria-disabled=true] .ux-mi-ic { background:var(--mist); color:var(--ink-400); }
.ux-mi-ic { display:flex; flex:none; width:34px; height:34px; align-items:center; justify-content:center; border-radius:10px; background:var(--plum-100); color:var(--plum); }
.ux-mi-l { display:block; font-weight:600; color:var(--ink-900); }
.ux-mi-s { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12.5px; color:var(--ink-500); }
.ux-mi-sep { height:1px; margin:4px 8px; background:var(--line); }
.ux-send-for { margin:-4px 0 10px; font-size:13px; line-height:1.45; color:var(--ink-500); }
.ux-send-list .ux-mi { min-height:52px; }
.ux-send-tip { margin:4px 10px 4px; padding-top:8px; border-top:1px solid var(--line); font-size:12.5px; line-height:1.45; color:var(--ink-500); }   /* v13o-p tips */
.ux-bb-tip { margin-top:2px; font-size:12.5px; color:#D9D4DE; }
/* phone action bar: Send · List · Spec (and the item # once the hero's codes scroll away) */
.ux-ab .ip-sb-in { gap:8px; }
.ux-ab .ux-send { flex:1; min-width:0; }
.ux-ab .ux-send-btn { height:44px; margin-left:0; padding:0 14px; font-size:14px; }
.ux-ab-b { flex:none; height:44px; padding:0 12px; gap:6px; }
.ux-ab.has-c .ux-ab-t { display:none; }
.ux-ab.has-c .ux-ab-b { width:44px; padding:0; }
.ux-ab-c { flex:none; max-width:96px; }

/* ---------- bulk select (lists) ---------- */
.ux-selbtn.is-on { border-color:var(--plum); background:var(--plum-50); color:var(--plum); }
@media (max-width:639.98px) { .ux-selbtn { width:44px; padding:0; } .ux-selbtn > span { display:none; } }
.ux-cb { position:absolute; top:8px; right:8px; z-index:3; display:flex; width:30px; height:30px; align-items:center; justify-content:center; cursor:pointer; }
.ux-cb input { position:absolute; inset:-7px; width:auto; height:auto; margin:0; opacity:0; cursor:pointer; }
.ux-cb span { display:flex; width:24px; height:24px; align-items:center; justify-content:center; border-radius:8px; background:rgba(255,255,255,.94); box-shadow:inset 0 0 0 1.5px var(--ink-300), 0 1px 3px rgba(27,24,31,.12); color:transparent; transition:background .12s, box-shadow .12s, color .12s; }
.ux-cb:hover span { box-shadow:inset 0 0 0 1.5px var(--plum), 0 1px 3px rgba(27,24,31,.12); }
.ux-cb.is-on span { background:var(--plum); box-shadow:none; color:#fff; }
.ux-cb input:focus-visible + span { outline:2px solid var(--plum); outline-offset:2px; }
.ux-cb.is-row { position:relative; top:auto; right:auto; margin:0 auto; }
[data-bulk] .im-card { cursor:pointer; }
[data-bulk] .im-card:has(.ux-cb.is-on) { box-shadow:0 0 0 2px var(--plum); background:var(--plum-50); }
[data-bulk] .im-tr:has(.ux-cb.is-on) { background:var(--plum-50); }
[data-bulk] .im-card .im-x-acts { display:none; }
[data-bulk] #main { padding-bottom:calc(var(--tray-h, 0px) + 120px); }
[data-bulk] .im-x-tray { display:none; }
[data-bulk] .im-toaster { transform:translate(-50%, -78px); }
.ux-bb { position:fixed; left:0; right:0; bottom:calc(var(--tabbar-h, 0px) + max(10px, env(safe-area-inset-bottom))); z-index:46; display:flex; justify-content:center; padding:0 10px; pointer-events:none; }
.ux-bb-in { pointer-events:auto; display:flex; align-items:center; gap:10px; width:100%; max-width:1180px; padding:8px 8px 8px 16px; border-radius:20px; background:#1B181F; color:#fff; box-shadow:0 18px 40px -16px rgba(27,24,31,.55); animation:ux-up .22s ease-out; }
@keyframes ux-up { from { transform:translateY(12px); opacity:0; } to { transform:none; opacity:1; } }
.ux-bb-c { flex:none; min-width:0; }
.ux-bb-n { font-size:14px; white-space:nowrap; } .ux-bb-n b { font-size:16px; } .ux-bb-n small { color:#B9B4BF; font-size:12px; }
.ux-bb-s { display:flex; gap:2px; margin:2px 0 0 -6px; }
.ux-bb-l { height:26px; padding:0 6px; border-radius:8px; font-size:12.5px; font-weight:600; color:#E4D2E6; white-space:nowrap; }
.ux-bb-l:hover { background:rgba(255,255,255,.1); color:#fff; } .ux-bb-l.is-q { color:#B9B4BF; }
.ux-bb-acts { display:flex; flex:1; min-width:0; justify-content:flex-end; gap:4px; overflow-x:auto; }
.ux-bb-a { display:flex; flex:none; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-width:64px; height:52px; padding:0 8px; border-radius:14px; font-size:11.5px; font-weight:600; color:#fff; white-space:nowrap; transition:background .12s; }
.ux-bb-a:hover:not(:disabled) { background:rgba(255,255,255,.12); }
.ux-bb-a:disabled { opacity:.38; cursor:not-allowed; }
.ux-bb-a[data-bulk-act=photos] { background:var(--plum); } .ux-bb-a[data-bulk-act=photos]:hover:not(:disabled) { background:#8E4685; }
.ux-bb :focus-visible { outline:2px solid #E4D2E6; outline-offset:2px; }
.ux-bb-done { display:flex; flex:none; width:40px; height:40px; align-items:center; justify-content:center; border-radius:999px; color:#B9B4BF; }
.ux-bb-done:hover { background:rgba(255,255,255,.12); color:#fff; }
/* v13o-p: "More" (phones only): CSV, Catalog and Compare in a menu above the bar, so the row never scrolls sideways */
.ux-bb-mw { position:relative; display:none; flex:none; }
.ux-bb-menu { position:absolute; right:0; bottom:calc(100% + 10px); z-index:2; display:flex; flex-direction:column; min-width:220px; padding:6px; border-radius:16px; background:#fff; color:var(--ink-900); box-shadow:0 0 0 1px var(--line), 0 18px 40px -12px rgba(27,24,31,.45); }
.ux-bb-mi { display:flex; align-items:center; gap:12px; min-height:48px; padding:6px 12px; border-radius:12px; text-align:left; font-size:14px; color:var(--ink-900); }
.ux-bb-mi svg { flex:none; color:var(--plum); }
.ux-bb-mi b { display:block; font-weight:600; }
.ux-bb-mi small { display:block; font-size:12px; color:var(--ink-500); }
.ux-bb-mi:hover:not(:disabled), .ux-bb-mi:focus-visible { background:var(--plum-50); outline:none; }
.ux-bb-mi:focus-visible { box-shadow:inset 0 0 0 2px var(--plum); }
.ux-bb-mi:disabled { cursor:not-allowed; } .ux-bb-mi:disabled b, .ux-bb-mi:disabled svg { color:var(--ink-400); }
@media (max-width:767.98px) {
  .ux-bb { padding:0 8px; }
  .ux-bb-in { flex-wrap:wrap; gap:4px 8px; padding:8px 6px 6px 14px; border-radius:18px; }
  .ux-bb-c { flex:1; min-width:0; }
  .ux-bb-s { flex-wrap:wrap; }   /* "Select shown (48) · Select all 281 · Clear" wraps instead of running under the Done button */
  .ux-bb-acts { order:3; flex-basis:100%; justify-content:space-between; margin:0 0 0 -8px; overflow:visible; }
  .ux-bb-a { flex:1 1 0; min-width:0; height:48px; padding:0 4px; }
  .ux-bb-a.is-more { display:none; }
  .ux-bb-mw { display:flex; flex:1 1 0; min-width:0; } .ux-bb-mw > .ux-bb-a { flex:1; }
  .ux-bb-a > span { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
  [data-bulk] #main { padding-bottom:calc(var(--tray-h, 0px) + 150px); }
  [data-bulk] .im-toaster { transform:translate(-50%, -128px); }
}
@media print { .ux-bb, .ux-cb { display:none !important; } }