/*
 * STUDENT V2 — WORK / QUESTION FOCUS v1
 * Design System v1
 * "Oyun gibi ama oyuncak değil."
 *
 * Soru çözümünde amaç: arayüz geri çekilir, içerik öne çıkar.
 */

body.studentWorkFocus {
    min-height: 100vh;
    margin: 0;
    background: var(--sv-bg);
    color: var(--sv-text);
    padding-bottom: env(safe-area-inset-bottom);
}

.studentWorkFocus .work-shell {
    width: min(100% - 28px, 920px);
    margin-inline: auto;
    padding-top: clamp(18px, 4vw, 34px);
}

/* Assignment giriş kartı */
.studentWorkFocus .work-card,
.studentWorkFocus .solve-card {
    background: var(--sv-surface);
    color: var(--sv-text);
    border: 1px solid rgba(174,182,204,.13);
    border-radius: var(--sv-radius-xl);
    box-shadow: var(--sv-shadow-md);
}

.studentWorkFocus .work-card {
    padding: clamp(20px, 4vw, 34px);
}

.studentWorkFocus .work-head,
.studentWorkFocus .solve-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.studentWorkFocus .back-link,
.studentWorkFocus .btn-soft {
    background: transparent;
    border: 1px solid rgba(174,182,204,.18);
    color: var(--sv-text-muted);
    border-radius: 14px;
    min-height: 42px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    font-weight: 700;
}

.studentWorkFocus .back-link:hover,
.studentWorkFocus .btn-soft:hover {
    color: var(--sv-text);
    background: var(--sv-surface-raised);
    border-color: rgba(124,108,242,.32);
}

.studentWorkFocus .title {
    color: var(--sv-text);
    margin-top: 24px;
    letter-spacing: -.025em;
}

.studentWorkFocus .badge {
    background: rgba(79,163,255,.12);
    color: var(--sv-secondary);
    border: 1px solid rgba(79,163,255,.20);
}

.studentWorkFocus .badge.homework {
    background: rgba(124,108,242,.13);
    color: var(--sv-primary);
    border-color: rgba(124,108,242,.23);
}

.studentWorkFocus .badge.review {
    background: rgba(242,184,75,.12);
    color: var(--sv-warning);
    border-color: rgba(242,184,75,.24);
}

/* İlerleme */
.studentWorkFocus .progress-track {
    background: rgba(174,182,204,.13);
    overflow: hidden;
    border-radius: 999px;
}

.studentWorkFocus .progress-fill {
    background: var(--sv-primary);
}

.studentWorkFocus .progress-value,
.studentWorkFocus .meta,
.studentWorkFocus .work-meta {
    color: var(--sv-text-muted);
}

/* Soru seçici / liste */
.studentWorkFocus .question-item,
.studentWorkFocus .question-selector a,
.studentWorkFocus .question-button {
    background: var(--sv-bg-soft);
    color: var(--sv-text);
    border: 1px solid rgba(174,182,204,.13);
}

.studentWorkFocus .question-item:hover,
.studentWorkFocus .question-selector a:hover,
.studentWorkFocus .question-button:hover {
    background: var(--sv-surface-raised);
    border-color: rgba(124,108,242,.34);
}

.studentWorkFocus .question-item.active,
.studentWorkFocus .question-selector .active,
.studentWorkFocus .question-button.active {
    background: rgba(124,108,242,.14);
    border-color: rgba(124,108,242,.42);
    color: var(--sv-text);
}

/* Çözüm ekranı */
.studentWorkFocus .solve-card {
    padding: clamp(18px, 4vw, 32px);
}

.studentWorkFocus .solve-top {
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(174,182,204,.12);
}

.studentWorkFocus .timer {
    min-width: 76px;
    text-align: center;
    color: var(--sv-text);
    background: var(--sv-bg-soft);
    border: 1px solid rgba(174,182,204,.14);
    border-radius: 999px;
    padding: 8px 12px;
    font-variant-numeric: tabular-nums;
    font-weight: 800;
}

/* Soru metni: sakin ve yüksek okunabilirlik */
.studentWorkFocus .solve-question {
    margin-top: 24px;
    color: var(--sv-text);
    font-size: clamp(1rem, 1.2vw + .75rem, 1.18rem);
    line-height: 1.7;
}

.studentWorkFocus .solve-question svg {
    max-width: 100%;
    height: auto;
    display: block;
    margin-inline: auto;
}

