/* /companies.html only — auto-hashed by asset_map(), loaded only on this page. */

.co-tools {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s3);
  align-items: end;
  padding: var(--s4) 0;
  border-bottom: var(--rule) solid var(--line);
}

.co-search {
  flex: 1 1 16rem;
  min-width: 12rem;
}
.co-search input {
  width: 100%;
  font: inherit;
  font-size: var(--t3);
  padding: var(--s2) var(--s3);
  border: var(--rule) solid var(--line);
  background: var(--panel);
  color: var(--ink);
  border-radius: 0.25rem;
}

.co-pick {
  display: flex;
  flex-direction: column;
  gap: var(--s1);
  font-size: var(--t2);
}
.co-pick-key {
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: var(--t1);
}
.co-pick select {
  font: inherit;
  font-size: var(--t3);
  padding: var(--s1) var(--s2);
  border: var(--rule) solid var(--line);
  background: var(--panel);
  color: var(--ink);
  border-radius: 0.25rem;
  min-width: 8rem;
}

.co-cols { position: relative; }
.co-cols-menu {
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 5;
  background: var(--panel);
  border: var(--rule) solid var(--line);
  padding: var(--s2) var(--s3);
  display: flex;
  flex-direction: column;
  gap: var(--s1);
  font-size: var(--t2);
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}
/* P49-D5's bug, here too: `display: flex` beats the browser's own
   `[hidden] { display: none }`, so the menu rendered open on every load. */
.co-cols-menu[hidden] { display: none; }

.co-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s2);
  padding: var(--s3) 0;
}
.co-chip {
  font: inherit;
  font-size: var(--t2);
  padding: var(--s1) var(--s2);
  border: var(--rule) solid var(--line);
  border-radius: 999px;
  background: var(--panel-wash);
  color: var(--ink);
  cursor: pointer;
}
.co-chip-clear {
  border-style: dashed;
  color: var(--muted);
}

.co-count {
  font-size: var(--t2);
  color: var(--muted);
  margin: 0 0 var(--s2);
}

.co-table-wrap {
  overflow-x: auto;
}

.co-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--t3);
}
.co-table th,
.co-table td {
  padding: var(--s2) var(--s3);
  border-bottom: var(--rule) solid var(--line-soft);
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 16rem;
}
.co-table thead th {
  font-size: var(--t1);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  position: sticky;
  top: 0;
  background: var(--paper);
}
.co-h-sort { cursor: pointer; }
.co-h-sort:hover { color: var(--ink); }
.co-h-sort[aria-sort="ascending"]::after { content: " \2191"; }
.co-h-sort[aria-sort="descending"]::after { content: " \2193"; }
.co-h-num { text-align: right; font-variant-numeric: tabular-nums; }

.co-row.is-hidden { display: none; }
.co-nopage { color: var(--muted); font-size: var(--t1); }

.co-class {
  display: inline-block;
  padding: 0 var(--s2);
  border-radius: 0.2rem;
  font-size: var(--t1);
  color: var(--band-ink);
}
.co-class-financial { background: var(--class-financial); }
.co-class-material { background: var(--class-material); }
.co-class-other { background: var(--class-other); opacity: var(--c-oth-alpha, 0.65); }

.co-note {
  font-size: var(--t2);
  color: var(--muted);
  max-width: 60rem;
}

@media (max-width: 640px) {
  .co-tools { flex-direction: column; align-items: stretch; }
  /* .co-search's `flex: 1 1 16rem` sizes WIDTH in the default row axis; once
     this rule flips the axis to column, the same basis sizes HEIGHT instead
     and the search box grows to 16rem tall. Reset it for the column axis. */
  .co-search { flex: none; }
  .co-table thead { display: none; }
  .co-table, .co-table tbody, .co-table tr, .co-table td { display: block; width: 100%; }
  .co-table tr {
    border-bottom: var(--rule) solid var(--line);
    padding: var(--s2) 0;
  }
  .co-table td {
    white-space: normal;
    max-width: none;
    border-bottom: none;
    padding: var(--s1) 0;
  }
  .co-table td:not(.co-name):not(.co-col-ticker):not(.co-col-platform)::before {
    content: attr(data-label);
    display: inline-block;
    min-width: 6rem;
    color: var(--muted);
    font-size: var(--t1);
  }
  /* B11: Company, Ticker, Listing Type, Class, Filings on mobile — the rest
     collapse to keep a card scannable rather than a table squeezed thin.
     `.co-table td` above sets display:block at specificity (0,0,1,1); a bare
     class selector is only (0,0,1,0) and loses to it regardless of source
     order, so every one of these needs the `.co-table td` prefix to actually
     win. Market cap joins the hidden set here too -- B11 names five columns
     and this is not one of them. */
  .co-table td.co-col-sector, .co-table td.co-col-industry,
  .co-table td.co-col-basic, .co-table td.co-col-index, .co-table td.co-cap {
    display: none;
  }
}