/*

date:  20.10.2025

*/

@font-face {
    font-family: 'Circular';
    src: url('../fonts/CircularXXWeb-Book.woff2') format('woff2'),
        url('../fonts/CircularXXWeb-Book.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Circular';
    src: url('../fonts/CircularXXWeb-Medium.woff2') format('woff2'),
        url('../fonts/CircularXXWeb-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Circular';
    src: url('../fonts/CircularXXWeb-Bold.woff2') format('woff2'),
        url('../fonts/CircularXXWeb-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

:root {
    --login-font: 'Circular', sans-serif;
    --login-bg: #FAFAF8;
    --login-bg-img: url(../admin/login-bg.svg);
    --login-bg-repeat: no-repeat;
    --login-bg-position: center top;
    --login-bg-size: 50vw 60vh;
    --login-card-bg: rgba(255, 255, 255, 0.8);
    --login-card-border-rad: 32px;
    --login-card-border: rgba(255, 255, 255, 0.4);
    --login-card-shadow: 0 0.8rem 1.6rem rgba(20, 40, 60, 0.04),
        0 1.6rem 3.2rem rgba(20, 40, 60, 0.04);
    --login-card-filter: blur(12px);
    --login-form-clr: #00283C;

    --login-form-link-clr: #00C8DC;

    --login-btn-bg: #00283C;
    --login-btn-bg-hover: rgba(3, 41, 60, 0.90);
    --login-btn-clr: #FFFFFF;
    --login-btn-clr-hover: #FFFFFF;
    --login-btn-border: none;
    --login-btn-border-hover: none;
    --login-btn-brd-rad: 30px;
    --login-btn-padding: 8px 24px;

    --login-logo: none;
    --login-logo-pos-h: center;
    --login-logo-height: 80px;
    --login-logo-mb: 20px;
    --login-logo-display: block;

    --login-link-clr: #00C8DC;
}
/* login page */
body.login {
    background-color: var(--login-bg);
    background-image: var(--login-bg-img);
    background-repeat: var(--login-bg-repeat);
    background-position: var(--login-bg-position);
    background-size: var(--login-bg-size);
    font-family: var(--login-font);
}

.login #login,
.login .login_center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0;
}

body.login.wp-core-ui .button-primary {
    background: var(--login-btn-bg);
    border-color: var(--login-btn-border);
    color: var(--login-btn-clr);
    border-radius: var(--login-btn-brd-rad);
    padding: var(--login-btn-padding);
}
body.login.wp-core-ui .button-primary:hover {
    background: var(--login-btn-bg-hover);
    border-color: var(--login-btn-border-hover);
    color: var(--login-btn-clr-hover);
}

.login h1,
.login h1.admin-email__heading {
    position: relative;
    z-index: 10;
    display: var(--login-logo-display);
    color: var(--login-form-clr);
    border: none;
    width: auto;
    height: var(--login-logo-height);
    margin-bottom: var(--login-logo-mb);
    background-image: var(--login-logo);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: var(--login-logo-pos-h);
}

h1.screen-reader-text {
    display: none;
}

.login h1 a,
.login h1.wp-login-logo a {
    display: none;
}

.login .language-switcher {
    display: none;
}

.login .privacy-policy-page-link {
    display: none;
}

.login form,
.login #loginform,
.login #lostpasswordform {
    z-index: 5;
    display: flex;
    flex-direction: column;
    color: var(--login-form-clr);
    margin: 0;
    -webkit-backdrop-filter: var(--login-card-filter);
    backdrop-filter: var(--login-card-filter);
    background-color: var(--login-card-bg);
    border: var(--login-card-border);
    border-radius: var(--login-card-border-rad,
            0px);
    box-shadow: var(--login-card-shadow);
}

.login form > * {
    order: 1;
    color: var(--login-form-clr);
}

.login form {
    order: 1;
    color: var(--login-form-link-clr);
}


.login p#nav {
    display: block;
}
.login #backtoblog,
.login #nav {
    padding-inline: 0;
    margin-bottom: 8px;
    text-align: center;
}
.login #backtoblog a,
.login #nav a,
.login .privacy-policy-page-link a {
    position: relative;
    z-index: 10;
    text-decoration: none;
    color: var(--login-link-clr);
}

.login #nav {
    margin-top: 16px;
}

.login #backtoblog,
.login .privacy-policy-page-link {
    margin-top: 8px;
}

/* 2fa Wordfence */
#wfls-prompt-overlay {
    color: var(--login-form-link-clr);
    background: var(--login-card-bg);
}

/* trusona */
.login form > div:has(.trusona-employee-button) {
    order: 100;
    margin-top: 20px;
}

.login form:has(.trusona-employee-button) > .submit,
.login #loginform:has(.trusona-employee-button) > .submit {
    padding-bottom: 20px;
    border-bottom: 1px dashed var(--login-form-clr);
    border-radius: 0;
}

.trusona-easy-login-button,
.trusona-login-button,
.trusona-no-passwords-login-button,
.no-passwords-login-button,
.trusona-consumer-button,
.trusona-employee-button {
    border-radius: 4px;
    overflow: hidden;
    box-shadow: none;
}

.login .trusona-employee-button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    height: auto;
    width: auto;
    margin: 0 auto;
    padding: 0 12px;
    color: #2271b1;
    border-color: #2271b1;
    border-style: solid;
    border-width: 1px;
    border-radius: 3px;
    background: #f6f7f7;
    text-indent: 0 !important;
    font-size: 13px;
    font-weight: 400;
    line-height: 2.30769231;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    text-decoration: none;
    text-shadow: none;
}
.login .trusona-employee-button:focus {
    background: #f6f7f7;
    border-color: #3582c4;
    color: #0a4b78;
    box-shadow: 0 0 0 1px #3582c4;
    outline: 2px solid transparent;
    outline-offset: 0;
}
.login .trusona-employee-button:hover {
    background: #f0f0f1;
    border-color: #0a4b78;
    color: #0a4b78;
}
.login .trusona-employee-button:before,
.login .trusona-employee-button::after {
    display: none;
}