/*!
 * Network & Email Tools — styles on top of Public Tools' tools.css.
 * Classes start with nt-; shared components (pt-panel, pt-badge, pt-checks,
 * pt-table, pt-kv) come from Public Tools.
 */

/* ── Form ───────────────────────────────────────────────────────────── */
.nt-form__row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem; }
.nt-form__main { flex: 1 1 18rem; }
.nt-form__row > .pt-field:not(.nt-form__main) { flex: 0 1 auto; }
.nt-form__row .pt-select { min-width: 9rem; max-width: 100%; }
.nt-form__port .pt-input { width: 7rem; }
.nt-form__go { flex: 0 0 auto; }
.nt-form__extra { margin-top: .6rem; flex-wrap: wrap; align-items: center; gap: .5rem .75rem; }
.nt-form__extra .pt-help { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .35rem; }
.nt-form__optional { margin-top: .75rem; }
.nt-form__opt { margin-top: .5rem; }
.nt-form .pt-input[aria-invalid="true"] { border-color: var(--pt-error); }
[data-nt-show-when][hidden] { display: none !important; }

/* What is my IP: the address, large. */
.nt-myip { display: flex; flex-direction: column; gap: .25rem; padding: .25rem 0 .75rem; }
.nt-myip__label { font-size: .8125rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--pt-muted); }
.nt-myip__ip { font-family: var(--pt-mono); font-size: clamp(1.5rem, 5vw, 2.25rem); font-weight: 700; color: var(--pt-ink); overflow-wrap: anywhere; line-height: 1.2; }

/* ── Results ────────────────────────────────────────────────────────── */
.nt-result { margin-top: 1.25rem; }
.nt-result[aria-busy="true"] { opacity: .6; }
.nt-summary { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .6rem; }
.nt-summary__title { flex: 1 1 100%; margin: 0; font-family: var(--pt-mono); font-size: .9375rem; font-weight: 600; color: var(--pt-ink); overflow-wrap: anywhere; }
.nt-panel .pt-panel__head .pt-help { margin: 0; font-family: var(--pt-mono); font-size: .8125rem; }
.nt-muted { color: var(--pt-muted); }
.nt-ok { color: var(--pt-ok); font-weight: 700; }
.nt-err { color: var(--pt-error); }
.nt-num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.nt-detail > span { display: block; overflow-wrap: anywhere; font-size: .85rem; }
.nt-detail > span + span { margin-top: .2rem; }
.nt-badges { display: inline-flex; flex-wrap: wrap; gap: .3rem; }
.nt-record { margin: 0; padding: .6rem .8rem; background: var(--pt-soft); border: 1px solid var(--pt-line); border-radius: var(--pt-radius-sm);
  font-family: var(--pt-mono); font-size: .8125rem; color: var(--pt-ink); white-space: pre-wrap; overflow-wrap: anywhere; }
.nt-values { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; }
.nt-values li { font-size: .9rem; color: var(--pt-ink); overflow-wrap: anywhere; }
.nt-ref__none { margin: 0; color: var(--pt-muted); }

/* Resolver and list names with a second line. */
.nt-res__name { display: block; font-weight: 600; color: var(--pt-ink); }
.nt-res__where { display: block; font-size: .78rem; color: var(--pt-muted); }
.nt-val { display: block; font-size: .8125rem; overflow-wrap: anywhere; }
.nt-prop td:nth-child(2) { min-width: 12rem; }
.nt-ports tr.nt-open td:first-child, .nt-bl tr.nt-listed td:first-child { box-shadow: inset 3px 0 0 var(--pt-error); }
.nt-bl td:last-child { white-space: nowrap; }
.nt-spf td:first-child { white-space: nowrap; }
.nt-dkim { display: flex; flex-direction: column; gap: .35rem; }
.nt-dkim__name { margin: 0; font-size: .85rem; font-weight: 600; color: var(--pt-ink); overflow-wrap: anywhere; }
.nt-hops { margin: 0; padding-left: 1.25rem; display: flex; flex-direction: column; gap: .3rem; font-size: .85rem; overflow-wrap: anywhere; }

/* Website down: the verdict, big and coloured. */
.nt-verdict { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .9rem; align-items: start;
  padding: 1rem 1.15rem; border-radius: var(--pt-radius-sm); border: 1px solid var(--pt-line); background: var(--pt-soft); }
.nt-verdict__icon .pt-ico { width: 2rem; height: 2rem; }
.nt-verdict--ok { background: var(--pt-ok-soft); border-color: #bbf7d0; }
.nt-verdict--ok .nt-verdict__icon { color: var(--pt-ok); }
.nt-verdict--warn { background: var(--pt-warn-soft); border-color: #fde68a; }
.nt-verdict--warn .nt-verdict__icon { color: var(--pt-warn); }
.nt-verdict--error { background: var(--pt-error-soft); border-color: #fecaca; }
.nt-verdict--error .nt-verdict__icon { color: var(--pt-error); }
.nt-verdict__word { margin: 0; font-size: 1.35rem; font-weight: 800; color: var(--pt-ink); line-height: 1.2; }
.nt-verdict__text { margin: .2rem 0 0; font-weight: 600; color: var(--pt-ink); }
.nt-verdict__detail { margin: .35rem 0 0; font-size: .9rem; color: var(--pt-text); }

/* ── Phones ─────────────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .nt-form__row { align-items: stretch; }
  .nt-form__row > .pt-field, .nt-form__go { flex: 1 1 100%; }
  .nt-form__row .pt-select, .nt-form__port .pt-input { width: 100%; }
  .nt-prop td:nth-child(2) { min-width: 9rem; }
}

@media print {
  .nt-form { display: none !important; }
}