/* ============================================================
   민자사업 화면 — 판정 · 절차 · 사례 · 근거 · 초안

   세 가지를 확정값과 다르게 그린다 (`views.js` 머리말).
   - `확인 필요` — 빨강 테두리. 비대상(초록)과 섞이면 안 된다
   - `조건부` 단계 — 점선 테두리
   - 통상 소요기간 — 점선 막대 + `참고` 꼬리표
   ============================================================ */

.src-bar {
  display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap;
  padding: 8px 12px; margin-bottom: 18px;
  border: 1px solid var(--accent-border); background: var(--accent-subtle);
  border-radius: var(--r-8); font-size: var(--fs-11); color: var(--accent-text);
}
.src-bar b { font-weight: 700; }

/* 판정 요약 띠 */
.verdict {
  border: 1px solid var(--border-2); border-left: 4px solid var(--success);
  border-radius: var(--r-8); background: var(--bg-panel); padding: 12px 15px; margin-bottom: 16px;
}
.verdict > b { display: block; font-size: var(--fs-13); font-weight: 650; line-height: 1.55; }
.verdict > span { display: block; margin-top: 4px; font-size: var(--fs-11); color: var(--text-2); line-height: 1.65; }
.verdict[data-s="unknown"] { border-left-color: var(--danger); background: #fffafa; }

/* 판정 표 */
.tb.chk td { vertical-align: top; line-height: 1.6; }
.tb.chk tr[data-s="unknown"] td:first-child { box-shadow: inset 3px 0 0 var(--danger); }
.tb.chk tr[data-s="applies"] td:first-child { box-shadow: inset 3px 0 0 var(--warning); }
.tb.chk tr[data-s="not"] td:first-child { box-shadow: inset 3px 0 0 var(--success); }
.tb.chk tr[data-s="conditional"] td:first-child { box-shadow: inset 3px 0 0 var(--accent); }
.tb tr.hl td { background: var(--accent-subtle); }
.needs {
  display: inline-block; margin-top: 5px; padding: 1px 7px; border-radius: var(--r-4);
  background: var(--danger-subtle); color: var(--danger); font-size: var(--fs-10); font-weight: 650;
}

.refchip {
  display: inline-flex; align-items: center; margin: 1px 3px 1px 0; padding: 1px 7px;
  border: 1px solid var(--accent-border); border-radius: 999px; background: var(--bg-panel);
  font: inherit; font-size: var(--fs-10); font-weight: 650; color: var(--accent-text);
  cursor: pointer; white-space: nowrap;
}
.refchip:hover { background: var(--accent-subtle); }
.refchip.wide { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.bt-refs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.bt-b .li { display: block; padding-left: 12px; position: relative; }
.bt-b .li::before { content: "·"; position: absolute; left: 3px; }

/* 가정 */
.assume { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 9px; }
.assume .as {
  border: 1px solid var(--border-1); border-radius: var(--r-8); background: var(--bg-panel);
  padding: 11px 13px; display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
}
.assume .as.on { border-style: dashed; border-color: var(--warning-border); background: var(--warning-subtle); }
.assume .ak { font-size: var(--fs-10); color: var(--text-3); font-weight: 650; width: 100%; }
.assume b { font-size: var(--fs-15); font-weight: 700; }
.assume .ad { width: 100%; font-size: var(--fs-11); color: var(--text-2); line-height: 1.6; }

/* 절차 */
.tile.ref { border-style: dashed; }
label.mini { font-size: var(--fs-10); color: var(--text-3); font-weight: 650; display: inline-flex; align-items: center; gap: 4px; }
.stage {
  border: 1px solid var(--border-1); border-radius: var(--r-8); background: var(--bg-panel);
  margin-bottom: 8px; overflow: hidden;
}
.stage.maybe { border-style: dashed; border-color: var(--danger-border); }
.stage.hl { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-subtle); }
.sg-h { display: flex; align-items: center; gap: 8px; padding: 10px 13px; background: var(--bg-sidebar); flex-wrap: wrap; }
.sg-h .no {
  display: grid; place-items: center; width: 20px; height: 20px; border-radius: var(--r-4);
  background: var(--accent); color: #fff; font-size: var(--fs-10); font-weight: 700; flex: 0 0 auto;
}
.stage.maybe .sg-h .no { background: var(--bg-panel); color: var(--danger); border: 1px dashed var(--danger); }
.sg-h b { font-size: var(--fs-13); font-weight: 650; }
.sg-h .who { font-size: var(--fs-10); color: var(--text-3); }
.sg-m { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.mbar { width: 120px; height: 8px; border-radius: 4px; border: 1px dashed var(--border-3); overflow: hidden; }
.mbar i { display: block; height: 100%;
  background: repeating-linear-gradient(90deg, var(--accent-border) 0 4px, transparent 4px 7px); }
.sg-m .ml { font-size: var(--fs-10); color: var(--text-2); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sg-m .ml em { font-style: normal; padding: 0 4px; border-radius: 3px; background: var(--bg-subtle); color: var(--text-3); margin-left: 2px; }
.sg-c { padding: 6px 13px; font-size: var(--fs-11); color: var(--danger); background: #fffafa; border-top: 1px dashed var(--danger-border); }
.sg-b { padding: 9px 13px 11px; }
.sg-b ul { margin: 0 0 7px; padding-left: 17px; }
.sg-b li { font-size: var(--fs-12); color: var(--text-1); line-height: 1.7; }
.sg-r { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.sg-r .k { font-size: var(--fs-10); color: var(--text-3); font-weight: 650; margin: 0 2px 0 6px; }
.sg-r .k:first-child { margin-left: 0; }
.sg-r .btn { margin-left: auto; }

/* 사례 · 근거 */
.card.qa { padding: 12px 15px; }
.card.qa .qh { display: flex; align-items: flex-start; gap: 8px; justify-content: space-between; margin-bottom: 5px; }
.card.qa .qh b { font-size: var(--fs-12); font-weight: 650; }
.sec.hl > .sec-h h3 { color: var(--accent-text); }
.guides { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 7px; margin-bottom: 9px; }
.guide {
  display: flex; flex-direction: column; gap: 4px; padding: 10px 12px;
  border: 1px solid var(--border-1); border-radius: var(--r-8); background: var(--bg-panel);
  text-decoration: none; color: inherit;
}
.guide:hover { border-color: var(--accent-border); background: var(--accent-subtle); }
.guide b { font-size: var(--fs-12); font-weight: 650; line-height: 1.45; }
.guide .tag { align-self: flex-start; }
.qa-list { border: 1px solid var(--border-1); border-radius: var(--r-8); background: var(--bg-panel); overflow: hidden; }
.qa-r {
  display: grid; grid-template-columns: auto 1fr; gap: 3px 8px; align-items: baseline;
  width: 100%; padding: 9px 13px; border: 0; border-bottom: 1px solid var(--border-1);
  background: transparent; font: inherit; text-align: left; cursor: pointer;
}
.qa-r:last-child { border-bottom: 0; }
.qa-r:hover { background: var(--bg-sidebar); }
.qa-r b { font-size: var(--fs-12); font-weight: 650; }
.qa-r .ex { grid-column: 2; font-size: var(--fs-11); color: var(--text-3); line-height: 1.55; }

/* 초안 */
.dchap { margin: 18px 0 7px; font-size: var(--fs-13); font-weight: 700; color: var(--text-2); }
.dsec { border: 1px solid var(--border-1); border-radius: var(--r-8); background: var(--bg-panel); margin-bottom: 6px; }
.dsec[data-m="ai"] { border-color: #bfe3cc; }
.dsec[data-m="pending"] { border-style: dashed; border-color: var(--warning-border); }
.dsec > summary {
  display: flex; align-items: center; gap: 8px; padding: 9px 13px; cursor: pointer; list-style: none;
}
.dsec > summary::-webkit-details-marker { display: none; }
.dsec > summary b { font-size: var(--fs-12); font-weight: 650; }
.dsec[open] > summary { border-bottom: 1px solid var(--border-1); }
.dtext { padding: 10px 14px; font-size: var(--fs-12); line-height: 1.8; white-space: pre-wrap; color: var(--text-1); }
.dtext mark { background: #fff1a8; padding: 0 2px; border-radius: 2px; }
.dsec .unres { margin: 0 14px 10px; }
.orig { margin: 0 14px 10px; border: 1px dashed var(--border-2); border-radius: var(--r-6); }
.orig > summary { padding: 6px 10px; font-size: var(--fs-11); color: var(--text-3); cursor: pointer; }
.orig .dtext { color: var(--text-2); font-size: var(--fs-11); }

/* 원문 창 */
.docbody { white-space: pre-wrap; font-size: var(--fs-12); line-height: 1.8; max-height: 62vh; overflow: auto; color: var(--text-1); }

/* 설정 */
.card.ref { border-style: dashed; }
.durs { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.dur em { font-style: normal; font-size: var(--fs-10); color: var(--text-3); margin-right: 5px; }
.dur b { font-size: var(--fs-12); font-variant-numeric: tabular-nums; }
select.inp { padding-right: 6px; }
