/**
 * Suspicious e-mail and attachment analyzer: the report. Outcome, findings and tables
 * use the realm's blocks (tools-alert, tools-findings, tools-table); this file only lays
 * out the technical detail tree and keeps long strings from breaking the layout.
 */

.tools-atr-result:not([hidden]) { min-height: 6rem; }

.tools-atr-progress {
    color: var(--c-ink-mute);
    font-size: 0.95rem;
}

.tools-atr-h {
    font-size: 1.05rem;
    margin: var(--s-5) 0 var(--s-2);
    color: var(--c-ink);
}

.tools-atr-limit {
    margin: var(--s-2) 0 0;
    font-size: 0.9rem;
    color: var(--c-ink-soft);
}

.tools-atr-next {
    margin-top: var(--s-4);
}

.tools-atr-mono,
.tools-atr-excerpt {
    font-family: var(--font-mono);
    font-size: 0.85rem;
    overflow-wrap: anywhere;
}

.tools-atr-excerpt { color: var(--c-ink-mute); }

.tools-atr-table td { overflow-wrap: anywhere; }

.tools-atr-tech {
    margin-top: var(--s-5);
    border: 1px solid var(--c-line);
    border-radius: var(--r-md);
    background: var(--c-bg-card);
    padding: var(--s-3) var(--s-4);
}

.tools-atr-tech > summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--c-blue-700);
}

.tools-atr-kv {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: var(--s-1) var(--s-3);
    margin: var(--s-3) 0;
    font-size: 0.9rem;
}

.tools-atr-kv dt { color: var(--c-ink-mute); }
.tools-atr-kv dd { margin: 0; overflow-wrap: anywhere; }

.tools-atr-tree {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.9rem;
}

.tools-atr-tree > li {
    padding: var(--s-2) 0 var(--s-2) calc(var(--atr-depth, 0) * var(--s-4));
    border-top: 1px solid var(--c-line);
    overflow-wrap: anywhere;
}

.tools-atr-kind { color: var(--c-ink-mute); }

.tools-atr-facts {
    margin: var(--s-1) 0 0;
    padding-left: var(--s-4);
}

.tools-atr-facts li { margin: var(--s-1) 0; }

@media (max-width: 768px) {
    .tools-atr-kv { grid-template-columns: 1fr; }
    /* One card per domain: four columns do not fit a phone. */
    .tools-atr-table thead { display: none; }
    .tools-atr-table,
    .tools-atr-table tbody,
    .tools-atr-table tr,
    .tools-atr-table td { display: block; width: 100%; }
    .tools-atr-table tr { border-top: 1px solid var(--c-line); padding: var(--s-2) 0; }
    .tools-atr-table td { border: 0; padding: var(--s-1) var(--s-3); }
    .tools-atr-table td::before {
        content: attr(data-label);
        display: block;
        font-size: 0.75rem;
        color: var(--c-ink-mute);
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }
    .tools-atr-tree > li { padding-left: calc(var(--atr-depth, 0) * var(--s-2)); }
}