/* Task Helper — clients on screen (job-intake.md §28; BRIEF-932). Copyright Rapid Surveys Pty Ltd. App tokens only. */
.cl-field select { width: 100%; }
.cl-field select.cl-inherited { color: var(--muted); }   /* the inherited client, in grey (the words say "from job …" too) */
.cl-inh { margin: 4px 0 0; font-size: 13px; }
.cl-acts { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 0; }
.cl-acts .chip { width: auto; }
.cl-acts [hidden] { display: none; }
.cl-newbox { display: flex; flex-direction: column; gap: 6px; margin: 8px 0 0; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); }
.cl-newbox[hidden] { display: none; }
.cl-newbox input { margin: 0; }
.cl-nbtns { display: flex; gap: 8px; } .cl-nbtns button { width: auto; }
.cl-msg { margin: 4px 0 0; }
.cl-card { display: block; margin: 2px 0 0; font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cl-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.cl-setting select { width: 100%; max-width: 24em; }
.cl-ro { margin: 2px 0 0; }
.cl-job { margin: 4px 0 8px 22px; } .cl-job .cl-setting { margin: 0; } .cl-job label { font-size: 13px; }
@media (pointer: coarse) { .cl-acts .chip, .cl-nbtns button, .cl-setting select, .cl-field select { min-height: 44px; } }
/* The client's details inside the page's "Client" form box (NOTE-932f): read-only, phone / email as links. */
.cl-inner { margin: 0 0 8px; }
.cl-details { display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; margin: 0 0 12px; font-size: 14px; }
.cl-details[hidden] { display: none; }
.cl-details > div { display: contents; }
.cl-details dt { color: var(--muted); }
.cl-details dd { margin: 0; overflow-wrap: anywhere; }
.cl-details a { color: var(--accent); }
@media (max-width: 400px) { .cl-details { grid-template-columns: 1fr; gap: 0; } .cl-details dd { margin: 0 0 6px; } }
@media (pointer: coarse) { .cl-details a { display: inline-block; min-height: 44px; line-height: 44px; } }