/* Wrapper */
.mts-practice-wrapper {
    max-width: 100%;
}

/* Test title center */
.mts-practice-wrapper h2 {
    text-align: center;
    font-weight: 700;
    margin-bottom: 25px;
}

/* Card */
.mts-practice-wrapper .mts-card {
    background: #fff;
    border: 1px solid #ddd;
    padding: 20px;
    margin-bottom: 25px;
    border-radius: 4px;
}

/* Question */
.mts-card p strong {
    font-weight: 700;
}

/* Simple line between question & options */
.mts-card p {
    border-bottom: 1px solid #ddd;
    padding-bottom: 8px;
    margin-bottom: 15px;
}

/* Options list clean */
.mts-card ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

.mts-card ul li {
    padding: 6px 0;
    border-bottom: 1px solid #eee;
}

/* Remove last option line */
.mts-card ul li:last-child {
    border-bottom: none;
}

/* Button full width */
.mts-card button {
    width: 100%;
    background: #c8b59b;   /* light brown */
    color: #000;
    border: 1px solid #b09a7c;
    padding: 12px;
    margin-top: 15px;
    font-size: 15px;
    cursor: pointer;
    font-weight: 600;
}

.mts-card button:hover {
    background: #b9a384;
}


/* Answer box simple (NO COLOR) */
.mts-answer-box {
    margin-top: 15px;
    padding-top: 10px;
    border-top: 1px solid #ddd;
    background: none;
}

/* Answer & explanation simple text */
.mts-answer-box p {
    margin: 6px 0;
    border: none;
    padding: 0;
}



/* =========================
   TEST WRAPPER
========================= */

.mts-test-wrapper {
    max-width: 100%;
}

/* =========================
   QUESTION BOX
========================= */

.mts-test-question {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 14px;
    margin-bottom: 22px;
}

/* Question text (LEFT only) */
.mts-q-title {
    font-weight: 600;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e5e5e5;
    text-align: left;
}

/* =========================
   OPTIONS
========================= */

.mts-test-option {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px;
    cursor: pointer;
    border-bottom: 1px solid #eee;
}

.mts-test-option:last-child {
    border-bottom: none;
}

/* hide radio */
.mts-test-option input {
    display: none;
}

/* number circle */
.mts-test-option::before {
    content: attr(data-no);
    width: 28px;
    height: 28px;
    border: 1px solid #333;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #333;
    background: #fff;
    flex-shrink: 0;
}

/* option text */
.mts-test-option span {
    display: block;
    width: 100%;
}

/* SELECTED OPTION */
.mts-test-option.selected::before {
    background: #000;
    color: #fff;
    border-color: #000;
}

/* =========================
   SUBMIT BUTTON
========================= */

.mts-test-form button[type="submit"] {
    width: 100%;
    padding: 14px;
    font-size: 16px;
    border: none;
    background: #b33a3a;
    color: #fff;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 20px;
}

/* =========================
   HEADER CENTER (ONLY TITLE + TIME)
========================= */

.mts-test-wrapper h2 {
    text-align: center;
    margin-bottom: 6px;
}

.mts-test-wrapper > p {
    text-align: center;
    margin-bottom: 20px;
}


.mts-pagination {
    margin: 30px 0;
    text-align: center;
}

.mts-page {
    display: inline-block;
    margin: 0 5px;
    padding: 6px 12px;
    border: 1px solid #ddd;
    text-decoration: none;
}

.mts-page.current {
    background: #333;
    color: #fff;
    border-color: #333;
}


