/* r3-lists.css — round 3 (9 Nov 2026), group G (lists): the list template (/stocks/, /etfs/, their market pages,
 * /crypto/, /commodities/, /companies/), /countries/ and the glossary. Loaded only there (inc/lists-r3.php). Values from
 * the design files (list-template.html, list-template-country.html, countries-list.html, glossary-index.html). The
 * news index has its own file (r3-news.css). */

/* --- list template: the Show ▾ / Filter ▾ bar at the design's 42px (12 + 18 + 10 + the 2px rule); the 44px tap
   area stays, as an invisible layer that moves nothing --- */
.td-section-index .lt-bar .lt-word { min-height: 0; position: relative; }
.td-section-index .lt-bar .lt-word::after { content: ""; position: absolute; left: 0; right: 0; top: -1px; bottom: -1px; }
/* Show ▾ sits 24px further from Filter ▾ than the bar's gap (design td-sort: .td-sortbtn{margin-right:24px}); here the
   button is wrapped (td_sort_menu()), so the wrapper carries it. cdiff r2: x 1160 vs 1136 at 1440, 221 vs 182 at 390. */
.td-section-index .lt-bar > .td-sortmenu { margin-right: 24px; }
/* the Show menu's panel: the house panel's own padding (16 / 32 / 28), so its options run 256px in a 320px panel */
@media (min-width: 641px) {
	.td-section-index .td-sort-panel.lt-panel { padding: 16px 32px 28px; }
}

/* --- countries: the coverage line under the figures (design block tdch-key-css, verbatim) --- */
.tdch-key{margin:18px 0 0;max-width:none;font-size:15px;line-height:1.6;color:var(--td-ink-2)}.tdch-opt-s{display:block;font-size:12px;line-height:1.3;color:var(--td-ink-3);text-align:right}@media (max-width:640px){.tdch-key{font-size:14px}}
/* the crumb at its 18px line: the 44px hit area is a layer, not padding (padding put the hero 51px low); the hub's own
   step reads grey, as drawn */
.td-countries-archive .tdch .tdch-crumbs a { padding-block: 0; position: relative; }
.td-countries-archive .tdch .tdch-crumbs a::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 44px; transform: translateY(-50%); }
.td-countries-archive .tdch .tdch-crumbs .tdch-crumb-world[aria-current] { color: var(--td-ink-3, #6E6A62); }

/* --- glossary index --- */
/* the search line at the design's height (40px desktop, 34px phone): the input's 44px floor is gone, the row is the target */
.gloss-main .gloss-search input { min-height: 0; }
/* the explainer link at the design's size class, sentence case (the Lists note): 12px, the smallest type we set */
.gloss-main .gl-more { font-size: 12px; position: relative; }
/* a 44px tap area on the 18px link, as a layer that moves nothing (final sweep r2: gl-more 137x18) */
.gloss-main .gl-more::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 44px; transform: translateY(-50%); }
/* phone: the alphabet in two even rows of 14, as drawn (gloss-az); the r2 auto-fill floor of 24px made three rows at 390
   (141px vs the design's 89). The chip wraps under the term only when it does not fit, as in the design. */
@media (max-width: 640px) {
	.gloss-main .gloss-az { grid-template-columns: repeat(14, minmax(0, 1fr)) !important; }
	.gloss-main .gloss-az .gl-letter, .gloss-main .gloss-az .gl-letter.gl-all { min-height: 40px !important; }
}
