/*
 * Objednávky + ceník — feature styly stavěné VÝHRADNĚ na DS tokenech (mirrors
 * evidence.css / finance.css). Record shell přebírá .pr-* (person-record.css),
 * listy SegmentTable, formuláře DrawerForm/Popup, status pilulky kanonický
 * .acrm-pill <tone> (ds.css). Zde jen to, co je specifické: výběr služeb
 * (dlaždice tarifů), tabulka položek a řádek splátkového kalendáře / úkolu.
 */

/* ---- výběr služeb (jedna dlaždice = jeden název; uvnitř tlačítka tarifů) ---- */
.ord-svc-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--sp-4);
}
.ord-svc {
  display: grid;
  gap: var(--sp-3);
  align-content: start;
  padding: var(--sp-4);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: var(--bg-canvas);
}
.ord-svc-nm {
  font: var(--section);
  font-weight: 600;
  color: var(--fg);
}
.ord-svc-desc {
  font: var(--small);
  color: var(--fg-secondary);
}
.ord-tiers {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-2);
}
.ord-tier {
  display: grid;
  gap: var(--sp-0);
  text-align: left;
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-100);
  color: var(--fg);
  cursor: pointer;
  transition:
    background-color 0.12s ease,
    border-color 0.12s ease,
    color 0.12s ease;
}
.ord-tier:hover {
  background: var(--hover-surface);
}
.ord-tier.on {
  background: var(--accent);
  border-color: var(--accent-press);
  color: var(--fg-on-accent);
}
.ord-tier .tt {
  font: var(--small);
  font-weight: 600;
}
.ord-tier .pp {
  font: var(--small);
}

/* ---- položky objednávky: tabulka = DS <DataTable lite>; pod ní součtová linka ---- */
.ord-total {
  display: flex;
  justify-content: flex-end;
  gap: var(--sp-5);
  align-items: center;
  height: 40px;
  padding: 0 var(--sp-3);
  font: var(--cell);
  font-weight: 600;
}
.ord-total .num {
  font-variant-numeric: tabular-nums;
}

/* Řádky splátek/úkolů/kroků jedou přes DS <RecordList> — .ord-line odstraněn. */

/* ---- veřejný náhled objednávky (mimo shell, bez auth) ---- */
.ord-pub-wrap {
  min-height: 100vh;
  background: var(--surface-100);
  display: grid;
  place-items: start center;
  padding: var(--sp-7) var(--sp-5);
}
.ord-pub-card {
  width: 100%;
  max-width: 720px;
  display: grid;
  gap: var(--sp-5);
  padding: var(--sp-7);
  background: var(--bg-canvas);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.ord-pub-foot {
  display: flex;
  justify-content: space-between;
  gap: var(--sp-3);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--border);
  font: var(--small);
  color: var(--fg-muted);
}

/* ---- návrh párování z banky (pod řádkem splátky) ---- */
.ord-suggest {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-2) var(--sp-3);
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-75);
  font: var(--small);
}
.ord-suggest .grow {
  flex: 1;
  min-width: 0;
}

/* ==== realizační projekty (delivery projects) — .dp-* ===================== */

/* mini progress bar (seznam · úkol · veřejný náhled) */
.dp-prog {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  min-width: 110px;
}
.dp-bar {
  position: relative;
  flex: 1;
  min-width: 56px;
  height: 6px;
  border-radius: var(--radius-pill);
  background: var(--surface-100);
  overflow: hidden;
}
.dp-bar > i {
  position: absolute;
  inset: 0 auto 0 0;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}
.dp-bar.full > i {
  background: var(--positive-ink);
}
.dp-prog-v {
  font: var(--small);
  color: var(--fg-secondary);
  font-variant-numeric: tabular-nums;
  min-width: 40px;
  text-align: right;
}

