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

/* === SCREEN READER UTILITIES === */

.sr-only {
	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;
}

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

/* === FOCUS MANAGEMENT === */

/* Enhanced focus styles */
*:focus-visible {
	outline: 3px solid #007bff;
	outline-offset: 2px;
	border-radius: 3px;
	box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.25);
}

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

/* High contrast focus for specific elements */
.btn:focus-visible,
.form-control:focus-visible,
a:focus-visible {
	outline: 3px solid #007bff;
	outline-offset: 2px;
	background-color: rgba(0, 123, 255, 0.1);
}

/* Focus trap for modals */
.modal:focus-within {
	outline: none;
}

/* Skip links */
.skip-link {
	position: absolute;
	top: -40px;
	left: 6px;
	background: #000;
	color: #fff;
	padding: 8px;
	z-index: 10000;
	text-decoration: none;
	border-radius: 0 0 4px 4px;
}

.skip-link:focus {
	top: 6px;
}

/* === COLOR CONTRAST === */

/* Ensure minimum 4.5:1 contrast ratio */
.text-muted {
	color: #6c757d !important; /* WCAG AA compliant */
}

.text-light {
	color: #495057 !important; /* Better contrast than original */
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	* {
		background-color: Canvas !important;
		color: CanvasText !important;
	}
	
	a, button {
		color: LinkText !important;
	}
	
	a:visited {
		color: VisitedText !important;
	}
}

/* === MOTION PREFERENCES === */

/* Respect user's motion preferences */
@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;
	}
	
	/* Keep essential animations but make them instant */
	.employee .card-inner {
		transition: transform 0.01ms !important;
	}
	
	/* Remove parallax effects */
	.parallax {
		transform: none !important;
	}
}

/* === KEYBOARD NAVIGATION === */

/* Make all interactive elements keyboard accessible */
button,
[role="button"],
input,
select,
textarea,
a,
[tabindex]:not([tabindex="-1"]) {
	position: relative;
}

/* Visible focus indicator for keyboard users */
button:focus-visible,
[role="button"]:focus-visible,
.employee:focus-visible {
	z-index: 1;
	outline: 3px solid #007bff;
	outline-offset: 2px;
}

/* Improve button touch targets */
@media (pointer: coarse) {
	button,
	.btn,
	[role="button"],
	input[type="submit"],
	input[type="button"] {
		min-height: 44px;
		min-width: 44px;
	}
}

/* === FORM ACCESSIBILITY === */

/* Required field indicators */
input[required] + label::after,
textarea[required] + label::after,
select[required] + label::after {
	content: " *";
	color: #dc3545;
	font-weight: bold;
}

/* Error states */
.field-invalid,
input:invalid:not(:focus):not(:placeholder-shown) {
	border-color: #dc3545 !important;
	box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

/* Success states */
.field-valid {
	border-color: #28a745 !important;
	box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25) !important;
}

/* Error messages */
.field-error {
	color: #dc3545;
	font-size: 0.875em;
	margin-top: 0.25rem;
	display: block;
}

/* Fieldset and legend improvements */
fieldset {
	border: 2px solid #dee2e6;
	border-radius: 0.25rem;
	padding: 1rem;
	margin: 1rem 0;
}

legend {
	font-weight: bold;
	padding: 0 0.5rem;
	font-size: 1.1em;
}

/* === ARIA LIVE REGIONS === */

[aria-live] {
	position: relative;
}

[aria-live="polite"] {
	/* Styles for polite announcements */
}

[aria-live="assertive"] {
	/* Styles for urgent announcements */
}

/* Status messages */
.status-message {
	padding: 0.75rem 1rem;
	border-radius: 0.25rem;
	margin: 1rem 0;
	border-left: 4px solid #007bff;
}

.status-message.success {
	background-color: #d4edda;
	border-color: #28a745;
	color: #155724;
}

.status-message.error {
	background-color: #f8d7da;
	border-color: #dc3545;
	color: #721c24;
}

