/* The point-in-time viewer popup: what one captured snapshot holds, and one payload's JSON. */

/*
 * A popup body is bare heading, paragraph, table and pre nodes written into the tool page that opened
 * it, so none of it inherits the padding the CMS gives its own form fields.
 */
.ApiSnapshotPointInTime-popup {
    /* Wide, because a payload line is long and wrapping JSON at 40em is unreadable. */
    max-width: 70em;
    padding: var(--gap-l, 20px);
}

/*
 * Sits above the heading, so it takes a small gap of its own rather than the paragraph rule's larger one.
 */
.ApiSnapshotPointInTime-popup > .ApiSnapshotPointInTime-back {
    margin: 0 0 var(--gap-s, 5px);
}

.ApiSnapshotPointInTime-popup > h1 {
    margin: 0 0 var(--gap-m, 10px);
}

.ApiSnapshotPointInTime-popup > p {
    line-height: 1.5;
    margin: 0 0 var(--gap-m, 10px);
}

.ApiSnapshotPointInTime-popup > table {
    margin: 0 0 var(--gap-m, 10px);
    width: 100%;
}

/*
 * The payload scrolls inside the popup rather than growing it. A scorecards payload runs to tens of
 * thousands of lines, and a popup that tall puts its own heading off the top of the screen.
 */
.ApiSnapshotPointInTime-popup > pre {
    background: var(--color-bg-shade, #f0f0f0);
    margin: 0;
    max-height: 60vh;
    overflow: auto;
    padding: var(--gap-m, 10px);
    white-space: pre;
}

/*
 * The snapshot list on a settings form sits in the note of a read-only field, and the CMS switches
 * `pointer-events` off — and the text to a disabled grey — for everything inside a read-only row's note.
 * That is right for the inputs it is aimed at and wrong for a link, which is why the CMS makes the same
 * exception for its own read-only URL links.
 *
 * `pointer-events` is an inherited property, so this has to match the anchor itself: a declaration on
 * anything wrapping it would still be inherited straight past by the anchor.
 */
a.ApiSnapshotPointInTime-link {
    color: var(--Link-color, #1e6ba1);
    cursor: pointer;
    pointer-events: auto;
    text-decoration: underline;
}
