/*
 * fd-stock-skin.css — Version 1.0.0 (2026-10-26)
 *
 * THE STOCK PAGES' SKIN FOR TOOLS BUILT ON THE .bq-fd SYSTEM.
 * /institutions/, /institutions/{name}/, /compare/, /scatter/ and
 * /stocks/{t}/revenue-breakdown/ keep bq-ownership's .bq-fd structure and
 * scripts, but the design they wear is the /stocks/ pages', bq-pages'
 * stock lists' and the company-KPI tool's — not the fund pages':
 *   - tokens: the stock pages' blue-grey ink and hairlines, and the KPI ramp
 *     in place of the fund hues;
 *   - buttons: company-KPI .ck-control-btn — white, grey label, ink on
 *     hover. No dark fill and no blue label, in any state;
 *   - tables: bq-pages' .bq-sl-table, value for value;
 *   - selects open the KPI menu (bq-dropdown, loaded by each page).
 * The fund pages themselves do not load this file: they keep their card
 * contents (funds.css 3.3.0 gives every .bq-fd page the stock pages' card
 * frames and ground).
 *
 * Opt in with the body class .bq-stock-skin.
 */
body.bq-stock-skin .bq-fd {
    --fd-ink: #0b1f2e;
    --fd-text: #37485a;
    --fd-muted: #6b7a89;
    --fd-faint: #97a4b2;
    --fd-line: #eaeff4;
    --fd-line-mid: #dfe6ed;
    --fd-line-strong: #cfd9e3;
    --fd-tint: #f7fafc;
    --fd-tint-2: #f1f6fa;
    --fd-navy: #0b1f2e;
    --fd-teal: #0f6e6e;   --fd-teal-soft: rgba(15, 110, 110, .10);
    --fd-amber: #ef9f4a;  --fd-amber-soft: rgba(239, 159, 74, .14);
    --fd-rose: #cf4d4d;   --fd-rose-soft: rgba(207, 77, 77, .10);
    --fd-violet: #7a5a9e; --fd-violet-soft: rgba(122, 90, 158, .10);
    --fd-plum: #a84a72;   --fd-plum-soft: rgba(168, 74, 114, .10);
    /* Blue is focus rings and links only, as on the stock pages. */
    --fd-blue: #217ab4;   --fd-blue-soft: rgba(0, 82, 155, .08);
    --fd-accent: var(--fd-teal);
    --fd-accent-soft: var(--fd-teal-soft);
}

/* The cards' overflow:hidden existed to clip the fund pages' coloured top
   bar (gone in funds.css 3.3.0); it would also clip the KPI menus. */
body.bq-stock-skin .bq-fd .bq-section { overflow: visible; }

/* ── Buttons: company-KPI .ck-control-btn ── */
body.bq-stock-skin .bq-fd .bq-fd-btn {
    height: 34px;
    padding: 0 12px;
    box-sizing: border-box;
    justify-content: center;
    gap: 7px;
    background: #fff;
    border: 1px solid var(--fd-line-mid);
    border-radius: 6px;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .1px;
    line-height: 1;
    color: var(--fd-muted);
    text-decoration: none;
    white-space: nowrap;
}
body.bq-stock-skin .bq-fd .bq-fd-btn:hover {
    background: var(--fd-tint-2);
    border-color: var(--fd-line-strong);
    color: var(--fd-ink);
}
body.bq-stock-skin .bq-fd .bq-fd-btn:focus-visible {
    outline: none;
    border-color: var(--fd-blue);
    box-shadow: 0 0 0 3px var(--fd-blue-soft);
}
body.bq-stock-skin .bq-fd .bq-fd-btn[disabled] {
    opacity: 1;
    background: #f8f9fa;
    border-color: #e9ecef;
    color: var(--fd-faint);
}

