/*
 * Accessibility overrides (WCAG 2.1 AA).
 * Loaded after app.css (compiled, no source in repo), so fixes live here.
 */

/* ---- CONTRAST FIXES: DISABLED pending client sign-off on colours ---- */

:root {
    /*#4e8ac9 fails*/
    /*4.5: 1 on light backgrounds;*/
    /*darker variant for light sections*/
    --color-blue-a11y-on-light: #2a66a5;
    /*5.9: 1 on white,*/
    /*4.5: 1 on light lavender #4e8ac9 fails*/
    /*4.5: 1 on the navy footer;*/
    /*lighter variant for dark sections*/
    --color-blue-a11y-on-dark: #6f9fdc;
    /*5.4: 1 on #002658,*/
    /*4.9: 1 on #032c6a*/
}

/*Footer: blue text on navy (4.09:1 -> 5.4:1). Re-scoping the variable fixes*/
/*  every footer rule that uses var(--color-blue) (menu, boiler, connect, sign up). */
.footer {
    --color-blue: var(--color-blue-a11y-on-dark);
}

/*Blue text/buttons on light backgrounds (2.76:1 -> 4.5:1+). */
main,
.bg-light-lavender,
.bg-lightest-lemon,
.bg-light-lemon,
.bg-lemon,
.bg-lighter-gray {
    --color-blue: var(--color-blue-a11y-on-light);
}

/*Inline colour pasted into editor content */
main [style*="color: #4e8ac9"],
main [style*="color:#4e8ac9"] {
    color: var(--color-blue-a11y-on-light) !important;
}

/*Keep the header / solid blue sections on the original brand blue */
.bg-blue {
    --color-blue: #4e8ac9;
}

/*White text on lavender (2.02:1) -> navy (7.3:1) */
.bg-lavender .testimonial-slider__quote,
.bg-lavender .testimonial-slider__attribution,
.bg-lavender .social-cta__title,
.bg-lavender [style*="color: #ffffff"],
.bg-lavender [style*="color:#ffffff"],
.bg-lavender [style*="color: #fff;"],
.bg-lavender.testimonial-slider,
.bg-lavender .hh-btn.hh-btn--white {
    color: var(--color-blueDarker) !important;
}

.bg-lavender .hh-btn.hh-btn--white {
    border-color: var(--color-blueDarker);
}

.bg-lavender .hh-btn.hh-btn--white:focus,
.bg-lavender .hh-btn.hh-btn--white:hover {
    background: var(--color-blueDarker);
    color: var(--color-white) !important;
}

.bg-lavender .testimonial-slider .swiper-pagination-bullet,
.bg-lavender.testimonial-slider .swiper-pagination-bullet {
    border-color: var(--color-blueDarker);
    color: var(--color-blueDarker);
}

.bg-lavender .testimonial-slider .swiper-pagination-bullet.swiper-pagination-bullet-active,
.bg-lavender.testimonial-slider .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--color-blueDarker);
}

/*Visually-hidden bullet label text must still meet contrast */
.testimonial-slider .swiper-pagination-bullet {
    color: var(--color-blueDarker);
}

/*FAQ header: white on gold (1.78:1) -> navy */
.questions__header h3 {
    color: var(--color-blueDarker);
}

/* ---- END CONTRAST FIXES ---- */

/* FAQ header is keyboard-focusable (role=button); show focus ring */
.questions__header:focus-visible {
    outline: 3px solid var(--color-blueDarker);
    outline-offset: -3px;
}

/* Top nav links: #fbfeff on --color-blueDark #4278b5 = 4.52:1 (passes AA) */
.header__top-nav ul > li a {
    color: #fbfeff;
}

/*
 * Testimonial slider text + controls (chevrons + pagination dots).
 * Colour follows the block's background so non-text contrast is >= 3:1
 * (WCAG 2.2 SC 1.4.11). Navy passes on every background option:
 *   none/white 14.8, gray 14.2, light-lemon 14.1, lightest-lemon 13.1,
 *   lemon 12.8, light-lavender 11.3, orange 8.3, lavender 7.3,
 *   deep-lavender 5.4, blue 4.1
 * Blue keeps white (3.6:1) to match the original design.
 */
.testimonial-slider {
    --slider-control-color: var(--color-blueDarker);
}

.testimonial-slider.bg-blue {
    --slider-control-color: var(--color-white);
}

/* Quote + attribution text. Both are "large text" (quote >= 28px/600,
   attribution >= 25px), so AA needs 3:1 (SC 1.4.3); every combo passes. */
.testimonial-slider,
.testimonial-slider .testimonial-slider__quote,
.testimonial-slider .testimonial-slider__attribution {
    color: var(--slider-control-color);
}

.testimonial-slider .swiper-button-prev,
.testimonial-slider .swiper-button-next {
    color: var(--slider-control-color);
}

.testimonial-slider .swiper-pagination-bullet {
    border-color: var(--slider-control-color);
    color: var(--slider-control-color); /* hidden "Go to slide N" label */
}

.testimonial-slider .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: var(--slider-control-color);
}

/* Visible keyboard focus (SC 2.4.7) in the same contrast-safe colour */
.testimonial-slider .swiper-button-prev:focus-visible,
.testimonial-slider .swiper-button-next:focus-visible,
.testimonial-slider .swiper-pagination-bullet:focus-visible {
    outline: 2px solid var(--slider-control-color);
    outline-offset: 3px;
}