/*
 * Classic template: what the shared accessibility module (www/common/modules/a11y) needs
 * from this design. Module option 'own' => ['text', 'images'] turns the generic rules for
 * those two off; they are done here instead.
 */

/* The settings button sits bottom left (the "back to top" button is bottom right). */
:root { --mws-fab-left: 15px; --mws-fab-right: auto; --mws-fab-bottom: 15px; }
/* The cookie card sits bottom right on wider screens, so the button on the left stays where
   it is; on phones the banner spans the width and the module's rule moves the button up. */
@media (min-width: 641px) { html.mws-consent-open .mws-fab { bottom: var(--mws-fab-bottom) !important; } }

/* Text size: much of this design's text is in px, which a larger root font size would not
   reach, so the page is zoomed instead (layout reflows as with browser zoom). */
html[data-a11y-text="115"] body { zoom: 1.15; }
html[data-a11y-text="130"] body { zoom: 1.3; }
html[data-a11y-text="150"] body { zoom: 1.5; }

/* Hide images: photos, and the slideshow and header backgrounds (their dark base color
   stays behind the white captions). */
html[data-a11y-images="on"] body img,
html[data-a11y-images="on"] body video { opacity: 0 !important; }
html[data-a11y-images="on"] .carousel-item .fill,
html[data-a11y-images="on"] header.masthead,
html[data-a11y-images="on"] section#contact { background-image: none !important; }
html[data-a11y-images="on"] .carousel-item .fill { background-color: #212529 !important; }

/* High contrast keeps the slideshow captions readable on the black base */
html[data-a11y-contrast="on"] .carousel-item .fill { background-color: transparent !important; }
html[data-a11y-contrast="on"] #mainNav { background-image: none !important; }

/* zoomed text on a narrow screen: long words and the footer links wrap instead of
   pushing the page sideways */
html[data-a11y-text] body * { overflow-wrap: anywhere; }
html[data-a11y-text] footer a.d-inline-block { max-width: calc(100% - 2rem); white-space: normal; }