/* ============================================================
   Accessibility Styles for VSP 2025
   These styles improve usability for all users — especially those
   using keyboards, screen readers, or assistive technology.
   ============================================================ */

/* 🔹 Skip Link - Allows keyboard users to jump to main content */
.skip-link {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	z-index: 999;
	background: #000;
	color: #fff;
	padding: 1rem;
}

/* 🔹 Show skip link when focused */
.skip-link:focus {
	left: 0;
	top: 0;
	width: auto;
	height: auto;
	display: block;
}

/* 🔹 Default focus style (high-contrast for visibility) */
:focus {
	
}

/* 🔹 Focus rings for all form elements and links */
a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus {
	
}

/* 🔹 Screen Reader Only - Hide content visually but keep it accessible */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
	word-wrap: normal !important;
}

/* 🔹 Make screen-reader text visible when focused (e.g. skip links) */
.screen-reader-text:focus {
	position: static;
	width: auto;
	height: auto;
	margin: 0;
	clip: auto;
	overflow: visible;
}

/* 🔹 Form Label Improvements */
label {
	font-weight: 600;
	display: block;
	margin-bottom: 0.25rem;
}

/* 🔹 Form Field Base Styling */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="url"],
textarea,
select {
	width: 100%;
	max-width: 100%;
	border: 1px solid #ccc;
	padding: 0.5rem;
	font-size: 1rem;
}

/* 🔹 Visual indicator for disabled fields */
input:disabled,
textarea:disabled {
	background: #f5f5f5;
	color: #888;
}

/* 🔹 Table Structure - Clear cell separation and contrast */
table {
	border-collapse: collapse;
	width: 100%;
}

th, td {
	padding: 0.75rem;
	border: 1px solid #ddd;
	text-align: left;
	background-color: #fff;
	color: #000;
}

/* 🔹 Table Header Contrast */
thead th {
	background-color: #0f225e; /* VSP blue */
	color: #fff;
}

/* 🔹 Reduced Motion Preference - Minimize animations for sensitive users */
@media (prefers-reduced-motion: reduce) {
	* {
		animation-duration: 0.001ms !important;
		transition-duration: 0.001ms !important;
	}
}