/*!
 * Server Security Tools — what the five tools need beyond Public Tools'
 * shared styles (tools.css, loaded first). Plain CSS, ss- prefix.
 */
.ss-mt { margin-top: .75rem; }
.ss-muted { color: var(--pt-muted, #64748b); font-weight: 400; }
.ss-content { margin-top: .5rem; }
.ss-self-end { align-self: end; }
.ss-fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.ss-fieldset > legend { padding: 0; margin-bottom: .25rem; font-size: .875rem; font-weight: 600; color: var(--pt-ink, #0f172a); }

/* Option lists. */
.ss-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); gap: 0 1rem; }
.ss-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13rem), 1fr)); gap: .75rem 1.25rem; }
.ss-groups .ss-fieldset { display: flex; flex-direction: column; }
.ss-radios { display: flex; flex-direction: column; gap: .1rem; }
.ss-radios .pt-check { display: flex; flex-wrap: wrap; gap: .1rem .5rem; }
.ss-priv { display: flex; flex-direction: column; gap: .4rem; }
.ss-priv__row { display: grid; grid-template-columns: minmax(12rem, 16rem) minmax(0, 1fr); gap: .25rem 1rem; align-items: center; }
@media (max-width: 640px) { .ss-priv__row { grid-template-columns: 1fr; } }

/* An input with buttons beside it. */
.ss-join { display: flex; gap: .4rem; align-items: stretch; }
.ss-join .pt-input { flex: 1 1 auto; min-width: 0; }
.ss-join .pt-btn { flex: 0 0 auto; }
.pt-field .ss-join + .pt-input { margin-top: .4rem; }

/* Code. */
.pt-ui .ss-code { min-height: 10rem; font-size: .8125rem; line-height: 1.55; white-space: pre; overflow: auto; tab-size: 4; }
.pt-ui .ss-code--short { min-height: 4.5rem; white-space: pre-wrap; overflow-wrap: anywhere; }
.pt-ui .ss-cmd { margin: 0 0 .5rem; padding: .6rem .75rem; border-radius: var(--pt-radius-sm, .5rem); background: #0f172a; color: #e2e8f0; font-family: var(--pt-mono); font-size: .8125rem; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }
.pt-ui .ss-cmd code { background: none; color: inherit; padding: 0; font: inherit; }
.ss-subtitle { margin: 1.1rem 0 .5rem; font-size: .9375rem; font-weight: 700; color: var(--pt-ink, #0f172a); }
.ss-snippets { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16rem), 1fr)); gap: .25rem 1rem; }
.ss-snippets .ss-subtitle { margin-top: .5rem; }

/* CSP outputs. */
.ss-out + .ss-out { margin-top: .75rem; }
.ss-out__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }

/* Notes. */
.ss-notes { display: flex; flex-direction: column; gap: .5rem; }
.ss-notes:empty { display: none; }
.pt-ui .ss-notes .pt-note { display: block; margin: 0; white-space: pre-line; }
.ss-notes .pt-link { display: inline; }

/* SSH findings. */
.ss-summary { margin: .5rem 0 0; padding: .65rem .9rem; border-radius: var(--pt-radius-sm, .5rem); font-weight: 600; font-size: .9375rem; }
.ss-summary--bad { background: var(--pt-error-soft, #fef2f2); color: #7f1d1d; border: 1px solid #fecaca; }
.ss-summary--warn { background: var(--pt-warn-soft, #fefce8); color: #713f12; border: 1px solid #fde68a; }
.ss-summary--ok { background: var(--pt-ok-soft, #f0fdf4); color: #14532d; border: 1px solid #bbf7d0; }
.ss-dot { display: inline-grid; place-items: center; width: 1.3rem; height: 1.3rem; border-radius: 9999px; font-size: .75rem; font-weight: 800; color: #fff; background: currentColor; }
.pt-check-row--error .ss-dot { background: var(--pt-error, #b91c1c); color: #fff; }
.pt-check-row--warn .ss-dot { background: #d97706; color: #fff; }
.pt-check-row--info .ss-dot { background: var(--pt-accent, #2563eb); color: #fff; }
.pt-check-row--ok .ss-dot { background: var(--pt-ok, #15803d); color: #fff; }
.pt-check-row__text p { margin: 0; }
.pt-check-row__text p + p, .pt-check-row__text p + code { margin-top: .3rem; }
.ss-meta { font-family: var(--pt-mono); font-size: .75rem; color: var(--pt-muted, #64748b); }

/* Disclosures. */
.ss-more > summary { cursor: pointer; font-size: .875rem; font-weight: 600; color: var(--pt-accent-strong, #1d4ed8); }
.ss-more > summary:focus-visible { outline: none; box-shadow: var(--pt-focus); border-radius: .25rem; }
.pt-ui .pt-btn[aria-pressed="true"] { background: var(--pt-accent-soft, #eff6ff); border-color: var(--pt-accent-line, #bfdbfe); color: var(--pt-accent-strong, #1d4ed8); }

@media (max-width: 640px) {
    .ss-join { flex-wrap: wrap; }
    .ss-join .pt-input { flex-basis: 100%; }
}