/**
 * PPQ Quiz Theme: Modern
 *
 * Bold, contemporary light design with vibrant accent colors.
 * Indigo/purple primary color, clean white backgrounds, strong typography.
 * Larger typography, card-based layout, subtle shadows.
 *
 * @package PressPrimer_Quiz
 * @since 1.0.0
 */

/* ==========================================================================
   Theme Variables
   ========================================================================== */

.ppq-quiz-theme-modern,
.ppq-quiz-landing.ppq-quiz-theme-modern,
.ppq-quiz-interface.ppq-quiz-theme-modern,
.ppq-results-container.ppq-quiz-theme-modern,
.ppq-question-review-container.ppq-quiz-theme-modern {
	/* Primary Colors - Vibrant Indigo */
	--ppq-primary: #4f46e5;
	--ppq-primary-hover: #4338ca;
	--ppq-primary-light: #eef2ff;
	--ppq-primary-rgb: 79, 70, 229;

	/* Secondary Colors */
	--ppq-secondary: #6366f1;
	--ppq-secondary-hover: #4f46e5;

	/* Status Colors - Strong, accessible */
	--ppq-success: #059669;
	--ppq-success-light: #d1fae5;
	--ppq-success-hover: #047857;
	--ppq-error: #dc2626;
	--ppq-error-light: #fee2e2;
	--ppq-error-hover: #b91c1c;
	--ppq-warning: #d97706;
	--ppq-warning-light: #fef3c7;
	--ppq-info: #0284c7;
	--ppq-info-light: #e0f2fe;

	/* Background Colors - Clean whites and light grays */
	--ppq-bg: #ffffff;
	--ppq-bg-alt: #f8fafc;
	--ppq-bg-hover: #f1f5f9;
	--ppq-bg-active: #e2e8f0;
	--ppq-bg-card: #ffffff;
	--ppq-bg-surface: #f8fafc;

	/* Text Colors - High contrast */
	--ppq-text: #1e293b;
	--ppq-text-secondary: #475569;
	--ppq-text-light: #64748b;
	--ppq-text-inverse: #ffffff;

	/* Border Colors */
	--ppq-border: #e2e8f0;
	--ppq-border-light: #f1f5f9;
	--ppq-border-focus: #4f46e5;

	/* Spacing */
	--ppq-space-xs: 0.25rem;
	--ppq-space-sm: 0.5rem;
	--ppq-space-md: 1rem;
	--ppq-space-lg: 1.5rem;
	--ppq-space-xl: 2rem;
	--ppq-space-2xl: 3rem;

	/* Border Radius - More rounded for modern feel */
	--ppq-radius-sm: 6px;
	--ppq-radius-md: 10px;
	--ppq-radius-lg: 14px;
	--ppq-radius-xl: 18px;
	--ppq-radius-full: 9999px;

	/* Shadows - Soft, layered */
	--ppq-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
	--ppq-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	--ppq-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
	--ppq-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
	--ppq-shadow-focus: 0 0 0 3px rgba(79, 70, 229, 0.3);
	--ppq-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.1), 0 1px 2px rgba(0, 0, 0, 0.06);

	/* Typography */
	--ppq-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	--ppq-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
	--ppq-font-size-xs: 0.75rem;
	--ppq-font-size-sm: 0.875rem;
	--ppq-font-size-base: 1rem;
	--ppq-font-size-lg: 1.125rem;
	--ppq-font-size-xl: 1.375rem;
	--ppq-font-size-2xl: 1.75rem;
	--ppq-font-size-3xl: 2.25rem;
	--ppq-line-height: 1.5;
	--ppq-line-height-tight: 1.3;

	/* Spacing Controls (customizable via Settings) */
	--ppq-option-padding: 12px;
	--ppq-question-margin: 24px;
	--ppq-max-width: 800px;

	/* Transitions */
	--ppq-transition-fast: 0.15s ease;
	--ppq-transition: 0.2s ease;
	--ppq-transition-slow: 0.3s ease;
}

/* ==========================================================================
   Base Container Styling
   ========================================================================== */

