/**
 * WCAG 2.1 AA helpers for OBC — load after library theme stylesheet.
 * Targets findings from automated scan (contrast, focus).
 */

/* Shared subscribe strip (was inline style on #subscribe — easier 1.4.12 overrides) */
#subscribe {
	background-color: #374f75;
	padding-top: 25px;
	padding-bottom: 15px;
}

/* Email field on blue bar: white input surface + dark text (AA vs background + placeholder) */
#subscribe .subscribe-input {
	background-color: #ffffff !important;
	color: #1a1a1a !important;
	border: 1px solid #2c3d52 !important;
}
#subscribe .subscribe-input:focus {
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

/* Side menu: theme uses #808080 on #1a1a1a — bump for AA small text; force over per-library CSS */
.menu .menu-wrap > a.smoothScroll {
	color: #d8d8d8 !important;
}
.menu .menu-wrap > a.smoothScroll:hover,
.menu .menu-wrap > a.smoothScroll:focus {
	color: #ffffff !important;
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

.menu .menu-wrap button.menu-close {
	color: #cfcfcf !important;
}
.menu .menu-wrap button.menu-close:hover,
.menu .menu-wrap button.menu-close:focus {
	color: #ffffff !important;
}

/* Subscribe strip: ensure CTA text/background ratio on blue bar */
#subscribe .subscribe-submit.btn-green2,
#subscribe button.subscribe-submit {
	background-color: #14532d !important;
	color: #ffffff !important;
	border: 2px solid transparent;
}
#subscribe .subscribe-submit.btn-green2:hover,
#subscribe .subscribe-submit.btn-green2:focus,
#subscribe button.subscribe-submit:hover,
#subscribe button.subscribe-submit:focus {
	background-color: #0f3f22 !important;
	color: #ffffff !important;
}

/* Club name links on #g (light gray area) */
#g .club-grid-card-title {
	margin-top: 10px;
	margin-bottom: 0;
	font-size: 14px;
	line-height: 1.35;
	letter-spacing: 2px;
	font-weight: 700;
}
#g .club-grid-card-title .club-card-title-link {
	color: #2a2a2a;
	text-decoration: none;
}
#g .club-grid-card-title .club-card-title-link:hover {
	color: #0b5cab;
	text-decoration: underline;
}
#g .club-grid-card-title .club-card-title-link:focus {
	color: #0b5cab;
	outline: 2px solid #0b5cab;
	outline-offset: 3px;
}

/* book.php header: theme targeted h2/h3; markup now uses h1 + p.h3 */
#header h1,
#header h2 {
	color: #5dca88;
	font-size: 36px;
	line-height: 48px;
}
#header h3 {
	color: #ccc;
	font-weight: 400;
	font-size: 28px;
	margin: 0;
}

/* Submit buttons (library picker #374F75 bar, First Look form, etc.) */
#subscribe .subscribe-submit.btn-green2,
#subscribe button.subscribe-submit,
#subscribe-promo button[type="submit"].btn-green2,
#subscribe-promo .subscribe-submit-firstlook {
	background-color: #14532d !important;
	color: #ffffff !important;
	border-color: transparent !important;
}
#subscribe .subscribe-submit.btn-green2:hover,
#subscribe .subscribe-submit.btn-green2:focus,
#subscribe button.subscribe-submit:hover,
#subscribe button.subscribe-submit:focus,
#subscribe-promo button[type="submit"].btn-green2:hover,
#subscribe-promo button[type="submit"].btn-green2:focus,
#subscribe-promo .subscribe-submit-firstlook:hover,
#subscribe-promo .subscribe-submit-firstlook:focus {
	background-color: #0f3f22 !important;
	color: #ffffff !important;
}

/* Book page: day-picker buttons on pale blue header */
#header .btn.btn-trans {
	color: #2d3333 !important;
	border-color: #5c6565 !important;
}
#header .btn.btn-trans:hover,
#header .btn.btn-trans:focus {
	color: #0d1111 !important;
	background-color: rgba(255, 255, 255, 0.35) !important;
}

/* clubs.php optional library banner strip (see .logo-bar--accent / .logo-bar--light) */
#logo-bar.logo-bar--accent a {
	color: #ffffff !important;
	text-decoration: underline;
}
#logo-bar.logo-bar--light a {
	color: #1a3652 !important;
}

/* Clubs hero (#h): white on #8090aa is often <4.5:1 for body-sized text — darken band for AA */
#h {
	background-color: #4a5a72 !important;
}
#h h1 {
	color: #ffffff !important;
	font-weight: 700;
}
#h h2 {
	color: #ffffff !important;
	font-weight: 400;
}
/* clubs.php hero tagline uses <h2 class="h3"> — beat Bootstrap .h3 gray */
#h.clubs-hero-banner h2.h3 {
	color: #ffffff !important;
	font-weight: 400 !important;
}