/* Seçenekler */
.studentWorkFocus .options {
    display: grid;
    gap: 12px;
    margin-top: 22px;
}

.studentWorkFocus .option-btn {
    width: 100%;
    min-height: 56px;
    border-radius: var(--sv-radius-md);
    border: 1px solid rgba(174,182,204,.16);
    background: var(--sv-bg-soft);
    color: var(--sv-text);
    text-align: left;
    padding: 14px 16px;
    transition:
        transform .15s ease,
        border-color .15s ease,
        background .15s ease;
}

.studentWorkFocus .option-btn:hover:not(:disabled) {
    transform: translateY(-1px);
    background: var(--sv-surface-raised);
    border-color: rgba(124,108,242,.34);
}

/* Cevap gönderilmeden önce seçim = mor */
.studentWorkFocus .option-btn.selected {
    background: rgba(124,108,242,.14);
    border-color: var(--sv-primary);
    box-shadow: inset 3px 0 0 var(--sv-primary);
}

/* Değerlendirme sonrası semantik renkler */
.studentWorkFocus .option-btn.correct {
    background: rgba(55,201,165,.13);
    border-color: rgba(55,201,165,.52);
    color: var(--sv-text);
    box-shadow: inset 3px 0 0 var(--sv-success);
}

.studentWorkFocus .option-btn.wrong {
    background: rgba(239,106,120,.12);
    border-color: rgba(239,106,120,.52);
    color: var(--sv-text);
    box-shadow: inset 3px 0 0 var(--sv-danger);
}

.studentWorkFocus .option-btn.muted {
    opacity: .56;
}

/* Geri bildirim */
.studentWorkFocus .feedback {
    margin-top: 18px;
    padding: 16px 18px;
    border-radius: var(--sv-radius-md);
    background: var(--sv-bg-soft);
    border: 1px solid rgba(174,182,204,.14);
    color: var(--sv-text);
}

.studentWorkFocus .feedback.correct,
.studentWorkFocus .feedback.success {
    border-color: rgba(55,201,165,.30);
    background: rgba(55,201,165,.09);
}

.studentWorkFocus .feedback.wrong,
.studentWorkFocus .feedback.error {
    border-color: rgba(239,106,120,.30);
    background: rgba(239,106,120,.08);
}

/* İpucu = dikkat, cevap değildir */
.studentWorkFocus .btn-warning {
    background: rgba(242,184,75,.12);
    color: var(--sv-warning);
    border: 1px solid rgba(242,184,75,.25);
}

.studentWorkFocus .btn-warning:hover {
    background: rgba(242,184,75,.18);
}

.studentWorkFocus .hints {
    color: var(--sv-text);
}

.studentWorkFocus .hint,
.studentWorkFocus .hint-card {
    background: rgba(242,184,75,.08);
    border: 1px solid rgba(242,184,75,.20);
    color: var(--sv-text);
}

/* Ana aksiyon */
.studentWorkFocus .btn-primary {
    background: var(--sv-primary);
    border-color: var(--sv-primary);
    color: var(--sv-text);
    box-shadow: 0 10px 24px rgba(124,108,242,.20);
}

/* İnceleme uyarısı */
.studentWorkFocus .notice.warning {
    background: rgba(242,184,75,.10);
    border: 1px solid rgba(242,184,75,.22);
    color: var(--sv-text);
}

/* Soru çözümünde global menü bilinçli olarak yok:
   öğrenci odakta kalır, Çalış'a dönüş üst soldaki sakin bağlantıdır. */

@media (max-width: 640px) {
    .studentWorkFocus .work-shell {
        width: min(100% - 18px, 920px);
        padding-top: 12px;
    }

    .studentWorkFocus .work-card,
    .studentWorkFocus .solve-card {
        border-radius: 20px;
        padding: 16px;
    }

    .studentWorkFocus .solve-top {
        align-items: stretch;
    }

    .studentWorkFocus .btn-soft,
    .studentWorkFocus .back-link {
        min-height: 44px;
    }

    .studentWorkFocus .option-btn {
        min-height: 58px;
        padding: 15px 14px;
    }
}

/* ============================================================
   FIX v1.0.1 — Assignment question preview + Student UI modal
   ============================================================ */

