/* Login page: full-screen landscape behind a white logo panel and login card */
body.task-login {
    background: #1f3b1f url(images/background.jpg) center center / cover no-repeat fixed;
}

body.task-login #layout,
body.task-login #layout-content {
    background: transparent;
}

body.task-login #logo {
    background: rgba(255, 255, 255, .92);
    border-radius: 8px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .35);
    padding: .75rem 1.5rem;
    max-height: 120px;
    width: auto;
    box-sizing: content-box;
}

body.task-login #login-form {
    background: rgba(255, 255, 255, .92);
    border-radius: 8px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, .35);
    padding: 1.5rem 2rem 1rem;
    color: #333;
}

/* The logo has a white background, so keep its panel white and untinted */
html.dark-mode body.task-login #logo {
    background: #fff;
    filter: none;
    opacity: 1;
}

html.dark-mode body.task-login #login-form {
    background: rgba(33, 41, 44, .92);
    color: #c5d1d3;
}