/* Clone-specific styles: replacements for Stencil component styling that the
   original injected at runtime (ionic-sub-header), plus the homepage
   crisis-stats band added by the 2026-11-09 content refresh. Everything else
   comes from the site's own compiled CSS (styles.min.css + page css). */

/* ── ionic-sub-header clone (from assets/stencil/components/ionic-sub-header) */
.sub-header-clone {
  font-family: Inter, "Inter UI", Helvetica, Arial, sans-serif;
  position: sticky;
  top: -.5px;
  z-index: 99;
  background: #020814;
  color: #fff;
  font-size: 13px;
}
.sub-header-clone > .container {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  position: relative;
}
.sub-header-clone ul {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 10px 0;
}
.sub-header-clone ul li { display: flex; align-items: center; }
.sub-header-clone ul li + li::before {
  content: '/';
  margin: 0 8px;
  color: rgba(255, 255, 255, .4);
}
.sub-header-clone ul[slot="right"] li + li::before,
.sub-header-clone .container > ul:last-of-type li + li::before { content: none; }
.sub-header-clone .container > ul:last-of-type li { margin-left: 20px; }
.sub-header-clone a { color: rgba(255, 255, 255, .75); text-decoration: none; font-weight: 600; }
.sub-header-clone a:hover, .sub-header-clone a.active { color: #fff; }
.sub-header-clone__toggle { display: none; }

/* ── Homepage crisis-stats band (2026-11-09 refresh; typography mirrors
      the #performance stat list in home.min.css) */
#crisis-stats { padding-top: 40px; padding-bottom: 8px; }
#crisis-stats .crisis-stats__list {
  display: flex;
  flex-wrap: wrap;
  gap: 32px;
  list-style: none;
  margin: 0;
  padding: 0;
}
#crisis-stats .crisis-stats__list li {
  flex: 1 1 200px;
  display: flex;
  flex-direction: column;
}
#crisis-stats .crisis-stats__list strong {
  font-size: 56px;
  line-height: 100%;
  letter-spacing: -.03em;
  font-weight: 700;
  color: #020814;
}
#crisis-stats .crisis-stats__list span {
  margin-top: 10px;
  font-size: 16px;
  line-height: 150%;
  color: #445b78;
}
#crisis-stats .crisis-stats__sources {
  margin-top: 24px;
  font-size: 12px;
  color: #92a1b3;
}
@media (max-width: 767px) {
  #crisis-stats .crisis-stats__list strong { font-size: 40px; }
}

/* ── Article/report share icons (ion-icon replacements) */
.sharing .share-icon { width: 18px; height: 18px; display: inline-block; vertical-align: middle; fill: currentColor; }

/* ── Admin (bare, functional) */
.admin-body { font-family: Inter, Helvetica, Arial, sans-serif; background: #f6f8fa; color: #1a232f; }
#web-share { display: none; }