/* =====================================================
   luyen-thi-sap-xep-abc.css
   CSS riêng cho view "Sắp xếp ABC" (阅读第二部分 · 排列顺序).
   Nạp SAU luyen-thi-hsk.css (CSS chung của khung làm bài) — chỉ thêm
   các class mà phần Viết không có. Lấy từ file HoctiengTrungcungHang_HSK4_H41005.html
   ===================================================== */

/* Ba vế A / B / C */
.example-source .opt-label,
.option-list .opt-label {
    font-weight: 800;
    color: var(--azhsk-blue-dark);
    margin-right: 4px;
}

.example-source .opt-line,
.option-list .opt-line {
    display: block;
    margin: 2px 0;
}

.option-list {
    color: #374d5b;
    font-size: 17px;
    line-height: 1.9;
}

/* Ô nhập đáp án (VD: BAC) */
.answer-row.text-mode {
    display: flex;
    align-items: center;
    padding: 10px 12px;
    gap: 10px;
    flex-wrap: wrap;
}

    .answer-row.text-mode:empty:before {
        content: "";
    }

.answer-input {
    flex: 1;
    min-width: 160px;
    height: 42px;
    border: 1px solid #9bcde3;
    border-radius: 6px;
    padding: 0 12px;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: .12em;
    color: var(--azhsk-blue-dark);
    background: #fff;
    text-transform: uppercase;
    /* layout site chặn bôi đen toàn trang -> phải mở lại cho ô nhập, không thì gõ/xoá khó */
    -webkit-user-select: text !important;
    user-select: text !important;
}

    .answer-input::placeholder {
        color: #b3c4cf;
        font-weight: 600;
        letter-spacing: .04em;
        text-transform: none;
    }

    .answer-input:focus-visible {
        outline: 3px solid rgba(255,240,0,.95);
        outline-offset: 2px;
    }

    .answer-input:disabled {
        background: #f3f7fa;
        color: #7c94a3;
    }

    .answer-input.correct {
        border-color: var(--ok);
        box-shadow: 0 0 0 2px rgba(39,133,83,.15);
    }

    .answer-input.wrong {
        border-color: var(--bad);
        box-shadow: 0 0 0 2px rgba(200,75,63,.15);
    }

/* Pinyin của câu đáp án (bật/tắt bằng nút "Bật Pinyin") */
.answer-py-plain {
    display: none;
    margin-top: 2px;
    color: #7a6e2b;
    font-size: 12.5px;
    line-height: 1.45;
}

.inline-result.show-pinyin .answer-py-plain {
    display: block;
}

/* Cỡ chữ 大 / 中 / 小 */
.main .option-list,
.main .answer-input {
    font-size: calc(17px * var(--exam-scale));
}

.main .answer-py-plain {
    font-size: var(--pinyin-size);
}