/*
 * Phase 1.5 Legacy UI Modernization
 * Plain CSS — no Tailwind/Flux to avoid dual-CSS conflicts.
 * Loaded on all legacy pages via includes/head.php.
 */

/* =============================================
   Footer — ITS-matching white footer
   ============================================= */

.legacy-footer {
	background: white;
	border-top: 1px solid #e5e7eb;
	padding: 24px 25px;
}

.legacy-footer-inner {
	max-width: 1280px;
	margin: 0 auto;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.legacy-footer-copyright {
	color: #6b7280;
	font-size: 0.875rem;
	line-height: 1.5;
	white-space: nowrap;
}

.legacy-footer-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-size: 0.875rem;
	line-height: 1.5;
}

.legacy-footer-links a {
	color: #6b7280;
	text-decoration: none;
	white-space: nowrap;
}

.legacy-footer-links a:hover {
	color: #374151;
}

.legacy-footer-links .footer-sep {
	color: #d1d5db;
	user-select: none;
}

.legacy-footer-links .ccpa-icon {
	width: 2rem;
	vertical-align: middle;
	margin-right: 4px;
}

@media screen and (max-width: 768px) {
	.legacy-footer-inner {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* =============================================
   Instruments Page — Intro Text
   ============================================= */

.instruments-intro {
	font-size: .875rem;
	color: #6b7280;
	line-height: 1.6;
	max-width: 720px;
	padding: 0;
	margin: 0;
}

.instruments-intro p {
	font-size: .875rem;
	color: #6b7280;
	padding: 0 0 8px 0 !important;
	margin: 0;
	text-indent: 0;
}

.instruments-intro a {
	color: #004e96;
}

/* =============================================
   Instruments Page — Card Layout
   ============================================= */

.instruments-layout {
	display: flex;
	gap: 32px;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0;
}

.instruments-main {
	flex: 2;
	min-width: 0;
}

.instruments-sidebar {
	flex: 1;
	min-width: 280px;
	align-self: flex-start;
	position: sticky;
	top: 16px;
	padding-top: 16px;
}

.assessment-card {
	border: 1px solid #e4e4e7;
	border-radius: 8px;
	background: white;
	padding: 20px 24px;
	margin-bottom: 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.assessment-card:hover {
	border-color: #004E96;
	box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1);
}

.assessment-card-content {
	flex: 1;
	min-width: 0;
}

.assessment-card-title {
	font-weight: 700;
	font-size: 1.5rem;
	color: #004e96;
	margin: 0 0 4px 0;
	line-height: 1.3;
}

.assessment-card-date {
	font-size: 1rem;
	color: #6b7280;
	margin: 0;
	line-height: 1.4;
}

.assessment-card-action {
	flex-shrink: 0;
}

.status-badge {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 9999px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.025em;
	margin-bottom: 6px;
}

.status-badge-begin {
	background: #dbeafe;
	color: #1e40af;
}

.status-badge-resume {
	background: #fef3c7;
	color: #92400e;
}

.status-badge-submitted {
	background: #d1fae5;
	color: #065f46;
}

.status-badge-closed {
	background: #f3f4f6;
	color: #6b7280;
}

.sidebar-card {
	border: 1px solid #e4e4e7;
	border-radius: 8px;
	background: white;
	padding: 24px;
}

.sidebar-card h2 {
	font-weight: 700;
	font-size: 1.25rem;
	color: #004e96;
	margin: 0 0 16px 0;
	padding: 0;
}

.sidebar-card table {
	width: 100%;
}

.sidebar-card td {
	padding: 6px 0;
}

.sidebar-card label {
	font-size: 0.875rem;
	color: #374151;
	font-weight: 600;
}

/* =============================================
   Modern Button Styles (replaces legacy pointyButton)
   ============================================= */

.assessment-card .assessment-card-action .pointyButtonLong,
.assessment-card .assessment-card-action .defaultSubmitButtonLong,
.assessment-card .assessment-card-action .closedButton,
.assessment-card-action form .pointyButtonLong[type="submit"],
.assessment-card-action form .defaultSubmitButtonLong[type="submit"] {
	display: inline-block;
	padding: 10px 24px;
	margin: 0;
	width: auto;
	height: auto;
	border-radius: 8px;
	font-family: 'Calibri', sans-serif;
	font-size: 1rem;
	font-weight: 600;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
	border: 1px solid #e4e4e7;
	transition: all 0.15s ease;
	background: white;
	background-image: none;
	color: #004e96;
	white-space: nowrap;
	line-height: 1.4;
	text-transform: none;
	letter-spacing: 0;
	box-shadow: none;
}

.assessment-card .assessment-card-action .pointyButtonLong:hover,
.assessment-card .assessment-card-action .defaultSubmitButtonLong:hover,
.assessment-card-action form .pointyButtonLong[type="submit"]:hover,
.assessment-card-action form .defaultSubmitButtonLong[type="submit"]:hover {
	background: #004e96;
	background-image: none;
	color: white;
	border-color: #004e96;
}

.assessment-card .assessment-card-action .closedButton {
	color: #9ca3af;
	border-color: #e5e7eb;
	cursor: not-allowed;
	background: #f9fafb;
}

.assessment-card-action a {
	text-decoration: none;
}

.assessment-card-action a .pointyButtonLong,
.assessment-card-action a .closedButton {
	display: inline-block;
	margin: 0;
	width: auto;
	height: auto;
}

/* Sidebar Add Assessment button */
.sidebar-card form .pointyButtonLonger[type="submit"],
.sidebar-card .pointyButtonLonger {
	display: inline-block;
	width: 100%;
	padding: 10px 24px;
	margin: 0;
	height: auto;
	border-radius: 8px;
	font-family: 'Calibri', sans-serif;
	font-size: 1rem;
	font-weight: 600;
	text-align: center;
	cursor: pointer;
	border: none;
	background: #004e96;
	background-image: none;
	color: white;
	text-transform: none;
	letter-spacing: 0;
	line-height: 1.4;
	box-shadow: none;
	transition: background 0.15s ease;
	box-sizing: border-box;
}

.sidebar-card form .pointyButtonLonger[type="submit"]:hover,
.sidebar-card .pointyButtonLonger:hover {
	background: #003a75;
	background-image: none;
}

/* Sidebar Book Card */
.sidebar-book-card {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 24px;
}

.sidebar-book-header {
	display: flex;
	align-items: center;
	gap: 16px;
}

.sidebar-book-header h2 {
	margin: 0;
}

.sidebar-book-cover {
	width: 100px;
	flex-shrink: 0;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
}

.sidebar-book-content {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.sidebar-book-content p {
	font-size: 0.875rem;
	line-height: 1.6;
	color: #4b5563;
	margin: 0;
}

.sidebar-book-content .btn-assessment-primary {
	display: block;
	text-decoration: none;
	margin-top: 4px;
}

/* =============================================
   Assessment Question Pages (TTS/LTS/OTS/CTS360)
   ============================================= */

/* Intro body text — darker for better contrast */
.tts-window p {
	font-size: 1rem !important;
	color: #4b5563 !important;
	line-height: 1.6 !important;
}

/* Reduce main heading size */
.tts-window h3 {
	font-size: 2rem !important;
	margin-bottom: 8px;
}

/* Question spacing — more breathing room between questions */
.question-number-class {
	padding-top: 20px;
	padding-bottom: 20px;
}

/* Question number — tone down size */
.question-number-class span {
	font-size: 36px !important;
}

/* =============================================
   Question Layout — flex replacing tables
   ============================================= */

.question-block {
	display: flex;
	align-items: flex-start;
	gap: 24px;
	margin: 40px 0;
}

.question-number {
	flex-shrink: 0;
	width: 48px;
	padding-top: 0;
}

.question-number span {
	font-size: 48px;
	font-weight: 700;
	line-height: 1.2;
	color: #fadab3;
}

.question-number span.answered {
	color: #E28903;
}

.question-content {
	flex: 1;
	min-width: 0;
}

.question-text {
	font-weight: 600;
	font-size: 1.5rem;
	color: #1f2937;
	margin-bottom: 10px;
	line-height: 1.5;
}

.question-options {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
}

.question-option {
	cursor: pointer;
	display: inline-flex;
	align-items: center;
}

/* Hide radio inside label — span is the visual control */
.question-option .tts-field {
	display: inline-block !important;
	position: absolute !important;
	opacity: 0 !important;
	width: 0 !important;
	height: 0 !important;
	pointer-events: none;
}

/* Neutralize legacy .checked class from default.css — the modern
   pill-button design uses CSS :checked on the radio instead */
.question-option .question-answer-class.checked {
	color: #374151 !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
}

/* CSS :checked styling — replaces jQuery .checked class */
.question-option .tts-field:checked + .question-answer-class {
	background: #004e96 !important;
	border-color: #004e96 !important;
	color: white !important;
	font-weight: 600 !important;
}

/* Answer option spans — styled as outlined buttons */
.question-answer-class {
	display: inline-block !important;
	border: 1px solid #d1d5db !important;
	border-radius: 6px !important;
	padding: 7px 14px !important;
	margin: 0 !important;
	cursor: pointer;
	white-space: nowrap;
	text-align: center;
	color: #374151 !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	transition: all 0.15s ease;
	line-height: 1.4 !important;
}

.question-answer-class:hover {
	background: #004e96 !important;
	border-color: #004e96 !important;
	color: white !important;
}

/* Disabled Continue button when N/O limit exceeded */
.tts-window .pointyButtonBlue:disabled,
.tts-window .pointyButtonBlue[type="submit"]:disabled {
	background: #9ca3af !important;
	border-color: #9ca3af !important;
	cursor: not-allowed !important;
	opacity: 0.7;
}

/* Progress bar — blue brand theme */
.progress-bg {
	background: #dbeafe !important;
}

.progress-process {
	background: #004e96 !important;
}

/* Bottom navigation buttons — centered */
.tts-window .question-nav {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	padding: 16px 0;
}

/* Save for Later — secondary (blue outlined) */
.tts-window .defaultSubmitButtonLong,
.tts-window .defaultSubmitButtonLong[type="submit"] {
	background: white !important;
	background-image: none !important;
	color: #004e96 !important;
	border: 1px solid #004e96 !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
}

.tts-window .defaultSubmitButtonLong:hover,
.tts-window .defaultSubmitButtonLong[type="submit"]:hover {
	background: #004e96 !important;
	color: white !important;
}

/* Previous — secondary (blue outlined) */
.tts-window .pointyButtonReverse,
.tts-window .pointyButtonReverse[type="submit"] {
	background: white !important;
	background-image: none !important;
	color: #004e96 !important;
	border: 1px solid #004e96 !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
}

.tts-window .pointyButtonReverse:hover,
.tts-window .pointyButtonReverse[type="submit"]:hover {
	background: #004e96 !important;
	color: white !important;
}

/* Continue — primary (blue filled) */
.tts-window .pointyButtonBlue,
.tts-window .pointyButtonBlue[type="submit"] {
	background: #004e96 !important;
	background-image: none !important;
	color: white !important;
	border: 1px solid #004e96 !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
}

.tts-window .pointyButtonBlue:hover,
.tts-window .pointyButtonBlue[type="submit"]:hover {
	background: #003a75 !important;
	border-color: #003a75 !important;
}

/* Submit — primary (blue filled, matches Continue) */
.tts-window .ltsSubmitButton,
.tts-window .ltsSubmitButton[type="submit"] {
	background: #004e96 !important;
	background-image: none !important;
	color: white !important;
	border: 1px solid #004e96 !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
}

.tts-window .ltsSubmitButton:hover,
.tts-window .ltsSubmitButton[type="submit"]:hover {
	background: #003a75 !important;
	border-color: #003a75 !important;
}

/* =============================================
   Clean Button Classes (for assessments page)
   ============================================= */

/* Shared base for all assessment buttons */
.btn-assessment-submitted,
.btn-assessment-disabled,
.btn-assessment-primary,
.btn-assessment-primary-action {
	display: inline-block;
	padding: 10px 24px;
	margin: 0;
	width: auto;
	height: auto;
	border-radius: 8px;
	font-family: 'Calibri', sans-serif;
	font-size: 1rem;
	font-weight: 600;
	text-align: center;
	white-space: nowrap;
	line-height: 1.4;
	text-transform: none;
	text-decoration: none;
	letter-spacing: 0;
	box-shadow: none;
	background-image: none;
	transition: all 0.15s ease;
	box-sizing: border-box;
}

/* Icon inside buttons */
.btn-icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

/* Begin / Resume — primary filled blue, matching Add Assessment */
.btn-assessment-primary-action {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #004e96;
	color: white;
	border: 1px solid #004e96;
	cursor: pointer;
}

.btn-assessment-primary-action:hover {
	background: #003a75;
	border-color: #003a75;
}

/* Submitted — ghost variant with hover text swap */
.btn-assessment-submitted {
	display: inline-grid;
	background: white;
	color: #004e96;
	border: 1px solid #e4e4e7;
	cursor: pointer;
}

.btn-assessment-submitted .btn-label-default,
.btn-assessment-submitted .btn-label-hover {
	grid-area: 1 / 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
}

.btn-assessment-submitted .btn-label-hover {
	visibility: hidden;
}

.btn-assessment-submitted:hover {
	border-color: #004e96;
	background: #004e96;
	color: white;
}

.btn-assessment-submitted:hover .btn-label-default {
	visibility: hidden;
}

.btn-assessment-submitted:hover .btn-label-hover {
	visibility: visible;
}

/* Closed — gray, disabled */
.btn-assessment-disabled {
	background: #f9fafb;
	color: #9ca3af;
	border: 1px solid #e5e7eb;
	cursor: not-allowed;
}

/* Sidebar Add Assessment — filled blue, full-width */
.btn-assessment-primary {
	width: 100%;
	background: #004e96;
	color: white;
	border: none;
	cursor: pointer;
}

.btn-assessment-primary:hover {
	background: #003a75;
}

/* Spinning border highlight — no wrapper needed, pure pseudo-element */
.btn-glow {
	position: relative;
	overflow: hidden;
	z-index: 0;
}

.btn-glow::before {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100vw;
	height: 100vw;
	margin-left: -50vw;
	margin-top: -50vw;
	z-index: -1;
	background: conic-gradient(
		from 0deg at 50% 50%,
		rgba(140, 200, 255, 0.8) 0deg,
		rgba(180, 220, 255, 1) 20deg,
		transparent 60deg,
		transparent 300deg,
		rgba(140, 200, 255, 0.5) 340deg,
		rgba(140, 200, 255, 0.8) 360deg
	);
	animation: btn-glow-spin 3s linear infinite;
	will-change: transform;
}

.btn-glow::after {
	content: '';
	position: absolute;
	inset: 2px;
	z-index: -1;
	border-radius: inherit;
	background: #004e96;
}

@keyframes btn-glow-spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

/* Link-wrapped buttons in assessment cards */
.assessment-card-action a {
	text-decoration: none;
}

@media screen and (max-width: 900px) {
	.instruments-layout {
		flex-direction: column;
	}

	.instruments-sidebar {
		min-width: 0;
	}
}

/* =============================================
   Open-Ended Questions Page
   ============================================= */

.open-ended-questions {
	display: flex !important;
	align-items: flex-start;
	gap: 24px;
	width: 100% !important;
	border: none !important;
	margin: 40px 0 !important;
}

.open-ended-number {
	flex-shrink: 0;
	width: 48px;
}

.open-ended-number span {
	font-size: 48px;
	font-weight: 700;
	color: #e28903;
	line-height: 1.2;
}

.open-ended-body {
	flex: 1;
	min-width: 0;
}

/* Hide the legacy table-based title */
.open-ended-title {
	background: none !important;
	padding: 0 !important;
	font-weight: 600;
	font-size: 1.5rem !important;
	color: #1f2937 !important;
	margin-bottom: 12px;
	line-height: 1.5;
}

.open-ended-title table {
	width: 100%;
}

.open-ended-title td {
	vertical-align: top;
	color: #1f2937 !important;
	font-size: 1.5rem !important;
	font-weight: 600;
	padding: 0 !important;
}

/* Hide the number column from the table — we use .open-ended-number instead */
.open-ended-title td:first-child {
	display: none;
}

.tts-open-field {
	width: 100% !important;
	box-sizing: border-box !important;
	border: 1px solid #d1d5db !important;
	border-radius: 8px !important;
	padding: 12px 16px !important;
	font-family: 'Calibri', sans-serif !important;
	font-size: 1rem !important;
	line-height: 1.6 !important;
	color: #1f2937 !important;
	resize: vertical !important;
	transition: border-color 0.15s ease;
	min-height: 120px;
}

.tts-open-field:focus {
	outline: none !important;
	border-color: #004e96 !important;
	box-shadow: 0 0 0 3px rgba(0, 78, 150, 0.1) !important;
}

/* General flash banner — for success/error messages on any page */
.flash-banner {
	display: none;
	background: #fef2f2;
	border: 1px solid #fca5a5;
	border-radius: 6px;
	color: #991b1b;
	padding: 12px 16px;
	margin: 12px 0;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.flash-banner.visible {
	display: block;
}

.flash-banner.success {
	background: #e8f0f8;
	border-color: #004e96;
	color: #004e96;
}

/* Inline validation / flash message banner */
.tts-window .noo-warning-banner {
	display: none;
	background: #fef2f2;
	border: 1px solid #fca5a5;
	border-radius: 6px;
	color: #991b1b;
	padding: 12px 16px;
	margin: 12px 0;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.tts-window .noo-warning-banner.visible {
	display: block;
}

.tts-window .noo-warning-banner.success {
	background: #e8f0f8;
	border-color: #004e96;
	color: #004e96;
}

/* =============================================
   Dashboard-Window Pages (non-question legacy pages)
   ============================================= */

.dashboard-window {
	padding-top: 24px;
	padding-bottom: 24px;
}

/* Typography */
.dashboard-window h3 {
	font-size: 2rem !important;
	font-weight: 700 !important;
	color: #1f2937 !important;
	margin-bottom: 4px;
}

.dashboard-window p {
	font-size: 1rem !important;
	color: #4b5563 !important;
	line-height: 1.6 !important;
	margin-bottom: 6px;
}

/* Buttons — primary (blue filled) */
.dashboard-window .defaultSubmitButton,
.dashboard-window .defaultSubmitButton[type="submit"],
.dashboard-window .pointyButtonLonger,
.dashboard-window .pointyButtonLonger[type="submit"] {
	background: #004e96 !important;
	background-image: none !important;
	color: white !important;
	border: 1px solid #004e96 !important;
	border-radius: 8px !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	height: auto !important;
	width: auto !important;
	line-height: 1.4 !important;
	margin: 0 !important;
	cursor: pointer;
	transition: all 0.15s ease;
}

.dashboard-window .defaultSubmitButton:hover,
.dashboard-window .defaultSubmitButton[type="submit"]:hover,
.dashboard-window .pointyButtonLonger:hover,
.dashboard-window .pointyButtonLonger[type="submit"]:hover {
	background: #003a75 !important;
	border-color: #003a75 !important;
}

/* Buttons — pointyButtonLong / pointyButtonLonger2 (primary filled) */
.dashboard-window .pointyButtonLong,
.dashboard-window .pointyButtonLong[type="submit"],
.dashboard-window .pointyButtonLonger2,
.dashboard-window .pointyButtonLonger2[type="submit"] {
	background: #004e96 !important;
	background-image: none !important;
	color: white !important;
	border: 1px solid #004e96 !important;
	border-radius: 8px !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	height: auto !important;
	width: auto !important;
	line-height: 1.4 !important;
	margin: 0 !important;
	cursor: pointer;
	transition: all 0.15s ease;
}

.dashboard-window .pointyButtonLong:hover,
.dashboard-window .pointyButtonLong[type="submit"]:hover,
.dashboard-window .pointyButtonLonger2:hover,
.dashboard-window .pointyButtonLonger2[type="submit"]:hover {
	background: #003a75 !important;
	border-color: #003a75 !important;
}

/* Buttons — secondary (blue outlined) */
.dashboard-window .defaultSubmitButtonLong,
.dashboard-window .defaultSubmitButtonLong[type="submit"],
.dashboard-window .defaultSubmitButtonLonger,
.dashboard-window .defaultSubmitButtonLonger[type="submit"] {
	background: white !important;
	background-image: none !important;
	color: #004e96 !important;
	border: 1px solid #004e96 !important;
	border-radius: 8px !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	height: auto !important;
	width: auto !important;
	line-height: 1.4 !important;
	margin: 0 !important;
	cursor: pointer;
	transition: all 0.15s ease;
}

.dashboard-window .defaultSubmitButtonLong:hover,
.dashboard-window .defaultSubmitButtonLong[type="submit"]:hover,
.dashboard-window .defaultSubmitButtonLonger:hover,
.dashboard-window .defaultSubmitButtonLonger[type="submit"]:hover {
	background: #004e96 !important;
	color: white !important;
}

/* Buttons — pointyButtonBlue (primary filled) */
.dashboard-window .pointyButtonBlue,
.dashboard-window .pointyButtonBlue[type="submit"] {
	background: #004e96 !important;
	background-image: none !important;
	color: white !important;
	border: 1px solid #004e96 !important;
	border-radius: 8px !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	height: auto !important;
	width: auto !important;
	line-height: 1.4 !important;
	margin: 0 !important;
	cursor: pointer;
	transition: all 0.15s ease;
}

.dashboard-window .pointyButtonBlue:hover,
.dashboard-window .pointyButtonBlue[type="submit"]:hover {
	background: #003a75 !important;
	border-color: #003a75 !important;
}

/* Buttons — pointyButtonReverse (secondary outlined) */
.dashboard-window .pointyButtonReverse,
.dashboard-window .pointyButtonReverse[type="submit"] {
	background: white !important;
	background-image: none !important;
	color: #004e96 !important;
	border: 1px solid #004e96 !important;
	border-radius: 8px !important;
	text-transform: none !important;
	box-shadow: none !important;
	font-size: 1rem !important;
	font-weight: 600 !important;
	padding: 10px 24px !important;
	height: auto !important;
	width: auto !important;
	line-height: 1.4 !important;
	margin: 0 !important;
	cursor: pointer;
	transition: all 0.15s ease;
}

.dashboard-window .pointyButtonReverse:hover,
.dashboard-window .pointyButtonReverse[type="submit"]:hover {
	background: #004e96 !important;
	color: white !important;
}

/* Button elements — inline-flex for icon alignment */
.dashboard-window button.defaultSubmitButton,
.dashboard-window button.defaultSubmitButtonLong,
.dashboard-window button.defaultSubmitButtonLonger,
.dashboard-window button.pointyButtonLonger {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

/* Disabled button state */
.dashboard-window .pointyButtonLonger:disabled,
.dashboard-window .pointyButtonLonger[type="submit"]:disabled,
.dashboard-window .defaultSubmitButton:disabled,
.dashboard-window .defaultSubmitButton[type="submit"]:disabled {
	background: #9ca3af !important;
	border-color: #9ca3af !important;
	color: white !important;
	cursor: not-allowed !important;
	opacity: 0.6 !important;
}

/* Text inputs */
.dashboard-window .form-group input {
	border: 1px solid #d1d5db;
	border-radius: 6px;
	padding: 8px 12px;
	font-size: 1rem;
	color: #374151;
	transition: border-color 0.15s ease;
}

.dashboard-window .form-group input[type="email"] {
	min-width: 280px;
}

.dashboard-window .form-group input:focus {
	outline: none;
	border-color: #004e96;
	box-shadow: 0 0 0 3px rgba(0, 78, 150, 0.1);
}

/* Override default.css 14px inputs to 1rem */
.reg-input-text,
.homepage-em-box,
.homepage-pw-box {
	font-size: 1rem !important;
}

/* Reset margin and widen form inputs (overrides default.css) */
.dashboard-window .reg-input-text {
	margin: 0;
	min-width: 320px;
}

/* Blue focus ring for form inputs (overrides default.css orange) */
.reg-input-text:focus,
.homepage-em-box:focus,
.homepage-pw-box:focus {
	outline: 2px solid #004e96 !important;
	outline-offset: 2px;
}

/* Radios and checkboxes */
.dashboard-window input[type="radio"],
.dashboard-window input[type="checkbox"] {
	accent-color: #004e96;
}

/* Step cards — major workflow sections */
.step-card {
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 28px 32px;
	margin: 24px 0;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.note {
	font-size: 0.875rem;
	color: #6b7280;
	margin-top: 12px;
	margin-bottom: 0;
}

.step-card-header {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 16px;
}

.step-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	min-width: 40px;
	background: #E28903;
	color: white;
	font-size: 1.25rem;
	font-weight: 700;
	border-radius: 50%;
	font-family: 'Calibri', sans-serif;
}

.step-title {
	font-size: 1.5rem !important;
	color: #1f2937 !important;
	font-weight: 700 !important;
	font-family: 'Calibri', sans-serif;
	margin: 0 !important;
	padding: 0 !important;
}

/* Section labels (blue) — sub-section headings within step cards */
.section-label {
	color: #004e96 !important;
	font-size: 1.25rem !important;
	font-weight: 700 !important;
	margin-top: 20px;
	margin-bottom: 4px;
}

/* Form rows — flex layout replacing table forms */
.form-row {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: flex-start;
	padding: 12px 0;
}

.form-row .form-group {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.form-row .form-group label {
	color: #004e96;
	font-weight: 700;
	font-size: 1rem;
}

/* Radio group — horizontal flex */
.radio-group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 24px;
	padding: 12px 0;
}

.radio-group label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
	font-size: 1rem;
	color: #374151;
}

/* Consent row — checkbox with consent label */
.consent-row {
	padding: 12px 0;
}

.consent-row label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
	font-size: 1rem;
	color: #374151;
}

/* Invite button row */
.invite-button-row {
	padding: 8px 0 12px;
}

/* Inline flash banner for invite form */
.invite-flash-banner {
	display: none;
	background: #fef2f2;
	border: 1px solid #fca5a5;
	border-radius: 6px;
	color: #991b1b;
	padding: 12px 16px;
	margin: 8px 0;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.invite-flash-banner.visible {
	display: block;
}

.invite-flash-banner.success {
	background: #e8f0f8;
	border-color: #004e96;
	color: #004e96;
}

/* Assessment action row — begin/resume button + assessment name */
.assessment-action-row {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 16px 20px;
	margin: 12px 0 4px;
	background: #f0f5fb;
	border-radius: 8px;
	border: 1px solid #d6e3f2;
}

.assessment-action-meta {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.assessment-name {
	color: #004e96;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
}

.assessment-deadline {
	color: #6b7280;
	font-size: 0.875rem;
	font-weight: 400;
}

/* Rater guidelines list */
.rater-guidelines-list {
	padding-left: 24px !important;
	margin-top: 0 !important;
	margin-bottom: 12px;
}

.rater-guidelines-list li {
	font-size: 1rem;
	color: #4b5563;
	line-height: 1.6;
	margin-bottom: 2px;
}

/* Rater table — invited raters list */
.rater-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 1rem;
	margin-top: 8px;
}

.rater-table th,
.rater-table td {
	padding: 10px 16px;
	border-bottom: 1px solid #e4e4e7;
	text-align: center;
	vertical-align: middle;
}

.rater-table th {
	color: #004e96;
	font-weight: 700;
	border-bottom: 2px solid #d6e3f2;
}

.rater-table tr:last-child td {
	border-bottom: none;
}

/* Status table — rater status summary */
.status-table {
	border-collapse: collapse;
	font-size: 1rem;
	margin-top: 8px;
}

.status-table th,
.status-table td {
	padding: 10px 24px;
	border-bottom: 1px solid #e4e4e7;
	text-align: center;
	vertical-align: middle;
}

.status-table th {
	color: #004e96;
	font-weight: 700;
	border-bottom: 2px solid #d6e3f2;
}

.status-table tr:last-child td {
	border-bottom: none;
}

/* Start Assessment button */
.btn-start-assessment {
	display: inline-block;
	padding: 12px 32px;
	background: #004e96;
	color: white;
	border: 1px solid #004e96;
	border-radius: 8px;
	font-family: 'Calibri', sans-serif;
	font-size: 1.125rem;
	font-weight: 600;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
	transition: all 0.15s ease;
}

.btn-start-assessment:hover {
	background: #003a75;
	border-color: #003a75;
	color: white;
}