/* fáze (skupina úkolů) — nadpis + počet hotových */
.dp-phase {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin: var(--sp-5) 0 var(--sp-2);
}
.dp-phase:first-child {
  margin-top: 0;
}
.dp-phase .nm {
  font: var(--section);
  font-weight: 600;
  color: var(--fg);
}
.dp-phase .ct {
  font: var(--small);
  color: var(--fg-muted);
}
.dp-phase .dp-prog {
  margin-left: auto;
  min-width: 140px;
}

/* balík akcí na řádku úkolu — smí zalomit na úzké ploše */
.dp-acts {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  flex-wrap: wrap;
  flex: none;
}

/* komentář (interní / viditelné klientovi) */
.dp-comment {
  display: grid;
  gap: var(--sp-2);
  padding: var(--sp-3) 0;
  border-bottom: 1px solid var(--border);
}
.dp-comment:last-child {
  border-bottom: 0;
}
.dp-comment-h {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font: var(--small);
  color: var(--fg-secondary);
}
.dp-comment-b {
  font: var(--p);
  color: var(--fg);
  white-space: pre-wrap;
}
.dp-composer {
  display: grid;
  gap: var(--sp-3);
  margin-top: var(--sp-4);
  padding-top: var(--sp-4);
  border-top: 1px solid var(--border);
}
.dp-composer-row {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-wrap: wrap;
}

/* přepínač viditelnosti komentáře (interní ↔ klient) */
.dp-seg {
  display: inline-flex;
  gap: var(--sp-0);
  padding: var(--sp-0);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-75);
}
.dp-seg button {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  padding: var(--sp-1) var(--sp-3);
  border: 0;
  border-radius: var(--radius-xs);
  background: transparent;
  color: var(--fg-secondary);
  font: var(--small);
  cursor: pointer;
}
.dp-seg button.on {
  background: var(--bg-canvas);
  color: var(--fg);
  box-shadow: var(--shadow-1, 0 0 0 1px var(--border));
}

/* box s veřejným odkazem (kopírování) */
.dp-linkbox {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-75);
  font: var(--small);
}
.dp-linkbox .url {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--fg-secondary);
  font-variant-numeric: tabular-nums;
}

/* rozpad rentability (per uživatel / per měsíc) — jednoduchý řádek */
.dp-split {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  min-height: 36px;
  padding: var(--sp-1) var(--sp-2);
  border-bottom: 1px solid var(--border);
  font: var(--cell);
}
.dp-split:last-child {
  border-bottom: 0;
}
.dp-split .grow {
  flex: 1;
  min-width: 0;
}
.dp-split .val {
  font-variant-numeric: tabular-nums;
  color: var(--fg-secondary);
  min-width: 72px;
  text-align: right;
}

/* ==== task-flow / WorkFlow (Čeká → Na řadě → Hotovo) — .wf-* ============== */

/* souhrn projektu — plný progress bar nad statovými kartami */
.wf-sumbar {
  display: grid;
  gap: var(--sp-2);
  margin-bottom: var(--sp-4);
}
.wf-sumbar-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-3);
}
.wf-sumbar-pct {
  font: var(--h2);
  color: var(--fg);
  font-variant-numeric: tabular-nums;
}
.wf-sumbar-lbl {
  font: var(--small);
  color: var(--fg-secondary);
}
.wf-sumbar-track {
  position: relative;
  height: var(--sp-3);
  border-radius: var(--radius-pill);
  background: var(--surface-75);
  overflow: hidden;
}
.wf-sumbar-track > i {
  position: absolute;
  inset: 0 auto 0 0;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}
.wf-sumbar-track.full > i {
  background: var(--positive-ink);
}

/* stavová pilulka task-flow — Čeká (tlumená) · Na řadě (amber, zvýrazněná) · … */

/* role badge (neutrální „Má na starost") */
.wf-role {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  height: 20px;
  padding: 0 var(--sp-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-75);
  color: var(--fg-secondary);
  font: var(--overline);
  white-space: nowrap;
}
.wf-role .ti {
  font-size: var(--ico-2xs);
  color: var(--fg-muted);
}

