html,
body.task-login {
    min-height: 100%;
    background: #071014 !important;
}

body.task-login {
    color-scheme: dark;
    background: #071014 !important;
    overflow-x: hidden;
}

body.task-login::before,
body.task-login::after {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
}

body.task-login::before {
    background: #071014 url("/images/auth-background.png?v=202608240336") center center / cover no-repeat !important;
    z-index: 0;
}

body.task-login::after {
    background:
        linear-gradient(180deg, rgba(5, 12, 15, 0.34) 0%, rgba(5, 12, 15, 0.44) 48%, rgba(5, 12, 15, 0.78) 100%),
        radial-gradient(circle at 50% 28%, rgba(0, 194, 255, 0.13), transparent 28rem);
    z-index: 1;
}

body.task-login #layout-content,
body.task-login #layout,
body.task-login #layout-menu,
body.task-login #login-form,
body.task-login #login-footer {
    position: relative;
    z-index: 2;
    background: transparent !important;
}

body.task-login #logo {
    width: min(260px, 72vw);
    max-height: 96px;
    object-fit: contain;
    margin-bottom: 2.4rem;
}

body.task-login #login-form .form-control,
body.task-login #login-form .input-group-text,
body.task-login #login-form button,
body.task-login #login-form input[type="submit"] {
    border-color: rgba(126, 236, 255, 0.55);
}

body.task-login #login-form input[type="submit"],
body.task-login #login-form button.btn-primary {
    background: #8edff0;
    border-color: #8edff0;
    color: #021217;
}

body.task-login input,
body.task-login .form-control,
body.task-login .input-group-text {
    background-color: rgba(17, 32, 36, 0.86) !important;
    color: #dff7ff !important;
}

@media (max-width: 640px), (prefers-color-scheme: light) {
    html,
    body.task-login {
        background: #071014 !important;
    }

    body.task-login::before {
        background-image: url("/images/auth-background.png?v=202608240336") !important;
        background-position: center top !important;
        background-size: cover !important;
    }

    body.task-login::after {
        background:
            linear-gradient(180deg, rgba(5, 12, 15, 0.22) 0%, rgba(5, 12, 15, 0.42) 46%, rgba(5, 12, 15, 0.82) 100%),
            radial-gradient(circle at 50% 18%, rgba(0, 194, 255, 0.15), transparent 22rem);
    }
}