/* Drag and Drop Styles */

/* Draggable items */
.draggable {
    cursor: grab;
}

.draggable:active {
    cursor: grabbing;
}

/* Styles for the task being dragged */
.dragging {
    opacity: 0.6;
    border: 2px dashed var(--primary-color) !important;
    background-color: var(--hover-color) !important;
}

/* Styles for category drop targets */
.drop-target {
    border: 2px dashed var(--primary-color) !important;
    background-color: rgba(var(--primary-rgb), 0.1) !important;
}

.drop-target-hover {
    background-color: rgba(var(--primary-rgb), 0.2) !important;
}

/* Drag feedback element */
.drag-feedback {
    padding: 8px 12px;
    background-color: var(--primary-color);
    color: white;
    border-radius: 4px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    pointer-events: none;
    z-index: 9999;
}

/* Animation for successful drop */
@keyframes successDrop {
    0% { 
        background-color: rgba(var(--success-rgb), 0.3);
        border-color: var(--success-color);
    }
    100% { 
        background-color: var(--bg-color);
        border-color: var(--border-color);
    }
}

.success-drop {
    animation: successDrop 1s ease-out;
}