/* ==========================================================================
   Sierra Fire Recovery Guide — additions to the fire landing page.

   Loaded by planner/fire.html only, AFTER planner.css and fire.css. One job:
   THE DOCUMENTS SECTION (#documents). Cards in the same idiom as .fire-whatis,
   on the same tokens (--card, --border, --ink-soft, --forest-green,
   --cedar-accent) that fire.css and planner.css declare. No new colours.

   The header-menu rules that used to live here have MOVED to fire.css, because
   planner/fire-plan.html now carries the same hamburger and does not load this
   file. Do not re-add them here — two copies would drift.
   ========================================================================== */

/* ==========================================================================
   Replacing lost documents (#documents on fire.html)
   ========================================================================== */

.fire-docs-note {
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--muted-2, #8A8172);
    margin: 12px 0 0;
    max-width: 62ch;
    text-wrap: pretty;
}

.fire-docs-list {
    list-style: none;
    margin: 24px 0 0;
    padding: 0;
    display: grid;
    gap: 12px;
}

.fire-doc {
    background: var(--card, #FFFDF8);
    border: 1px solid var(--border, #E9E1D2);
    border-radius: 14px;
    padding: 18px 20px;
}

.fire-doc-h {
    font-family: 'Newsreader', serif;
    font-size: 18.5px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.005em;
    color: var(--forest-green, #163C2E);
    margin: 0;
}

.fire-doc-p {
    font-size: 15.5px;
    line-height: 1.55;
    color: var(--ink-soft, #5C564C);
    margin: 7px 0 0;
    max-width: 62ch;
    text-wrap: pretty;
}

/* One link per row, not a wrapped pill cloud: these are read and chosen
   deliberately, and the labels name the agency so the destination is legible
   before the tap. 44px min-height keeps them thumb-sized. */
.fire-docs .fire-doc-links {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: grid;
    gap: 2px;
}

.fire-docs .fire-doc-links a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 6px 0;
    font-size: 14.5px;
    font-weight: 600;
    color: var(--green-mid, #24614A);
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    text-wrap: pretty;
}

.fire-docs .fire-doc-links a:hover { color: var(--cedar-accent, #B4552F); }

.fire-docs .fire-doc-links a:focus-visible {
    outline: 2px solid var(--green-mid, #24614A);
    outline-offset: 3px;
    border-radius: 4px;
}

.fire-docs-more {
    font-size: 14.5px;
    line-height: 1.7;
    color: var(--ink-soft, #5C564C);
    margin: 18px 0 0;
    max-width: 66ch;
    text-wrap: pretty;
}

.fire-docs-more a {
    color: var(--green-mid, #24614A);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.fire-docs-more a:hover { color: var(--cedar-accent, #B4552F); }

/* ==========================================================================
   Print — somebody with no house may well be working from a printed copy.
   A link is useless on paper unless its address is on the page, so print the
   URL after each one.
   ========================================================================== */

@media print {
    .fire-docs { break-inside: auto; }
    .fire-doc { break-inside: avoid; border-color: #CFC8B8; }
    .fire-docs .fire-doc-links a,
    .fire-docs-more a { color: #000; text-decoration: none; }
    .fire-docs .fire-doc-links a::after,
    .fire-docs-more a::after {
        content: " (" attr(href) ")";
        font-weight: 400;
        font-size: 11px;
        color: #555;
        word-break: break-all;
    }
}