/* ------------------------------------------------------------
   Login-Seite
------------------------------------------------------------ */

.snlm_login_page {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 100vh;

    padding: var(--snlm_spacing_lg);

    background:
        radial-gradient(
            circle at top,
            var(--snlm_color_surface_light) 0,
            var(--snlm_color_bg) 48%
        );
}


/* ------------------------------------------------------------
   Login-Container
------------------------------------------------------------ */

.snlm_login {
    width: min(100%, var(--snlm_login_width));
}


/* ------------------------------------------------------------
   Login-Box
------------------------------------------------------------ */

.snlm_login_box {
    padding: 32px;

    background: var(--snlm_color_surface);

    border: 1px solid var(--snlm_color_border);
    border-radius: var(--snlm_radius);

    box-shadow: var(--snlm_shadow);
}


/* ------------------------------------------------------------
   Login-Icon
------------------------------------------------------------ */

.snlm_login_logo {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 58px;
    height: 58px;

    margin: 0 auto var(--snlm_spacing_md);

    background: var(--snlm_color_surface_light);
    color: var(--snlm_color_primary);

    border: 1px solid var(--snlm_color_border_light);
    border-radius: var(--snlm_radius);

    font-size: 1.6rem;
}


/* ------------------------------------------------------------
   Login-Kopf
------------------------------------------------------------ */

.snlm_login_header {
    margin-bottom: var(--snlm_spacing_lg);

    text-align: center;
}

.snlm_login_title {
    margin: 0 0 4px;

    font-size: var(--snlm_font_size_xl);
    line-height: 1.25;
}

.snlm_login_subtitle {
    margin: 0;

    color: var(--snlm_color_text_muted);

    font-size: var(--snlm_font_size_sm);
}


/* ------------------------------------------------------------
   Login-Footer
------------------------------------------------------------ */

.snlm_login_footer {
    margin-top: var(--snlm_spacing_lg);

    color: var(--snlm_color_text_muted);

    font-size: var(--snlm_font_size_xs);
    text-align: center;
}