/* External styles keep login and security layouts compatible with CSP. */

html.front-login-page {
    min-height: 100%;
}
body.auth.front-login-bg {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: 100vh;
    min-height: 100dvh;
    margin: 0;
    padding: 24px;
    background: transparent !important;
    position: relative;
}
body.front-login-bg::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background-image:
        linear-gradient(rgba(7,16,30,.12), rgba(7,16,30,.12)),
        url('/static/front-login-bg.png') !important;
    background-position: center center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
}
html.front-login-page {
    background: url('/static/front-login-bg.png') center center / cover no-repeat fixed !important;
}
body.front-login-bg .authcard {
    flex: 0 0 auto;
    width: min(450px, 100%);
    /* Auto margins center when space allows and collapse on short screens. */
    margin: auto;
    background: rgba(18,34,58,.88);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
@media(max-width:600px){body.auth.front-login-bg{padding:16px}}

.fg-mt-16{margin-top:16px}
.fg-mt-14{margin-top:14px}
.fg-mt-10{margin-top:10px}
.fg-mt-18{margin-top:18px}
.fg-my-18{margin:18px 0}
.fg-my-12{margin:12px 0}
.fg-my-15{margin:15px 0}
.fg-break-any{overflow-wrap:anywhere;word-break:break-all}
.fg-recovery-codes{font-family:monospace;line-height:1.9;font-size:16px;overflow-wrap:anywhere}
main.fg-auth-shell{max-width:520px;margin:70px auto;padding:20px}
.fg-recovery-list{margin:20px 0;font-family:monospace;font-size:17px;line-height:2;overflow-wrap:anywhere}
.fg-auth-error{font-weight:700;color:#ffb4bd}
.fg-qr-wrap{margin:20px 0;text-align:center}
.fg-auth-qr{width:220px;height:220px;max-width:100%;background:#fff;padding:10px;border-radius:8px}
.fg-secret-key{margin-top:10px;overflow-wrap:anywhere;word-break:break-all}
@media(max-width:600px){main.fg-auth-shell{margin:24px auto;padding:16px}}