/* Search boxes: the KPI field. */
body.bq-stock-skin .bq-fd .bq-fd-search input {
    height: 34px;
    border: 1px solid var(--fd-line-mid);
    border-radius: 6px;
    font-size: 12.5px;
    color: var(--fd-ink);
}
body.bq-stock-skin .bq-fd .bq-fd-search input:hover { border-color: var(--fd-line-strong); }
body.bq-stock-skin .bq-fd .bq-fd-search input:focus {
    outline: none;
    border-color: var(--fd-blue);
    box-shadow: 0 0 0 3px var(--fd-blue-soft);
}

/* ── Tables: bq-pages' stock-list table (bq-pages/assets/css/stock-lists.css,
   .bq-sl-table), value for value: a #f5f8fa header over a 2px #cdd7e0 rule
   with 10px/700 uppercase #a0aec0 labels, 13px #4a5568 rows 7px x 12px on
   #e7edf2 hairlines, a #f4f8fb hover, tickers bold #00529b. The table sits
   flush in its card. ── */
body.bq-stock-skin .bq-fd .bq-fd-tablewrap { border: 0; border-radius: 0; }
body.bq-stock-skin .bq-fd .bq-fd-table { font-size: 13px; color: #4a5568; }
body.bq-stock-skin .bq-fd .bq-fd-table thead th {
    padding: 8px 12px;
    background: #f5f8fa;
    border-bottom: 2px solid #cdd7e0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .9px;
    text-transform: uppercase;
    color: #a0aec0;
    white-space: nowrap;
}
body.bq-stock-skin .bq-fd .bq-fd-table thead th button,
body.bq-stock-skin .bq-fd .bq-fd-table thead th a {
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    text-transform: inherit;
}
body.bq-stock-skin .bq-fd .bq-fd-table thead th button:hover,
body.bq-stock-skin .bq-fd .bq-fd-table thead th a:hover { color: #4a5568; }
body.bq-stock-skin .bq-fd .bq-fd-table td,
body.bq-stock-skin .bq-fd .bq-fd-table tbody th {
    padding: 7px 12px;
    border-bottom: 1px solid #e7edf2;
    font-size: 13px;
    color: #4a5568;
    vertical-align: middle;
}
body.bq-stock-skin .bq-fd .bq-fd-table td { font-variant-numeric: tabular-nums; }
body.bq-stock-skin .bq-fd .bq-fd-table tbody tr:hover { background: #f4f8fb; }
body.bq-stock-skin .bq-fd .bq-fd-table tbody tr:last-child td,
body.bq-stock-skin .bq-fd .bq-fd-table tbody tr:last-child th { border-bottom: 0; }
body.bq-stock-skin .bq-fd .bq-fd-table td.bq-fd-c-rank { color: #a0aec0; font-size: 12px; }
body.bq-stock-skin .bq-fd .bq-fd-table .is-up,
body.bq-stock-skin .bq-fd .bq-fd-table td.is-up { color: #15803d; }
body.bq-stock-skin .bq-fd .bq-fd-table .is-down,
body.bq-stock-skin .bq-fd .bq-fd-table td.is-down { color: #c5331f; }

/* Screen-reader-only labels. */
body.bq-stock-skin .screen-reader-text {
    position: absolute !important;
    width: 1px; height: 1px;
    margin: -1px; padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 768px) {
    body.bq-stock-skin .bq-fd .bq-fd-table thead th,
    body.bq-stock-skin .bq-fd .bq-fd-table td,
    body.bq-stock-skin .bq-fd .bq-fd-table tbody th { padding: 8px 10px; }
    body.bq-stock-skin .bq-fd .bq-fd-table td,
    body.bq-stock-skin .bq-fd .bq-fd-table tbody th { font-size: 12.5px; }
}

/* iOS zooms the page on focus of any field under 16px. Last in the file. */
@media (pointer: coarse) {
    body.bq-stock-skin .bq-fd input[type="search"],
    body.bq-stock-skin .bq-fd input[type="text"],
    body.bq-stock-skin .bq-fd input[type="number"],
    body.bq-stock-skin .bq-fd select,
    body.bq-stock-skin .bq-fd textarea,
    body.bq-stock-skin .bq-fd .bq-fd-search input {
        font-size: 16px !important;
    }
}