/* fc.css — trading/fc/<TICKER>{,-tr,-de}.html, the static per-ticker share
   pages. Loaded after style.css and indicators.css, which already supply the
   nav, footer, base tokens and every component these pages reuse verbatim:
   .ind-wrap/.ind-crumb/.ind-head/.ind-title, .sumcard/.sum-stripe/.sum-state,
   .panel/.panel-body, .vband/.vbar/.vscale/.mk, .pill, .health-row/.pillars/
   .pillar, .disc. This file adds only what those two do not already style:
   the diligence-checklist list (mirrors the inline <style> block in
   trading/fundamentalcore.html's .dil-* rules, renamed fc-dil-* so the two
   documents never share a selector), the ETF wrapper key/value rows, the
   refusal/warn paragraphs, the language row and the CTA back to the
   analyzer. No new colour is introduced -- every value below is one of the
   tokens style.css already defines in :root.

   Mobile-first: the base rules below are the phone layout (single column,
   the same one indicators.css's own pages fall back to under 640px); the one
   @media (min-width: 641px) block widens spacing where the extra width is
   free, matching indicators.css's own breakpoint. */

.fc-crumb-cur { color: var(--navy); font-weight: 600; }

/* ── generic sub-text under a value: price date, band prose, checklist
   count, the "data updated" line. One shared look so a page that stacks
   several of these (band line + settled note + unearned warning) reads as
   one paragraph rhythm, not four different typefaces. ── */
.fc-sub, .panel-body > p {
    margin: .5rem 0 0;
    font-size: .89rem;
    line-height: 1.65;
    color: var(--mid);
}

.fc-sub:first-child, .panel-body > p:first-child { margin-top: 0; }

/* Headings inside a panel body are real <h2>/<h1> here (crawlable structure
   the interactive analyzer does not need, since it never ships a DOM a
   crawler reads) -- styled to match .panel-title's ink rather than the
   browser default serif jump. */
.panel-body h2 {
    font-weight: 700;
    color: var(--navy);
    font-size: .96rem;
    margin: 0 0 .6rem;
}

.panel-body h2:not(:first-child) { margin-top: 1.1rem; }

/* Refusal sentence in place of a panel this payload cannot draw -- never a
   blank section (CLAUDE.md, "a refusal that hides a whole panel has to say
   so where the panel was"). Left border only, no colour: the same "state is
   a shape" rule indicators.css sets for the rest of this page family. */
.fc-refusal {
    margin: 0;
    padding: .8rem 1rem;
    background: var(--surface);
    border-left: 3px solid var(--navy);
    border-radius: 0 10px 10px 0;
    font-size: .88rem;
    line-height: 1.6;
    color: var(--mid);
}

/* Standing-premium warning: same recessed-well shape as .fc-refusal, kept a
   separate class since the two are never nested and a reviewer scanning the
   generator should be able to tell which sentence is which without reading
   the string it wraps. */
.fc-warn {
    margin: .6rem 0 0;
    padding: .8rem 1rem;
    background: var(--surface);
    border-left: 3px solid var(--navy);
    border-radius: 0 10px 10px 0;
    font-size: .88rem;
    line-height: 1.6;
    color: var(--mid);
}

/* ── ETF wrapper facts ── */
.fc-etf-prem-grid > div {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    padding: .6rem 0;
    font-size: .89rem;
    color: var(--mid);
}

.fc-etf-prem-grid b {
    font-family: var(--ff-mono);
    font-weight: 700;
    color: var(--navy);
}

.fc-etf-kv { width: 100%; border-collapse: collapse; margin-top: .4rem; }

.fc-etf-kv td {
    padding: .55rem 0;
    border-bottom: 1px solid var(--border);
    font-size: .86rem;
    line-height: 1.55;
    color: var(--mid);
    vertical-align: top;
}

.fc-etf-kv tr:last-child td { border-bottom: 0; }
.fc-etf-kv td:first-child { padding-right: 1rem; }

