/**
 * Accessibility Focus Indicators
 * Ensures all interactive elements have visible focus indicators for keyboard navigation
 */

/* Reset and base focus styles */
*:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
}

/* Enhanced focus for links */
a:focus,
.link:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* Button focus styles */
.btn:focus,
button:focus,
input[type="button"]:focus,
input[type="submit"]:focus,
input[type="reset"]:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* Form element focus styles */
input:focus,
textarea:focus,
select:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 1px !important;
    box-shadow: 0 0 0 3px rgba(0, 115, 170, 0.2) !important;
    border-color: #0073aa !important;
}

/* Accordion button focus */
.accordion-button:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
    background-color: rgba(0, 115, 170, 0.1) !important;
}

/* Navigation toggle focus */
.navbar-toggler:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* Custom interactive elements with role="button" */
[role="button"]:focus,
[tabindex="0"]:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* Slider/carousel controls focus */
.glide__arrow:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* Form pagination steps focus */
.forminator-step:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* WhatsApp chat button focus */
.joinchat__button:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

.joinchat__close:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* Cookie notice close button focus */
.cn-close-icon:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px rgba(0, 115, 170, 0.2) !important;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    *:focus,
    a:focus,
    button:focus,
    input:focus,
    textarea:focus,
    select:focus,
    [role="button"]:focus,
    [tabindex="0"]:focus {
        outline: 3px solid #000 !important;
        outline-offset: 2px !important;
        box-shadow: 0 0 0 5px #fff, 0 0 0 8px #000 !important;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    *:focus {
        transition: none !important;
    }
}

/* Skip Links for Keyboard Navigation */
.skip-links {
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    z-index: 999999 !important;
}

.skip-link {
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
    z-index: 999999 !important;
    padding: 12px 20px !important;
    background: #000 !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 16px !important;
    font-weight: bold !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3) !important;
    transition: none !important;
}

.skip-link:focus {
    position: fixed !important;
    top: 10px !important;
    left: 10px !important;
    z-index: 999999 !important;
    outline: 3px solid #0073aa !important;
    outline-offset: 2px !important;
}

.skip-link:hover {
    background: #333 !important;
    color: #fff !important;
}

/* Ensure skip links appear above everything */
.skip-links .skip-link:focus {
    clip: auto !important;
    height: auto !important;
    width: auto !important;
    overflow: visible !important;
}