/* Accessibility (WCAG 2.1 AA) overrides. Loaded last in BaseSite.master.
   The theme accent #77b2f4 was darkened to #1d63b3 in style-lhmwd.css so it reads on white (6.0:1).
   On the dark header, footer and banners the light accent still passes, so it is restored there. */

/* Skip link (2.4.1 Bypass Blocks) */
.skip-link {
    position: absolute;
    left: 8px;
    top: -60px;
    z-index: 10000;
    padding: 10px 16px;
    background: #1d63b3;
    color: #ffffff !important;
    font-weight: 600;
    border-radius: 3px;
    text-decoration: none;
    transition: none !important;
}

.skip-link:focus {
    top: 8px !important;
}

#main-content:focus {
    outline: none;
}

/* Visible keyboard focus (2.4.7 Focus Visible) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #1d63b3 !important;
    outline-offset: 2px;
}

.context-dark a:focus-visible,
.context-dark button:focus-visible,
.rd-navbar-dark a:focus-visible,
.rd-navbar-dark button:focus-visible,
.rd-navbar-dark input:focus-visible {
    outline-color: #ffffff !important;
}

/* Light accent on dark backgrounds */
.context-dark .text-primary,
.rd-navbar-dark .rd-navbar-panel a:not([class]),
.breadcrumbs-custom a:hover {
    color: #77b2f4;
}

.footer-classic a:not(.button):hover,
.footer-classic a:not(.button):focus {
    color: #77b2f4 !important;
}

/* Top menu hover/focus/current state sits on the dark menu bar; the theme selectors are long, so !important */
.rd-navbar-dark .rd-nav-item:hover > .rd-nav-link,
.rd-navbar-dark .rd-nav-item.focus > .rd-nav-link,
.rd-navbar-dark .rd-nav-item.opened > .rd-nav-link,
.rd-navbar-dark .rd-nav-item.active > .rd-nav-link,
.rd-navbar-dark .rd-nav-link:focus-visible,
.rd-navbar-dark .rd-nav-item:hover > .rd-navbar-submenu-toggle,
.rd-navbar-dark .rd-nav-item.focus > .rd-navbar-submenu-toggle,
.rd-navbar-dark .rd-nav-item.opened > .rd-navbar-submenu-toggle,
.rd-navbar-dark .rd-nav-item.active > .rd-navbar-submenu-toggle {
    color: #77b2f4 !important;
}

.footer-classic .svg-color-primary,
.context-dark .svg-color-primary {
    fill: #77b2f4;
}
