/* FreeTakeoff.tools — reference prose that sits under a calculator.
 *
 * Every rule in this file is scoped inside .calc-reference. Nothing here may
 * restyle shared UI: css/guide.css already owns .tip-box, .faq-item,
 * .faq-question and .faq-answer for the guide pages, and the calculator pages
 * load both stylesheets on some routes. Scoping is what keeps the two apart.
 */

.calc-reference {
    max-width: 46rem;
    margin: 2.5rem auto 0;
    padding-top: 2rem;
    border-top: 1px solid var(--border);
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.calc-reference h2 {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 2rem 0 0.75rem;
    letter-spacing: -0.01em;
}

.calc-reference > h2:first-child {
    margin-top: 0;
}

.calc-reference h3 {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
    margin: 1.5rem 0 0.5rem;
}

.calc-reference p {
    margin-bottom: 1rem;
}

.calc-reference ul,
.calc-reference ol {
    margin: 0 0 1rem 1.25rem;
}

.calc-reference li {
    margin-bottom: 0.5rem;
}

.calc-reference a {
    color: var(--accent);
    text-decoration: underline;
    text-decoration-color: rgba(245, 158, 11, 0.4);
    text-underline-offset: 2px;
}

.calc-reference a:hover {
    text-decoration-color: var(--accent);
}

.calc-reference strong {
    color: var(--text-primary);
    font-weight: 600;
}

/* Formula reference — the house pattern from freeacoustics' rt60.html,
   restated here against this site's dark palette. */
.calc-reference .formula-reference {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin: 1.25rem 0;
}

.calc-reference .formula-reference h4 {
    font-size: 0.7rem;
    color: var(--text-secondary);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.75rem;
    font-weight: 600;
}

/* Column alignment carries meaning in these blocks, so whitespace is preserved
   and the block scrolls rather than wrapping. */
.calc-reference .formula-block {
    background: var(--bg-dark);
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 0.85rem 1rem;
    margin-bottom: 0.75rem;
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.8rem;
    line-height: 1.7;
    color: var(--accent);
    white-space: pre;
    overflow-x: auto;
}

.calc-reference .formula-note {
    color: var(--text-muted);
    font-size: 0.8125rem;
    line-height: 1.6;
}

.calc-reference .formula-note:last-child {
    margin-bottom: 0;
}

/* Limits callout — deliberately not named .tip-box */
.calc-reference .ref-limits {
    background: rgba(245, 158, 11, 0.07);
    border: 1px solid rgba(245, 158, 11, 0.28);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    margin: 1.5rem 0;
}

.calc-reference .ref-limits h3 {
    margin-top: 0;
}

.calc-reference .ref-limits p:last-child,
.calc-reference .ref-limits ul:last-child {
    margin-bottom: 0;
}

/* FAQ — scoped so it cannot collide with css/guide.css */
.calc-reference .faq-item {
    padding: 1rem 0;
    border-bottom: 1px solid var(--border);
}

.calc-reference .faq-item:last-of-type {
    border-bottom: none;
}

.calc-reference .faq-question {
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.4rem;
}

.calc-reference .faq-answer {
    margin-bottom: 0;
}

/* Sources — the house .page-sources pattern */
.calc-reference .page-sources {
    margin-top: 2rem;
    padding-top: 1rem;
    border-top: 1px solid var(--border);
    font-size: 0.8125rem;
    line-height: 1.7;
    color: var(--text-muted);
}

@media (max-width: 640px) {
    .calc-reference {
        font-size: 0.9rem;
    }

    .calc-reference .formula-block {
        font-size: 0.72rem;
    }
}

/* Print.

   This used to be `.calc-reference { display: none }`, which hid the WHOLE
   reference block — and that block is the only container for the limits box and
   the sources paragraph. A printed overtime sheet therefore showed effective
   rates and weekly crew costs with no "not payroll, not legal advice" anywhere
   on it, and cost-index has a one-click print button. The reference prose is
   long and does not belong in a bid file, but the disclaimer and the citations
   do — they are the reason the numbers can be trusted. */
@media print {
    .calc-reference > *:not(.ref-limits):not(.page-sources) {
        display: none;
    }

    .calc-reference {
        margin-top: 1.5rem;
        padding-top: 0.75rem;
        border-top: 1px solid #999;
        page-break-inside: avoid;
    }

    .calc-reference .ref-limits,
    .calc-reference .page-sources {
        display: block;
        font-size: 9pt;
        line-height: 1.45;
        color: #000;
        background: none;
        border: none;
        padding: 0;
    }

    .calc-reference .ref-limits {
        margin-bottom: 0.5rem;
        font-weight: 600;
    }
}