/**
 * Quiz Maker Complete Automation - Public Styles
 */

/* Quiz Container */
.qmca-quiz-container {
	margin: 20px 0;
}

.qmca-quiz-container h2 {
	font-size: 24px;
	margin-bottom: 20px;
}

/* Quiz Set (Toggle) */
.qmca-quiz-set {
	border: 1px solid #ddd;
	border-radius: 5px;
	margin-bottom: 15px;
	overflow: hidden;
}

.qmca-quiz-set-header {
	background: #f7f7f7;
	padding: 15px 20px;
	cursor: pointer;
	transition: background 0.3s;
}

.qmca-quiz-set-header:hover {
	background: #efefef;
}

.qmca-quiz-set-header h3 {
	margin: 0;
	font-size: 18px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.qmca-toggle-icon {
	display: inline-block;
	transition: transform 0.3s;
	font-size: 14px;
}

.qmca-question-count {
	font-size: 14px;
	font-weight: normal;
	color: #666;
}

.qmca-status {
	font-size: 14px;
	margin-left: auto;
}

.qmca-quiz-set-content {
	padding: 20px;
	background: #fff;
}

/* Locked State */
.qmca-locked {
	text-align: center;
	padding: 30px;
}

.qmca-locked p {
	font-size: 16px;
	margin-bottom: 15px;
}

/* Quiz Question Interface */
.qmca-question-container {
	max-width: 800px;
	margin: 0 auto;
}

.qmca-progress {
	margin-bottom: 20px;
	text-align: center;
}

.qmca-progress-bar {
	width: 100%;
	height: 10px;
	background: #f0f0f0;
	border-radius: 5px;
	overflow: hidden;
	margin-top: 10px;
}

.qmca-progress-fill {
	height: 100%;
	background: #0073aa;
	transition: width 0.3s;
}

.qmca-question {
	margin-bottom: 30px;
}

.qmca-question h4 {
	font-size: 18px;
	line-height: 1.6;
}

/* Options */
.qmca-options {
	margin-bottom: 30px;
}

.qmca-option {
	display: block;
	padding: 15px;
	margin-bottom: 10px;
	border: 2px solid #ddd;
	border-radius: 5px;
	cursor: pointer;
	transition: all 0.3s;
}

.qmca-option:hover {
	border-color: #0073aa;
	background: #f0f8ff;
}

.qmca-option input[type="radio"] {
	margin-right: 10px;
}

.qmca-option input[type="radio"]:checked + .qmca-option-text {
	font-weight: bold;
}

.qmca-option-text {
	display: inline-block;
	vertical-align: middle;
	width: calc(100% - 30px);
}

/* Navigation */
.qmca-navigation {
	display: flex;
	justify-content: space-between;
	gap: 10px;
}

.qmca-navigation .button {
	flex: 1;
}

/* Results */
.qmca-results {
	max-width: 800px;
	margin: 0 auto;
}

.qmca-score {
	text-align: center;
	padding: 30px;
	background: #f0f8ff;
	border-radius: 10px;
	margin-bottom: 30px;
}

.qmca-score h3 {
	margin-top: 0;
	font-size: 24px;
}

.qmca-score-big {
	font-size: 72px;
	font-weight: bold;
	color: #0073aa;
	margin: 20px 0;
}

.qmca-results-details {
	margin-bottom: 30px;
}

.qmca-results-details h4 {
	font-size: 20px;
	margin-bottom: 15px;
}

.qmca-result-item {
	border: 1px solid #ddd;
	border-radius: 5px;
	margin-bottom: 10px;
	overflow: hidden;
}

.qmca-result-item.correct {
	border-color: #28a745;
}

.qmca-result-item.incorrect {
	border-color: #dc3545;
}

.qmca-result-header {
	padding: 10px 15px;
	background: #f7f7f7;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.qmca-result-item.correct .qmca-result-header {
	background: #d4edda;
}

.qmca-result-item.incorrect .qmca-result-header {
	background: #f8d7da;
}

.qmca-result-number {
	font-weight: bold;
}

.qmca-result-status {
	font-weight: bold;
}

.qmca-result-item.correct .qmca-result-status {
	color: #28a745;
}

.qmca-result-item.incorrect .qmca-result-status {
	color: #dc3545;
}

.qmca-result-body {
	padding: 15px;
}

.qmca-result-body p {
	margin: 5px 0;
}

.qmca-retry {
	text-align: center;
	padding: 20px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
	.qmca-quiz-set-header h3 {
		font-size: 16px;
		flex-wrap: wrap;
	}

	.qmca-question h4 {
		font-size: 16px;
	}

	.qmca-score-big {
		font-size: 48px;
	}

	.qmca-navigation {
		flex-direction: column;
	}
}

/* Loading Spinner */
.qmca-loading {
	text-align: center;
	padding: 60px 20px;
}

.qmca-spinner {
	display: inline-block;
	width: 50px;
	height: 50px;
	border: 4px solid #f3f3f3;
	border-top: 4px solid #0073aa;
	border-radius: 50%;
	animation: qmca-spin 1s linear infinite;
	margin-bottom: 20px;
}

@keyframes qmca-spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

.qmca-loading p {
	color: #666;
	font-size: 16px;
	margin: 10px 0 0 0;
}

.qmca-loading small {
	color: #999;
	font-size: 14px;
}

/* Error State */
.qmca-error {
	text-align: center;
	padding: 40px 20px;
	background: #fff3cd;
	border: 2px solid #ffc107;
	border-radius: 5px;
}

.qmca-error p {
	color: #856404;
	font-size: 16px;
	margin-bottom: 20px;
}

.qmca-retry-load {
	background: #0073aa !important;
	color: white !important;
	padding: 10px 20px !important;
	border: none !important;
	border-radius: 5px;
	cursor: pointer;
	font-size: 16px;
}

.qmca-retry-load:hover {
	background: #005a87 !important;
}

/* Quiz Options (Before Start) */
.qmca-quiz-options {
	margin: 20px 0;
	padding: 20px;
	background: #f8f9fa;
	border-radius: 5px;
}

.qmca-quiz-options h4 {
	margin-top: 0;
	margin-bottom: 15px;
	font-size: 16px;
}

.qmca-option-radio {
	display: block;
	padding: 12px 15px;
	margin-bottom: 10px;
	background: white;
	border: 2px solid #ddd;
	border-radius: 5px;
	cursor: pointer;
	transition: all 0.2s;
}

.qmca-option-radio:hover {
	border-color: #0073aa;
	background: #f0f8ff;
}

.qmca-option-radio input[type="radio"] {
	margin-right: 10px;
}

.qmca-option-radio input[type="radio"]:checked {
	accent-color: #0073aa;
}

.qmca-option-radio span {
	font-size: 14px;
}

/* Immediate Feedback */
.qmca-immediate-feedback {
	margin: 20px 0;
	padding: 15px;
	border-radius: 5px;
	animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.qmca-immediate-feedback.correct {
	background: #d4edda;
	border: 2px solid #28a745;
	color: #155724;
}

.qmca-immediate-feedback.incorrect {
	background: #f8d7da;
	border: 2px solid #dc3545;
	color: #721c24;
}

.qmca-immediate-feedback p {
	margin: 5px 0;
}

.qmca-feedback-icon {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px !important;
}

.qmca-immediate-feedback strong {
	font-weight: 600;
}

/* AI Analysis Sections */
.qmca-explanation,
.qmca-analysis-keywords,
.qmca-analysis-memory {
	margin-top: 15px;
	padding: 12px;
	border-radius: 5px;
	line-height: 1.6;
}

.qmca-explanation {
	background: #fff3cd;
	border-left: 4px solid #ffc107;
}

.qmca-analysis-keywords {
	background: #e7f5ff;
	border-left: 4px solid #0073aa;
}

.qmca-analysis-memory {
	background: #fff4e6;
	border-left: 4px solid #ff9800;
}

.qmca-result-body .qmca-explanation,
.qmca-result-body .qmca-analysis-keywords,
.qmca-result-body .qmca-analysis-memory {
	margin-top: 10px;
	font-size: 14px;
}

.qmca-result-body .qmca-explanation strong,
.qmca-result-body .qmca-analysis-keywords strong,
.qmca-result-body .qmca-analysis-memory strong {
	display: block;
	margin-bottom: 5px;
	color: #333;
}
