/* Control › 위험 경로 › 경로 상세 (security-path-detail.js, T23-37). The cards, tables, chain and name-value pairs are the
   shared parts (lx-; 리디자인 명세 6.9); only what is this screen's own is here: the head's line, the four-lane chain, the
   chain beside its rail, the instant's bar and a few cells' wrapping. */
.spd{min-width:0;word-break:keep-all;overflow-wrap:anywhere}

/* The head: the way back and the cause, the marks under it, and the view on its right. */
.spd-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:8px 24px}
.spd-title{display:flex;flex-direction:column;gap:4px;min-width:0}
.spd-back{font-size:13px;color:var(--ds-text-3)}
.spd-line{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0}
.spd-line .lx-sub{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px}
.spd-backline{margin:12px 0 0;text-align:center}

/* The instant an incident view is of: its input, its button and the runs' times. */
.spd-at{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px}
.spd-at input.lx-in{height:32px;width:auto}
.spd-at-runs{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px;margin-left:8px}

/* The chain and, beside it, the rail of what is pressed; the rail stays in sight while the page scrolls. */
.spd-main{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.spd-left{min-width:0}
.spd-rail{position:sticky;top:12px;min-width:0}
.spd-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-items:start}
.spd-card{min-width:0}
.spd-card .lx-card-h .spd-push{margin-left:auto}
.spd-scroll{overflow-x:auto}

/* The path's four lanes instead of the asset page's five; a lane is a list item, its marker none. */
.spd .spd-chain{grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 16px;padding:0;list-style:none}
.spd-node{width:100%;cursor:pointer}
.spd-node.lx-is-sel,.spd-node.lx-is-sel:hover{border-color:var(--ds-accent);background:var(--ds-accent-soft)}
.spd-node .lx-cell{min-width:0}
.spd-edge{display:inline;text-align:left;font-weight:500}
.spd-edge-at{display:block;margin-top:2px}
.spd-days{white-space:nowrap}
.spd-id{font-size:12.5px;word-break:break-all}
.spd-said{display:inline-flex;align-items:center;gap:4px 6px;white-space:nowrap}

/* The name-value pairs of the rail and the links; a value of several lines keeps each its own. */
.spd .spd-kv{grid-template-columns:92px minmax(0,1fr);gap:8px 12px;margin-top:8px}
.spd-cond,.spd-cite{display:flex;flex-wrap:wrap;align-items:center;gap:4px 6px}
.spd-cites{min-width:0}
.spd-links{margin-top:10px;gap:6px 10px}
.spd [data-spd-hint]{margin:12px 0 0}
.spd-run{margin-top:12px;padding-top:12px;border-top:1px solid var(--ds-line)}
.spd-run .lx-note{margin-top:8px}

@media (max-width:1180px){
  .spd-main,.spd-two{grid-template-columns:minmax(0,1fr)}
  .spd-rail{position:static}
}
@media (max-width:720px){
  .spd .spd-chain{grid-template-columns:minmax(0,1fr)}
  .spd .lx-chain .lx-lane+.lx-lane::before{display:none}
}

/* Permission comparisons are shared with the declaration page; long provider names and ARNs stay copyable. */
.pnc-list,.pnc-step,.pnc-detail{min-width:0;overflow-wrap:anywhere}
.pnc-step{padding:12px 0;border-top:1px solid var(--ds-line)}
.pnc-step dl,.pnc-coverage{margin:8px 0}
.pnc-step dd,.pnc-coverage dd{margin:0 0 8px}
.pnc-coverage>div{display:flex;flex-wrap:wrap;gap:8px 16px}
.pnc-result{display:inline-block;margin:4px 8px 4px 0}
.pnc-code{display:inline;word-break:break-all}
.pnc-code code{user-select:text}
.pnc-code button{vertical-align:baseline}
.pnc-scroll{max-width:100%;overflow-x:auto}
.pnc-scroll table{min-width:520px}
.pnc-scroll td{vertical-align:top;max-width:320px}
.spd-comparison{margin-top:12px}
.psn-picker{margin:12px 0}
#security-permission-need-root{min-width:0;overflow-wrap:anywhere}
#security-permission-need-root>.lx-t{table-layout:fixed}
#security-permission-need-root>.lx-t>tbody>tr>td{vertical-align:top}
#security-permission-need-root .lx-form{margin-top:20px;max-width:760px}
#security-permission-need-root .lx-field{margin:10px 0}
#security-permission-need-root .lx-fs{margin:12px 0;padding:12px;border:1px solid var(--ds-line);border-radius:8px}
.pnc-step dt{color:var(--ds-text-3);font-size:13px}
.pnc-step ul{padding-left:18px;list-style:disc}
/* 업무 필요 권한: the form's save and clear stand on one row at its end. */
#security-permission-need-root .psn-actions{gap:var(--sp-2);margin-top:var(--sp-4)}