.question-card {
    background: var(--color-white);
    border-radius: 5rem;
    box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.07);
    padding: 3rem;
    margin-bottom: 1.25rem;

    & .question-card-header {
        gap: 1rem;
        margin-bottom: 0.25rem;
    }

    & .question-text {
        flex: 1;
        text-align: left;
        font-size: 2.4rem;

        @media (min-width: 992px) {
            font-size: 3rem;
        }
    }

    & .question-badge {
        font-size: 1.4rem;
        white-space: nowrap;
        padding-top: 0.125rem;
    }
}

.answers-list {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;

    & li {
        margin-bottom: 0.5rem;
    }

    & .answer-label {
        display: flex;
        align-items: center;
        gap: 0.75rem;
        padding: 0.625rem 1rem;
        border-radius: 1rem;
        cursor: pointer;
        transition: background 0.15s;
        font-size: 2rem;

        & input {
            position: absolute;
            opacity: 0;
            width: 0;
            height: 0;
        }

        & .answer-dot {
            flex-shrink: 0;
            width: 2rem;
            height: 2rem;
            border-radius: 50%;
            border: 0.125rem solid var(--color-blue-light);
            background: var(--color-white);
            transition: background 0.15s, border-color 0.15s;
        }

        &:hover {
            background: var(--color-blue-light);
        }

        &:has(input:checked) {
            background: var(--color-blue-light);

            & .answer-dot {
                background: var(--color-brand);
                border-color: var(--color-brand);
            }

            &:hover {
                background: var(--color-blue-light);
            }
        }
    }
}

.examen-nav {
    display: flex;
    justify-content: center;
    align-items: center;
}

.review-summary {
    margin: 1.5rem 0;

    p {
        font-size: 3rem;
        text-align: center;

        &.review-unanswered {
            font-size: 2rem;
        }
    }
}

.disclaimer {
    list-style-type: none;

    li {
        padding-bottom: 0.5rem;
    }
}

.result {
    p {
        color: var(--color-red);
        text-align: center;
        font-size: 3rem;

        &.score {
            font-size: 10rem;
            font-weight: bold;
        }
    }

    &.passed p {
        color: var(--color-green-check);
    }
}