/* Assignment soru kartı: eski beyaz paneli Design System'e al. */
.studentWorkFocus .question-list-card {
    background: var(--sv-surface);
    color: var(--sv-text);
    border: 1px solid rgba(174,182,204,.13);
    box-shadow: var(--sv-shadow-soft);
}

.studentWorkFocus .question-list-card:hover {
    border-color: rgba(124,108,242,.30);
}

.studentWorkFocus .question-list-card.correct {
    background: rgba(55,201,165,.08);
    border-color: rgba(55,201,165,.30);
}

.studentWorkFocus .question-list-card.wrong {
    background: rgba(239,106,120,.08);
    border-color: rgba(239,106,120,.30);
}

.studentWorkFocus .question-list-card.answered {
    background: rgba(124,108,242,.08);
    border-color: rgba(124,108,242,.30);
}

.studentWorkFocus .question-list-card.hint {
    background: rgba(242,184,75,.07);
    border-color: rgba(242,184,75,.26);
}

.studentWorkFocus .q-head {
    border-bottom-color: rgba(174,182,204,.12);
}

.studentWorkFocus .q-no,
.studentWorkFocus .difficulty {
    background: var(--sv-bg-soft);
    color: var(--sv-text-muted);
    border-color: rgba(174,182,204,.14);
}

/* Asıl görünmeyen metin burada düzeliyor. */
.studentWorkFocus .question-text,
.studentWorkFocus .question-text .bikom-token-text,
.studentWorkFocus .question-text .bikom-token-latex {
    color: var(--sv-text);
}

.studentWorkFocus .question-text {
    line-height: 1.72;
}

.studentWorkFocus .question-text .bikom-token-svg {
    color: initial;
}

.studentWorkFocus .question-text .bikom-token-svg svg {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 14px auto;
}

/* Assignment önizleme seçenekleri de aynı görsel dünyada. */
.studentWorkFocus .option-preview {
    background: var(--sv-bg-soft);
    color: var(--sv-text-soft);
    border-color: rgba(174,182,204,.14);
}

.studentWorkFocus .option-preview.selected {
    background: rgba(124,108,242,.14);
    border-color: rgba(124,108,242,.42);
    color: var(--sv-text);
}

.studentWorkFocus .option-preview.correct {
    background: rgba(55,201,165,.12);
    border-color: rgba(55,201,165,.34);
    color: var(--sv-text);
}

.studentWorkFocus .option-preview.wrong {
    background: rgba(239,106,120,.11);
    border-color: rgba(239,106,120,.34);
    color: var(--sv-text);
}

.studentWorkFocus .student-choice-note {
    color: var(--sv-primary);
}

/* ------------------------------------------------------------
   Student message box / confirm modal — Design System v1
   ------------------------------------------------------------ */
.student-modal-backdrop {
    background: rgba(7,10,23,.72);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.student-modal {
    background: var(--sv-surface);
    color: var(--sv-text);
    border: 1px solid rgba(174,182,204,.16);
    border-radius: var(--sv-radius-lg);
    box-shadow: 0 24px 70px rgba(2,5,18,.48);
    padding: 20px;
}

.student-modal h3 {
    color: var(--sv-text);
    font-size: 18px;
}

.student-modal p {
    color: var(--sv-text-muted);
    font-size: 13px;
    line-height: 1.6;
}

.student-modal .btn-soft {
    background: var(--sv-bg-soft);
    color: var(--sv-text-soft);
    border: 1px solid rgba(174,182,204,.16);
}

.student-modal .btn-primary {
    background: var(--sv-primary);
    color: var(--sv-text);
    border-color: var(--sv-primary);
    box-shadow: 0 10px 24px rgba(124,108,242,.22);
}

/* Toast'lar da eski beyaz kutuya dönmesin. */
.student-toast {
    background: var(--sv-surface-raised);
    color: var(--sv-text);
    border-color: rgba(174,182,204,.16);
    box-shadow: 0 16px 40px rgba(2,5,18,.36);
}

.student-toast.success {
    background: var(--sv-surface-raised);
    border-color: rgba(55,201,165,.34);
    color: var(--sv-success);
}

.student-toast.error {
    background: var(--sv-surface-raised);
    border-color: rgba(239,106,120,.34);
    color: var(--sv-danger);
}

.student-toast.warning {
    background: var(--sv-surface-raised);
    border-color: rgba(242,184,75,.34);
    color: var(--sv-warning);
}