/* ===== Клиенты: директория ===== */
.clients-wrap{padding-bottom:40px}
.cl-bar{display:flex;align-items:center;justify-content:space-between;padding:6px 2px 16px}
.cl-count{font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.cl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.cl-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:16px 18px;cursor:pointer;
  transition:border-color .15s,transform .12s,box-shadow .15s}
.cl-card:hover{border-color:var(--line2);transform:translateY(-2px);box-shadow:var(--shadow)}
.cl-card:active{transform:translateY(0)}
.cl-top{display:flex;align-items:center;gap:12px;margin-bottom:14px;min-width:0}
.cl-av{width:42px;height:42px;border-radius:12px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:17px;color:var(--av-fg);background:var(--av-bg);border:1px solid var(--line2)}
.cl-idd{min-width:0}
.cl-name{font-weight:700;font-size:16px;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-phone{color:var(--muted);font-size:13px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--accent);font-weight:700;letter-spacing:.02em}
.cl-bot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:13px;border-top:1px solid var(--line)}
.cl-cargos{font-size:13px;color:var(--muted)}
.cl-owed{font-weight:700;font-size:15px}
.cl-owed.owe{color:var(--accent)}
.cl-owed.clear{color:var(--muted);font-weight:500;font-size:13px}

/* карточка клиента (drawer) */
.cl-sum{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px}
.cl-sum-i{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px 12px;text-align:center}
.cl-sum-i b{display:block;font-size:19px;font-weight:800;letter-spacing:-.01em}
.cl-sum-i b.owe{color:var(--accent)}
.cl-sum-i span{display:block;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:3px}
.cl-cargo{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--panel);
  border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:9px;cursor:pointer;transition:border-color .15s}
.cl-cargo:hover{border-color:var(--line2)}
.cl-cargo-h{display:flex;align-items:center;gap:9px}
.cl-cargo-h b{font-size:15px;font-weight:700}
.cl-cargo-route{color:var(--muted);font-size:12.5px;margin-top:4px}
.cl-cargo-r{text-align:right;font-weight:700;font-size:15px;white-space:nowrap}
.cl-cargo-r small{display:block;font-weight:500;font-size:11.5px;color:var(--muted);margin-top:2px}
.cl-cargo-r small.owe{color:var(--accent)}

@media(max-width:560px){.cl-grid{grid-template-columns:1fr}}