/* NCAPA accessibility fixes (WO-118). WCAG 2.2 AA: 4.5:1 for text, 24px tap targets. */

/* NCAPA blue, a shade deeper: #008AB0 is 3.99:1 on white; #007A9C is 4.93:1 (4.52:1 on the #f5f5f5 footer). */
body {
	--ironwood-primary-color: #007a9c;
	--ncapa-blue: #007a9c;
	--wp--preset--color--blue: #007a9c;
	/* NCAPA teal #4ca8bd is 2.74:1 against white either way; #2c7a8c is 4.92:1. */
	--ncapa-accent-teal: #2c7a8c;
	--wp--preset--color--teal: #2c7a8c;
}

/* NCAPA orange as text: #f19e38 is 2.2:1 on white; #ad5c00 is 4.87:1. Orange backgrounds stay orange. */
.has-orange-color {
	color: #ad5c00 !important;
}

/* Set by ncapa-a11y.js on Kadence blocks that carry #008ab0 or #4ca8bd in their own CSS. */
.ncapa-a11y-bg-blue:not(:hover):not(:focus) { background-color: #007a9c !important; }
.ncapa-a11y-bg-teal:not(:hover):not(:focus) { background-color: #2c7a8c !important; }
.ncapa-a11y-fg-blue:not(:hover):not(:focus) { color: #007a9c !important; }
.ncapa-a11y-fg-teal:not(:hover):not(:focus) { color: #2c7a8c !important; }

/* Post dates and categories on archive cards: #777 is 4.48:1; #666 is 5.74:1. */
.clb-custom-meta {
	color: #666;
}

/* Links on light colored panels (light blue, green, the chapter pastels, the light blue info cards):
   near-black, 4.5:1 or better on every one of them; underlined inside running text (see below). */
.entry-content .has-background:not(.has-blue-background-color):not(.has-dark-blue-background-color):not(.has-teal-background-color):not(.has-black-background-color):not(.has-orange-background-color) a:not(.wp-block-button__link),
.clb-single-info-card-wrapper[style*="174,218,229"] a {
	color: #1a1a1a;
}

/* Anything on NCAPA orange (#f19e38): dark text (8:1) instead of white (2.2:1). Info cards,
   Genesis Blocks buttons and orange panels carry it in markup; ncapa-a11y.js tags the rest.
   The last selector outranks Join Us's own Additional CSS (.page-id-35 … white !important). */
body .clb-single-info-card-wrapper[style*="241,158,56"],
body .clb-single-info-card-wrapper[style*="241,158,56"] *,
body [style*="background-color:#f19e38"],
body .ncapa-a11y-bg-orange,
body .ncapa-a11y-bg-orange *,
body .clb-single-info-card-wrapper.ncapa-a11y-bg-orange .clb-single-info-card-heading a {
	color: #1a1a1a !important;
}

/* EventRail date badge month: #2b6cb0 on #e1e7ee is 4.35:1; #255d99 is 5.43:1. */
.tder-date-badge__month {
	color: #255d99;
}

/* Genesis Blocks "Share on Twitter": white on #1ca1f3 is 2.82:1; #1170a8 is 5.38:1. */
.gb-block-sharing.gb-share-color-social .gb-share-twitter,
.gb-block-sharing.gb-share-color-social .gb-share-twitter:hover,
.gb-block-sharing.gb-share-color-social .gb-share-twitter:focus {
	background-color: #1170a8;
	color: #fff;
}

/* Set by ncapa-a11y.js on a link whose color fails against a light background it sits on. */
body .ncapa-a11y-link-dark {
	color: #1a1a1a !important;
}

/* Once a link is the same near-black as the text around it, the underline is what marks it
   as a link. Card and heading links stand alone and stay as they were. */
.entry-content .has-background :is(p, li) a:not(.wp-block-button__link),
.entry-content :is(p, li) a.ncapa-a11y-link-dark {
	text-decoration: underline;
}

/* Social icons in the top bar: at least 24 x 24px to tap. */
.clb-social-icon > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 24px;
	min-height: 24px;
}

/* File block: the file name link beside the Download button, at least 24px tall to tap. */
.wp-block-file > a:not(.wp-block-file__button) {
	display: inline-block;
	min-height: 24px;
	line-height: 24px;
}

/* EventRail turns the focus outline off on event titles (.tder-event-row__title a:focus, loaded
   after this file): give keyboard users one back, one step more specific. */
.tder-event-row .tder-event-row__title a:focus-visible,
.tder-event-card .tder-event-card__title a:focus-visible {
	outline: 3px solid var(--ncapa-blue);
	outline-offset: 2px;
}

/* Carousel pagination dots: a 24px target around the same 10px dot (WCAG 2.5.8). Kadence sets
   padding 0 and margin 3px on .splide__pagination__page; the dots end up 8px further apart. */
.splide .splide__pagination__page {
	box-sizing: content-box;
	padding: 7px;
	margin: 0;
	background-clip: content-box;
}