.wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.delete-image-preview {
    top: 0.25rem;
    right: 0.5rem;
    backdrop-filter: brightness(1.618) blur(5px);
}

input[type="file"] + * > img[src]:not([src=""]) {
    margin-left: auto;
    margin-top: 0.25rem;
    margin-right: 0.25rem;
    max-width: calc(100% - 0.5rem);
}

.d-flex[style*="display:block"],
.d-flex[style*="display: block"],
.flex-column[style*="display:block"],
.flex-column[style*="display: block"],
.flex-row[style*="display:block"],
.flex-row[style*="display: block"],
.row[style*="display:block"],
.row[style*="display: block"] {
    display: flex !important;
}

@media screen and (width < 576px) {
    .form-switch:has([class*="col-sm-"]) {
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
    }

    .form-switch > [class*="col-sm-"] {
        width: auto;
    }

    .form-switch > label[class*="col-sm-"] {
        flex: 1 0 auto;
    }

    .form-switch > div[class*="col-sm-"] {
        flex: 0 0 3rem;
    }
}

@media screen and (width < 768px) {
    .form-switch:has([class*="col-md-"]) {
        flex-direction: row;
        flex-wrap: wrap;
        width: 100%;
    }

    .form-switch > [class*="col-md-"] {
        width: auto;
    }

    .form-switch > label[class*="col-md-"] {
        flex: 1 0 auto;
    }

    .form-switch > div[class*="col-md-"] {
        flex: 0 0 3rem;
    }
}