/* The DNS, registration and DANE tools. Loaded after mail-tools.css and web-tools.css, whose verdict, findings, facts,
   tables (data-cards), rows, tags and paths they share; this file holds only what these tools add. */

/* Rail pickers: record types and services as chips that wrap. */
.dns-chips { display: flex; flex-wrap: wrap; gap: var(--tb-space-1); }
.dns-chips .tb-chip { font-family: var(--tb-font-mono); font-size: var(--tb-font-size-xs); }
#options .tb-field__label { margin-top: var(--tb-space-2); }

/* Names and record data in tables: mono, breaking only where a long value must. */
.dns-name, .dns-data { font: var(--tb-font-size-xs) / var(--tb-leading-normal) var(--tb-font-mono); color: var(--tb-text-strong); overflow-wrap: anywhere; }
.dns-answer td:nth-child(2), .dns-answer td:nth-child(3) { white-space: nowrap; }
.dns-answer td:last-child { white-space: normal; }
td > .dns-data + .dns-data { display: block; }

/* Registration: one line from registration to expiry, today marked; amber when expiry is near, red when past. */
.dns-life:empty { display: none; }
.dns-life { --_tone: var(--tb-text-strong); display: grid; gap: var(--tb-space-2); margin-bottom: var(--tb-space-4); }
.dns-life[data-state="soon"] { --_tone: var(--tb-status-warning-solid); }
.dns-life[data-state="expired"] { --_tone: var(--tb-status-danger-solid); }
.dns-life__bar { position: relative; height: var(--tb-space-2); border-radius: var(--tb-radius-full); background: var(--tb-surface-subtle); overflow: hidden; }
.dns-life__lived { position: absolute; inset: 0 auto 0 0; background: var(--tb-border-default); }
.dns-life__left { position: absolute; top: 0; bottom: 0; background: var(--_tone); }
.dns-life__now { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: var(--tb-text-strong); }
.dns-life__marks { display: flex; justify-content: space-between; gap: var(--tb-space-3); }
.dns-life__mark { display: grid; gap: 1px; margin: 0; font-size: var(--tb-font-size-xs); color: var(--tb-text-muted); }
.dns-life__mark:nth-child(2) { text-align: center; }
.dns-life__mark:last-child { text-align: right; }
.dns-life__mark b { font: var(--tb-weight-semibold) var(--tb-font-size-sm) var(--tb-font-mono); color: var(--tb-text-strong); }

/* Status codes: the badge, the plain label, the code, then what it means. */
.dns-status { list-style: none; display: grid; margin: 0; padding: 0; border-top: 1px solid var(--tb-border-subtle); }
.dns-status__item { display: grid; gap: var(--tb-space-1); padding: var(--tb-space-3) 0; border-bottom: 1px solid var(--tb-border-subtle); }
.dns-status__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tb-space-2); margin: 0; font-size: var(--tb-font-size-sm); color: var(--tb-text-strong); }
.dns-status__head code { font: var(--tb-font-size-2xs) var(--tb-font-mono); color: var(--tb-text-muted); }
.dns-status__meaning { margin: 0; font-size: var(--tb-font-size-xs); color: var(--tb-text-body); }

/* Registration history: date, then what happened; future dates (expiry) quieter. */
.dns-events { list-style: none; display: grid; margin: 0; padding: 0; border-top: 1px solid var(--tb-border-subtle); }
.dns-events > li { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--tb-space-3); padding: var(--tb-space-2) 0; border-bottom: 1px solid var(--tb-border-subtle); font-size: var(--tb-font-size-sm); color: var(--tb-text-strong); }
.dns-events > li[data-future] { color: var(--tb-text-muted); }

/* Propagation: agreement as one bar; matching solid, older answers hatched, failures red. */
.dns-spread { display: flex; gap: 2px; height: var(--tb-space-3); margin-bottom: var(--tb-space-3); }
.dns-spread__part { min-width: var(--tb-space-3); border-radius: var(--tb-radius-sm); background: var(--tb-text-strong); }
.dns-spread__part[data-kind="old"] { background: repeating-linear-gradient(135deg, var(--tb-status-warning-solid) 0 2px, var(--tb-status-warning-bg) 2px 4px); }
.dns-spread__part[data-kind="fail"] { background: var(--tb-status-danger-solid); }
.dns-resolvers td:nth-child(n+3) { white-space: nowrap; }
.dns-resolvers tr[data-differs] .dns-data { color: var(--tb-status-warning-fg); }