.ppq-quiz-theme-modern.ppq-quiz-landing,
.ppq-quiz-theme-modern.ppq-quiz-interface,
.ppq-quiz-theme-modern.ppq-results-container,
.ppq-quiz-theme-modern.ppq-question-review-container {
	background: var(--ppq-bg-surface);
	color: var(--ppq-text);
	font-family: var(--ppq-font-family);
	padding: var(--ppq-space-xl);
}

/* ==========================================================================
   Quiz Landing Page
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-quiz-content {
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-xl);
	box-shadow: var(--ppq-shadow-lg);
	padding: var(--ppq-space-2xl);
}

.ppq-quiz-theme-modern .ppq-quiz-header {
	margin-bottom: var(--ppq-space-xl);
	padding-bottom: var(--ppq-space-lg);
	border-bottom: 1px solid var(--ppq-border);
}

.ppq-quiz-theme-modern .ppq-quiz-title {
	font-size: var(--ppq-font-size-3xl);
	font-weight: 800;
	color: var(--ppq-text);
	margin: 0 0 var(--ppq-space-md);
	letter-spacing: -0.03em;
	line-height: var(--ppq-line-height-tight);
}

.ppq-quiz-theme-modern .ppq-quiz-description {
	font-size: var(--ppq-font-size-lg);
	color: var(--ppq-text-secondary);
	line-height: var(--ppq-line-height);
}

/* Meta Grid */
.ppq-quiz-theme-modern .ppq-quiz-meta {
	background: var(--ppq-bg-alt);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-lg);
	padding: var(--ppq-space-lg);
	margin-bottom: var(--ppq-space-xl);
}

.ppq-quiz-theme-modern .ppq-quiz-meta-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ppq-space-lg);
}

.ppq-quiz-theme-modern .ppq-quiz-meta-item {
	display: flex;
	align-items: center;
	gap: var(--ppq-space-sm);
}

.ppq-quiz-theme-modern .ppq-quiz-meta-icon {
	font-size: var(--ppq-font-size-xl);
	color: var(--ppq-primary);
}