/* přepínač „Zadání úkolu" (description) — chip jako .wf-role, ale klikací */
.wf-desc-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  height: 20px;
  padding: 0 var(--sp-2);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-75);
  color: var(--fg-secondary);
  font: var(--overline);
  white-space: nowrap;
  cursor: pointer;
}
.wf-desc-btn:hover {
  color: var(--ink-900);
  border-color: var(--border-strong);
}
.wf-desc-btn.on {
  background: var(--accent-tint);
  border-color: var(--accent);
  color: var(--accent-ink);
}
.wf-desc-btn .ti {
  font-size: var(--ico-2xs);
  color: var(--fg-muted);
}
.wf-desc-btn.on .ti {
  color: var(--accent-ink);
}
/* rozbalené zadání úkolu — plný text pod hlavičkou úkolu */
.wf-task-desc {
  font: var(--small);
  color: var(--fg);
  white-space: pre-wrap;
  text-wrap: pretty;
  padding: var(--sp-2) var(--sp-3);
  border-left: 2px solid var(--border-strong);
  background: var(--surface-50);
  border-radius: var(--radius-xs);
}

/* úkol v task-flow — řádek dělený hairlinem (list prostorem, ne krabičkami) */
.wf-task {
  display: grid;
  gap: var(--sp-3);
  padding: var(--sp-3) var(--sp-2);
  border-bottom: 1px solid var(--border);
}
.wf-task:last-child {
  border-bottom: 0;
}
.wf-task.active {
  background: var(--warning-subtle);
  box-shadow: inset 3px 0 0 var(--warning);
  border-radius: var(--radius-xs);
}
.wf-task-head {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.wf-task-head .ri {
  flex: none;
  display: inline-flex;
  color: var(--fg-muted);
  font-size: var(--ico-sm);
}
.wf-task.active .wf-task-head .ri {
  color: var(--warning-ink);
}
.wf-task-head .grow {
  flex: 1;
  min-width: 0;
  display: grid;
  gap: var(--sp-0);
}
.wf-task-nm {
  font: var(--cell);
  color: var(--fg);
}
.wf-task.done .wf-task-nm,
.wf-task.skipped .wf-task-nm {
  color: var(--fg-muted);
}
.wf-task.done .wf-task-nm {
  text-decoration: line-through;
}
.wf-task-sub {
  font: var(--small);
  color: var(--fg-secondary);
}
.wf-chips {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  flex: none;
  flex-wrap: wrap;
  justify-content: flex-end;
}

/* ovládací řádek úkolu — pickery (Zpracuje / Role / Navazuje na) + akce */
.wf-ctl {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-wrap: wrap;
}
.wf-field {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  font: var(--small);
  color: var(--fg-muted);
}
.wf-field > select.acrm-input {
  width: auto;
  min-width: 132px;
  height: var(--control-h);
  font: var(--small);
}
.wf-acts {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin-left: auto;
  flex: none;
}
/* P3 — poznámka o stavu fáze, když chybí předpoklad (např. „nejdřív nabídku") */
.wf-note {
  font: var(--small);
  color: var(--fg-muted);
  font-style: italic;
}

/* řádek pro přidání kroku šablony (fáze · role · hodiny · paralelně · přidat) */
.wf-stepform {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-wrap: wrap;
}
.wf-stepform > .acrm-input {
  width: auto;
}
.wf-stepform > .wf-grow {
  flex: 1 1 160px;
}
.wf-stepform > .wf-role-sel {
  flex: 0 1 180px;
}
.wf-stepform > .wf-hours {
  flex: 0 0 88px;
}
.wf-stepform > .wf-stepform-add {
  margin-left: auto;
}

/* přepínač paralelně / sekvenčně (editor šablon + úkol) */
.wf-parbtn {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  height: var(--control-h);
  padding: 0 var(--sp-3);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-100);
  color: var(--fg-secondary);
  font: var(--small);
  cursor: pointer;
  white-space: nowrap;
}
.wf-parbtn .ti {
  font-size: var(--ico-xs);
}
.wf-parbtn.on {
  background: var(--pill-amber-bg);
  border-color: var(--warning);
  color: var(--pill-amber-ink);
}

