.openmodal {
    --openmodal-primary-color: var(--gps-primary, var(--bs-primary, #0d6efd));
    --openmodal-success-color: var(--gps-success, var(--bs-success, #198754));
    --openmodal-danger-color: var(--gps-danger, var(--bs-danger, #dc3545));
    --openmodal-warning-color: var(--gps-warning, var(--bs-warning, #ffc107));
    --openmodal-info-color: var(--gps-info, var(--bs-info, #0dcaf0));
    --openmodal-secondary-color: var(--gps-secondary, var(--bs-secondary, #6c757d));
    --openmodal-primary-bg: var(--gps-primary-gradient, var(--openmodal-primary-color));
    --openmodal-success-bg: var(--gps-success-gradient, var(--openmodal-success-color));
    --openmodal-danger-bg: var(--gps-danger-gradient, var(--openmodal-danger-color));
    --openmodal-warning-bg: var(--gps-warning-gradient, var(--openmodal-warning-color));
    --openmodal-info-bg: var(--gps-info-gradient, var(--openmodal-info-color));
    --openmodal-secondary-bg: var(--gps-secondary-gradient, var(--openmodal-secondary-color));
}

.openmodal .openmodal-box.openmodal-type-blue {
    border-top-color: var(--openmodal-primary-color) !important;
}

.openmodal .openmodal-box.openmodal-type-green {
    border-top-color: var(--openmodal-success-color) !important;
}

.openmodal .openmodal-box.openmodal-type-red,
.openmodal .openmodal-box.openmodal-type-danger {
    border-top-color: var(--openmodal-danger-color) !important;
}

.openmodal .openmodal-box.openmodal-type-orange,
.openmodal .openmodal-box.openmodal-type-warning {
    border-top-color: var(--openmodal-warning-color) !important;
}

.openmodal-dialog {
    max-width: none;
}

.openmodal-dialog.openmodal-size-small {
    max-width: min(calc(100vw - 1rem), 26rem);
    width: min(calc(100vw - 1rem), 26rem);
}

.openmodal-dialog.openmodal-size-medium {
    max-width: min(calc(100vw - 1rem), 44rem);
    width: min(calc(100vw - 1rem), 44rem);
}

.openmodal-dialog.openmodal-size-large {
    max-width: min(calc(100vw - 1rem), 72rem);
    width: min(calc(100vw - 1rem), 72rem);
}

.openmodal-dialog[class*="openmodal-col-"] {
    max-width: none;
    width: min(calc(100vw - 1rem), var(--openmodal-width, 44rem));
}

.openmodal .modal-content.openmodal-box {
    border-top: 0.45rem solid var(--openmodal-primary-color);
    border-radius: 0.5rem;
    box-shadow: 0 0.75rem 2.5rem rgba(20, 34, 48, 0.24);
    overflow: hidden;
    position: relative;
}

.openmodal .modal-header {
    align-items: center;
    gap: 1rem;
}

.openmodal .modal-title {
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.25;
}

.openmodal .openmodal-floating-close {
    background-color: rgba(255, 255, 255, 0.88);
    border-radius: 50%;
    padding: 0.55rem;
    position: absolute;
    right: 0.85rem;
    top: 0.85rem;
    z-index: 6;
}

.openmodal .openmodal-content-pane {
    max-height: calc(100dvh - 12rem);
}

.openmodal .openmodal-buttons {
    gap: 0.35rem;
    justify-content: flex-end;
}

.openmodal .openmodal-buttons .btn {
    font-weight: 600;
}

@media (max-width: 575.98px) {
    .openmodal .modal-dialog.openmodal-dialog {
        align-items: stretch;
        margin: 0;
        max-width: 100dvw;
        min-height: 100dvh;
        width: 100dvw;
    }

    .openmodal .modal-content.openmodal-box {
        border-radius: 0;
        min-height: 100dvh;
    }

    .openmodal .openmodal-content-pane {
        flex: 1 1 auto;
        max-height: none;
        overflow-y: auto;
    }

    .openmodal .openmodal-buttons {
        justify-content: stretch;
    }

    .openmodal .openmodal-buttons .btn {
        flex: 1 1 auto;
        min-width: 0;
    }

    .openmodal-dialog[class*="openmodal-col-"] {
        max-width: 100dvw;
        width: 100dvw;
    }
}

.openmodal-col-2 { --openmodal-width: 16.666667vw; }
.openmodal-col-3 { --openmodal-width: 25vw; }
.openmodal-col-4 { --openmodal-width: 33.333333vw; }
.openmodal-col-5 { --openmodal-width: 41.666667vw; }
.openmodal-col-6 { --openmodal-width: 50vw; }
.openmodal-col-7 { --openmodal-width: 58.333333vw; }
.openmodal-col-8 { --openmodal-width: 66.666667vw; }
.openmodal-col-10 { --openmodal-width: 83.333333vw; }
.openmodal-col-12 { --openmodal-width: calc(100vw - 1rem); }

@media (min-width: 576px) {
    .openmodal-col-sm-2 { --openmodal-width: 16.666667vw; }
    .openmodal-col-sm-3 { --openmodal-width: 25vw; }
    .openmodal-col-sm-4 { --openmodal-width: 33.333333vw; }
    .openmodal-col-sm-5 { --openmodal-width: 41.666667vw; }
    .openmodal-col-sm-6 { --openmodal-width: 50vw; }
    .openmodal-col-sm-7 { --openmodal-width: 58.333333vw; }
    .openmodal-col-sm-8 { --openmodal-width: 66.666667vw; }
    .openmodal-col-sm-10 { --openmodal-width: 83.333333vw; }
    .openmodal-col-sm-12 { --openmodal-width: calc(100vw - 1rem); }
}

@media (min-width: 768px) {
    .openmodal-col-md-2 { --openmodal-width: 16.666667vw; }
    .openmodal-col-md-3 { --openmodal-width: 25vw; }
    .openmodal-col-md-4 { --openmodal-width: 33.333333vw; }
    .openmodal-col-md-5 { --openmodal-width: 41.666667vw; }
    .openmodal-col-md-6 { --openmodal-width: 50vw; }
    .openmodal-col-md-7 { --openmodal-width: 58.333333vw; }
    .openmodal-col-md-8 { --openmodal-width: 66.666667vw; }
    .openmodal-col-md-10 { --openmodal-width: 83.333333vw; }
    .openmodal-col-md-12 { --openmodal-width: calc(100vw - 1rem); }
}

@media (min-width: 992px) {
    .openmodal-col-lg-2 { --openmodal-width: 16.666667vw; }
    .openmodal-col-lg-3 { --openmodal-width: 25vw; }
    .openmodal-col-lg-4 { --openmodal-width: 33.333333vw; }
    .openmodal-col-lg-5 { --openmodal-width: 41.666667vw; }
    .openmodal-col-lg-6 { --openmodal-width: 50vw; }
    .openmodal-col-lg-7 { --openmodal-width: 58.333333vw; }
    .openmodal-col-lg-8 { --openmodal-width: 66.666667vw; }
    .openmodal-col-lg-10 { --openmodal-width: 83.333333vw; }
    .openmodal-col-lg-12 { --openmodal-width: calc(100vw - 1rem); }
}

.openmodal .openmodal-buttons button.btn-blue,
.openmodal .openmodal-buttons button.btn-primary {
    background: var(--openmodal-primary-bg) !important;
    color: #fff !important;
}

.openmodal .openmodal-buttons button.btn-green,
.openmodal .openmodal-buttons button.btn-success {
    background: var(--openmodal-success-bg) !important;
    color: #fff !important;
}

.openmodal .openmodal-buttons button.btn-info {
    background: var(--openmodal-info-bg) !important;
    color: #fff !important;
}

.openmodal .openmodal-buttons button.btn-orange,
.openmodal .openmodal-buttons button.btn-warning {
    background: var(--openmodal-warning-bg) !important;
    color: #fff !important;
}

.openmodal .openmodal-buttons button.btn-red,
.openmodal .openmodal-buttons button.btn-danger {
    background: var(--openmodal-danger-bg) !important;
    color: #fff !important;
}

.openmodal .openmodal-buttons button.btn-secondary {
    background: var(--openmodal-secondary-bg) !important;
    color: #fff !important;
}

.openmodal .openmodal-buttons button.btn-default {
    background: #e8edf2 !important;
    color: #27333f !important;
}

.openmodal .openmodal-buttons button:hover,
.openmodal .openmodal-buttons button:focus {
    filter: brightness(0.95);
}
