.fcpress-header-surface {
    background-color: rgba(0, 0, 0, 0.9);
}

.fc-dark {
    background-color: #2c2f18;
}

.fc-toast__panel {
    max-height: calc(var(--fcpress-viewport-height, 100svh) * 0.85);
}

body.login.fcpress-header-surface {
    min-height: 100vh;
}

body.login.fcpress-header-surface #login {
    padding-top: 1rem;
    width: min(25rem, calc(100% - 2rem));
}

body.login.fcpress-header-surface #nav,
body.login.fcpress-header-surface #backtoblog,
body.login.fcpress-header-surface .privacy-policy-page-link {
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.14);
    margin: 0 auto 0.85rem;
    max-width: none;
    padding: 0;
    text-align: left;
}

body.login.fcpress-header-surface #backtoblog a,
body.login.fcpress-header-surface #nav a,
body.login.fcpress-header-surface .privacy-policy-page-link a {
    align-items: center;
    color: #1f2937;
    display: flex;
    min-height: 2.75rem;
    padding: 0.7rem 0.95rem;
    text-decoration: none;
}

body.login.fcpress-header-surface #backtoblog a:hover,
body.login.fcpress-header-surface #nav a:hover,
body.login.fcpress-header-surface .privacy-policy-page-link a:hover {
    color: #111827;
    text-decoration: none;
}

@media (min-width: 480px) {
    body.login.fcpress-header-surface #login {
        display: grid;
        gap: 1rem;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: min(28rem, calc(100% - 2rem));
    }

    body.login.fcpress-header-surface #login > h1,
    body.login.fcpress-header-surface #login > form,
    body.login.fcpress-header-surface #login > .message,
    body.login.fcpress-header-surface #login > #login_error,
    body.login.fcpress-header-surface #login > .notice,
    body.login.fcpress-header-surface #login > .success,
    body.login.fcpress-header-surface #login > .forgetmenot,
    body.login.fcpress-header-surface #login > p.submit,
    body.login.fcpress-header-surface #login > .privacy-policy-page-link {
        grid-column: 1 / -1;
    }

    body.login.fcpress-header-surface #nav,
    body.login.fcpress-header-surface #backtoblog {
        margin: 0;
        justify-self: center;
        width: 10.75rem;
    }
}
