/* The indicator hubs (/economics/forecast/{indicator}) and the country-market pages (/world-market/...).
   They stand on history-report.css (hr-*); this file has only what those pages add.
   Colours come from the site's variables; a series is told apart by its legend and by the table under
   the chart, not by colour alone. */

.ec-hub,.ec-wm{--s1:#2457c5;--s2:#b85a0b;--s3:#0f7a65;--s4:#a02c78;--s5:#5a6270}
:root[data-theme=dark] .ec-hub,:root[data-theme=dark] .ec-wm{--s1:#80a4ff;--s2:#f0a050;--s3:#42c9ad;--s4:#e58bc7;--s5:#b4b9c4}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .ec-hub,:root:not([data-theme=light]) .ec-wm{--s1:#80a4ff;--s2:#f0a050;--s3:#42c9ad;--s4:#e58bc7;--s5:#b4b9c4}}

.ec-hub .econ-nav,.ec-wm .econ-nav{margin-top:6px}
.ec-hub .hr-chart{margin-top:6px}
.ec-hub .ec-bars,.ec-hub .ec-lines{max-width:760px;overflow:visible}
.ec-bars .ec-name{font-size:13px;fill:var(--text)}
.ec-bars .ec-val{font-size:12px;fill:var(--muted)}
.ec-bars .bar{fill:var(--brand)}
.ec-bars .bar.neg{fill:var(--down)}
.ec-bars .bar.iran{fill:var(--s3)}
.ec-bars .zero{stroke:var(--line-strong);stroke-width:1}

.ec-lines .grid line{stroke:var(--line);stroke-width:1}
.ec-lines .yl,.ec-lines .xl text{font-size:11.5px;fill:var(--muted)}
.ec-lines .ecl{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.ec-lines .ecl.fc{stroke-dasharray:6 5}
.ec-lines .s1{stroke:var(--s1)}.ec-lines .s2{stroke:var(--s2)}.ec-lines .s3{stroke:var(--s3)}.ec-lines .s4{stroke:var(--s4)}.ec-lines .s5{stroke:var(--s5)}

.ec-legend{display:flex;flex-wrap:wrap;gap:6px 18px;margin:10px 0 16px;padding:0;list-style:none;font-size:14px}
.ec-legend li{display:inline-flex;align-items:center;gap:8px}
.ec-legend .sw{display:inline-block;width:22px;height:4px;border-radius:2px;background:var(--s5)}
.ec-legend .sw.s1{background:var(--s1)}.ec-legend .sw.s2{background:var(--s2)}.ec-legend .sw.s3{background:var(--s3)}.ec-legend .sw.s4{background:var(--s4)}
.ec-h3{margin:30px 0 6px;font-size:17px;font-weight:700;color:var(--ink)}

.ec-table tr.is-key th,.ec-table tr.is-key td{background:var(--brand-soft)}
.ec-table td{font-variant-numeric:tabular-nums}
.ec-chg{white-space:nowrap;color:var(--text)}
.ec-chg::before{display:inline-block;margin-inline-end:4px;font-size:10px;color:var(--muted)}
.ec-chg.up::before{content:"▲"}
.ec-chg.down::before{content:"▼"}
.ec-chg.flat::before{content:"■"}

/* the country-market pages */
.ec-wm .hr-table td.ec-q{white-space:normal;max-width:34ch}
.ec-wm .ec-links{display:flex;flex-wrap:wrap;gap:8px 12px;margin:14px 0 0;padding:0;list-style:none}
.ec-wm .ec-links a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:var(--text);background:var(--surface)}
.ec-wm .ec-links a:hover,.ec-wm .ec-links [aria-current=page]{border-color:var(--brand);background:var(--brand-soft)}
.ec-wm .ec-countries{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px 12px;margin:0;padding:0;list-style:none}
.ec-wm .ec-countries a{display:flex;justify-content:space-between;gap:8px;min-height:44px;align-items:center;padding:6px 12px;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--text);background:var(--surface)}
.ec-wm .ec-countries a:hover{border-color:var(--brand)}
.ec-wm .ec-countries small{color:var(--muted)}

@media (max-width:760px){
  .ec-hub .hr-w,.ec-wm .hr-w{display:none}
  .ec-hub .hr-n,.ec-wm .hr-n{display:block}
  .ec-hub .hr-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}

.ec-hub .hr-scroll.tall{max-height:640px}