/* ============================================================
   drag_drop_bank — визуальные эффекты для перетаскиваемых плиток.
   Добавить в конец static/js/tests/css/standard_test_style.css
   (или app.css — куда обычно кладутся общие стили теста).
   Цвет/подсветку правильного/неправильного ответа НЕ трогаем —
   это уже управляется существующими классами .answer.correct/.incorrect.
============================================================ */

.drag-tile {
    transition: transform .1s ease, box-shadow .1s ease, opacity .1s ease;
}

.drag-tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.12);
}

.drag-tile.dragging {
    opacity: 0.4;
}

.drag-drop-slot.drag-over {
    background: #eef0ff !important;
    border-color: #4c5fd5 !important;
}

.drag-drop-slot.filled {
    color: #333;
}

@media (max-width: 767px) {
    .drag-tile {
        padding: 12px 16px !important;
        font-size: 1rem !important;
    }
}