/* club.php hero: one page h1 (club), book title = h2 */
#h h1.club-page-heading {
	font-size: 40px !important;
	font-weight: 500 !important;
	margin: 0 !important;
	color: #ffffff !important;
}
#h h2.club-book-heading {
	font-size: 30px !important;
	font-weight: 600 !important;
	margin: 0.35em 0 0 !important;
	color: #ffffff !important;
	line-height: 1.25;
}
#h h2.club-book-heading a {
	color: #ffffff !important;
	text-decoration: underline;
}
#h h2.club-book-heading a:hover,
#h h2.club-book-heading a:focus {
	color: #ffeee4 !important;
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}
#h .club-authors-line {
	color: #f0f4f8 !important;
	margin-top: 0.5rem;
}

/* club.php: second white band was duplicate id="w" — unique id, same spacing as #w */
#club-readers-wrap.club-readers-wrap {
	padding-top: 50px;
	padding-bottom: 50px;
}
#h hr {
	border-color: #ffffff !important;
}

/* Slide-out home link — class + href for scanners that ignore compound selectors */
.menu .menu-wrap .logo > a.site-home-link {
	color: #ffffff !important;
}
.menu .menu-wrap .logo > a.site-home-link:hover,
.menu .menu-wrap .logo > a.site-home-link:focus {
	color: #ffeee4 !important;
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

/* Menu open control: ensure icon meets contrast on translucent bar */
#menuToggle {
	color: #ffffff !important;
	background-color: rgba(0, 0, 0, 0.55) !important;
}
#menuToggle:hover,
#menuToggle:focus {
	background-color: rgba(0, 0, 0, 0.72) !important;
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

/* Email field placeholder (on white input) */
#subscribe .subscribe-input::placeholder {
	color: #4a4a4a;
	opacity: 1;
}
#subscribe .subscribe-input:-ms-input-placeholder {
	color: #4a4a4a;
}

/* Purina / special block: mail link on #374F75 — hotpink fails AA */
#subscribe a.link-on-subscribe {
	color: #ffffff !important;
	text-decoration: underline;
	font-weight: 600;
}

/* Any green Bootstrap submit (picklibrary, etc.) */
button[type="submit"].btn-green2 {
	background-color: #14532d !important;
	color: #ffffff !important;
	border-color: transparent !important;
}
button[type="submit"].btn-green2:hover,
button[type="submit"].btn-green2:focus {
	background-color: #0f3f22 !important;
	color: #ffffff !important;
}

/* Book header: #ccc on pale blue can fail — deepen slightly */
#header p.h3 {
	color: #5c6565 !important;
	font-weight: 400;
	font-size: 28px;
	margin: 0;
}

/* clubs.php grid: hover fan-out (was tied to duplicate IDs; container uses .library-oyset-header-inner) */
.no-touch .library-oyset-header-inner:hover .bookcover {
	transition: all 0.2s ease;
}
.no-touch .library-oyset-header-inner:hover .library-oyset-bookcover:nth-child(1) .bookcover.medium {
	-webkit-transform: translateX(-10px);
	transform: translateX(-10px);
}
.no-touch .library-oyset-header-inner:hover .library-oyset-bookcover:nth-child(2) .bookcover.small {
	-webkit-transform: translateX(25px);
	transform: translateX(25px);
}
.no-touch .library-oyset-header-inner:hover .library-oyset-bookcover:nth-child(3) .bookcover.x-small {
	-webkit-transform: translateX(60px);
	transform: translateX(60px);
}

/* Skip link: high-contrast when focused (Bootstrap sr-only-focusable) */
a.sr-only.sr-only-focusable:focus,
a.sr-only.sr-only-focusable:focus-visible {
	position: fixed;
	top: 0.5rem;
	left: 0.5rem;
	z-index: 100000;
	clip: auto !important;
	width: auto !important;
	height: auto !important;
	padding: 0.65rem 1rem !important;
	margin: 0 !important;
	overflow: visible !important;
	background-color: #0b3d6d !important;
	color: #ffffff !important;
	text-decoration: underline;
	outline: 3px solid #ffffff;
	outline-offset: 2px;
}

/* First Look / KidsBuzz: primary CTA on white (scan contrast) */
#subscribe-promo .btn-primary {
	background-color: #0b5cab !important;
	border-color: #084a8f !important;
	color: #ffffff !important;
}
#subscribe-promo .btn-primary:hover,
#subscribe-promo .btn-primary:focus {
	background-color: #073a6e !important;
	border-color: #052e57 !important;
	color: #ffffff !important;
}

#subscribe-promo .subscribe-input::placeholder {
	color: #4a4a4a;
	opacity: 1;
}

#subscribe-promo .subscribe-input.subscribe-promo-email-input::placeholder {
	color: #3d3d3d !important;
	opacity: 1 !important;
}