.ppq-quiz-theme-modern .ppq-quiz-meta-label {
	font-size: var(--ppq-font-size-sm);
	font-weight: 500;
	color: var(--ppq-text-light);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.ppq-quiz-theme-modern .ppq-quiz-meta-value {
	font-size: var(--ppq-font-size-lg);
	font-weight: 700;
	color: var(--ppq-text);
}

/* Actions */
.ppq-quiz-theme-modern .ppq-quiz-actions {
	padding-top: var(--ppq-space-lg);
}

/* ==========================================================================
   Buttons
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--ppq-space-sm);
	padding: var(--ppq-space-md) var(--ppq-space-xl);
	font-family: var(--ppq-font-family);
	font-size: var(--ppq-font-size-base);
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	border-radius: var(--ppq-radius-lg);
	border: none;
	cursor: pointer;
	transition: all var(--ppq-transition);
}

.ppq-quiz-theme-modern .ppq-button-primary {
	background: var(--ppq-primary);
	color: var(--ppq-text-inverse);
	box-shadow: var(--ppq-shadow-md);
}

.ppq-quiz-theme-modern .ppq-button-primary:hover {
	background: var(--ppq-primary-hover);
	box-shadow: var(--ppq-shadow-lg);
	transform: translateY(-1px);
}

.ppq-quiz-theme-modern .ppq-button-primary:focus {
	outline: none;
	box-shadow: var(--ppq-shadow-focus);
}

.ppq-quiz-theme-modern .ppq-button-secondary {
	background: var(--ppq-bg);
	color: var(--ppq-text);
	border: 2px solid var(--ppq-border);
}

.ppq-quiz-theme-modern .ppq-button-secondary:hover {
	background: var(--ppq-bg-hover);
	border-color: var(--ppq-text-light);
}

.ppq-quiz-theme-modern .ppq-button-secondary:focus {
	outline: none;
	box-shadow: var(--ppq-shadow-focus);
}

.ppq-quiz-theme-modern .ppq-button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	transform: none;
}

/* ==========================================================================
   Form Elements
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-input {
	width: 100%;
	padding: var(--ppq-space-md);
	font-family: var(--ppq-font-family);
	font-size: var(--ppq-font-size-base);
	color: var(--ppq-text);
	background: var(--ppq-bg);
	border: 2px solid var(--ppq-border);
	border-radius: var(--ppq-radius-md);
	transition: all var(--ppq-transition);
}

.ppq-quiz-theme-modern .ppq-input:hover {
	border-color: var(--ppq-text-light);
}

.ppq-quiz-theme-modern .ppq-input:focus {
	outline: none;
	border-color: var(--ppq-primary);
	box-shadow: var(--ppq-shadow-focus);
}

.ppq-quiz-theme-modern .ppq-input::placeholder {
	color: var(--ppq-text-light);
}

/* ==========================================================================
   Quiz Interface
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-quiz-interface-header {
	margin-bottom: var(--ppq-space-xl);
	padding: var(--ppq-space-lg);
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-lg);
	box-shadow: var(--ppq-shadow-sm);
}

.ppq-quiz-theme-modern .ppq-quiz-interface-header-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--ppq-space-lg);
	margin-bottom: var(--ppq-space-md);
}

.ppq-quiz-theme-modern .ppq-quiz-interface-title {
	font-size: var(--ppq-font-size-xl);
	font-weight: 700;
	color: var(--ppq-text);
	margin: 0;
}

.ppq-quiz-theme-modern .ppq-quiz-interface-meta {
	display: flex;
	align-items: center;
	gap: var(--ppq-space-lg);
}

.ppq-quiz-theme-modern .ppq-quiz-interface-meta-item {
	display: flex;
	align-items: center;
	gap: var(--ppq-space-sm);
	padding: var(--ppq-space-sm) var(--ppq-space-md);
	background: var(--ppq-bg-alt);
	border-radius: var(--ppq-radius-full);
	font-size: var(--ppq-font-size-sm);
	font-weight: 600;
	color: var(--ppq-text-secondary);
}

.ppq-quiz-theme-modern .ppq-progress-bar-container {
	background: var(--ppq-bg-alt);
	border-radius: var(--ppq-radius-full);
	height: 8px;
	overflow: hidden;
}

.ppq-quiz-theme-modern .ppq-progress-bar {
	background: var(--ppq-primary);
	height: 100%;
	border-radius: var(--ppq-radius-full);
	transition: width var(--ppq-transition-slow);
}

/* Timer */
.ppq-quiz-theme-modern .ppq-timer {
	font-weight: 700;
	font-family: var(--ppq-font-mono);
	color: var(--ppq-text);
}

.ppq-quiz-theme-modern .ppq-timer-container.ppq-timer-warning {
	background: var(--ppq-warning-light);
	color: var(--ppq-warning);
}

.ppq-quiz-theme-modern .ppq-timer-container.ppq-timer-warning .ppq-timer {
	color: var(--ppq-warning);
}

.ppq-quiz-theme-modern .ppq-timer-container.ppq-timer-danger {
	background: var(--ppq-error-light);
	color: var(--ppq-error);
	animation: ppq-modern-pulse 1s ease-in-out infinite;
}

.ppq-quiz-theme-modern .ppq-timer-container.ppq-timer-danger .ppq-timer {
	color: var(--ppq-error);
}

@keyframes ppq-modern-pulse {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.7; }
}

