/* Accessibility (A11Y) Enhancements - 2025 Best Practices */

/* Focus Management */
*:focus-visible {
    outline: 3px solid #FF6B35;
    outline-offset: 2px;
    border-radius: 4px;
    box-shadow: 0 0 0 4px rgba(255, 107, 53, 0.2);
}

/* Remove default focus for mouse users */
*:focus:not(:focus-visible) {
    outline: none;
}

/* Enhanced focus for interactive elements */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #FF6B35;
    outline-offset: 2px;
    border-radius: 4px;
    box-shadow: 0 0 0 4px rgba(255, 107, 53, 0.2);
    position: relative;
    z-index: 1;
}

/* Skip to Content Link - Hidden by default, only visible on focus */
.skip-to-content {
    position: absolute;
    top: -100px;
    left: 0;
    background: #FF6B35;
    color: white;
    padding: 12px 20px;
    text-decoration: none;
    z-index: 10000;
    border-radius: 0 0 4px 0;
    font-weight: 600;
    transition: top 0.3s ease;
    opacity: 0;
    pointer-events: none;
}

.skip-to-content:focus {
    top: 0;
    opacity: 1;
    pointer-events: auto;
}

/* ARIA Live Regions */
[role="alert"],
[role="status"],
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Screen Reader Only */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    padding: inherit;
    margin: inherit;
    overflow: visible;
    clip: auto;
    white-space: normal;
}

/* Form Accessibility */
label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: 600;
    color: #2C3E50;
}

label.required::after {
    content: " *";
    color: #E74C3C;
    font-weight: bold;
}

/* Form Error States */
.form-control.is-invalid,
.form-select.is-invalid {
    border-color: #E74C3C;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath d='m5.8 3.6 .4.4.4-.4m0 4.8-.4-.4-.4.4'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.invalid-feedback {
    display: block;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #E74C3C;
}

.valid-feedback {
    display: block;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #4ECDC4;
}

/* Micro Text - Helper text for forms */
.form-text {
    display: block;
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* Button Accessibility */
button:disabled,
.btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    pointer-events: none;
}

/* Loading States - A11Y */
[aria-busy="true"] {
    position: relative;
    pointer-events: none;
}

[aria-busy="true"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1em;
    height: 1em;
    margin: -0.5em 0 0 -0.5em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

/* Keyboard Navigation Indicators */
.keyboard-nav *:focus {
    outline: 3px solid #FF6B35;
    outline-offset: 2px;
}

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
    *:focus-visible {
        outline: 4px solid;
        outline-offset: 3px;
    }
    
    .btn {
        border: 2px solid currentColor;
    }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Responsive Breakpoints - Enhanced */
/* Extra Small - 320px */
@media (max-width: 320px) {
    .navbar-brand {
        font-size: 1.2rem;
    }
    
    .navbar-brand img {
        height: 28px;
    }
    
    .form-control,
    .form-select {
        font-size: 16px; /* Prevents zoom on iOS */
    }
}

/* Small - 576px */
@media (min-width: 576px) {
    .container {
        max-width: 540px;
    }
}

/* Medium - 768px */
@media (min-width: 768px) {
    .container {
        max-width: 720px;
    }
    
    .skip-to-content {
        font-size: 1rem;
    }
}

/* Large - 1024px */
@media (min-width: 1024px) {
    .container {
        max-width: 960px;
    }
}

/* Extra Large - 1440px */
@media (min-width: 1440px) {
    .container {
        max-width: 1320px;
    }
}

/* Touch Target Sizes - Minimum 44x44px */
button,
.btn,
a.btn,
input[type="button"],
input[type="submit"],
input[type="reset"],
.nav-link {
    min-height: 44px;
    min-width: 44px;
    padding: 0.5rem 1rem;
}

/* Landmark Roles */
main[role="main"] {
    outline: none;
}

nav[role="navigation"] {
    outline: none;
}

footer[role="contentinfo"] {
    outline: none;
}

/* ARIA Hidden Content */
[aria-hidden="true"] {
    display: none;
}

/* Live Region Announcements */
[aria-live="polite"],
[aria-live="assertive"] {
    position: absolute;
    left: -10000px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}