/* ============================================================
   GLOBAL TITLE & HEADER TYPOGRAPHY — GalaxySeven
   ------------------------------------------------------------
   Source of truth for the house heading face:

     premium-nav.css → .premium-nav-link {
         font-family: "Montserrat", sans-serif;
     }

   The premium navigation typeface is carried over to every
   heading in the app. Two families of class names are covered and
   treated identically:

     *-title   → `.co-section-title`, `.cb-panel-title`,
                 `.trade-hero-title`, `.shared-auth-title`,
                 `.legal-modal-title`, `.dash-section-title`, …
     *-header  → `.bebay-header`, `.co-header`, `.ui-header`,
                 `.legal-modal-header`, `.rw-panel-header`, …

   Both get the nav family at medium weight (500).

   HOW THE SELECTORS WORK
     [class$="-title"]   → the class attribute ENDS with `-title`
     [class*="-title "]  → `-title` is followed by another class
                           (or a trailing space)
   …and the same pair again for `-header`. Both halves are needed
   to catch elements that carry extra classes; together they
   deliberately skip look-alikes such as `.rw-title-icon` /
   `.mt-section-title-icon`, which a plain `[class*="-title"]`
   substring test would wrongly match.

   THE THIRD SELECTOR
   A page-header bar keeps its heading in a bare `<h1>` styled by a
   compound `.xx-header h1` rule (`.bebay-header h1`,
   `.co-header h1`, `.dashboard-header h1`, …). Compound selectors
   out-rank inheritance, so those headings have to be named
   explicitly — otherwise they keep Orbitron/Maven Pro at weight
   700–800. Scoping this to h1–h4 inside a `*-header` leaves the
   bar's other labels, buttons and values on their own type styles.

   SPECIFICITY
   `:root :is(...)` resolves to (0,2,0) — (0,2,1) for the nested
   heading form — so these declarations beat the per-page
   `.something-title` rules and template `<style>` blocks without
   needing `!important`. A component that genuinely needs another
   face or weight can still win with a two-class selector.

   New templates must link this sheet alongside the others:
     <link rel="stylesheet"
           href="{{ url_for('static', filename='css/title-font.css') }}">
   ============================================================ */

:root {
    --title-font: "Montserrat", sans-serif;
}

/* Every *-title and *-header element */
:root :is(
    [class$="-title"], [class*="-title "],
    [class$="-header"], [class*="-header "]
) {
    font-family: var(--title-font);
    font-weight: 500;
}

/* Heading nested in a *-header bar (`.co-header h1`, …) */
:root :is([class$="-header"], [class*="-header "]) :is(h1, h2, h3, h4) {
    font-family: var(--title-font);
    font-weight: 500;
}