.dropzone {
    border: 1px solid rgba(0, 40, 100, 0.2);
    min-height: 4.5rem;
}

.dropzone.disabled, .dropzone.readonly {
    background-color: #f8f9fa;
}

.dropzone .dz-preview.dz-image-preview .dz-details {
    cursor: move;
}
.dropzone .dz-preview {
    visibility: hidden;
}
.dropzone .dz-progress {
    visibility: visible;
}

.dropzone .dz-message {
    margin: 0 auto;
}
.dropzone.dz-started .dz-message {
    display: block;
}
.dropzone.disabled .dz-message, .dropzone.readonly .dz-message {
    display: none;
}

.dropzone.disabled .dz-preview, .dropzone.readonly .dz-preview {
    opacity: 0.5;
}
.dropzone .dz-preview .dz-image, .dropzone .dz-preview.dz-file-preview .dz-image {
    border-radius: 0.4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; 
}

.dropzone.disabled .dz-preview .dz-image, .dropzone.disabled .dz-preview.dz-file-preview .dz-image, .dropzone.readonly .dz-preview .dz-image, .dropzone.readonly .dz-preview.dz-file-preview .dz-image {
    border-radius: 0.4rem;
}
.dropzone.dz-clickable {
    cursor: auto;
}
.dropzone .dz-preview .dz-remove i {
    cursor: pointer;
}

.dropzone.disabled .dz-remove, .dropzone.readonly .dz-remove {
    display: none;
}

.dropzone .dz-preview .dz-image img {
    height: 100%;
    object-fit: cover;
}

.dropzone .dz-remove i {
    border: 1px solid;
    border-radius: 50%;
}

.dropzone .dz-remove i::before {
    padding-top:2px;
}

[data-bs-theme=dark] .dropzone .dz-preview.dz-image-preview {
   background: inherit;
}

[data-bs-theme=dark] .dropzone {
    border: 1px solid rgba(78, 78, 79, 0.3);
}

[data-bs-theme=dark] .dropzone.disabled, [data-bs-theme=dark] .dropzone.readonly {
    background-color: inherit;
    color: inherit;
}