/* ==========================================================================
   Questions
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-question {
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-xl);
	box-shadow: var(--ppq-shadow-card);
	padding: var(--ppq-space-2xl);
	margin-bottom: var(--ppq-space-xl);
}

.ppq-quiz-theme-modern .ppq-question-header {
	margin-bottom: var(--ppq-space-lg);
}

.ppq-quiz-theme-modern .ppq-question-number {
	display: inline-block;
	font-size: var(--ppq-font-size-sm);
	font-weight: 700;
	color: var(--ppq-primary);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-bottom: var(--ppq-space-sm);
}

.ppq-quiz-theme-modern .ppq-question-text {
	font-size: var(--ppq-font-size-xl);
	font-weight: 600;
	color: var(--ppq-text);
	line-height: var(--ppq-line-height);
	margin: 0 0 var(--ppq-space-xl);
}

.ppq-quiz-theme-modern .ppq-question-hint {
	font-size: var(--ppq-font-size-sm);
	color: var(--ppq-text-light);
	font-style: italic;
	margin-top: var(--ppq-space-sm);
}

/* ==========================================================================
   Answer Options
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-answer-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: var(--ppq-option-padding);
}

.ppq-quiz-theme-modern .ppq-answer-option {
	display: flex;
	align-items: flex-start;
	gap: var(--ppq-space-md);
	padding: var(--ppq-option-padding);
	background: var(--ppq-bg-alt);
	border: 2px solid var(--ppq-border);
	border-radius: var(--ppq-radius-lg);
	cursor: pointer;
	transition: all var(--ppq-transition);
}

.ppq-quiz-theme-modern .ppq-answer-option:hover {
	background: var(--ppq-bg-hover);
	border-color: var(--ppq-text-light);
	transform: translateX(4px);
}

.ppq-quiz-theme-modern .ppq-answer-option.ppq-selected {
	background: var(--ppq-primary-light);
	border-color: var(--ppq-primary);
}

/* Custom radio/checkbox styling - style the visual span, input is hidden by base CSS */
.ppq-quiz-theme-modern .ppq-answer-radio-check {
	width: 22px;
	height: 22px;
	border: 2px solid var(--ppq-border);
	border-radius: 50%;
	background: var(--ppq-bg);
	margin: 0;
	margin-top: 0;
	flex-shrink: 0;
	cursor: pointer;
	transition: all var(--ppq-transition);
}

.ppq-quiz-theme-modern .ppq-question[data-question-type="multiple_answer"] .ppq-answer-radio-check,
.ppq-quiz-theme-modern .ppq-question[data-question-type="ma"] .ppq-answer-radio-check {
	border-radius: var(--ppq-radius-sm);
}

.ppq-quiz-theme-modern .ppq-answer-option:hover .ppq-answer-radio-check {
	border-color: var(--ppq-primary);
}

.ppq-quiz-theme-modern .ppq-answer-option.ppq-selected .ppq-answer-radio-check {
	background: var(--ppq-primary);
	border-color: var(--ppq-primary);
}

.ppq-quiz-theme-modern .ppq-answer-option.ppq-selected .ppq-answer-radio-check::after {
	width: 8px;
	height: 8px;
	background: var(--ppq-text-inverse);
	border-radius: 50%;
}

.ppq-quiz-theme-modern .ppq-question[data-question-type="multiple_answer"] .ppq-answer-option.ppq-selected .ppq-answer-radio-check::after,
.ppq-quiz-theme-modern .ppq-question[data-question-type="ma"] .ppq-answer-option.ppq-selected .ppq-answer-radio-check::after {
	width: 6px;
	height: 10px;
	background: none;
	border: solid var(--ppq-text-inverse);
	border-width: 0 2px 2px 0;
	border-radius: 0;
	transform: translate(-50%, -60%) rotate(45deg);
}

.ppq-quiz-theme-modern .ppq-answer-input:focus + .ppq-answer-radio-check {
	outline: none;
	box-shadow: var(--ppq-shadow-focus);
}

.ppq-quiz-theme-modern .ppq-answer-text {
	flex: 1;
	font-size: var(--ppq-font-size-base);
	color: var(--ppq-text);
	line-height: var(--ppq-line-height);
}

.ppq-quiz-theme-modern .ppq-answer-option.ppq-selected .ppq-answer-text {
	color: var(--ppq-text);
	font-weight: 500;
}

/* ==========================================================================
   Navigation
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-quiz-navigation {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: var(--ppq-space-xl);
	margin-top: var(--ppq-space-xl);
	border-top: 1px solid var(--ppq-border);
	gap: var(--ppq-space-md);
}

.ppq-quiz-theme-modern .ppq-quiz-navigation .ppq-button {
	min-width: 140px;
}

/* ==========================================================================
   Auto-save Indicator
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-autosave-indicator {
	display: flex;
	align-items: center;
	gap: var(--ppq-space-sm);
	padding: var(--ppq-space-sm) var(--ppq-space-md);
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-full);
	font-size: var(--ppq-font-size-sm);
	color: var(--ppq-text-secondary);
	box-shadow: var(--ppq-shadow-sm);
}

.ppq-quiz-theme-modern .ppq-autosave-indicator.ppq-autosave-error {
	background: var(--ppq-error-light);
	border-color: var(--ppq-error);
	color: var(--ppq-error);
}

/* ==========================================================================
   Notices
   ========================================================================== */