/* „Z projektů — na řadě" (osobní úkoly /tasks) */
.wf-sec-title {
  font: var(--h2);
  letter-spacing: var(--tracking-tight);
  margin: 0 0 var(--sp-3);
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.wf-sec-cnt {
  font: 600 11px var(--font-mono);
  color: var(--fg-secondary);
  background: var(--surface-75);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 0 var(--sp-2);
  height: 18px;
  display: inline-grid;
  place-items: center;
  font-variant-numeric: tabular-nums;
}

/* ==== projektové okno (project workspace) — .pw-* ========================
   Dlouhodobý pracovní prostor projektu: hlavička (.pr-top) + kontextová lišta,
   souhrnný proužek (4 buňky), dvousloupcové tělo — vlevo práce (WorkFlow, Tým,
   rentabilita, výkaz), vpravo prominentní diskuse (feed + composer). Vše na DS
   tokenech; a2a = záměrná karta předání práce (AI tón). */

/* scrollovací tělo pod hlavičkou */
.pw-scroll {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: var(--sp-5) var(--sp-6) var(--sp-7);
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
}

/* kontextová lišta — firma · objednávka · tarif · termíny */
.pw-ctx {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-2) var(--sp-3);
  font: var(--small);
  color: var(--fg-secondary);
}
.pw-ctx .sep {
  width: 1px;
  height: 14px;
  background: var(--border);
  flex: none;
}
.pw-tarif {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  color: var(--fg);
}
.pw-tarif .ti {
  font-size: var(--ico-2xs);
  color: var(--fg-muted);
}
.pw-when {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  font-variant-numeric: tabular-nums;
}
.pw-when .ti {
  font-size: var(--ico-2xs);
  color: var(--fg-muted);
}
.pw-note {
  font: var(--small);
  color: var(--fg-muted);
  white-space: pre-wrap;
  margin-top: calc(var(--sp-2) * -1);
}

/* --- kontext projektu: zadání (brief) · odkazy · přílohy --- */
.pw-brief {
  font: var(--p);
  color: var(--fg);
  white-space: pre-wrap;
  text-wrap: pretty;
}
/* editor odkazu — kind · popis · url · přidat (stack na úzku) */
.pw-linkform {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(0, 1.4fr) auto;
  align-items: center;
  gap: var(--sp-2);
  margin-top: var(--sp-3);
}
.pw-linkform > .acrm-input {
  width: auto;
}
.pw-linkform-kind {
  min-width: 140px;
}
@media (max-width: 720px) {
  .pw-linkform {
    grid-template-columns: 1fr;
  }
}
/* horní lišta příloh — typ + nahrát (tlačí se doprava v .pr-block-h) */
.pw-att-tools {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
}
.pw-att-kind {
  width: auto;
  min-width: 140px;
  height: var(--control-h);
}

/* souhrnný proužek — 4 buňky (reuse .pr-card look) */
.pw-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--sp-3);
}
@media (max-width: 1180px) {
  .pw-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
.pw-strip .pr-card {
  min-height: 84px;
}
.pw-cell-bar {
  margin-top: auto;
}

/* dvousloupcové tělo — vlevo práce, vpravo diskuse */
.pw-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 0.82fr);
  gap: var(--sp-5);
  align-items: start;
}
@media (max-width: 1080px) {
  .pw-grid {
    grid-template-columns: 1fr;
  }
}
.pw-work {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-6);
}