.status-message.warning {
	background-color: #fff3cd;
	border-color: #ffc107;
	color: #856404;
}

/* === LANDMARK REGIONS === */

/* Ensure proper landmark structure */
main[role="main"],
main {
	min-height: 200px; /* Ensure content area is substantial */
}

nav[role="navigation"],
nav {
	position: relative;
}

/* Navigation improvements */
nav ul {
	list-style: none;
}

nav a {
	display: block;
	text-decoration: none;
}

nav a:hover,
nav a:focus {
	text-decoration: underline;
}

/* === TABLE ACCESSIBILITY === */

/* Responsive tables */
.table-responsive {
	position: relative;
}

@media (max-width: 767.98px) {
	.table-responsive table {
		border: 0;
	}
	
	.table-responsive thead {
		border: none;
		clip: rect(0 0 0 0);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		width: 1px;
	}
	
	.table-responsive tr {
		border-bottom: 3px solid #ddd;
		display: block;
		margin-bottom: 0.625em;
	}
	
	.table-responsive td {
		border: none;
		border-bottom: 1px solid #ddd;
		display: block;
		font-size: 0.8em;
		text-align: right;
		padding-left: 50%;
		position: relative;
	}
	
	.table-responsive td::before {
		content: attr(data-label) ": ";
		font-weight: bold;
		left: 6px;
		position: absolute;
		text-align: left;
		top: 6px;
		width: 45%;
	}
}

/* === PRINT ACCESSIBILITY === */

@media print {
	/* Ensure good contrast in print */
	* {
		color: #000 !important;
		background: transparent !important;
		box-shadow: none !important;
	}
	
	/* Show link URLs in print */
	a[href]:after {
		content: " (" attr(href) ")";
		font-size: smaller;
	}
	
	/* Don't show URLs for fragment identifiers */
	a[href^="#"]:after,
	a[href^="javascript:"]:after {
		content: "";
	}
	
	/* Page break improvements */
	h1, h2, h3, h4, h5, h6 {
		page-break-after: avoid;
	}
	
	blockquote,
	pre {
		page-break-inside: avoid;
	}
}

/* === TOUCH AND POINTER ACCESSIBILITY === */

/* Improve touch targets */
@media (pointer: coarse) {
	/* Minimum 44px touch targets */
	button,
	input,
	select,
	textarea,
	a,
	.btn {
		min-height: 44px;
		min-width: 44px;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}
	
	/* Increase spacing between touch targets */
	.btn + .btn {
		margin-left: 0.5rem;
	}
}

/* === LANGUAGE SUPPORT === */

/* RTL language support */
[dir="rtl"] {
	text-align: right;
}

[dir="rtl"] .float-left {
	float: right !important;
}

[dir="rtl"] .float-right {
	float: left !important;
}

/* === CONTENT ACCESSIBILITY === */

/* Better text readability */
p, li, td, th {
	line-height: 1.6;
}

/* Consistent heading hierarchy */
h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }

/* Improve readability of long text blocks */
.text-content {
	max-width: 70ch; /* Optimal reading length */
	line-height: 1.6;
}

/* === ANIMATION ACCESSIBILITY === */

/* Provide animation controls */
.animation-controls {
	position: fixed;
	top: 10px;
	right: 10px;
	z-index: 9999;
	background: rgba(0, 0, 0, 0.8);
	color: white;
	padding: 0.5rem;
	border-radius: 4px;
	font-size: 0.875rem;
}

.animation-toggle {
	background: transparent;
	border: 1px solid white;
	color: white;
	padding: 0.25rem 0.5rem;
	cursor: pointer;
	border-radius: 2px;
}

.animation-toggle:focus,
.animation-toggle:hover {
	background: rgba(255, 255, 255, 0.2);
}

/* Hide animation controls by default, show only when needed */
.animation-controls {
	display: none;
}

.reduce-motion .animation-controls {
	display: block;
}