.image-preview-container {
    position: relative;
    display: inline-block
}

.image-preview {
    transition: transform .3s ease-in-out
}

.image-preview:hover {
    filter: grayscale(50%) brightness(80%) contrast(80%);
    transform: scale(1.05);
    cursor: pointer
}

.image-text {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    background: var(--bs-dark);
    padding: 5px;
    border-radius: 5px;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    cursor: pointer
}

.image-preview-container:hover .image-text {
    opacity: 1
}

.custom-preview-container {
    margin-top: 10px;
}

.custom-preview-video {
    max-width: 200px;
    max-height: 200px;
}

.custom-preview-image {
    max-width: 200px;
    max-height: 200px;
}