/* ── German Quiz - Public Styles ── */
.gq-quiz-container {
    max-width: 720px;
    margin: 24px auto;
    font-family: 'Segoe UI', Tahoma, 'Vazir', sans-serif;
    direction: rtl;
}

/* Header */
.gq-quiz-header { background: #f8f9fa; border-radius: 12px; padding: 20px 24px; margin-bottom: 20px; border: 1px solid #e0e0e0; }
.gq-quiz-title { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.gq-quiz-title h2 { margin: 0; font-size: 20px; }
.gq-quiz-desc { color: #555; margin: 8px 0; }
.gq-quiz-meta { display: flex; gap: 16px; font-size: 13px; color: #666; margin-top: 10px; flex-wrap: wrap; }

/* Level badges */
.gq-level-badge { padding: 3px 12px; border-radius: 14px; font-weight: 700; font-size: 13px; color: #fff; }
.gq-level-A1 { background: #27ae60; }
.gq-level-A2 { background: #2ecc71; color: #1a5c35; }
.gq-level-B1 { background: #f39c12; }
.gq-level-B2 { background: #e67e22; }
.gq-level-C1 { background: #c0392b; }

/* Timer */
.gq-timer { margin-top: 12px; display: flex; align-items: center; gap: 8px; font-weight: 600; }
.gq-timer-display { font-size: 20px; font-variant-numeric: tabular-nums; color: #2271b1; }
.gq-timer-display.gq-urgent { color: #e74c3c; animation: gq-pulse 1s infinite; }
@keyframes gq-pulse { 0%,100% { opacity:1; } 50% { opacity:.4; } }

/* Start screen */
.gq-start-screen { text-align: center; padding: 30px 0; }
.gq-user-fields { margin-bottom: 20px; display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.gq-user-fields input { padding: 10px 14px; border: 1px solid #ccc; border-radius: 8px; font-size: 14px; min-width: 200px; }
.gq-fill-info { color: #777; font-size: 13px; margin-bottom: 10px; }

/* Buttons */
.gq-btn { padding: 10px 24px; border: none; border-radius: 8px; font-size: 15px; cursor: pointer; font-weight: 600; transition: all .2s; }
.gq-btn-start  { background: #2271b1; color: #fff; font-size: 17px; padding: 14px 36px; }
.gq-btn-start:hover { background: #135e96; }
.gq-btn-next   { background: #2271b1; color: #fff; }
.gq-btn-prev   { background: #f0f0f0; color: #333; }
.gq-btn-submit { background: #27ae60; color: #fff; }
.gq-btn-retry  { background: #f39c12; color: #fff; }
.gq-btn:hover  { opacity: .88; }
.gq-btn:disabled { opacity: .5; cursor: not-allowed; }

/* Progress */
.gq-progress { margin-bottom: 20px; }
.gq-progress-bar { background: #e0e0e0; border-radius: 10px; height: 8px; overflow: hidden; margin-bottom: 6px; }
.gq-progress-fill { height: 100%; background: linear-gradient(90deg, #2271b1, #27ae60); border-radius: 10px; transition: width .3s ease; }
.gq-progress-text { font-size: 13px; color: #666; }

/* Question */
.gq-question { background: #fff; border: 1px solid #e0e0e0; border-radius: 12px; padding: 24px; }
.gq-q-number { font-size: 12px; color: #999; font-weight: 600; margin-bottom: 8px; }
.gq-q-text { font-size: 17px; font-weight: 600; margin-bottom: 20px; line-height: 1.6; }

/* Options */
.gq-options { display: flex; flex-direction: column; gap: 10px; }
.gq-option { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 2px solid #e0e0e0; border-radius: 10px; cursor: pointer; transition: all .2s; }
.gq-option:hover { border-color: #2271b1; background: #f0f6fc; }
.gq-option input[type=radio] { display: none; }
.gq-opt-key { min-width: 28px; height: 28px; border-radius: 50%; background: #e0e0e0; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; }
.gq-opt-text { flex: 1; }

.gq-option.selected { border-color: #2271b1; background: #e8f0fc; }
.gq-option.selected .gq-opt-key { background: #2271b1; color: #fff; }
.gq-option.gq-result-correct { border-color: #27ae60; background: #eafaf1; }
.gq-option.gq-result-wrong   { border-color: #e74c3c; background: #fdf2f2; }

/* T/F */
.gq-tf { flex-direction: row; gap: 16px; }
.gq-tf-opt { flex: 1; justify-content: center; font-size: 16px; }
.gq-tf-icon { font-size: 20px; }

/* Fill blank */
.gq-fill-input, .gq-essay-input {
    width: 100%; padding: 12px 14px; border: 2px solid #e0e0e0; border-radius: 8px;
    font-size: 15px; font-family: inherit; box-sizing: border-box; transition: border-color .2s;
}
.gq-fill-input:focus, .gq-essay-input:focus { border-color: #2271b1; outline: none; }
.gq-essay-note { color: #888; font-size: 13px; margin-bottom: 10px; }

/* Navigation */
.gq-nav { display: flex; justify-content: space-between; margin-top: 24px; gap: 10px; }

/* Results */
.gq-result-summary { text-align: center; padding: 30px 20px; background: #f8f9fa; border-radius: 12px; margin-bottom: 24px; border: 2px solid #e0e0e0; }
.gq-result-score-big { font-size: 60px; font-weight: 900; line-height: 1; }
.gq-result-score-big.passed { color: #27ae60; }
.gq-result-score-big.failed { color: #e74c3c; }
.gq-result-verdict { font-size: 22px; font-weight: 700; margin: 10px 0 4px; }
.gq-result-detail-text { font-size: 14px; color: #666; }

.gq-result-item { border: 1px solid #e0e0e0; border-radius: 10px; padding: 16px; margin-bottom: 12px; }
.gq-result-item.correct-item { border-color: #27ae60; background: #f0faf4; }
.gq-result-item.wrong-item   { border-color: #e74c3c; background: #fdf4f4; }
.gq-result-item.essay-item   { border-color: #f39c12; background: #fffbf0; }
.gq-ri-q   { font-weight: 600; margin-bottom: 8px; }
.gq-ri-ans { font-size: 13px; margin: 4px 0; }
.gq-ri-exp { font-size: 13px; color: #555; background: #fff; padding: 8px 12px; border-radius: 6px; margin-top: 8px; border-right: 3px solid #2271b1; }
.gq-result-details h3 { font-size: 16px; margin: 0 0 12px; }