/*test.css*/

/* для всех тестовых страниц */
.test-page {
    margin: 20px auto;
    max-width: 800px;
    text-align: center;
}

/* вывод списка пройденых тестов - Test History */
.test-card-link {
    text-decoration: none; /* Убирает подчеркивание */
    color: inherit; /* Наследует цвет текста */
    display: block; /* Делаем ссылку блочным элементом */
}

/* контенер для страницы теста */
.test-container {
    display: flex;
    flex-wrap: wrap;
}

/* контенер для восросов теста */
.test-questions-container {
    flex: 1 1 100%; /* занимает всю ширину */
    display: flex;
    gap: 20px; /* расстояние между вопросами */
    flex-wrap: wrap;
}

/* Стили для формы теста */
.test-container form {
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: 100%; /* Чтобы не схлопывалось */
}

/* контенер для списка пройденных тестов */
.test-history-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.test-card {
    flex: 1 1 calc(45% - 20px);
    border-radius: 8px;
    padding: 5px 20px 15px 30px; /* Уменьшенный padding */
    overflow: hidden;
    background-color: #fff;
    transition: transform 0.4s, box-shadow 0.4s;
    box-shadow:
        inset 0 -3em 3em rgba(0, 0, 0, 0.1),
        0 0 0 0.5px rgb(255, 255, 255),
        0.3em 0.3em 1em rgba(0, 0, 0, 0.3);
}

.test-card:hover {
    transform: translateY(-1px) scale(1.01);
        box-shadow:
        inset 0 -3em 3em rgba(0, 0, 0, 0.1),
        0 0 0 0.5px rgb(255, 255, 255),
        0.5em 0.5em 2em rgba(0, 0, 0, 0.4);
}

/* контенер для пройденных тестов теств */
.test-result-container {
    text-align: left;
    flex-wrap: wrap;
    gap: 10px;
    width: 100%; /* Чтобы не схлопывалось */
}

.test-history-card {
    flex: 1 1 calc(45% - 20px);
    margin-bottom: 15px;
    padding: 10px 40px; /* Уменьшенный padding */
    border-radius: 8px;
    overflow: hidden;
    line-height: 1.3;
    background-color: #fff;
    transition: transform 0.4s, box-shadow 0.4s;
    box-shadow:
        inset 0 -3em 3em rgba(0, 0, 0, 0.1),
        0 0 0 0.5px rgb(255, 255, 255),
        0.3em 0.3em 1em rgba(0, 0, 0, 0.3);
}

.test-history-card:hover {
    transform: translateY(-1px) scale(1.01);
        box-shadow:
        inset 0 -3em 3em rgba(0, 0, 0, 0.1),
        0 0 0 0.5px rgb(255, 255, 255),
        0.5em 0.5em 2em rgba(0, 0, 0, 0.4);
}


.test-page-question {
    margin: 20px;
    font-size: 1rem;
    font-weight: bold;
    color: #aa1f53;
}

.test-page-content {
    margin: 10px 20px;
    font-size: 1rem;
    line-height: 1.3;
}

.test-history-content {
    margin: 15px 12px;
    font-size: 1rem;
    line-height: 1.4;
}

.test-page h2 {
    margin: 20px;
    font-size: 1.6rem;
    color: #535353;
}

.test-page h3 {
    margin: 10px;
    font-size: 1.1rem;
    color: black;
}

/*
.test-full-content p {
    font-size: 1.1rem;
    line-height: 1.8;
}

.test-question {
    margin-bottom: 20px;
    font-size: 18px;
    color: #aa1f53;
}

.test-answer {
    margin-left: 20px;
    font-size: 16px;
}
 */

.correct {
    background-color: #d4edda; /* светло-зеленый */
}

.student-choice {
    background-color: #f8d7da; /* светло-розовый */
}

.both {
    background-color: #c3e6cb; /* если выбор совпадает с правильным */
}

.unanswered {
    background-color: #FFFACD;
}