/* ============================================================
   deal-detail-v2.css — DETAIL DEALU v2 (dle uploads/pipeline1–6.png)
   Načítá se PO styles.css i pipeline-deal-v2.css.
   TOKEN-DRIVEN → GT fialová / UNI-TOP oranžová bez další práce.
   Platí pro OBA režimy (light i dark); theme-gated je jen pár doladění.
   Scope: výhradně .dd* uvnitř #drawer → nedotýká se pipeline boardu,
   modalů ani IVT.
   ============================================================ */

/* ---------- 1) HLAVIČKA DETAILU ---------- */
#drawer .dd{flex:0 0 auto;background:var(--surface);border-bottom:1px solid var(--line)}
#drawer .dd__top{padding:14px 64px 10px 24px}
#drawer .dd__eyebrow{font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--accent)}
#drawer .dd__hrow{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-top:5px}
#drawer .dd__hmain{min-width:0;display:flex;flex-direction:column;gap:9px}
#drawer .dd__title{font-size:20px;line-height:1.18;font-weight:800;letter-spacing:-.022em;margin:0;text-wrap:pretty}
#drawer .dd__badges{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
#drawer .dd__hval{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right}
#drawer .dd__hval span{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
#drawer .dd__hval b{font-size:20px;font-weight:800;letter-spacing:-.025em;font-family:var(--mono);white-space:nowrap}
#drawer .dd__hacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:11px}
#drawer .dd__hacts a.btn,#drawer .dd-card a.btn{text-decoration:none}

#drawer .dd-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:800;border-radius:7px;padding:3px 9px;letter-spacing:.01em}
#drawer .dd-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
#drawer .dd-badge--open{background:var(--accent-soft);color:var(--accent-ink)}
#drawer .dd-badge--won{background:rgba(34,160,101,.14);color:#1a8a56}
#drawer .dd-badge--lost{background:rgba(214,72,72,.14);color:#c04141}
#drawer .dd-badge--arch{background:var(--chip-soft);color:var(--muted)}
#drawer .dd-chip{display:inline-flex;align-items:center;font-size:11px;font-weight:700;background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:var(--ink-2)}
#drawer .dd-chip--tag{background:transparent;border-style:dashed}

/* ---------- 2) STEPPER FÁZÍ ---------- */
#drawer .dd__stepper{display:flex;align-items:stretch;gap:3px;padding:0 24px 11px;overflow-x:auto;scrollbar-width:thin}
#drawer .dd-step{display:flex;align-items:center;gap:8px;flex:1 1 0;min-width:128px;background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:8px 12px;cursor:pointer;font-family:inherit;color:var(--muted);transition:background .13s,border-color .13s,color .13s}
#drawer .dd-step__dot{width:9px;height:9px;border-radius:50%;border:2px solid currentColor;flex:0 0 auto}
#drawer .dd-step__t{font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em}
#drawer .dd-step:not(.dd-step--ro):hover{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-soft)}
#drawer .dd-step.is-done{color:var(--ink-2)}
#drawer .dd-step.is-done .dd-step__dot{background:currentColor}
#drawer .dd-step.is-cur{background:var(--accent);border-color:transparent;color:#fff;box-shadow:var(--shadow-1)}
#drawer .dd-step.is-cur .dd-step__dot{background:#fff;border-color:#fff}
#drawer .dd-step--ro{cursor:default}

/* ---------- 3) SOUHRNNÉ DLAŽDICE ---------- */
#drawer .dd__tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:0 24px 11px}
#drawer .dd-tile{background:var(--surface-2);border:1px solid var(--line);border-radius:11px;padding:8px 12px;display:flex;flex-direction:column;gap:1px;min-width:0}
#drawer .dd-tile span{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#drawer .dd-tile b{font-size:15px;font-weight:800;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- 4) TABY ---------- */
#drawer .dd__tabs{display:flex;gap:2px;padding:0 24px;overflow-x:auto;scrollbar-width:none}
#drawer .dd__tabs::-webkit-scrollbar{display:none}
#drawer .dd-tab{display:inline-flex;align-items:center;gap:7px;background:none;border:0;border-bottom:2px solid transparent;padding:9px 13px;font-family:inherit;font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer;white-space:nowrap;transition:color .12s,border-color .12s}
#drawer .dd-tab .i{opacity:.75}
#drawer .dd-tab:hover{color:var(--ink)}
#drawer .dd-tab.is-active{color:var(--accent-ink);border-bottom-color:var(--accent)}
#drawer .dd-tab.is-active .i{opacity:1;color:var(--accent)}

/* ---------- 5) OBSAH — mřížka karet + pravý panel ---------- */
#drawer .drawer__body{padding:18px 24px 32px;background:var(--bg,var(--surface-2))}
#drawer .dd__grid{display:grid;grid-template-columns:minmax(0,1fr) 336px;gap:16px;align-items:start}
#drawer .dd__grid--2{grid-template-columns:minmax(0,1fr) 380px}
#drawer .dd__main,#drawer .dd__side{display:flex;flex-direction:column;gap:14px;min-width:0}
#drawer .dd__side.is-dim{opacity:.5}
#drawer .dd-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
#drawer .dd-card__h{margin:0;padding:12px 16px 10px;font-size:12.5px;font-weight:800;letter-spacing:-.005em;color:var(--ink);border-bottom:1px solid var(--line-2)}
#drawer .dd-card__b{padding:12px 16px 14px}
#drawer .dd-card--qa .dd-card__b{padding:12px}