.ppq-quiz-theme-modern .ppq-notice {
	padding: var(--ppq-space-md) var(--ppq-space-lg);
	border-radius: var(--ppq-radius-md);
	margin-bottom: var(--ppq-space-lg);
	border-left: 4px solid;
}

.ppq-quiz-theme-modern .ppq-notice p {
	margin: 0;
}

.ppq-quiz-theme-modern .ppq-notice-error {
	background: var(--ppq-error-light);
	border-color: var(--ppq-error);
	color: var(--ppq-error);
}

.ppq-quiz-theme-modern .ppq-notice-success {
	background: var(--ppq-success-light);
	border-color: var(--ppq-success);
	color: var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-notice-warning {
	background: var(--ppq-warning-light);
	border-color: var(--ppq-warning);
	color: var(--ppq-text);
}

.ppq-quiz-theme-modern .ppq-notice-info {
	background: var(--ppq-info-light);
	border-color: var(--ppq-info);
	color: var(--ppq-info);
}

/* ==========================================================================
   Responsive Design
   ========================================================================== */

@media (max-width: 768px) {
	.ppq-quiz-theme-modern.ppq-quiz-landing,
	.ppq-quiz-theme-modern.ppq-quiz-interface,
	.ppq-quiz-theme-modern.ppq-results-container,
	.ppq-quiz-theme-modern.ppq-question-review-container {
		padding: var(--ppq-space-md);
	}

	.ppq-quiz-theme-modern .ppq-quiz-content {
		padding: var(--ppq-space-lg);
		border-radius: var(--ppq-radius-lg);
	}

	.ppq-quiz-theme-modern .ppq-quiz-title {
		font-size: var(--ppq-font-size-2xl);
	}

	.ppq-quiz-theme-modern .ppq-quiz-interface-header-content {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--ppq-space-md);
	}

	.ppq-quiz-theme-modern .ppq-quiz-interface-meta {
		width: 100%;
		justify-content: flex-start;
	}

	.ppq-quiz-theme-modern .ppq-question {
		padding: var(--ppq-space-lg);
	}

	.ppq-quiz-theme-modern .ppq-question-text {
		font-size: var(--ppq-font-size-lg);
	}

	.ppq-quiz-theme-modern .ppq-answer-option {
		padding: var(--ppq-space-md);
	}
}

@media (max-width: 480px) {
	.ppq-quiz-theme-modern .ppq-quiz-content {
		padding: var(--ppq-space-md);
		border-radius: var(--ppq-radius-md);
	}

	.ppq-quiz-theme-modern .ppq-quiz-title {
		font-size: var(--ppq-font-size-xl);
	}

	.ppq-quiz-theme-modern .ppq-quiz-meta-grid {
		flex-direction: column;
		gap: var(--ppq-space-md);
	}

	.ppq-quiz-theme-modern .ppq-quiz-navigation {
		flex-direction: column;
	}

	.ppq-quiz-theme-modern .ppq-quiz-navigation .ppq-button {
		width: 100%;
	}
}

/* ==========================================================================
   Results Page - Modern Theme
   ========================================================================== */

.ppq-quiz-theme-modern.ppq-results-container {
	background: var(--ppq-bg-surface);
	color: var(--ppq-text);
	padding: var(--ppq-space-xl);
	font-family: var(--ppq-font-family);
}

/* Results Header */
.ppq-quiz-theme-modern .ppq-results-header {
	text-align: center;
	margin-bottom: var(--ppq-space-xl);
}

.ppq-quiz-theme-modern .ppq-results-title {
	font-size: var(--ppq-font-size-3xl);
	font-weight: 800;
	color: var(--ppq-text);
	margin: 0 0 var(--ppq-space-sm);
	letter-spacing: -0.03em;
}

