.sortable-selected {
    background-color: rgba(52, 152, 219, 0.15);
    border: 2px solid #3498db; 
    box-shadow: 0 0 6px rgba(52, 152, 219, 0.4); 
    z-index: 10; 
}

/* Ghost class for the dragging preview */
.sortable-ghost {
    opacity: 0.6;
    background-color: rgba(52, 152, 219, 0.2);
    border: 2px dashed #3498db !important; /* Dashed blue border */
    box-shadow: 0 0 10px rgba(52, 152, 219, 0.3);
}

/* Class for the actual dragging item */
.sortable-drag {
    opacity: 0.9;
    background-color: white;
    border: 2px solid #3498db;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    transform: scale(1.05);
    z-index: 1000;
}