/* --- diskuse (prominentní pravý panel) --- */
.pw-chat {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  padding: var(--sp-5);
  background: var(--surface-50);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.pw-chat-h {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}
.pw-chat-h .t {
  font: var(--h3);
  color: var(--ink-900);
  letter-spacing: var(--tracking-tight);
}
.pw-chat-h .cnt {
  font: 600 11px var(--font-mono);
  color: var(--fg-secondary);
  background: var(--surface-75);
  border: 1px solid var(--border);
  border-radius: var(--radius-pill);
  padding: 0 var(--sp-2);
  height: 16px;
  display: inline-grid;
  place-items: center;
  font-variant-numeric: tabular-nums;
}

/* feed — ploché řádky oddělené prostorem */
.pw-feed {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}
.pw-empty {
  font: var(--small);
  color: var(--fg-muted);
  text-align: center;
  padding: var(--sp-5) 0;
}
.pw-msg {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--sp-3);
  align-items: start;
}
.pw-av {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  flex: none;
  display: grid;
  place-items: center;
  font: 600 10px var(--font-display);
  color: hsl(var(--av-hue, 222) 52% 42%);
  background: var(--surface-100);
  border: 1.5px solid hsl(var(--av-hue, 222) 62% 60%);
}
.pw-av.ai {
  color: var(--fg-on-accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-violet));
  border: 0;
}
.pw-av.ai .ti {
  font-size: var(--ico-sm);
}
.pw-msg-main {
  min-width: 0;
  display: grid;
  gap: var(--sp-1);
}
.pw-msg-head {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-2);
}
.pw-msg-name {
  font: 600 13px var(--font-sans);
  color: var(--ink-900);
}
.pw-msg-role {
  font: var(--small);
  color: var(--fg-muted);
}
.pw-msg-when {
  margin-left: auto;
  font: var(--mono);
  color: var(--fg-muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.pw-msg-body {
  font: var(--p);
  color: var(--fg);
  white-space: pre-wrap;
  text-wrap: pretty;
}
.pw-del {
  width: 24px;
  height: 24px;
  border-radius: var(--radius-sm);
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--fg-muted);
  cursor: pointer;
  flex: none;
}
.pw-del:hover {
  background: var(--hover-surface);
  color: var(--critical-ink);
}
.pw-del .ti {
  font-size: var(--ico-xs);
}

/* AI odznak (asistent / A2A tón) */
.pw-badge-ai {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  height: 18px;
  padding: 0 var(--sp-2);
  border-radius: var(--radius-pill);
  background: var(--accent-tint);
  color: var(--accent-ink);
  font: 600 10px var(--font-sans);
  white-space: nowrap;
}
.pw-badge-ai .ti {
  font-size: var(--ico-2xs);
}

/* karta předání práce mezi AI (A2A) — přerušovaný okraj, AI tón */
.pw-a2a {
  display: grid;
  gap: var(--sp-3);
  padding: var(--sp-4);
  border: 1px dashed var(--accent);
  border-radius: var(--radius-md);
  background: var(--accent-tint);
}
.pw-a2a-h {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
}
.pw-a2a-h > .ti {
  font-size: var(--ico-sm);
  color: var(--accent-ink);
}
.pw-a2a-h .t {
  font: 600 11px var(--font-display);
  color: var(--accent-ink);
}
.pw-a2a-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  height: 18px;
  padding: 0 var(--sp-2);
  border-radius: var(--radius-pill);
  font: 600 10px var(--font-sans);
  white-space: nowrap;
}
.pw-a2a-chip .ti {
  font-size: var(--ico-2xs);
}
.pw-a2a-chip.req {
  background: var(--pill-amber-bg);
  color: var(--pill-amber-ink);
}
.pw-a2a-chip.status {
  background: var(--pill-green-bg);
  color: var(--pill-green-ink);
}
.pw-a2a-flow {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--sp-2);
  font: 600 12px var(--font-sans);
  color: var(--ink-900);
}
.pw-a2a-role {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
}
.pw-a2a-role .ti {
  font-size: var(--ico-2xs);
  color: var(--accent-ink);
}
.pw-a2a-flow .arw {
  display: inline-flex;
  color: var(--accent-ink);
}
.pw-a2a-flow .arw .ti {
  font-size: var(--ico-sm);
}
.pw-a2a-body {
  font: var(--small);
  color: var(--fg);
  white-space: pre-wrap;
}
.pw-a2a-task {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  align-self: start;
  height: 20px;
  padding: 0 var(--sp-2);
  border-radius: var(--radius-sm);
  background: var(--surface-100);
  border: 1px solid var(--border);
  color: var(--fg-secondary);
  font: var(--overline);
}
.pw-a2a-task .ti {
  font-size: var(--ico-2xs);
  color: var(--positive-ink);
}

