.auth-creative-wrapper {
    background: #eef1f5;
}

.auth-creative-wrapper .auth-creative-inner .creative-card-wrapper {
    width: min(1000px, calc(100vw - 32px));
    max-width: min(1000px, calc(100vw - 32px));
    min-width: 0;
}

.auth-creative-wrapper .card {
    width: 100%;
    min-width: 0;
    border: 1px solid #e4e8ef;
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(40, 60, 80, 0.08);
}

.auth-creative-wrapper .creative-card-body {
    width: 100%;
    max-width: 100%;
    min-height: 540px;
}

.auth-creative-wrapper .row,
.auth-creative-wrapper [class*="col-"],
.auth-creative-wrapper form,
.auth-creative-wrapper .form-control {
    min-width: 0;
    max-width: 100%;
}

.auth-brand-logo img {
    height: 60px;
    width: auto;
    object-fit: contain;
}

.auth-hero-panel {
    min-height: 500px;
    padding: 24px;
}

.auth-hero-panel img {
    width: 100%;
    max-height: 500px;
    object-fit: cover;
    border-radius: 3px;
}

.auth-creative-wrapper .form-control {
    min-height: 46px;
    border-color: #dbe3ef;
    background-color: #eef4ff;
    color: #1f2f46;
}

.auth-creative-wrapper .form-control:focus {
    border-color: #d7bd51;
    box-shadow: 0 0 0 0.2rem rgba(245, 217, 107, 0.18);
}

.auth-primary-btn {
    min-height: 46px;
    border: 0;
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    background: linear-gradient(135deg, #f5d96b, #7e7e7e);
}

.auth-primary-btn:hover,
.auth-primary-btn:focus {
    color: #fff;
    background: linear-gradient(135deg, #e9ca55, #6f6f6f);
}

.auth-secondary-btn {
    min-height: 46px;
    font-weight: 700;
    color: #546272;
    border-color: #cfd7e3;
    background: #fff;
}

.auth-secondary-btn:hover,
.auth-secondary-btn:focus {
    color: #283c50;
    border-color: #d7bd51;
    background: #fff8df;
}

.auth-footer {
    border-top: 1px solid #edf0f4;
}

@media (max-width: 991.98px) {
    html body .auth-creative-wrapper .auth-creative-inner .creative-card-wrapper {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        min-width: 0 !important;
    }

    .auth-creative-wrapper .card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 16px auto;
    }

    .auth-creative-wrapper .creative-card-body {
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto;
        padding: 24px !important;
    }

    .auth-hero-panel {
        min-height: auto;
        padding: 18px;
    }

    .auth-hero-panel img {
        max-height: 320px;
    }

    .auth-creative-wrapper form .justify-content-between {
        gap: 12px;
        flex-wrap: wrap;
    }
}