/* Server-rendered data views: fee cells, hub filters, facets, offered-as,
   pathways, place intros, dashboard health. Interactive modules live in ui.css. */

/* Fee states (decision D8): a dated price, an explicit absence, or unchecked. */
.fee { display: inline-block; line-height: 1.3; }
.fee .fee-when { display: block; color: var(--muted); font-size: 12px; font-weight: 400; }
.fee--absent { color: var(--plum); font-weight: 600; font-size: 14px; }
.fee--unchecked { color: var(--muted); }
.fee-coverage { margin-top: 10px; }
td .best { color: var(--teal-deep); }

/* Hub filters (P7.2) and chips (P5.1) */
.hub-filters { margin-top: 22px; display: grid; gap: 8px; }
.facet-row { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.facet-label { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); min-width: 92px; }
.chip.is-on { background: var(--teal-deep); color: #fff; border-color: var(--teal-deep); }
.chip .n { opacity: .7; font-family: var(--mono); font-size: 11px; margin-left: 4px; }
a.chip { text-decoration: none; }
.hub-quick { max-width: 360px; margin-top: 6px; }
.results-count { color: var(--muted); margin-top: 12px; }
.hub-table td small { display: block; color: var(--muted); font-size: 12px; }
.hub-table .th-compare { width: 120px; }
.hub-table .rto { font-family: var(--mono); }

/* Search facets: state + city blocks reuse .facet */
.facet h3 small { font-weight: 400; color: var(--muted); font-size: 12px; }
.results-head h1 small { display: block; font-size: 16px; color: var(--muted); font-weight: 500; }

/* Offered as (P4.2) */
.offered-as { margin-top: 30px; }
.offered-as .table-shell { margin-top: 10px; }
.variant-note { border-left: 3px solid var(--teal); padding-left: 12px; }
.muted { color: var(--muted); }

/* Pathways (P7.4) */
.pathway-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px; }
.pathway { background: var(--wash); border: 1px solid var(--rule); border-radius: 12px; padding: 18px; }
.pathway h3 { font-size: 16px; margin: 0 0 10px; }
.pathway ul { list-style: none; padding: 0; margin: 0 0 10px; display: grid; gap: 6px; }
.pathway li .n { color: var(--muted); font-size: 12px; margin-left: 6px; }
.career-list { display: flex; flex-wrap: wrap; gap: 6px; }
.career-list .tag { text-decoration: none; }

/* City intro (P6.3) + programmatic links (P12.3) */
.place-intro { max-width: 760px; margin-top: 18px; display: grid; gap: 8px; color: var(--ink); }
.place-intro p { margin: 0; }
.sibling-cities { color: var(--muted); }
.combo-links { margin-top: 22px; }
.combo-links ul { list-style: none; padding: 0; margin: 8px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.combo-links li a { display: inline-block; padding: 6px 10px; border: 1px solid var(--rule); border-radius: 999px; font-size: 13px; text-decoration: none; }
.combo-links li a .n { color: var(--muted); font-family: var(--mono); font-size: 11px; margin-left: 4px; }

/* Harvest dashboard health (P3.2) + demand panels (P10.2) */
.health { border: 1px solid var(--rule); border-radius: 12px; padding: 16px; display: grid; gap: 12px; }
.health-state { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.health-state small { color: var(--muted); }
.health .dot { width: 14px; height: 14px; border-radius: 50%; background: #999; display: inline-block; }
.health--green .dot { background: #1e9e5a; }
.health--amber .dot { background: #e0a100; }
.health--red { border-color: #c62828; background: #fff5f5; }
.health--red .dot { background: #c62828; }
.health-legs td, .health-legs th { padding: 4px 10px 4px 0; text-align: left; }
.health-legs .is-low td { color: #c62828; }
tr.is-failed td { color: #c62828; }
.demand-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.demand-panel { border: 1px solid var(--rule); border-radius: 10px; padding: 12px; }
.demand-panel h5 { margin: 0 0 8px; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.demand-panel table { width: 100%; font-size: 14px; }

/* Prose pages: trust pages, privacy, guides */
.prose { max-width: 760px; }
.prose .entry { margin-top: 22px; font-size: 17px; line-height: 1.6; }
.prose .entry h2 { font-family: var(--display); font-size: 26px; margin: 34px 0 10px; color: var(--plum); letter-spacing: -.02em; }
.prose .entry h3 { font-size: 19px; margin: 26px 0 8px; }
.prose .entry p, .prose .entry ul, .prose .entry ol { margin: 0 0 14px; }
.prose .entry li { margin-bottom: 6px; }
.prose .entry table { width: 100%; border-collapse: collapse; margin: 14px 0 20px; font-size: 15px; }
.prose .entry th, .prose .entry td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--rule); vertical-align: top; }
.prose .entry blockquote { border-left: 3px solid var(--teal); margin: 0 0 14px; padding: 4px 0 4px 16px; color: var(--muted); }