/* ============================================
   ACCESSIBILITY IMPROVEMENTS
   ============================================ */

/* Skip Links */
.skip-link {
    position: absolute; top: -100px; left: 0; background: var(--primary-color, #0d6efd); color: white; padding: 12px 24px; text-decoration: none; font-weight: 600; z-index: 10001; border-radius: 0 0 4px 0; transition: top 0.3s ease; }

.skip-link:focus {
    outline: 3px solid var(--accent-color, #ff6b6b); outline-offset: 2px; }

/* Button Focus States */
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.2) !important; }

/* Improved Touch Targets (Minimum 44x44px) */
button,
a,
input[type="button"],
input[type="submit"],
.theme-toggle,
.menu-btn,
.social-links a,
.profile-social a {
    min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: center; }

/* Dark Mode Focus Colors */
body.dark-mode *:focus-visible {
    outline-color: var(--accent-color, #4dabf7) !important; }

/* 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; }
}

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
    *:focus-visible {
        outline-width: 4px !important; }
    
    button,
    a {
        border: 2px solid currentColor; }
}

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

/* Improve Form Accessibility */
label {
    margin-bottom: 8px; }

    border-left: 3px solid var(--primary-color, #0d6efd); }

    border-color: #dc3545; border-left-width: 3px; }

/* Loading States for Screen Readers */
[aria-busy="true"]::before {
    content: "Loading..."; }

/* Mobile Touch Target Improvements */
@media (max-width: 768px) {
    
    .skip-link {
        font-size: 16px; }
}