/* Health: one card per area with its result bar; the report lists every check under its area. */
.dns-areas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--tb-space-2); }
.dns-area { display: grid; align-content: start; gap: var(--tb-space-2); min-width: 0; padding: var(--tb-space-3); border: 1px solid var(--tb-border-subtle); border-radius: var(--tb-radius-card); background: var(--tb-surface-card); color: var(--tb-text-strong); text-decoration: none; transition: border-color var(--tb-duration-fast); }
.dns-area:hover { border-color: var(--tb-border-default); color: var(--tb-text-strong); }
.dns-area:focus-visible { outline: 2px solid var(--tb-focus-ring); outline-offset: 2px; }
.dns-area[data-status="fail"] { border-color: var(--tb-status-danger-border); }
.dns-area[data-status="warn"] { border-color: var(--tb-status-warning-border); }
.dns-area__name { font-size: var(--tb-font-size-sm); }
.dns-area__counts { font-size: var(--tb-font-size-xs); color: var(--tb-text-body); }
.dns-area__bar { display: flex; gap: 2px; height: var(--tb-space-1); }
.dns-area__seg { border-radius: 2px; background: var(--tb-status-neutral-solid); }
.dns-area__seg[data-status="pass"] { background: var(--tb-status-success-solid); }
.dns-area__seg[data-status="warn"] { background: var(--tb-status-warning-solid); }
.dns-area__seg[data-status="fail"] { background: var(--tb-status-danger-solid); }
.dns-report__title { margin: 0 0 var(--tb-space-1); font-size: var(--tb-font-size-sm); font-weight: var(--tb-weight-semibold); color: var(--tb-text-strong); }
.dns-report:focus-visible { outline: 2px solid var(--tb-focus-ring); outline-offset: 4px; border-radius: var(--tb-radius-sm); }

/* TXT: each record with what it is for, its size, and the value. */
.dns-txt { list-style: none; display: grid; margin: 0; padding: 0; border-top: 1px solid var(--tb-border-subtle); }
.dns-txt__item { display: grid; gap: var(--tb-space-1); padding: var(--tb-space-3) 0; border-bottom: 1px solid var(--tb-border-subtle); }
.dns-txt__item[data-status="fail"] .dns-data { color: var(--tb-status-danger-fg); }
.dns-txt__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--tb-space-2); margin: 0; }
.dns-txt__head .web-sub { display: inline; }

/* CNAME: the chain; a step that does not exist is marked. */
.dns-chainpath > li[data-status="fail"] code { color: var(--tb-status-danger-fg); text-decoration: line-through; }
.dns-chainpath > li[data-status="fail"] .web-path__step { color: var(--tb-status-danger-fg); }

/* SRV: tiers by priority; inside a tier, each target's share as a bar. */
.dns-srv { list-style: none; display: grid; gap: var(--tb-space-4); margin: 0; padding: 0; }
.dns-srv__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--tb-space-2); margin: 0 0 var(--tb-space-2); font-size: var(--tb-font-size-sm); color: var(--tb-text-strong); }
.dns-srv__head .web-sub { display: inline; }
.dns-srv__rows { list-style: none; display: grid; margin: 0; padding: 0; border-top: 1px solid var(--tb-border-subtle); }
.dns-srv__row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(4rem, 1fr) 3rem auto; align-items: center; gap: var(--tb-space-3); padding: var(--tb-space-2) 0; border-bottom: 1px solid var(--tb-border-subtle); }
.dns-srv__bar { height: var(--tb-space-2); border-radius: var(--tb-radius-full); background: var(--tb-surface-subtle); overflow: hidden; }
.dns-srv__fill { display: block; height: 100%; background: var(--tb-text-strong); }

