/**
 * Accessibility Improvements
 * Improved visibility for menu selection, hover states, and focus indicators
 */

/* Accessibility: hover and focus states for table headers */
table.display thead th:hover {
    outline: 2px solid #2271b1;
    outline-offset: -2px;
}

table.display thead th:focus {
    outline: 3px solid #2271b1;
    outline-offset: -3px;
}




/* Global focus styles - visible blue outline for all interactive elements */
/* Remove default focus outline first */
*:focus {
    outline: none;
}

/* Apply custom teal/blue outline to interactive elements */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
    outline: 2px solid #2BABCC !important;
    outline-offset: 0;
}



/* Navigation menu - make the whole menu item visible with white outline on focus/hover */
#navigation ul li a {
    display: block !important;
}

#navigation ul li a:focus,
#navigation ul li a:hover {
    outline: 2px solid #ffffff !important;
    outline-offset: -2px;
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Fix 5: Mobile menu improvements - make hamburger menu selection more visible */
@media only screen and (max-width: 767px) {
    /* White outline for header elements (blue outline would blend with header background) */
    #header a:focus,
    #header button:focus,
    #header input:focus,
    #header select:focus,
    #header textarea:focus {
        outline: 2px solid #ffffff !important;
        outline-offset: 0;
    }
}

#footer ul li a {
    min-height: 44px;
    align-items: center;
    display: flex !important;
}