.ppq-quiz-theme-modern .ppq-results-subtitle {
	font-size: var(--ppq-font-size-lg);
	color: var(--ppq-text-secondary);
	margin: 0;
}

/* Score Display */
.ppq-quiz-theme-modern .ppq-score-display {
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-xl);
	padding: var(--ppq-space-2xl);
	margin-bottom: var(--ppq-space-xl);
	text-align: center;
	box-shadow: var(--ppq-shadow-lg);
}

.ppq-quiz-theme-modern .ppq-score-display.ppq-passed {
	border-top: 4px solid var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-score-display.ppq-failed {
	border-top: 4px solid var(--ppq-error);
}

.ppq-quiz-theme-modern .ppq-score-percentage {
	font-size: 5rem;
	font-weight: 800;
	line-height: 1;
	margin-bottom: var(--ppq-space-md);
	letter-spacing: -0.03em;
}

.ppq-quiz-theme-modern .ppq-passed .ppq-score-percentage {
	color: var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-failed .ppq-score-percentage {
	color: var(--ppq-error);
}

.ppq-quiz-theme-modern .ppq-score-label {
	font-size: var(--ppq-font-size-sm);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ppq-text-light);
	margin-bottom: var(--ppq-space-lg);
}

.ppq-quiz-theme-modern .ppq-pass-status {
	display: inline-flex;
	align-items: center;
	gap: var(--ppq-space-sm);
	font-size: var(--ppq-font-size-lg);
	font-weight: 700;
	padding: var(--ppq-space-md) var(--ppq-space-xl);
	border-radius: var(--ppq-radius-full);
}

.ppq-quiz-theme-modern .ppq-pass-status.ppq-status-passed {
	background: var(--ppq-success-light);
	color: var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-pass-status.ppq-status-failed {
	background: var(--ppq-error-light);
	color: var(--ppq-error);
}

/* Score Breakdown */
.ppq-quiz-theme-modern .ppq-score-breakdown {
	display: flex;
	justify-content: center;
	gap: var(--ppq-space-2xl);
	margin-top: var(--ppq-space-xl);
	padding-top: var(--ppq-space-xl);
	border-top: 1px solid var(--ppq-border);
}

.ppq-quiz-theme-modern .ppq-breakdown-item {
	text-align: center;
}

.ppq-quiz-theme-modern .ppq-breakdown-value {
	font-size: var(--ppq-font-size-3xl);
	font-weight: 800;
	color: var(--ppq-text);
}

.ppq-quiz-theme-modern .ppq-breakdown-label {
	font-size: var(--ppq-font-size-sm);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ppq-text-light);
	margin-top: var(--ppq-space-xs);
}

/* Results Stats */
.ppq-quiz-theme-modern .ppq-results-stats {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ppq-space-xl);
	justify-content: center;
	margin-bottom: var(--ppq-space-xl);
	padding: var(--ppq-space-lg);
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-lg);
	box-shadow: var(--ppq-shadow-sm);
}

.ppq-quiz-theme-modern .ppq-stat-item {
	text-align: center;
	padding: var(--ppq-space-md);
}

.ppq-quiz-theme-modern .ppq-stat-label {
	font-size: var(--ppq-font-size-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ppq-text-light);
	margin-bottom: var(--ppq-space-xs);
}

.ppq-quiz-theme-modern .ppq-stat-value {
	font-size: var(--ppq-font-size-xl);
	font-weight: 700;
	color: var(--ppq-text);
}

/* Results Message */
.ppq-quiz-theme-modern .ppq-results-message {
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-lg);
	padding: var(--ppq-space-lg);
	margin-bottom: var(--ppq-space-xl);
	border-left: 4px solid var(--ppq-primary);
	box-shadow: var(--ppq-shadow-sm);
}

