/* Варианты ответа и ответы пользователя */
.answer-item {
    background: var(--light-color);
    border-radius: 8px;
    padding: 12px 16px;
    display: flex;
    align-items: center;
    border: 1.5px solid var(--border-color);
    justify-content: flex-start;
}
.answer-item.correct {
    border-color: var(--success-color);
    background: var(--answer-correct-bg, #e6f9ec);
    color: var(--answer-correct-text, #155724);
}
.answer-content {
    display: flex;
    align-items: center;
    gap: 10px;
}
.answer-letter {
    font-weight: bold;
    color: var(--primary-color);
    margin-right: 8px;
    font-size: 1.1em;
}
.answer-text.active {
    color: var(--text-color);
    text-align: left;
}
.correct-indicator {
    color: var(--success-color);
    font-weight: bold;
    margin-left: 10px;
}
.answer-tag {
    border-radius: 6px;
    padding: 0.15em 0.7em;
    font-size: 0.97em;
    font-weight: 500;
    background: #f5f0e6;
    color: #4a3b2f;
    border: 1px solid #bdbdbd;
    margin-right: 0.3em;
    margin-bottom: 0.2em;
    box-shadow: none;
}
.answer-tag.correct {
    background: #e6f9ec;
    color: #218838;
    border-color: #218838;
}
.answer-tag.incorrect {
    background: #ffeaea;
    color: #c82333;
    border-color: #c82333;
}
/* --- Стили для секции и списка ответов --- */
.answers-section {
    margin-bottom: 18px;
}
.answers-section h3 {
    font-size: 1.05em;
    color: var(--text-muted);
    margin-bottom: 8px;
}
.answers-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
/* --- Красивые стили для интерактивных кнопок-ответов --- */
.answer-btn.answer-item {
    width: 100%;
    background: var(--light-color);
    border-radius: 8px;
    border: 1.5px solid var(--border-color);
    box-shadow: 0 1px 6px var(--shadow-color);
    padding: 12px 16px;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1em;
    color: var(--text-color);
    cursor: pointer;
    transition: box-shadow 0.18s, border-color 0.18s, background 0.18s, color 0.18s;
    outline: none;
    position: relative;
    justify-content: flex-start;
}
.answer-btn.answer-item:hover, .answer-btn.answer-item:focus {
    box-shadow: 0 4px 16px var(--shadow-color);
    border-color: var(--primary-color);
    background: var(--hover-bg, #f8fafd);
    z-index: 1;
}
.answer-btn.answer-item.active {
    border-color: var(--primary-color);
    background: var(--primary-color-bg, #e6f0ff);
    color: var(--primary-color);
    box-shadow: 0 2px 12px var(--shadow-color);
}
.answer-btn.answer-item.correct {
    border-color: var(--success-color);
    background: var(--answer-correct-bg, #e6f9ec);
    color: var(--answer-correct-text, #155724);
}
.answer-btn.answer-item.incorrect {
    border-color: var(--danger-color, #c82333);
    background: #ffeaea;
    color: #c82333;
}
.answer-btn.answer-item:disabled {
    opacity: 0.7;
    cursor: default;
}
/* --- Кнопка подтвердить/следующий --- */
.btn-next {
    display: inline-block;
    background: var(--primary-color);
    color: var(--light-color);
    border: none;
    border-radius: 6px;
    padding: 10px 28px;
    font-size: 1.08em;
    font-weight: 600;
    margin-left: 10px;
    margin-top: 8px;
    cursor: pointer;
    transition: background 0.18s, color 0.18s, box-shadow 0.18s;
    box-shadow: 0 2px 8px var(--shadow-color);
}
.btn-next:disabled {
    background: var(--border-color);
    color: var(--text-muted);
    cursor: not-allowed;
    box-shadow: none;
}
.btn-next:hover:not(:disabled), .btn-next:focus:not(:disabled) {
    background: var(--primary-color-dark, #0056b3);
    color: var(--light-color);
}
/* --- Кнопка прервать --- */
.btn-abandon {
    display: inline-block;
    background: transparent;
    color: var(--danger-color, #c82333);
    border: 1.5px solid var(--danger-color, #c82333);
    border-radius: 6px;
    padding: 10px 22px;
    font-size: 1.02em;
    font-weight: 500;
    margin-right: 10px;
    margin-top: 8px;
    cursor: pointer;
    transition: background 0.18s, color 0.18s, border-color 0.18s;
}
.btn-abandon:hover, .btn-abandon:focus {
    background: var(--danger-color, #c82333);
    color: #fff;
    border-color: var(--danger-color, #c82333);
}