/* downloads.css — the tester downloads kit (/downloads, M4: TD/TK, WF-21/WF-28)
   and the EULA gate interstitial (EUG, WF-29). Token-bound only (F-R01). */

/* ============================================================================
   Page shell + page-level states
   ========================================================================== */

.dlk {
    /* The kit is a reading surface, not a dashboard: it keeps the frame's width
       but never lets a row push the page sideways (PF-R03). */
    min-width: 0;
}

.dlk__gate-line {
    color: var(--text-primary);
    font-size: var(--font-size-1);
}

/* A rate-limit arrival is a state in the page's own voice, not a failure
   (P2F-R14) — the same quiet inset the product page's download section uses. */
.dlk__notice {
    color: var(--text-primary);
    background-color: var(--surface-raised);
    border-inline-start: 3px solid var(--accent);
    padding: var(--space-sm) var(--space-md);
}

/* The non-gating agreement update (TD-R06): one calm line that opens, never a
   banner competing with the builds. */
.dlk__eula-update {
    color: var(--text-secondary);
    font-size: var(--font-size--1);
}

.dlk__eula-changed {
    margin-block-start: var(--space-sm);
    color: var(--text-primary);
}

.dlk__empty {
    color: var(--text-secondary);
}

/* ============================================================================
   Product group → known issues → per-platform (TK-R02 order)
   ========================================================================== */

.dlk__group {
    padding-block-end: var(--space-2xl);
    border-block-end: 1px solid var(--border-hairline);
}

.dlk__group:last-child {
    padding-block-end: 0;
    border-block-end: none;
}

.dlk__kib {
    padding: var(--container-pad);
    background-color: var(--surface-raised);
    border: 1px solid var(--border-hairline);
    border-radius: var(--radius-container);
}

.dlk__updated {
    margin-block-end: var(--space-sm);
    color: var(--text-secondary);
    font-size: var(--font-size--1);
}

.dlk__platform {
    min-width: 0;
}

/* ============================================================================
   Disclosures — install guide, release notes, full history (all native
   <details>, so every one of them works with scripting off).
   ========================================================================== */

.dlk__guide > summary,
.dlk__notes > summary,
.dlk__all > summary {
    cursor: pointer;
    color: var(--text-primary);
    /* A ≥44px target on touch without growing the row on the desktop (F-R12). */
    padding-block: var(--space-sm);
}

.dlk__guide > summary:hover,
.dlk__notes > summary:hover,
.dlk__all > summary:hover {
    color: var(--accent);
}

.dlk__guide-body,
.dlk__notes-body {
    padding-block-start: var(--space-sm);
    color: var(--text-secondary);
    max-width: var(--measure-prose-max);
}

.dlk__notes-sub {
    margin-block-start: var(--space-md);
    color: var(--text-primary);
    font-size: var(--font-size-0);
}

.dlk__all {
    margin-block-start: var(--space-md);
}

/* ============================================================================
   Download rows — LatestRow (prominent) and HistoryRow (compact), one anatomy
   ========================================================================== */

.dlk__rows {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Lucid-Session-Installer-Proposal-v1 §2.10: the direct installer, smaller, under the Installer button. */
.dlk__action {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-xs);
}

.dlk__direct {
    font-size: var(--font-size--1);
}

.dlk__row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-md);
    min-width: 0;
    padding: var(--container-pad);
    background-color: var(--surface-raised);
    border: 1px solid var(--border-hairline);
    border-radius: var(--radius-container);
}

/* Prominence is weight, not color alone: the latest build gets the emphasis
   border and the Primary action; history keeps the hairline. */
.dlk__row--latest {
    border-color: var(--border-emphasis);
}

.dlk__row--history {
    padding: var(--space-md) var(--container-pad-dense);
    font-size: var(--font-size--1);
}

.dlk__facts {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--text-secondary);
}

.dlk__date,
.dlk__size,
.dlk__minos {
    color: var(--text-secondary);
}

.dlk__sha {
    /* The hash is long; it takes its own line and clamps rather than widening
       the row (F-R15 — Sha256Line already middle-truncates). */
    flex: 1 1 100%;
    min-width: 0;
    margin: 0;
}

.dlk__notes {
    flex: 1 1 100%;
    min-width: 0;
}

/* ============================================================================
   EULA gate (EUG-R01, WF-29)
   ========================================================================== */

.eug {
    display: flex;
    flex-direction: column;
    gap: var(--space-lg);
    min-width: 0;
}

.eug__notice {
    color: var(--text-primary);
    background-color: var(--status-info-surface);
    border-inline-start: 3px solid var(--status-info-border);
    padding: var(--space-sm) var(--space-md);
}

.eug__changed {
    color: var(--text-secondary);
}

.eug__intro {
    color: var(--text-primary);
}

/* The capped scroller (EUG-R01): the agreement scrolls inside its own box so the
   action row is always in view below it — no scroll-to-bottom enforcement, so
   the cap must never be the thing that hides the decision. The cap is what the
   window has left once the site header, the gate's heading and notices, and the
   action row have theirs (about 27rem together); a flat share of the height
   (60vh) put the row below the fold on a laptop. The floor keeps a readable
   stretch of text in a short window. Overrides .edge-cues' horizontal axis: this
   box scrolls vertically, and the cues follow it. */
.eug__scroller {
    max-height: max(12rem, calc(100vh - 27rem));
    max-height: max(12rem, calc(100dvh - 27rem));
    overflow-x: hidden;
    overflow-y: auto;
    padding: var(--container-pad);
    background-color: var(--surface-raised);
    border: 1px solid var(--border-hairline);
    border-radius: var(--radius-container);
    background-image:
        linear-gradient(to bottom, var(--surface-raised), transparent 24px),
        linear-gradient(to top, var(--surface-raised), transparent 24px),
        linear-gradient(to bottom, var(--scrim), transparent 24px),
        linear-gradient(to top, var(--scrim), transparent 24px);
    background-position: center top, center bottom, center top, center bottom;
    background-repeat: no-repeat;
    background-size: 100% 24px, 100% 24px, 100% 12px, 100% 12px;
    background-attachment: local, local, scroll, scroll;
}

/* D-Q4: consent-class symmetry — accept and decline are peer controls, and the
   accent fill is the only difference between them. Nothing here may add weight
   to one side (no extra size, no separator, no reordering by importance). */
.eug__actions {
    justify-content: flex-start;
}

/* Where the window is too short even for the floor (a phone on its side, a narrow
   one with the change notice above), the action row holds the window's bottom edge
   instead of falling below it. In a window with room it sits where it is laid out. */
.eug form {
    position: sticky;
    bottom: 0;
    padding-block: var(--space-sm);
    background-color: var(--surface-page);
}

.eug__later {
    margin: 0;
}

/* ============================================================================
   F-R12: below 768 the rows stack and the action goes full-width at the ≥44px
   touch size. Nothing here may introduce a horizontal scrollbar at 320px.
   ========================================================================== */
@media (max-width: 767px) {
    .dlk__row {
        flex-direction: column;
        align-items: stretch;
    }

    .dlk__action .btn {
        width: 100%;
        min-height: 44px;
    }

    .eug__actions {
        flex-direction: column;
        align-items: stretch;
    }

    .eug__actions .btn {
        width: 100%;
        min-height: 44px;
        text-align: center;
    }

    .dlk__guide > summary,
    .dlk__notes > summary,
    .dlk__all > summary {
        min-height: 44px;
    }
}