.ppq-quiz-theme-modern .ppq-results-message.ppq-message-passed {
	border-left-color: var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-results-message.ppq-message-failed {
	border-left-color: var(--ppq-error);
}

.ppq-quiz-theme-modern .ppq-results-message p {
	margin: 0;
	color: var(--ppq-text);
	line-height: var(--ppq-line-height);
}

/* Question Review Section */
.ppq-quiz-theme-modern .ppq-question-review-section {
	margin-bottom: var(--ppq-space-xl);
}

.ppq-quiz-theme-modern .ppq-review-section-header {
	margin-bottom: var(--ppq-space-lg);
}

.ppq-quiz-theme-modern .ppq-review-section-title {
	font-size: var(--ppq-font-size-2xl);
	font-weight: 800;
	color: var(--ppq-text);
	margin: 0;
	letter-spacing: -0.02em;
}

/* Review Question Cards */
.ppq-quiz-theme-modern .ppq-review-question {
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-lg);
	padding: var(--ppq-space-lg);
	margin-bottom: var(--ppq-space-md);
	box-shadow: var(--ppq-shadow-sm);
}

.ppq-quiz-theme-modern .ppq-review-question.ppq-question-correct {
	border-left: 4px solid var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-review-question.ppq-question-incorrect {
	border-left: 4px solid var(--ppq-error);
}

.ppq-quiz-theme-modern .ppq-review-question.ppq-question-partial {
	border-left: 4px solid var(--ppq-warning);
}

.ppq-quiz-theme-modern .ppq-review-question.ppq-question-unanswered {
	border-left: 4px solid var(--ppq-text-light);
}

.ppq-quiz-theme-modern .ppq-review-question-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: var(--ppq-space-md);
}

.ppq-quiz-theme-modern .ppq-review-question-number {
	font-size: var(--ppq-font-size-sm);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ppq-primary);
}

.ppq-quiz-theme-modern .ppq-review-question-status {
	font-size: var(--ppq-font-size-xs);
	font-weight: 700;
	padding: var(--ppq-space-xs) var(--ppq-space-md);
	border-radius: var(--ppq-radius-full);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.ppq-quiz-theme-modern .ppq-review-question-status.ppq-status-correct {
	background: var(--ppq-success-light);
	color: var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-review-question-status.ppq-status-incorrect {
	background: var(--ppq-error-light);
	color: var(--ppq-error);
}

.ppq-quiz-theme-modern .ppq-review-question-status.ppq-status-partial {
	background: var(--ppq-warning-light);
	color: var(--ppq-warning);
}

.ppq-quiz-theme-modern .ppq-review-question-status.ppq-status-unanswered {
	background: var(--ppq-bg-alt);
	color: var(--ppq-text-light);
}

.ppq-quiz-theme-modern .ppq-review-question-text {
	font-size: var(--ppq-font-size-lg);
	font-weight: 600;
	line-height: var(--ppq-line-height);
	color: var(--ppq-text);
	margin-bottom: var(--ppq-space-lg);
}

/* Review Answers */
.ppq-quiz-theme-modern .ppq-review-answers {
	display: flex;
	flex-direction: column;
	gap: var(--ppq-space-sm);
}

.ppq-quiz-theme-modern .ppq-review-answer {
	display: flex;
	align-items: flex-start;
	gap: var(--ppq-space-md);
	padding: var(--ppq-space-md);
	border-radius: var(--ppq-radius-md);
	font-size: var(--ppq-font-size-base);
	line-height: var(--ppq-line-height);
	background: var(--ppq-bg-alt);
	border: 1px solid transparent;
}

.ppq-quiz-theme-modern .ppq-review-answer.ppq-answer-selected {
	background: var(--ppq-bg-hover);
	border-color: var(--ppq-border);
}

.ppq-quiz-theme-modern .ppq-review-answer.ppq-answer-correct {
	background: var(--ppq-success-light);
	border-color: var(--ppq-success);
}

.ppq-quiz-theme-modern .ppq-review-answer.ppq-answer-incorrect {
	background: var(--ppq-error-light);
	border-color: var(--ppq-error);
}

.ppq-quiz-theme-modern .ppq-review-answer-indicator {
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--ppq-font-size-sm);
	font-weight: 700;
}

.ppq-quiz-theme-modern .ppq-review-answer-text {
	flex: 1;
	color: var(--ppq-text);
}

/* Explanation */
.ppq-quiz-theme-modern .ppq-review-explanation {
	margin-top: var(--ppq-space-lg);
	padding: var(--ppq-space-md);
	background: var(--ppq-info-light);
	border-radius: var(--ppq-radius-md);
	border-left: 4px solid var(--ppq-info);
}

.ppq-quiz-theme-modern .ppq-explanation-label {
	font-size: var(--ppq-font-size-xs);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--ppq-info);
	margin-bottom: var(--ppq-space-xs);
}

