/* Cassiopeia accessibility integration — template files only. */
.wchd-skip-link {
  position: fixed;
  top: .5rem;
  left: .5rem;
  z-index: 10000;
  padding: .75rem 1rem;
  color: #000;
  background: #fff;
  border: 2px solid #005ea8;
  transform: translateY(-200%);
}
.wchd-skip-link:focus { transform: translateY(0); }
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid #005ea8;
  outline-offset: 3px;
  box-shadow: 0 0 0 3px #fff;
}
#eapps-instagram-feed-1 .eapps-instagram-feed-header-follow-button {
  background: #005ea8 !important;
  color: #fff !important;
}
#eapps-instagram-feed-1 .eapps-instagram-feed-header-follow-button-label {
  color: #fff !important;
}
#eapps-instagram-feed-1 .eapps-instagram-feed-header-follow-button-icon { fill: #fff !important; }
#eapps-twitter-feed-1 .eapps-twitter-feed-header-user-info-follow {
  background: #000 !important;
  color: #fff !important;
}
#eapps-twitter-feed-1 .eapps-twitter-feed-header-user-info-follow-label,
#eapps-twitter-feed-1 .eapps-twitter-feed-header-user-info-follow svg {
  color: #fff !important;
  fill: #fff !important;
}
/* WCAG 2.5.8 AA target size. Cassiopeia's hamburger is below the 24px minimum; 44px
   also satisfies 2.5.5 AAA and matches the touch target on the utility links. */
.navbar-toggler {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* WCAG 1.4.3 AA. ConvertForms writes --button-background-color into a per-form inline
   <style> in the head, so the id selector there outranks anything we load as a stylesheet.
   #4585f4 with white text is 3.55:1. #005ea8 is 6.63:1 and matches the Follow buttons above. */
.convertforms .cf-btn,
.convertforms .cf-btn:hover,
.convertforms .cf-btn:focus {
  --button-background-color: #005ea8 !important;
  --button-color: #ffffff !important;
  background-color: #005ea8 !important;
  color: #ffffff !important;
}

/* ---------------------------------------------------------------------------
   DoIT 508 remediation carried over from the live T3 template (2026-05-01 pass).
   On live these rules sit in an inline <style> in tpls/blocks/header.php and are
   scoped to .social-block. Cassiopeia's equivalent wrapper is .wchd-social-inner
   (index.php, bottom-a), so the scope is renamed and everything else is kept as
   deployed and verified on production. NOTES.md item 3 listed this port as
   outstanding; without it dev regresses eight contrast failures against live.
   --------------------------------------------------------------------------- */

/* WCAG 1.4.3 AA — Elfsight / Yottie secondary text ships at 3.06:1 to 4.43:1. */
.wchd-social-inner [class*="eapps-"] [class*="label"],
.wchd-social-inner [class*="eapps-"] [class*="date"],
.wchd-social-inner [class*="eapps-"] [class*="likes"],
.wchd-social-inner [class*="eapps-"] [class*="screen-name"],
.wchd-social-inner [class*="eapps-"] [class*="username"],
.wchd-social-inner [class*="eapps-"] [class*="see-more"],
.wchd-social-inner .es-header-user-username,
.wchd-social-inner .eapps-instagram-feed-header-stats-item-label,
.wchd-social-inner .eapps-twitter-feed-header-statistics-item-name,
/* Added 2026-09-07: the Facebook tab strip and post footers ship #7f8588 on white
   (3.74:1) and were not covered by the selector list carried over from live. */
.wchd-social-inner [class*="eapps-"] [class*="menu-item"],
.wchd-social-inner [class*="eapps-"] [class*="shares"],
.wchd-social-inner [class*="eapps-"] [class*="comments"],
.wchd-social-inner [class*="eapps-"] [class*="footer-meta"] * {
  color: #1f2933 !important;
}

/* Instagram header block: live pins these to solid black on white at 18px/700. */
.wchd-social-inner .es-header-user-username,
.wchd-social-inner .eapps-instagram-feed-header-stats-item-label,
.wchd-social-inner .eapps-instagram-feed-header-user-info-caption,
.wchd-social-inner .eapps-instagram-feed-header-user-info-caption a,
.wchd-social-inner .eapps-instagram-feed-header-stats-item,
.wchd-social-inner .eapps-instagram-feed-header-stats-item * {
  color: #000 !important;
  background-color: #fff !important;
  opacity: 1 !important;
  text-shadow: none !important;
}
.wchd-social-inner .eapps-instagram-feed-header-user-info-caption,
.wchd-social-inner .eapps-instagram-feed-header-user-info-caption a,
.wchd-social-inner .es-header-user-username {
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
}

/* "Load more" was 3.06:1 white on Instagram blue. #005ea8 is 6.63:1. */
.wchd-social-inner [class*="load-more"],
.wchd-social-inner button[class*="load-more"],
.wchd-social-inner .eapps-instagram-feed-posts-grid-load-more,
.wchd-social-inner .eapps-instagram-feed-posts-grid-load-more-text {
  color: #fff !important;
  background: #005ea8 !important;
  border: 2px solid #003f73 !important;
}

/* WCAG 1.4.1 AA — links in the feeds are otherwise distinguished by colour alone. */
.wchd-social-inner [class*="eapps-"] a,
.wchd-social-inner [class*="eapps-"] a span,
.wchd-social-inner [class*="eapps-"] a div,
.wchd-social-inner [class*="eapps-"] [class*="text"] a {
  color: #003f73 !important;
  text-decoration: underline !important;
}

/* WCAG 2.5.8 AA — the profile-name and post links inside the feeds sit at 15-18px.
   Live clears this because its base font is larger; on Cassiopeia they need the floor. */
.wchd-social-inner [class*="eapps-"] a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}

/* WCAG 2.5.8 AA — Smart Slider bullets render at 10x10 on Cassiopeia and 24x24 on
   live, so this is both an accessibility fix and a visual parity fix. */
.n2-ss-control-bullet .n2-bullet,
.nextend-bullet-bar .n2-bullet,
.n2-thumbnail-dot,
div.n2-bullet {
  min-width: 24px !important;
  min-height: 24px !important;
  width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  margin: 8px !important;
  box-sizing: border-box !important;
}
.n2-ss-control-bullet,
.nextend-bullet-bar,
.nextend-thumbnail-scroller { gap: 12px !important; }

/* WCAG 2.5.8 AA — in-page anchor links in article bodies (the FAQ index is ~45 of them)
   are 19px tall on Cassiopeia against 26.4px on live, where they compute to inline-block.
   Matching live restores both the target size and the visual line rhythm. */
.com-content-article__body a,
.com-content-article a {
  display: inline-block;
  min-height: 24px;
  line-height: 22.4px;
}

/* Later desktop parity rules override the original mobile grid. Restore reflow. */
@media (max-width: 767.98px) {
  .wchd-home-component .wchd-news-calendar-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .wchd-news-col, .wchd-calendar-col { min-width: 0; }
}
