/**
 * Accessibility Styles for ADA Compliance
 * WCAG 2.1 Level AA Compliance
 */

/* Skip Link - Screen Reader Only */
.skip-link {
	position: absolute;
	left: -9999px;
	z-index: 999999;
}

.skip-link:focus {
	left: 6px;
	top: 7px;
	background: #000;
	color: #fff;
	padding: 12px 24px;
	text-decoration: none;
	border-radius: 3px;
	font-weight: bold;
	font-size: 16px;
	border: 2px solid #fff;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
}

/* Screen Reader Only Text */
.sr-only,
.screen-reader-text {
	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:focus,
.screen-reader-text:focus {
	position: static;
	width: auto;
	height: auto;
	padding: inherit;
	margin: inherit;
	overflow: visible;
	clip: auto;
	white-space: normal;
}

/* Focus Indicators - WCAG 2.1 AA Compliant */
/* Only apply to interactive elements to avoid conflicts */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus,
video:focus,
iframe:focus {
	outline: 3px solid #005fcc;
	outline-offset: 2px;
}

/* Remove outline for mouse users but keep for keyboard */
.js-focus-visible a:focus:not(.focus-visible),
.js-focus-visible button:focus:not(.focus-visible),
.js-focus-visible input:focus:not(.focus-visible),
.js-focus-visible select:focus:not(.focus-visible),
.js-focus-visible textarea:focus:not(.focus-visible),
.js-focus-visible [tabindex]:focus:not(.focus-visible) {
	outline: none;
}

/* Focus styles for interactive elements - already defined above, removing duplicate */

/* Enhanced focus for navigation */
nav a:focus,
nav button:focus {
	outline: 3px solid #005fcc;
	outline-offset: 2px;
	background-color: rgba(0, 95, 204, 0.1);
}

/* Button focus states */
button:focus,
.btn:focus,
input[type="submit"]:focus,
input[type="button"]:focus {
	outline: 3px solid #005fcc;
	outline-offset: 2px;
	box-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
}

/* Form element focus */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
	outline: 3px solid #005fcc;
	outline-offset: 2px;
	border-color: #005fcc;
}

/* Remove focus outline for mouse clicks but keep for keyboard */
.js-focus-visible :focus:not(.focus-visible) {
	outline: none;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	*:focus {
		outline: 4px solid;
		outline-offset: 3px;
	}
}

/* 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;
	}
}

/* Color contrast improvements */
/* Ensure text meets WCAG AA standards (4.5:1 for normal text, 3:1 for large text) */
.text-white {
	color: #ffffff !important;
}

/* Footer color contrast fixes */
footer .copyright-text p {
	color: rgba(255, 255, 255, 0.9) !important;
}

footer .social-nav a,
footer .footer-nav a {
	color: rgba(255, 255, 255, 0.9) !important;
}

footer .social-nav a span,
footer .footer-nav a span {
	color: rgba(255, 255, 255, 0.9) !important;
}

footer .social-nav a:hover,
footer .footer-nav a:hover,
footer .social-nav a:focus,
footer .footer-nav a:focus {
	color: #ffffff !important;
}

footer .social-nav a:hover span,
footer .footer-nav a:hover span,
footer .social-nav a:focus span,
footer .footer-nav a:focus span {
	color: #ffffff !important;
}

/* Ensure links are distinguishable */
a:not(.btn):not(.nav-link):not(.navbar-brand):not(.skip-link) {
	text-decoration: underline;
}

a:not(.btn):not(.nav-link):not(.navbar-brand):not(.skip-link):hover,
a:not(.btn):not(.nav-link):not(.navbar-brand):not(.skip-link):focus {
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

/* Image accessibility */
img {
	max-width: 100%;
	height: auto;
}

/* Decorative images should have empty alt */
img[alt=""] {
	border: 0;
}

/* Video accessibility */
video {
	max-width: 100%;
	height: auto;
}

video:focus {
	outline: 3px solid #005fcc;
	outline-offset: 2px;
}

/* Ensure videos have controls for accessibility - Development only, remove in production */
/* video:not([controls]) {
	border: 2px dashed #ff9800;
}

video:not([controls])::before {
	content: "Warning: Video missing controls attribute";
	display: block;
	padding: 10px;
	background: #fff3e0;
	color: #e65100;
	font-weight: bold;
} */

/* Navigation accessibility */
nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

nav li {
	margin: 0;
}

/* Ensure sufficient touch target size (minimum 44x44px) */
button:not(.video-play-button),
a:not(.skip-link),
input[type="submit"],
input[type="button"],
.nav-link {
	min-height: 44px;
	min-width: 44px;
}

/* Ensure buttons and links can be properly sized */
button,
a.btn,
.nav-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Error states for forms */
input.error,
textarea.error,
select.error {
	border: 2px solid #d32f2f;
}

.error-message {
	color: #d32f2f;
	font-weight: bold;
	margin-top: 4px;
}

/* Success states */
.success-message {
	color: #2e7d32;
	font-weight: bold;
	margin-top: 4px;
}

/* Loading states */
[aria-busy="true"] {
	cursor: wait;
}

/* Hidden but accessible to screen readers */
.visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Live region for dynamic content */
[role="status"],
[role="alert"] {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Iframe accessibility */
iframe {
	border: 0;
}

iframe[title=""],
iframe:not([title]) {
	border: 2px dashed #d32f2f;
}

/* Ensure iframes have titles - Development only, remove in production */
/* iframe:not([title])::before {
	content: "Warning: iframe missing title attribute";
	display: block;
	padding: 10px;
	background: #ffebee;
	color: #c62828;
	font-weight: bold;
} */

/* Print styles for accessibility */
@media print {
	.skip-link,
	.sr-only,
	.screen-reader-text {
		display: none;
	}
	
	a[href]:after {
		content: " (" attr(href) ")";
	}
}

