/* HP HWC MS - design tokens
   deodar (forest green) for chrome, ink for text, paper background,
   species colours come from the species table (Leopard amber, Black Bear indigo). */
:root {
  --deodar: #1f4d3d;
  --deodar-dark: #163a2e;
  --ink: #1d2927;
  --muted: #5d6b67;
  --paper: #f3f5f1;
  --surface: #ffffff;
  --rule: #d3d9d0;
  --leopard: #c0690c;
  --bear: #3d4270;
  --hs-red: #b3261e;
  --hs-yellow: #d4a017;
  --hs-green: #3f8a4d;

  --bs-primary: #1f4d3d; --bs-primary-rgb: 31, 77, 61;
  --bs-link-color: #1f4d3d; --bs-link-color-rgb: 31, 77, 61;
  --bs-link-hover-color: #163a2e;
  --bs-body-color: #1d2927; --bs-body-bg: #f3f5f1;
  --bs-body-font-family: "Source Sans 3", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
  --bs-border-color: #d3d9d0;
  --bs-border-radius: 3px;
}
body { font-size: 0.97rem; line-height: 1.5; }
h1, h2, h3, h4, .h1, .h2, .h3, .h4 { font-family: "Source Serif 4", Georgia, "Times New Roman", serif; font-weight: 700; color: var(--ink); letter-spacing: -0.005em; }
.btn-primary { --bs-btn-bg: #1f4d3d; --bs-btn-border-color: #1f4d3d; --bs-btn-hover-bg: #163a2e; --bs-btn-hover-border-color: #163a2e; --bs-btn-active-bg: #163a2e; --bs-btn-disabled-bg: #1f4d3d; }
.btn-outline-primary { --bs-btn-color: #1f4d3d; --bs-btn-border-color: #1f4d3d; --bs-btn-hover-bg: #1f4d3d; --bs-btn-hover-border-color: #1f4d3d; }
:focus-visible { outline: 3px solid #e0a100; outline-offset: 2px; }
.skip-link { position: absolute; left: 8px; top: 8px; z-index: 3000; background: #fff; padding: 6px 10px; }

/* header + navigation */
.site-header { background: var(--deodar); color: #fff; border-bottom: 4px solid #d4a017; }
.brand { display: flex; align-items: center; gap: 12px; color: #fff; }
.brand:hover { color: #fff; }
.brand-mark { display: inline-grid; place-items: center; width: 44px; height: 44px; border: 2px solid rgba(255,255,255,.85); font: 700 0.8rem "Source Serif 4", Georgia, serif; letter-spacing: .03em; }
.brand-text strong { display: block; font: 700 1.15rem/1.2 "Source Serif 4", Georgia, serif; }
.brand-text small { display: block; color: rgba(255,255,255,.72); font-size: .8rem; }
.site-nav { background: var(--deodar-dark); padding: 0; }
.site-nav .nav-link { color: rgba(255,255,255,.82); padding: .65rem 1rem; border-bottom: 3px solid transparent; }
.site-nav .nav-link:hover { color: #fff; }
.site-nav .nav-link.active { color: #fff; font-weight: 600; border-bottom-color: #d4a017; }
.site-nav .navbar-toggler { border-color: rgba(255,255,255,.4); }
.site-nav .navbar-toggler-icon { filter: invert(1); }
.site-footer { border-top: 1px solid var(--rule); background: #e9ede6; color: var(--muted); }

/* panels */
.panel { background: var(--surface); border: 1px solid var(--rule); border-radius: 3px; }
.panel > .panel-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: .6rem 1rem; border-bottom: 1px solid var(--rule); background: #fafbf9; }
.panel > .panel-head h2, .panel > .panel-head h3 { margin: 0; font-size: 1.05rem; }
.panel > .panel-body { padding: 1rem; }
.page-title { margin: 1rem 0 .25rem; font-size: 1.7rem; }
.page-lead { color: var(--muted); max-width: 68ch; }
.filter-bar { background: var(--surface); border: 1px solid var(--rule); padding: .75rem; margin: 0 0 1rem; border-radius: 3px; }
.filter-bar .form-label { font-size: .8rem; color: var(--muted); margin-bottom: .15rem; }

/* figures */
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--rule); background: var(--surface); }
.stat-grid > div { padding: .8rem 1rem; border-right: 1px solid var(--rule); }
.stat-grid > div:last-child { border-right: 0; }
.stat-num { font: 700 1.9rem/1.1 "Source Serif 4", Georgia, serif; font-variant-numeric: tabular-nums; }
.stat-label { color: var(--muted); font-size: .85rem; }
.swatch { display: inline-block; width: .8em; height: .8em; border-radius: 50%; margin-right: .35em; vertical-align: -1px; }
@media (max-width: 767px) { .stat-grid { grid-template-columns: repeat(2, 1fr); } .stat-grid > div:nth-child(2) { border-right: 0; } .stat-grid > div:nth-child(-n+2) { border-bottom: 1px solid var(--rule); } }

/* maps + charts */
.map-box { width: 100%; height: 520px; border: 1px solid var(--rule); background: #dfe6dd; }
.map-box.tall { height: 68vh; min-height: 460px; }
.map-box.short { height: 340px; }
.chart-box { position: relative; height: 300px; }
.chart-box.tall { height: 380px; }
.leaflet-popup-content { font-size: .88rem; line-height: 1.4; margin: 10px 12px; }
.leaflet-popup-content dl { margin: .3rem 0 0; display: grid; grid-template-columns: auto 1fr; gap: 0 .6rem; }
.leaflet-popup-content dt { color: var(--muted); font-weight: 400; }
.leaflet-popup-content dd { margin: 0; }
.map-legend { background: rgba(255,255,255,.94); padding: 6px 10px; border: 1px solid var(--rule); font-size: .82rem; line-height: 1.5; }

/* tables */
.table-dense { font-size: .9rem; --bs-table-bg: transparent; }
.table-dense th { font-weight: 600; white-space: nowrap; background: #fafbf9; }
.table-dense td, .table-dense th { padding: .4rem .6rem; }
.num { text-align: right; font-variant-numeric: tabular-nums; }
.bar-cell { position: relative; min-width: 120px; }
.bar-cell > i { position: absolute; left: 0; top: 18%; bottom: 18%; background: rgba(31,77,61,.16); }
.bar-cell > span { position: relative; }

/* badges */
.badge-status { font-weight: 600; font-size: .75rem; padding: .25em .55em; border-radius: 2px; }
.st-verified { background: #dcefe0; color: #1d5a2b; }
.st-unverified { background: #f5ecd0; color: #7a5a00; }
.st-rejected { background: #f3d9d6; color: #8a1d16; }
.hs-red { background: var(--hs-red); color: #fff; } .hs-yellow { background: var(--hs-yellow); color: #1d2927; } .hs-green { background: var(--hs-green); color: #fff; }
.hs-chip { display: inline-block; padding: .1em .55em; font-size: .78rem; font-weight: 600; border-radius: 2px; }

.notice { border-left: 4px solid var(--hs-yellow); background: #fbf6e4; padding: .6rem .9rem; font-size: .9rem; }
.notice.info { border-left-color: var(--deodar); background: #e8f0ea; }
.module-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0; border: 1px solid var(--rule); background: var(--surface); }
.module-list li { border-right: 1px solid var(--rule); border-bottom: 1px solid var(--rule); margin: 0 -1px -1px 0; padding: .8rem 1rem; }
.module-list a { font-weight: 600; }
.module-list p { margin: .2rem 0 0; color: var(--muted); font-size: .88rem; }
.kv { display: grid; grid-template-columns: 11rem 1fr; gap: .35rem 1rem; margin: 0; }
.kv dt { color: var(--muted); font-weight: 400; }
.kv dd { margin: 0; }
@media (max-width: 575px) { .kv { grid-template-columns: 1fr; } .kv dt { margin-top: .4rem; } }
.pagination { --bs-pagination-active-bg: #1f4d3d; --bs-pagination-active-border-color: #1f4d3d; --bs-pagination-color: #1f4d3d; }

@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; scroll-behavior: auto !important; } }
@media print { .site-header, .site-footer, .filter-bar, .btn { display: none !important; } .map-box { height: 380px; } }
