/* WP-N2: Charities. Added to the /next/ build alongside next.css, never inside it — see
   docs/next-build-specs.md section 0.5a. Every class here is prefixed ch- so it cannot
   collide with next.css or the other two packages being built at the same time. */

.ch-rail{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:1rem}
.ch-rail-h{font-size:var(--t-h3);margin:0 0 .8rem}
.ch-field{margin-bottom:.9rem}
.ch-field select,.ch-field input[type=text]{width:100%;padding:.55rem .7rem;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font-size:var(--t-ui-sm)}
.ch-search-row{display:flex;gap:.5rem}
.ch-search-row input{flex:1;min-width:0}
.ch-applied{margin-top:1rem;padding-top:.9rem;border-top:1px solid #eef2f4}
.ch-applied-h{display:block;font-size:var(--t-chip);font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:.5rem}
.ch-applied-chips{display:flex;flex-wrap:wrap;gap:.4rem}

.ch-main{min-width:0}

/* The profile tabs (Finances, Funding evidence) still use a plain table; the results/side list
   does not any more (see .ch-cards below, WP-N5). */
.ch-table{width:100%;border-collapse:collapse;font-size:var(--t-ui-sm)}
.ch-table th{text-align:left;font-size:var(--t-caption);font-weight:600;color:var(--muted);border-bottom:2px solid var(--line);padding:.5rem .6rem;cursor:default}
.ch-table th[data-ch-sort]{cursor:pointer;color:var(--navy)}
.ch-table th[data-ch-sort]:hover{text-decoration:underline}
.ch-table td{padding:.55rem .6rem;border-bottom:1px solid #eef2f4;vertical-align:top}
.ch-table tbody tr:hover{background:#f7fafb}

/* WP-N5: the selection list. One stacked card per charity, used by both '#/charities' and
   '#/charities/SC012345' so selecting a charity never changes this column's width or shape,
   only which card carries .is-selected. */
.ch-sort-btns{display:flex;gap:.5rem;margin-bottom:.7rem}
.ch-cards{list-style:none;margin:0 0 .2rem;padding:0;display:flex;flex-direction:column;gap:.55rem}
.ch-card{display:flex;flex-direction:column;gap:.2rem;padding:.6rem .7rem;border:1px solid var(--line);border-left:3px solid transparent;border-radius:8px;background:#fff;text-decoration:none;color:inherit}
.ch-card:hover{background:#f7fafb;text-decoration:none}
.ch-card.is-selected{border-left-color:var(--navy);background:rgba(29,58,92,.06)}
.ch-card-name{font-weight:600;color:var(--ink)}
.ch-card-sub{font-size:var(--t-caption);color:var(--muted)}
.ch-card-fig{font-size:var(--t-caption);display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.ch-empty{color:var(--muted)}

.ch-name{font-weight:600;display:block}
.ch-sub{display:block;font-size:var(--t-caption);color:var(--muted)}
.ch-mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}
.ch-muted{color:var(--muted)}
.ch-unknown{font-style:italic}
.ch-band-word{font-weight:600}
.ch-checksum{font-size:.75rem;word-break:break-all}

.ch-badge{display:inline-flex;align-items:center;border-radius:100px;padding:.24rem .6rem;font-size:var(--t-chip);font-weight:700;white-space:nowrap}
.ch-badge-yes{background:var(--teal-soft);color:var(--teal-dark)}
.ch-badge-no{background:var(--unknown-tint);color:var(--unknown)}
.ch-fund-pending{font-size:var(--t-caption);color:var(--muted);font-style:italic}

.ch-pager{display:flex;align-items:center;gap:1rem;justify-content:center;margin-top:1rem;flex-wrap:wrap}
.ch-sort-note{margin-top:.6rem;text-align:center}

/* WP-N5: one persistent two-pane grid for both '#/charities' and '#/charities/SC012345'. Kept
   at the same 360px left column on both routes so there is nothing to compress and nothing to
   morph when a charity is selected. */
.ch-split{display:grid;grid-template-columns:360px 1fr;gap:1.2rem;align-items:start}
.ch-side{display:flex;flex-direction:column;gap:1rem}
.ch-detail{min-width:0}

.ch-profile-name{margin:0 0 .15rem}
.ch-profile-id{font-size:var(--t-caption);color:var(--muted);margin:0 0 1rem}
.ch-back{display:inline-block;margin-bottom:.7rem}

/* WP-N9 item 16: the one-line sentence on a profile reached by charity number, saying scope
   was not applied. Plain text, not a modal and not a warning colour. */
.ch-scope-note{margin:0 0 .8rem;color:var(--muted)}

.ch-lanes{align-items:stretch}
.ch-lane{background:#fff;border:1px solid var(--line);border-radius:10px;padding:.9rem;display:flex;flex-direction:column;gap:.5rem;height:100%}
.ch-lane-head{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.ch-lane-head h4{margin:0;font-size:var(--t-ui-sm)}
.ch-sub-h{font-size:var(--t-ui-sm);margin:1.1rem 0 .5rem}

/* WP-N9 item 1: next.css's shared .fig lays the figure and its label out in one row with no
   wrap, so a long figure (a seven-figure grants total) and its label collide inside a narrow
   Overview lane. Scoped to .ch-lane so this never touches .fig anywhere else on the site: the
   figure sits on its own line and the label below it, which cannot overlap at any width. */
.ch-lane .fig{flex-direction:column;align-items:flex-start;gap:.15rem}
.ch-lane .fig .fv{min-width:0}

/* WP-N6: overview comparison sentence and the classifications block (items 7-8). */
.ch-midpoint{margin:.7rem 0 0}
.ch-classify{margin:.9rem 0 0;padding-top:.8rem;border-top:1px solid #eef2f4}
.ch-objectives{margin:0 0 .7rem}
.ch-class-row{display:flex;gap:.7rem;align-items:flex-start;margin-bottom:.55rem;flex-wrap:wrap}
.ch-class-label{flex:0 0 130px;font-size:var(--t-caption);font-weight:600;color:var(--muted);padding-top:.2rem}
.ch-class-chips{display:flex;flex-wrap:wrap;gap:.35rem;flex:1;min-width:0}
.ch-plain-chip{padding-right:.65rem}

/* WP-N6: the per-lane order control on Funding evidence (item 12), matching the Awards tab's
   toolbar shape and placement. */
.ch-toolbar{display:flex;align-items:flex-end;gap:.6rem;margin:.4rem 0 .6rem}
.ch-toolbar select{padding:.4rem .6rem;border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);font-size:var(--t-ui-sm)}
.ch-nowrap{white-space:nowrap}

/* WP-N6: Sources tab, funding evidence provenance rows (item 13). */
.ch-prov-row{margin-bottom:.5rem}
.ch-prov-label{font-weight:600;display:block;margin-bottom:.1rem}

/* Pack F (item 10): the funder concentration block under the grants figure on a charity
   profile. .status s-par is the shared partial-evidence chip already used elsewhere on this
   build; reused here rather than inventing a second way to say "this is a subset". */
.ch-fconc{margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--line)}
.ch-fconc-head{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.3rem}
.ch-fconc-head h4{margin:0;font-size:var(--t-ui-sm)}
.ch-fbar{display:flex;width:100%;height:.9rem;border-radius:5px;overflow:hidden;background:var(--unknown-tint);margin:.6rem 0 .7rem}
.ch-fbar span{height:100%}
.ch-flist{display:flex;flex-direction:column;gap:.35rem}
.ch-frow{display:grid;grid-template-columns:.9rem 1fr auto auto;align-items:center;gap:.55rem;font-size:var(--t-ui-sm)}
.ch-swatch{width:.75rem;height:.75rem;border-radius:3px;flex:0 0 auto}
.ch-fname{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ch-fval{font-variant-numeric:tabular-nums;white-space:nowrap}
.ch-fpct{font-variant-numeric:tabular-nums;white-space:nowrap;min-width:3.2rem;text-align:right}
.ch-frow-muted{color:var(--muted)}
.ch-frow-muted .ch-fname{white-space:normal}

@media(max-width:1050px){
  .ch-split{grid-template-columns:1fr}
  .ch-lanes{grid-template-columns:1fr}
}
@media(max-width:650px){
  .ch-table thead{display:none}
  .ch-table,.ch-table tbody,.ch-table tr,.ch-table td{display:block;width:100%}
  .ch-table tr{border-bottom:2px solid var(--line);padding:.5rem 0}
  .ch-table td{border-bottom:0;padding:.2rem 0}
  .ch-search-row{flex-direction:column}
}

/* The remainder row opens to name the funders it covers. Reuses the shared .disc disclosure so
   it looks like every other "show me the rest" on the site; only the spacing is local. */
.ch-frest{margin-top:.5rem}
.ch-frest .disc-body{padding-top:.4rem}
.ch-fzero{margin-top:.6rem}