/* DNSSEC: levels from the root down, joined by a line; each shows DS, keys and signatures. */
.dns-chain { list-style: none; display: grid; gap: var(--tb-space-4); margin: 0; padding: 0; }
.dns-chain__level { position: relative; display: grid; gap: var(--tb-space-3); padding: var(--tb-space-4); border: 1px solid var(--tb-border-subtle); border-radius: var(--tb-radius-card); background: var(--tb-surface-card); }
.dns-chain__level + .dns-chain__level::before { content: ""; position: absolute; top: calc(-1 * var(--tb-space-4) - 1px); left: var(--tb-space-6); height: var(--tb-space-4); border-left: 2px solid var(--tb-border-default); }
.dns-chain__level[data-status="fail"] { border-color: var(--tb-status-danger-border); }
.dns-chain__level[data-status="warn"] { border-color: var(--tb-status-warning-border); }
.dns-chain__level[data-status="insecure"] { background: var(--tb-surface-inset); }
.dns-chain__head { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tb-space-2); }
.dns-chain__head .web-sub { display: inline; }
.dns-chain__zone { margin: 0; font: var(--tb-weight-semibold) var(--tb-font-size-sm) var(--tb-font-mono); color: var(--tb-text-strong); }
.dns-chain__parts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--tb-space-4); }
.dns-chain__part { display: grid; align-content: start; gap: var(--tb-space-2); min-width: 0; }
.dns-chain__title { margin: 0; font-size: var(--tb-font-size-xs); font-weight: var(--tb-weight-semibold); color: var(--tb-text-muted); }
.dns-chain__row { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--tb-space-1) var(--tb-space-2); margin: 0; font-size: var(--tb-font-size-xs); color: var(--tb-text-body); }
.dns-chain__row code { font: var(--tb-weight-semibold) var(--tb-font-size-xs) var(--tb-font-mono); color: var(--tb-text-strong); }
.dns-chain__row .web-sub { display: inline; }
.dns-chain__to { font-weight: var(--tb-weight-semibold); color: var(--tb-text-strong); }
.dns-chain__row[data-status="fail"] .dns-chain__to, .dns-chain__row[data-status="fail"] code { color: var(--tb-status-danger-fg); }

/* A signature's validity window, today marked. */
.dns-window { display: grid; gap: 2px; }
.dns-window__label { font-size: var(--tb-font-size-xs); color: var(--tb-text-strong); }
.dns-window__bar { position: relative; height: var(--tb-space-1); border-radius: var(--tb-radius-full); background: var(--tb-status-success-solid); }
.dns-window[data-status="warn"] .dns-window__bar { background: var(--tb-status-warning-solid); }
.dns-window[data-status="fail"] .dns-window__bar { background: var(--tb-status-danger-solid); }
.dns-window__now { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--tb-text-strong); }

/* DANE: each TLSA record of a server, and what it matched. */
.dns-tlsa { list-style: none; display: grid; margin: 0; padding: 0; border-top: 1px solid var(--tb-border-subtle); }
.dns-tlsa__item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px var(--tb-space-3); padding: var(--tb-space-2) 0; border-bottom: 1px solid var(--tb-border-subtle); }
.dns-tlsa__item > .web-sub { grid-column: 1; }
.dns-tlsa__result { grid-column: 2; grid-row: 1 / 3; align-self: center; font-size: var(--tb-font-size-xs); font-weight: var(--tb-weight-semibold); color: var(--tb-text-strong); text-align: right; }
.dns-tlsa__item[data-status="pass"] .dns-tlsa__result { color: var(--tb-status-success-fg); }
.dns-tlsa__item[data-status="fail"] .dns-tlsa__result { color: var(--tb-status-danger-fg); }

@media (max-width: 60rem) {
  .dns-areas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dns-chain__parts { grid-template-columns: minmax(0, 1fr); }
  .dns-srv__row { grid-template-columns: minmax(0, 1fr) 3rem; }
  .dns-srv__bar { grid-column: 1 / -1; grid-row: 2; }
  .dns-tlsa__item { grid-template-columns: minmax(0, 1fr); }
  .dns-tlsa__result { grid-column: 1; grid-row: auto; text-align: left; }
}
@media (max-width: 40rem) {
  .dns-areas { grid-template-columns: minmax(0, 1fr); }
  .dns-events > li { grid-template-columns: minmax(0, 1fr); gap: 0; }
}
@media (forced-colors: active) {
  .dns-life__left, .dns-life__now, .dns-spread__part, .dns-area__seg, .dns-srv__fill, .dns-window__bar, .dns-window__now { forced-color-adjust: none; background: CanvasText; }
  .dns-life__lived, .dns-spread__part[data-kind="old"], .dns-area__seg[data-status="info"] { forced-color-adjust: none; background: GrayText; }
}
