/* Program Editor Styles */

#dropZone {
    border: 3px dashed #ccc;
    border-radius: 10px;
    padding: 60px;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: #f8f9fa;
}

#dropZone:hover {
    border-color: #0d6efd;
    background-color: #e7f1ff;
}

#dropZone.drag-over {
    border-color: #0d6efd;
    background-color: #d0e8ff;
    transform: scale(1.02);
}

#dropZone i {
    font-size: 48px;
    color: #6c757d;
    margin-bottom: 20px;
}

#dropZone:hover i {
    color: #0d6efd;
}

#fileInput {
    display: none;
}

.image-item {
    cursor: move;
    transition: all 0.2s ease;
}

.image-item:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

.image-item.dragging {
    opacity: 0.5;
    transform: rotate(2deg);
}

.img-thumbnail {
    object-fit: cover;
}

.form-label {
    font-size: 0.85rem;
    margin-bottom: 0.25rem;
}

.image-item .card-body {
    padding: 0.75rem;
}