/* vuln domain styles. Owned by the vuln domain; loaded by index.html.
 * Build on tokens.css and components.css; prefix selectors with .vuln- so
 * nothing here can restyle another domain's screens. */

/* The five severity buckets, one palette everywhere a severity is drawn. */
.vuln-sev-critical { --vuln-c: var(--signal-crit); }
.vuln-sev-high { --vuln-c: var(--signal-warn); }
.vuln-sev-medium { --vuln-c: #e7d36a; }
.vuln-sev-low { --vuln-c: var(--signal-ok); }
.vuln-sev-unrated { --vuln-c: var(--signal-idle); }
/* Pale yellow reads on the dark theme only; darken it on white. */
:root[data-theme="light"] .vuln-sev-medium { --vuln-c: #a16207; }

.vuln-sevbar {
  display: flex;
  height: 10px;
  border-radius: 999px;
  overflow: hidden;
  background: var(--surface-high);
}
.vuln-sevbar.empty { opacity: 0.5; }
.vuln-sevbar > i { background: var(--vuln-c); cursor: pointer; }
.vuln-sevbar > i + i { box-shadow: -1px 0 0 var(--surface); }
.vuln-legend { cursor: pointer; }
.vuln-legend .swatch { width: 8px; height: 8px; border-radius: 2px; background: var(--vuln-c); display: inline-block; }

/* A deadline strip: one column per days-to-deadline range. */
.vuln-strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 6px; }
.vuln-strip-cell { display: flex; flex-direction: column; align-items: center; gap: 2px; cursor: pointer; min-width: 0; }
.vuln-strip-cell .t-label-sm { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.vuln-strip-bar { height: 44px; width: 100%; display: flex; align-items: flex-end; background: var(--surface-low); border-radius: 4px; overflow: hidden; }
.vuln-strip-bar > i { width: 100%; background: var(--signal-live); opacity: 0.7; min-height: 1px; }
.vuln-strip-cell.late .vuln-strip-bar > i { background: var(--signal-crit); }

/* Horizontal bar rows (top assets, tactics, time to fix). */
.vuln-barrow { display: grid; grid-template-columns: minmax(80px, 34%) 1fr 64px; align-items: center; gap: 8px; }
.vuln-barrow.clickable { cursor: pointer; }
.vuln-barrow.clickable:hover .t-body-sm { color: var(--signal-live); }
.vuln-barrow-track { height: 8px; background: var(--surface-high); border-radius: 999px; overflow: hidden; }
.vuln-barrow-track > i { display: block; height: 100%; background: var(--signal-live); opacity: 0.8; }
.vuln-barrow-track > i.k-crit { background: var(--signal-crit); }
.vuln-barrow-track > i.k-warn { background: var(--signal-warn); }
.vuln-barrow-track > i.k-ok { background: var(--signal-ok); }

/* Column chart for daily series. */
.vuln-cols { display: flex; align-items: stretch; gap: 3px; }
.vuln-col { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.vuln-col-stack { flex: 1; display: flex; flex-direction: column-reverse; background: var(--surface-low); border-radius: 3px; overflow: hidden; }
.vuln-col-stack > i { display: block; width: 100%; }
.vuln-col-stack > i.k-live { background: var(--signal-live); opacity: 0.75; }
.vuln-col-stack > i.k-ok { background: var(--signal-ok); }
.vuln-col-stack > i.k-crit { background: var(--signal-crit); }
.vuln-col-stack > i.k-warn { background: var(--signal-warn); }
.vuln-col-stack > i.k-idle { background: var(--signal-idle); }
.vuln-col-label { font-family: var(--font-mono); font-size: 10px; color: var(--outline); text-align: center; height: 14px; overflow: hidden; }

/* Filter bars above the lists. */
.vuln-filters { display: flex; flex-wrap: wrap; gap: var(--sp-sm); align-items: flex-end; }
.vuln-filters .field { min-width: 140px; }
.vuln-filters label.row { cursor: pointer; }

/* The ATT&CK kill-chain stepper. */
.vuln-chain { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.vuln-chain-step { border: 1px solid var(--outline-variant); border-radius: 6px; padding: 6px 8px; background: var(--surface-low); min-height: 56px; }
.vuln-chain-step.on { border-color: var(--signal-crit); background: color-mix(in srgb, var(--signal-crit) 14%, var(--surface-low)); }
.vuln-chain-step .n { font-family: var(--font-mono); font-size: 10px; color: var(--outline); }
.vuln-chain-step.clickable { cursor: pointer; }
@media (max-width: 1100px) { .vuln-chain { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* The AVM dial: 0..5, five the good end. */
.vuln-grade { font-family: var(--font-headline); font-size: 40px; line-height: 1; font-weight: 700; }
.vuln-grade.g0, .vuln-grade.g1 { color: var(--signal-crit-text); }
.vuln-grade.g2 { color: var(--signal-warn); }
.vuln-grade.g3 { color: #e7d36a; }
:root[data-theme="light"] .vuln-grade.g3 { color: #a16207; }
.vuln-grade.g4, .vuln-grade.g5 { color: var(--signal-ok); }

/* History timeline on the finding page. */
.vuln-timeline { display: flex; flex-direction: column; gap: 8px; border-left: 2px solid var(--outline-variant); padding-left: 12px; }
.vuln-timeline > div { position: relative; }
.vuln-timeline > div::before { content: ''; position: absolute; left: -17px; top: 6px; width: 8px; height: 8px; border-radius: 50%; background: var(--signal-live); }

.vuln-desc { white-space: pre-wrap; line-height: 1.55; }
.vuln-refs { display: flex; flex-direction: column; gap: 2px; max-height: 220px; overflow: auto; }
.vuln-refs a { color: var(--signal-info); word-break: break-all; }
.vuln-check { width: 16px; height: 16px; accent-color: var(--signal-live); }
/* Picked rows on the CVE page's affected assets, and what to do with them. */
.vuln-pickbar { align-items: center; padding: 6px 12px; border: 1px solid var(--outline-variant); border-radius: 6px; }
.vuln-pickbar[hidden] { display: none; }
/* A paragraph in a table cell: four lines, the rest on hover. */
.vuln-clamp { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.vuln-note { font-size: var(--fs-body-sm); color: var(--outline); }
.vuln-textarea { min-height: 96px; resize: vertical; font-family: inherit; }
.vuln-vec { word-break: break-all; }

/* ---- settings tabs (주요 소프트웨어, AVM 가중치) ------------------------ */
.vuln-ps-form .input, .vuln-ps-form .select { flex: 1 1 200px; }
.vuln-ps-chip { gap: 6px; }
.vuln-ps-del {
  background: none; border: 0; padding: 0 0 0 2px; cursor: pointer;
  color: inherit; opacity: .7; font: inherit;
}
.vuln-ps-del:hover { opacity: 1; }
.vuln-wt-group { padding-bottom: var(--sp-md); border-bottom: 1px solid var(--stroke); }
.vuln-wt-group:last-of-type { border-bottom: 0; }
.vuln-wt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: var(--sp-sm); }
.vuln-wt-grid.dense { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.vuln-wt-item { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.vuln-wt-item .t-code { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vuln-wt-item .input { width: 100%; }

/* ---- 이슈 (mail history) ------------------------------------------------ */
.vuln-mail-body {
  white-space: pre-wrap; margin: 0; padding: var(--sp-sm) var(--sp-md);
  max-height: 280px; overflow-y: auto; font: inherit; font-size: 13px;
  background: var(--surface-low); border-radius: var(--r-md);
}
.vuln-attachment {
  padding: var(--sp-sm) var(--sp-md); border-radius: var(--r-md);
  border: 1px solid var(--stroke);
}

/* ---- 지금 고칠 것 (fix-now; the vuln dashboard and the main one) -------- */
.fixnow { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.fixnow-row {
  display: flex; align-items: center; gap: var(--sp-md); cursor: pointer;
  padding: var(--sp-sm) var(--sp-md); border-bottom: 1px solid var(--stroke);
}
.fixnow-row:last-child { border-bottom: 0; }
.fixnow-row:hover, .fixnow-row:focus-visible { background: var(--surface-low); outline: none; }
.fixnow-rank {
  flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center;
  font-size: 12px; background: var(--surface-high); color: var(--on-surface-variant, inherit);
}
.fixnow.compact .fixnow-row { padding: 6px 0; gap: var(--sp-sm); }

/* ---- 근거 설명 / 우선순위 보조 (vuln::explain) ---------------------------- */
.vuln-explain {
  padding: var(--sp-sm) var(--sp-md); border-radius: var(--r-md);
  background: var(--surface-low); border: 1px solid var(--stroke);
  max-height: 60vh; overflow-y: auto; overflow-wrap: anywhere;
}
.vuln-assist { padding: var(--sp-sm) var(--sp-md); border-bottom: 1px solid var(--stroke); }

/* ---- CVE page: IDS detection rules ------------------------------------- */
.vuln-cell { align-items: flex-start; gap: 2px; }