/* řádky klíč → hodnota */
#drawer .dd-f{display:grid;grid-template-columns:118px minmax(0,1fr);gap:12px;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--line-2)}
#drawer .dd-f:last-child{border-bottom:0;padding-bottom:0}
#drawer .dd-f__k{font-size:11.5px;font-weight:600;color:var(--muted)}
#drawer .dd-f__v{font-size:13px;font-weight:700;color:var(--ink);min-width:0;overflow-wrap:anywhere}
#drawer .dd-f__v a{color:var(--accent-ink);text-decoration:none}
#drawer .dd-f__v a:hover{text-decoration:underline}
#drawer .dd-f--rating .dd-f__v{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
#drawer .dd-f__hint{font-size:11px;font-weight:600;color:var(--muted)}
#drawer .dd-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-right:7px;vertical-align:middle}
#drawer .dd-link{background:none;border:0;padding:0;font-family:inherit;font-size:13px;font-weight:700;color:var(--accent-ink);cursor:pointer}
#drawer .dd-link:hover{text-decoration:underline}
#drawer .dd-mono{font-family:var(--mono);font-size:12px}
#drawer .dd-cols2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;align-items:start}
#drawer .dd-cardacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
#drawer .dd-qa{display:flex;flex-direction:column;gap:7px}
#drawer .dd-qa .btn{width:100%;justify-content:flex-start}

/* formulářová pole v detailu */
#drawer .dd-fld{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
#drawer .dd-fld:last-child{margin-bottom:0}
#drawer .dd-fld>label{font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--muted)}
#drawer .dd-in{width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-size:13px;font-weight:600;font-family:inherit;color:var(--ink);background:var(--surface);outline:none}
#drawer textarea.dd-in{resize:vertical;line-height:1.5;font-weight:500}
#drawer .dd-in[readonly]{background:var(--surface-2);color:var(--ink-2)}

/* pravděpodobnost */
#drawer .dd-prog{height:6px;border-radius:99px;background:var(--line-2);overflow:hidden;margin-top:12px}
#drawer .dd-prog__bar{height:100%;border-radius:99px;background:var(--accent)}

/* aktivity */
#drawer .dd-act{display:flex;align-items:flex-start;gap:9px;padding:7px 0;border-bottom:1px solid var(--line-2)}
#drawer .dd-act:last-child{border-bottom:0;padding-bottom:0}
#drawer .dd-act__i{width:26px;height:26px;border-radius:8px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center;flex:0 0 auto}
#drawer .dd-act__b{min-width:0;display:flex;flex-direction:column;gap:1px}
#drawer .dd-act__b b{font-size:12.5px;font-weight:700;overflow-wrap:anywhere}
#drawer .dd-act__b span{font-size:11px;color:var(--muted)}
#drawer .dd-act__ok{margin-left:auto;color:#1a8a56;flex:0 0 auto}

/* štítky */
#drawer .dd-tagbox{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:7px}
#drawer .dd-tag{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;background:var(--accent-soft);color:var(--accent-ink);border-radius:7px;padding:3px 5px 3px 9px}
#drawer .dd-tag button{background:none;border:0;padding:0;display:grid;place-items:center;color:inherit;opacity:.6;cursor:pointer}
#drawer .dd-tag button:hover{opacity:1}

/* prvky převzaté ze starého detailu — usadit do karet */
#drawer .dd-card .sec-title{margin:16px 0 8px;padding:0;background:none;border:0}
#drawer .dd-card .sec-title:first-child{margin-top:0}
#drawer .dd-card .quickmove{margin:0 0 4px}
#drawer .dd-card .field{padding:6px 0;border-bottom:1px solid var(--line-2)}
#drawer .dd-card .field:last-child{border-bottom:0}
#drawer .dd-card .dprod__sum{margin-top:10px}
#drawer .dd-card .note-add{margin:0}
#drawer .dd-card .timeline{margin:0}
#drawer .dd-card .drawer__danger{margin-top:14px;padding-top:12px}
#drawer .dpanel .dpanel__head{margin-bottom:14px}

/* ---------- 6) RESPONSIVE ---------- */
@media(max-width:1500px){#drawer .dd__grid{grid-template-columns:minmax(0,1fr) 300px}#drawer .dd__grid--2{grid-template-columns:minmax(0,1fr) 330px}}
@media(max-width:1280px){#drawer .dd__grid,#drawer .dd__grid--2{grid-template-columns:minmax(0,1fr)}#drawer .dd__tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){#drawer .dd__top,#drawer .dd__stepper,#drawer .dd__tiles,#drawer .dd__tabs{padding-left:16px;padding-right:16px}#drawer .dd__top{padding-right:56px}#drawer .drawer__body{padding:14px 16px 28px}#drawer .dd__hrow{flex-direction:column;gap:10px}#drawer .dd__hval{align-items:flex-start;text-align:left}#drawer .dd__tiles{grid-template-columns:repeat(2,minmax(0,1fr))}#drawer .dd-cols2{grid-template-columns:1fr}#drawer .dd-f{grid-template-columns:1fr;gap:1px}}

/* ---------- 7) TMAVÝ REŽIM — jen doladění kontrastu ---------- */
html[data-theme="dark"] #drawer .drawer__body{background:var(--bg)}
html[data-theme="dark"] #drawer .dd-card{background:var(--surface);border-color:var(--line)}
html[data-theme="dark"] #drawer .dd-in{background:var(--surface-2)}
html[data-theme="dark"] #drawer .dd-in[readonly]{background:var(--line-2);color:var(--muted)}
html[data-theme="dark"] #drawer .dd-badge--won{background:rgba(52,199,133,.16);color:#4fd39c}
html[data-theme="dark"] #drawer .dd-badge--lost{background:rgba(240,110,110,.16);color:#f08c8c}
html[data-theme="dark"] #drawer .dd-act__ok{color:#4fd39c}
html[data-theme="dark"] #drawer .dd-step:not(.is-cur){background:var(--surface-2)}
