/* Tohen Media accessibility fixes - 2026-10-20 (see changes.md). Loaded last. */

/* A11Y-10: visible keyboard focus indicator (overrides outline:none rules) */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible, summary:focus-visible, iframe:focus-visible,
.topMenu .navbar-nav > li > a:focus-visible, .footer_contact .formInput:focus-visible,
.footer_without_form .formInput:focus-visible {
    outline: 3px solid #1a5fd0 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #ffffff !important;
}
/* the skip-link target receives programmatic focus: no ring around the whole page */
#main-content:focus, #main-content:focus-visible { outline: none !important; box-shadow: none !important; }
/* iCheck: the real checkbox is visually hidden, so show focus on its wrapper */
.icheckbox_flat-green.focus, .iradio_flat-green.focus,
.icheckbox_flat-green:focus-within, .iradio_flat-green:focus-within {
    outline: 3px solid #ffd54a !important;
    outline-offset: 2px !important;
}
/* dark sections: lighter focus ring */
.footer_contact :focus-visible, .footer_without_form :focus-visible,
.footer_contact_bottomSection :focus-visible, .footer_without_form_bottomSection :focus-visible,
.tabmenu :focus-visible, #BNagish :focus-visible {
    outline-color: #ffd54a !important;
    box-shadow: 0 0 0 2px #252a2f !important;
}

/* A11Y-08: contrast */
label[for="agree_privacy"] a, label[for="agree_privacy"] a:visited {
    color: #8cc8ff !important;
    text-decoration: underline !important;
}
.contant-card label[for="agree_privacy"] a, .form_page_form label[for="agree_privacy"] a { color: #1a5fd0 !important; }

/* A11Y-09: links inside text must not rely on colour alone */
.richtext a:not(.btn):not([class*="Btn"]):not([class*="button"]),
.itemContent a, .breadCrumbs a, .role a {
    text-decoration: underline;
}

/* A11Y-17: real H1 keeps the old div look */
h1.member-page-name { margin: 0; color: inherit; }

/* A11Y-29: "discover more" shown on hover should also show on keyboard focus */
a:focus .opacitybtn, a:focus-within .opacitybtn, .opacitybtn:focus-within { opacity: 1 !important; }

/* A11Y-04: skip-link bar is always in the tab order and appears only while one of its links has focus
   (replaces the old global keydown handler) */
.tabmenu { display: block !important; }
.tabmenu:not(:focus-within) {
    clip: rect(0, 0, 0, 0);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    width: 1px !important;
    height: 1px !important;
    overflow: hidden;
    padding: 0;
    border: 0;
}

/* A11Y-02: desktop sub-menus open on keyboard focus and close with Esc */
.topMenu .menuItem:focus-within > .submenu { visibility: visible; opacity: 1; }
.topMenu .menuItem.a11y-closed > .submenu { display: none !important; }

/* OneTrust focuses its own banner container on load; keep its original look (its buttons keep the focus ring) */
#onetrust-banner-sdk:focus, #onetrust-banner-sdk:focus-visible { outline: none !important; box-shadow: none !important; }

/* b5 (WAVE): real colours instead of transparent text in the skip-link bar.
   Unfocused links are clipped (visually hidden) instead of opacity:0 / text colour = background. */
.tabmenu li a { opacity: 1 !important; filter: none !important; color: #ffffff !important; background-color: #252a2f; }
.tabmenu li a:not(:focus) {
    position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important; -webkit-clip-path: inset(50%); clip-path: inset(50%); white-space: nowrap !important;
}
.tabmenu li a:focus { color: #ffff00 !important; }
/* b5 (WAVE): visually hidden labels get a defined, high-contrast colour pair (they are clipped, so nothing visible changes) */
.labelHide { color: #ffffff !important; background-color: #000000 !important; }
/* b5 (WAVE): hero banner text over a photo: dark fallback colour matching the image (avg #3c3c3e) */
.slickBannersCarousel .slickItem, .slickItem.BannerImage { background-color: #3c3c3e; }

/* b6: text size buttons inside the accessibility menu (#BNagishMenu) */
#BNagishMenu .a11yFontSize { display: flex; gap: 8px; padding: 0 16px 12px; }
#BNagishMenu .a11yFontBtn {
    flex: 1 1 0; min-width: 0; min-height: 44px; margin: 0; padding: 6px 4px;
    border: 0; border-radius: 6px; background: #5e5e5e; color: #ffffff;
    font-family: inherit; line-height: 1.2; cursor: pointer; text-align: center;
}
#BNagishMenu .a11yFontBtn:hover, #BNagishMenu .a11yFontBtn:focus { background: #be1e2d; color: #ffffff; }
#BNagishMenu .a11yFontBtn:focus-visible {
    outline: 3px solid #1a5fd0 !important; outline-offset: 2px !important; box-shadow: 0 0 0 2px #ffffff !important;
}
#BNagishMenu .a11yFontBtn .a11yFontGlyph { display: block; padding: 0; font-size: 20px; font-weight: bold; color: inherit; }
#BNagishMenu .a11yFontBtn .a11yFontText { display: block; padding: 0; font-size: 13px; color: inherit; }
/* b6c: the glyph (א+ / א / א-) is drawn from data-glyph so it is not part of the visible text name (axe label-content-name-mismatch);
   the accessible name is the aria-label, which equals the visible text label */
#BNagishMenu .a11yFontBtn .a11yFontGlyph::before { content: attr(data-glyph); content: attr(data-glyph) / ""; }
