/* Shadeland internal app - Customers (Search and the Customer screen). Built 29/10/2026, bms-core piece 1.
   Uses the brand tokens defined in styles.css; the state colours below are UI signals, never
   brand colours. Every rule is scoped under .cu / .cu-scope so it cannot leak into other tabs. */

:is(.cu,.cu-scope){--cu-bad:#B42318;--cu-bad-bg:#FDE7E5;--cu-ask-bg:#FFF3CC}
.cu{padding:12px 16px calc(96px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px}
.cu>div{display:flex;flex-direction:column;gap:14px}
:is(.cu,.cu-scope) [hidden]{display:none!important}
.cu h1{font-family:Anton,Impact,sans-serif;text-transform:uppercase;color:var(--navy);font-weight:400;
  font-size:28px;letter-spacing:.3px;margin:0;line-height:1.05;overflow-wrap:anywhere}
.cu-sub{color:var(--muted);font-size:14px;margin:4px 0 0}
.cu-q{width:100%;box-sizing:border-box;min-height:48px;border:1px solid var(--line);border-radius:12px;
  padding:10px 14px;font:inherit;font-size:16px;background:var(--white);color:var(--ink)}

.cu-banner{font-size:13px;border-radius:10px;padding:8px 12px;background:var(--paper);color:var(--muted)}
.cu-banner:empty{display:none}
.cu-banner.bad{background:var(--cu-bad-bg);color:var(--cu-bad)}

.cu-count{margin:0;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
.cu-list{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.cu-item{display:flex;flex-direction:column;gap:6px;width:100%;box-sizing:border-box;padding:12px 14px;border:0;
  border-top:1px solid var(--line);background:none;text-align:left;font:inherit;color:inherit}
.cu-list>.cu-item:first-child{border-top:0}
button.cu-item{cursor:pointer;min-height:var(--tap)}
.cu-title{font-weight:600;color:var(--ink);overflow-wrap:anywhere;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cu-meta{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.cu-pill{display:inline-flex;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:600;background:var(--paper);
  color:var(--ink);white-space:nowrap}
.cu-pill.br{background:#E6F3FB;color:var(--navy)}
.cu-detail{font-size:14px;color:var(--muted);overflow-wrap:anywhere}
.cu-detail a,.cu-dl a{color:var(--navy)}
.cu-empty{background:var(--white);border:1px dashed var(--line);border-radius:var(--radius);padding:16px;color:var(--muted);font-size:14px;margin:0}
.cu-note{font-size:13px;color:var(--muted);margin:0}

.cu-back{align-self:flex-start;border:0;background:none;color:var(--navy);font:inherit;font-weight:600;padding:8px 0;min-height:40px;cursor:pointer}
.cu-head{display:flex;flex-direction:column;gap:8px}
.cu-sec{display:flex;flex-direction:column;gap:8px}
.cu-sec h2{margin:0;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600}
.cu-dl{margin:0;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:4px 14px}
.cu-dl>div{display:grid;grid-template-columns:110px 1fr;gap:10px;padding:8px 0;border-top:1px solid var(--line)}
.cu-dl>div:first-child{border-top:0}
.cu-dl dt{color:var(--muted);font-size:13px}
.cu-dl dd{margin:0;overflow-wrap:anywhere}
.cu-link{border:0;background:none;color:var(--navy);font:inherit;font-weight:600;padding:0;cursor:pointer;text-decoration:underline}

.cu-fab{position:fixed;right:16px;bottom:calc(76px + env(safe-area-inset-bottom,0px));z-index:5;
  min-height:var(--tap);padding:0 18px;border:0;border-radius:999px;background:var(--navy);color:var(--white);
  font:inherit;font-weight:600;box-shadow:var(--shadow);cursor:pointer}

.cu-scope{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;justify-content:center}
/* display:flex above beats the browser's own [hidden] rule; an invisible full-screen layer would
   swallow every tap (build-traps.md, 28/10/2026). */
.cu-scope[hidden]{display:none!important}
.cu-backdrop{position:absolute;inset:0;background:rgba(27,46,58,.45)}
.cu-panel{position:relative;width:100%;max-width:560px;max-height:92vh;overflow:auto;background:var(--white);box-sizing:border-box;
  border-radius:16px 16px 0 0;padding:18px 16px calc(18px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:6px}
.cu-panel h2{margin:0 0 6px;font-size:18px;color:var(--navy)}
.cu-panel label{display:block;font-size:12px;font-weight:600;color:var(--muted);margin:8px 0 4px;letter-spacing:.03em}
.cu-panel input,.cu-panel select{width:100%;box-sizing:border-box;min-height:44px;border:1px solid var(--line);
  border-radius:10px;padding:10px 12px;font:inherit;background:var(--white);color:var(--ink)}
.cu-two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.cu-ask{margin-top:12px;padding:12px;border-radius:12px;background:var(--cu-ask-bg);display:flex;flex-direction:column;gap:8px}
.cu-ask h3{margin:0;font-size:16px;color:var(--ink)}
.cu-ask p{margin:0;font-size:14px}
.cu-ask .cu-item{background:var(--white);border:1px solid var(--line);border-radius:10px}
.cu-err{margin:6px 0 0;padding:8px 12px;border-radius:10px;background:var(--cu-bad-bg);color:var(--cu-bad);font-size:14px}
.cu-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}
.cu-btn{min-height:var(--tap);padding:0 20px;border-radius:999px;border:0;background:var(--navy);color:var(--white);font:inherit;font-weight:600;cursor:pointer}
.cu-btn.ghost{background:var(--white);color:var(--ink);border:1px solid var(--line)}
.cu-btn:disabled{opacity:.6}

/* Deposit paid or not on an app job (ruling 126, 31/10/2026). */
.cu-pill.dep-ok{background:#E3F4EA;color:#1E6B3A}
.cu-pill.dep-no{background:#FFF3D6;color:#7A5200}
/* Recent customers before anyone types (refine 03/11/2026) */
.cu-recent-h{margin:14px 0 8px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}

/* Change details (ruling 203, 04/11/2026). */
.cu-edit{display:flex;flex-direction:column;gap:8px;border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--paper)}
.cu-f{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted)}
.cu-f input,.cu-f select{font:inherit;font-size:16px;color:var(--ink);min-height:40px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--white)}
.cu-edit .cu-row{display:flex;gap:8px;flex-wrap:wrap}