.ppq-quiz-theme-modern .ppq-explanation-text {
	font-size: var(--ppq-font-size-sm);
	color: var(--ppq-text);
	line-height: var(--ppq-line-height);
	margin: 0;
}

/* Results Actions */
.ppq-quiz-theme-modern .ppq-results-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ppq-space-md);
	justify-content: center;
	padding-top: var(--ppq-space-xl);
}

.ppq-quiz-theme-modern .ppq-results-actions .ppq-button {
	padding: var(--ppq-space-md) var(--ppq-space-xl);
}

/* Email Results Form */
.ppq-quiz-theme-modern .ppq-email-results-form {
	background: var(--ppq-bg-card);
	border: 1px solid var(--ppq-border);
	border-radius: var(--ppq-radius-lg);
	padding: var(--ppq-space-lg);
	margin-top: var(--ppq-space-xl);
	box-shadow: var(--ppq-shadow-sm);
}

.ppq-quiz-theme-modern .ppq-email-form-title {
	font-size: var(--ppq-font-size-lg);
	font-weight: 700;
	color: var(--ppq-text);
	margin: 0 0 var(--ppq-space-md);
}

.ppq-quiz-theme-modern .ppq-email-form-row {
	display: flex;
	gap: var(--ppq-space-md);
}

.ppq-quiz-theme-modern .ppq-email-form-row .ppq-input {
	flex: 1;
}

/* Timeout Notice */
.ppq-quiz-theme-modern .ppq-timeout-notice {
	background: var(--ppq-warning-light);
	border: 1px solid var(--ppq-warning);
	border-radius: var(--ppq-radius-lg);
	padding: var(--ppq-space-md);
	margin-bottom: var(--ppq-space-lg);
	color: var(--ppq-text);
	font-size: var(--ppq-font-size-sm);
	border-left: 4px solid var(--ppq-warning);
}

/* Results Page Responsive */
@media (max-width: 768px) {
	.ppq-quiz-theme-modern.ppq-results-container {
		padding: var(--ppq-space-md);
	}

	.ppq-quiz-theme-modern .ppq-results-title {
		font-size: var(--ppq-font-size-2xl);
	}

	.ppq-quiz-theme-modern .ppq-score-percentage {
		font-size: 4rem;
	}

	.ppq-quiz-theme-modern .ppq-score-breakdown {
		gap: var(--ppq-space-lg);
	}

	.ppq-quiz-theme-modern .ppq-results-stats {
		gap: var(--ppq-space-md);
	}

	.ppq-quiz-theme-modern .ppq-email-form-row {
		flex-direction: column;
	}
}

@media (max-width: 480px) {
	.ppq-quiz-theme-modern .ppq-results-title {
		font-size: var(--ppq-font-size-xl);
	}

	.ppq-quiz-theme-modern .ppq-score-percentage {
		font-size: 3rem;
	}

	.ppq-quiz-theme-modern .ppq-score-breakdown {
		flex-direction: column;
		gap: var(--ppq-space-md);
	}

	.ppq-quiz-theme-modern .ppq-results-stats {
		flex-direction: column;
	}

	.ppq-quiz-theme-modern .ppq-results-actions {
		flex-direction: column;
	}

	.ppq-quiz-theme-modern .ppq-results-actions .ppq-button {
		width: 100%;
	}

	.ppq-quiz-theme-modern .ppq-review-question-header {
		flex-direction: column;
		gap: var(--ppq-space-sm);
	}
}

/* ==========================================================================
   Reduced Motion Support
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	.ppq-quiz-theme-modern *,
	.ppq-quiz-theme-modern *::before,
	.ppq-quiz-theme-modern *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}
