#image-modal .modal-body .modal-gallery {
    display: flex;
    /* justify-content: center; */
    align-items: center;
    flex-wrap: nowrap;

    width: 100%;
    height: fit-content;
    max-width: unset;
    overflow: auto;
}

#image-modal .modal-body .modal-gallery img {
    min-width: 100%;
    height: auto;
    padding: 0 6px;
}

.file-gallery {
    display: flex;
    flex-wrap: wrap;
}

.file-gallery .file {
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    transition: all 0.3s ease-in-out;
}

.file-gallery .file:hover {
    background-color: var(--bs-primary);
}

.file-gallery .file i {
    font-size: 32px;
    transition: all 0.3s ease-in-out;
}

.file-gallery .file span {
    color: var(--bs-primary);
}

.file-gallery .file:hover i,
.file-gallery .file:hover span {
    color: white;
}