/*
 * Sign in / sign up / password pages. These use the admin (Metronic) bundle,
 * so this file is linked from each front/authentication view after it and
 * restyles them to match site-modern.css. Not loaded by the admin panel.
 */
:root {
    --mx-navy: #0a2161;
    --mx-navy-deep: #06163f;
    --mx-teal: #1faac6;
    --mx-teal-dark: #1690a9;
    --mx-aqua: #2ceae0;
    --mx-ink: #0f1f3d;
    --mx-text: #475569;
    --mx-muted: #64748b;
    --mx-line: #e2e8f0;
    --mx-font: "Inter", "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
}

body#kt_body,
body#kt_body h1, body#kt_body h2, body#kt_body label, body#kt_body input,
body#kt_body button, body#kt_body a, body#kt_body span, body#kt_body div {
    font-family: var(--mx-font);
}
body#kt_body {
    background: #fff;
    color: var(--mx-text);
    -webkit-font-smoothing: antialiased;
}

/* Brand panel: navy over the banner artwork (set per page via --mx-auth-img) */
body#kt_body .flex-lg-row-auto[style*="#0a2161"] {
    background-color: var(--mx-navy-deep) !important;
    background-image:
        linear-gradient(160deg, rgba(6, 22, 63, .92) 0%, rgba(10, 33, 97, .78) 55%, rgba(6, 22, 63, .94) 100%),
        var(--mx-auth-img, none);
    background-size: cover;
    background-position: center;
}
body#kt_body .center-logo img {
    height: 6rem !important;
    width: auto;
}
body#kt_body .center-logo h1 {
    margin-top: 1rem;
    padding-bottom: .5rem !important;
    font: 700 2.25rem/1.1 var(--mx-font) !important;
    letter-spacing: -.02em;
}
body#kt_body .mx-auth-tagline {
    max-width: 20rem;
    margin: 0 auto;
    text-align: center;
    font: 400 1rem/1.6 var(--mx-font);
    color: rgba(255, 255, 255, .78);
}
body#kt_body .back-btn {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, .12);
}
body#kt_body .back-btn:hover {
    background-color: rgba(255, 255, 255, .22);
}
body#kt_body .blak-text {
    font: 500 .9375rem/1 var(--mx-font);
    color: rgba(255, 255, 255, .85);
}

/* Form column */
body#kt_body form h1 {
    font: 700 1.875rem/1.2 var(--mx-font) !important;
    letter-spacing: -.02em;
    color: var(--mx-ink);
}
body#kt_body .text-c1 {
    color: var(--mx-ink);
}
body#kt_body .text-c2,
body#kt_body .link-primary {
    color: var(--mx-teal-dark) !important;
}
body#kt_body .link-primary:hover,
body#kt_body a.text-c2:hover {
    color: var(--mx-navy) !important;
}
body#kt_body .form-label {
    font: 500 .875rem/1.25rem var(--mx-font) !important;
    color: var(--mx-ink) !important;
}
body#kt_body .form-control.form-control-solid {
    min-height: 3rem;
    border-radius: .75rem;
    border: 1px solid var(--mx-line);
    background-color: #fff;
    color: var(--mx-ink);
    font: 400 .9375rem/1.4 var(--mx-font);
    transition: border-color .2s, box-shadow .2s;
}
body#kt_body .form-control.form-control-solid:focus {
    border-color: var(--mx-teal);
    background-color: #fff;
    box-shadow: 0 0 0 4px rgba(31, 170, 198, .15);
}
body#kt_body .fs-4 {
    font-size: 1rem !important;
}
body#kt_body .btn.btn-primary {
    min-height: 3rem;
    border-radius: 999px;
    background-color: var(--mx-teal) !important;
    border-color: var(--mx-teal) !important;
    font: 600 .9375rem/1 var(--mx-font);
    box-shadow: 0 6px 16px rgba(31, 170, 198, .28);
}
body#kt_body .btn.btn-primary:hover,
body#kt_body .btn.btn-primary:focus {
    background-color: var(--mx-teal-dark) !important;
    border-color: var(--mx-teal-dark) !important;
}
body#kt_body .btn.btn-light-primary {
    min-height: 3rem;
    border-radius: 999px;
    background: #f1f5f9;
    color: var(--mx-ink);
}
body#kt_body .btn.btn-light-primary:hover {
    background: #e2e8f0;
    color: var(--mx-ink);
}
body#kt_body .alert {
    border-radius: .75rem;
    font-size: .9375rem;
}
body#kt_body .form-check-input:checked {
    background-color: var(--mx-teal);
    border-color: var(--mx-teal);
}

@media (max-width: 991.98px) {
    body#kt_body .center-logo {
        padding: 1rem 0 2.5rem;
    }
    body#kt_body .center-logo img {
        height: 4rem !important;
    }
}
