/* PivotLab: the new project form (partials/form_new_project.php) - the old components/form_new_project.php <style>. */

[data-pl-view="new_project"] .dropzone {
    background-color: #fff;
    border: var(--bs-border-width) solid var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    padding: 2rem;
    cursor: pointer;
}

[data-pl-view="new_project"] .dropzone.dragover {
    border-color: var(--bs-primary);
    background-color: #f8f9ff;
}

[data-pl-view="new_project"] .dropzone img.preview {
    max-width: 400px;
    width: 100%;
    height: auto;
    border-radius: 8px;
}

[data-pl-view="new_project"] .preview-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

[data-pl-view="new_project"] .preview-item {
    position: relative;
    width: 100px;
    height: 100px;
}

[data-pl-view="new_project"] .preview-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
}

[data-pl-view="new_project"] .preview-item button {
    position: absolute;
    top: 4px;
    right: 4px;
    background: rgba(255, 255, 255, 0.7);
    border: none;
    cursor: pointer;
    border-radius: 50%;
    padding: 2px 5px;
    width: 26px;
    height: 26px;
}