/* člen týmu — avatar + jméno/role + odznak AI */
.pw-team-av {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  flex: none;
  display: grid;
  place-items: center;
  font: 600 10px var(--font-display);
  color: hsl(var(--av-hue, 222) 52% 42%);
  background: var(--surface-100);
  border: 1.5px solid hsl(var(--av-hue, 222) 62% 60%);
}
.pw-team-av.ai {
  color: var(--fg-on-accent);
  background: linear-gradient(135deg, var(--accent), var(--accent-violet));
  border: 0;
}
.pw-team-av .ti {
  font-size: var(--ico-sm);
}

/* veřejný odkaz na klientský náhled (blok na konci pracovního sloupce) */
.pw-share {
  display: grid;
  gap: var(--sp-2);
}

/* veřejný náhled projektu — fáze jako řádky (mimo shell) */
.dp-pub-phase {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  min-height: 40px;
  padding: var(--sp-2) 0;
  border-bottom: 1px solid var(--border);
  font: var(--cell);
}
.dp-pub-phase:last-child {
  border-bottom: 0;
}
.dp-pub-phase .grow {
  flex: 1;
  min-width: 0;
}

/* ── SignaturePad (M3): podpis prstem na bílém „papíře" ── */
.sigpad {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}
.sigpad-canvas {
  width: 100%;
  height: 180px;
  background: #ffffff; /* ds-ok: podpisový „papír" je vždy bílý (i v dark mode), ať je podpis čitelný */
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-md);
  touch-action: none; /* kreslení prstem nesmí scrollovat stránku */
  cursor: crosshair;
  display: block;
}
.sigpad-hint {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  font: var(--small);
  color: var(--fg-muted);
}
.sigpad-hint > span {
  flex: 1;
  min-width: 0;
}
.sigpad-clear {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-1);
  font: 600 12px var(--font-sans);
  color: var(--fg-secondary);
  background: none;
  border: 0;
  padding: var(--sp-1) var(--sp-2);
  cursor: pointer;
  border-radius: var(--radius-xs);
}
.sigpad-clear:hover {
  color: var(--accent);
}
.sigpad-clear svg {
  width: var(--ico-xs);
  height: var(--ico-xs);
}

/* ── Veřejná akceptace + podpis (M3) ── */
.ord-accept {
  display: grid;
  gap: var(--sp-3);
  padding: var(--sp-4);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  background: var(--surface-75);
}
.ord-accepted {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-4);
  border: 1px solid var(--positive);
  border-radius: var(--radius-lg);
  background: var(--positive-subtle);
  color: var(--positive-ink);
}
.ord-accepted svg {
  width: var(--ico-md);
  height: var(--ico-md);
  flex: none;
}
.ord-accepted .t {
  font: 600 14px var(--font-sans);
}
.ord-accepted .s {
  font: var(--small);
  color: var(--fg-secondary);
}

/* ── Uložený podpis na detailu objednávky (M3) ── */
.ord-sig-info {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  flex-wrap: wrap;
}
.ord-sig-info .nm {
  font: 600 14px var(--font-sans);
  color: var(--ink-900);
}
.ord-sig-info .dt {
  font: var(--small);
  color: var(--fg-muted);
}
.ord-sig-img {
  height: 80px;
  max-width: 260px;
  object-fit: contain;
  background: #ffffff; /* ds-ok: podpis je na bílém papíře */
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
}