.fc-etf-kv td:last-child {
    text-align: right;
    font-family: var(--ff-mono);
    font-weight: 700;
    color: var(--navy);
    white-space: nowrap;
}

/* A holdings-lag row has no second column (etf_holdings_row passes ""): an
   empty right-aligned mono cell would just be dead space, so let it collapse
   rather than reserve width for nothing. */
.fc-etf-kv td:last-child:empty { display: none; }

/* ── diligence checklist ──
   Same shape as trading/fundamentalcore.html's .dil-list (3.4rem mark column
   + line), renamed fc-* since the two documents are never loaded together
   and a shared selector would only make it harder to tell, from the
   selector alone, which stylesheet a rule lives in. */
.fc-dil-list { list-style: none; margin: .3rem 0 0; padding: 0; }

.fc-dil-list li {
    display: grid;
    grid-template-columns: 3.4rem 1fr;
    gap: .2rem .8rem;
    padding: .7rem 0;
    border-bottom: 1px solid var(--border);
    align-items: start;
}

.fc-dil-list li:last-child { border-bottom: 0; }

.fc-dil-mark {
    align-self: start;
    font-family: var(--ff-mono);
    font-size: .6rem;
    letter-spacing: .08em;
    text-align: center;
    border-radius: 999px;
    padding: .25rem 0;
    border: 1px solid var(--border);
    color: var(--muted);
    background: var(--surface);
}

/* The mark's word carries the verdict; ink emphasis only, no colour --
   matching the "state is a shape" rule the rest of this page inherits from
   indicators.css. */
.fc-dil-mark.is-pass, .fc-dil-mark.is-fail { color: var(--navy); }

.fc-dil-line { font-size: .86rem; line-height: 1.58; color: var(--mid); }
.fc-dil-line b { color: var(--navy); font-family: var(--ff-mono); font-weight: 700; }

/* Provenance chip: a regex over 10-K prose (source="text") must not read
   like a tagged fact (source="edgar"/"xbrl"). Ink only; the label itself
   names which one this row is. */
.fc-dil-src {
    font-family: var(--ff-mono);
    font-size: .55rem;
    letter-spacing: .09em;
    text-transform: uppercase;
    vertical-align: .12em;
    white-space: nowrap;
    border: 1px solid var(--border);
    border-radius: 3px;
    padding: .05rem .28rem;
    margin-left: .35rem;
    color: var(--muted);
    background: var(--surface);
    font-weight: 600;
}

.fc-dil-term { color: var(--navy); font-weight: 600; }
.fc-dil-link { color: var(--blue); white-space: nowrap; }

/* ── language row: EN | TR | DE, visible (not just <link rel=alternate>) so
   a reader lands on whichever locale search sent them to and can still
   reach the other two. ── */
.fc-langrow {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 1.4rem 0 0;
    font-family: var(--ff-mono);
    font-size: .72rem;
    letter-spacing: .06em;
}

.fc-langrow a {
    color: var(--muted);
    padding: .32rem .65rem;
    border: 1px solid var(--border);
    border-radius: 6px;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.fc-langrow a:hover { color: var(--navy); border-color: var(--border-a); background: var(--hover); }
.fc-langrow a.active { color: var(--navy); border-color: var(--navy); font-weight: 600; }

/* ── CTA back to the interactive analyzer ── */
.fc-cta {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    margin-top: 1.5rem;
    padding: .85rem 1.3rem;
    background: var(--navy);
    color: #fff;
    font-family: var(--ff-mono);
    font-weight: 600;
    font-size: .78rem;
    letter-spacing: .04em;
    border-radius: 10px;
    transition: background .15s ease;
}

/* #253d87 is style.css's own .btn-primary hover value, reused rather than a
   third navy invented for one more button. No translateY/shadow here --
   indicators.css's pages step colour on hover, never elevation. */
.fc-cta:hover { background: #253d87; }

@media (min-width: 641px) {
    .fc-dil-list li { grid-template-columns: 3.8rem 1fr; }
    .fc-etf-prem-grid > div { font-size: .92rem; }
}