/* subscription_block2.php — First Look / KidsBuzz (inline styles moved for 1.4.12) */
#subscribe-promo {
	background-color: #ffffff;
	padding-top: 0;
}
#subscribe-promo .subscribe-promo-copy {
	color: #1a1a1a;
	text-align: justify;
	line-height: 1.65;
	letter-spacing: 0.01em;
}
#subscribe-promo .subscribe-promo-email-input {
	border: 1px solid #1a1a1a;
}
#subscribe-promo .subscribe-promo-col-narrow {
	padding-left: 100px;
}
@media (max-width: 991px) {
	#subscribe-promo .subscribe-promo-col-narrow {
		padding-left: 15px;
	}
}
#subscribe-promo .btn-primary.subscribe-promo-learn {
	font-size: 18px;
	background-color: #084a8f !important;
	border-color: #063c75 !important;
	color: #ffffff !important;
}
#subscribe-promo .btn-primary.subscribe-promo-learn:hover,
#subscribe-promo .btn-primary.subscribe-promo-learn:focus {
	background-color: #063a72 !important;
	border-color: #052e57 !important;
	color: #ffffff !important;
}

/* book.php */
#header .book-jacket-hero {
	box-shadow: 0 4px 6px 2px rgba(0, 0, 0, 0.1), 0 11px 3px 5px rgba(0, 0, 0, 0.02), 0 9px 12px 2px rgba(0, 0, 0, 0.4);
}
.book-chapter-body {
	line-height: 1.65;
	letter-spacing: 0.01em;
}
.book-chapter-body img {
	max-width: 100%;
	height: auto;
}
.book-reader-reviews {
	padding-top: 50px;
	padding-bottom: 50px;
}

/* book.php: weekday strip (replaces inline background from controller) */
#header .book-day-picker .btn-trans.book-day-nav-active {
	background-color: #5dca88 !important;
	color: #0d1111 !important;
	border-color: #3dad6e !important;
}
#header .book-day-picker .btn-trans.book-day-nav-active:hover,
#header .book-day-picker .btn-trans.book-day-nav-active:focus {
	background-color: #4ab87a !important;
	color: #000000 !important;
	outline: 2px solid #0d1111;
	outline-offset: 2px;
}

.book-goodreads-iframe {
	display: block;
	max-width: 100%;
	border: 0;
}

.matomo-noscript-img {
	border: 0;
	vertical-align: middle;
}

/* picklibrary.php: visible label + hint */
.picklibrary-field-label {
	display: block;
	color: #ffffff;
	font-weight: 600;
	margin-bottom: 0.35rem;
	text-align: center;
}
.picklibrary-search-hint {
	color: #e8eef5;
	font-size: 13px;
	line-height: 1.45;
	margin: 0.5rem 0 0;
	text-align: center;
}

/* First Look promo (white strip): keep a visible label — does not use float/absolute pill layout */
#subscribe-promo .subscribe-promo-field-label {
	display: block;
	color: #1a1a1a;
	font-weight: 600;
	margin-bottom: 0.35rem;
}

/* Subscribe strip copy: move long inline styles to CSS (WCAG 1.4.12 spacing overrides) */
#subscribe .subscribe-lede {
	font-size: 14px;
	color: #fff;
	text-align: justify;
	text-justify: inter-word;
	line-height: 1.65;
	letter-spacing: 0.01em;
}

/* book.php section heading (was inline margin) */
.book-todays-reading-heading {
	margin-bottom: 27px;
}

/* picklibrary.php visible page title */
.picklibrary-page-title {
	color: #ffffff;
	font-size: 28px;
	font-weight: 600;
	margin-top: 1.25rem;
	margin-bottom: 1rem;
	text-align: center;
}

/* clubs.php home: logo bar + hero + club grid (inline styles reduced) */
.logo-bar {
	margin-left: -20px;
}
.logo-bar--accent {
	background-color: #8090aa;
}
.logo-bar--light {
	background-color: #ffffff;
}
.logo-bar-ecpl-img {
	margin-top: 8px;
	padding-top: 6px;
	height: 144px;
}
#h.clubs-hero-banner {
	min-height: 160px;
}
#h h1.clubs-libname-heading {
	font-size: 48px !important;
	line-height: 1.15;
}
.clubs-grid-section {
	padding-top: 30px;
}
@media (min-width: 992px) {
	.clubs-grid-container {
		width: 930px;
		max-width: 100%;
	}
}
#g .bookcover .bookcover-img-div {
	background-image: var(--jacket);
}

/* authorbuzz_block.php (if included): avoid clashing id + promo layout */
#authorbuzz-promo {
	background-color: #ffffff;
	padding-top: 12px;
	padding-bottom: 12px;
}
#authorbuzz-promo .authorbuzz-promo-copy {
	color: #1a1a1a;
	line-height: 1.65;
}
#authorbuzz-promo .authorbuzz-promo-img {
	margin: 35px auto;
	display: block;
	max-width: 100%;
	height: auto;
}

#authorbuzz-promo a.btn.btn-primary.authorbuzz-promo-more {
	background-color: #084a8f !important;
	border-color: #063c75 !important;
	color: #ffffff !important;
}
#authorbuzz-promo a.btn.btn-primary.authorbuzz-promo-more:hover,
#authorbuzz-promo a.btn.btn-primary.authorbuzz-promo-more:focus {
	background-color: #063a72 !important;
	border-color: #052e57 !important;
	color: #ffffff !important;
}
