/* ==========================================================================
   Sign in / register / password pages, restyled to match the public site.
   Overrides the sb-admin-pro theme without touching the markup or the JS
   hooks (ids and classes on the forms are unchanged).
   ========================================================================== */

body.gr-auth {
    font-family: var(--gr-sans);
    color: var(--gr-body);
    background:
        radial-gradient(1100px 520px at 82% -12%, #e9f0fb 0%, rgba(233, 240, 251, 0) 62%),
        radial-gradient(760px 420px at 6% 8%, #fdf3e6 0%, rgba(253, 243, 230, 0) 60%),
        var(--gr-cream) !important;
    min-height: 100vh;
}

/* ---------- brand: centred, and still a link back to the public site ---------- */
.auth-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 11px;
    width: fit-content;
    margin: 0 auto;
    padding: 34px 20px 0;
    color: var(--gr-ink);
    font-weight: 800;
    font-size: 1.35rem;
    letter-spacing: -.02em;
    text-decoration: none;
    transition: opacity .18s ease;
}

.auth-brand:hover, .auth-brand:focus { color: var(--gr-navy); text-decoration: none; opacity: .88; }
.auth-brand:focus-visible { outline: 3px solid #8fb4ea; outline-offset: 3px; border-radius: 10px; }
.auth-brand__mark { width: 38px; height: 38px; flex: none; }

/* ---------- card ---------- */
.gr-auth .card {
    border: 1px solid var(--gr-line);
    border-radius: 22px;
    box-shadow: var(--gr-shadow-md);
    overflow: hidden;
    animation: gr-auth-in .55s cubic-bezier(.22, .8, .3, 1) both;
}

@keyframes gr-auth-in { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

.gr-auth .card-body { padding: 34px 36px; }
.gr-auth .card-body.p-5 { padding: 34px 36px !important; }
.gr-auth .card hr { border-color: var(--gr-line); }

.gr-auth .h3, .gr-auth h3, .gr-auth h1 {
    font-family: var(--gr-sans);
    color: var(--gr-ink);
    font-weight: 700 !important;
    letter-spacing: -.02em;
}

.gr-auth .card-body.text-center .h3 { font-size: 1.7rem; margin-bottom: 6px; }
.gr-auth .text-custom { font-size: 1.05rem; color: var(--gr-ink); font-weight: 700; }

/* ---------- fields ---------- */
.gr-auth label, .gr-auth .text-gray-600 {
    color: var(--gr-muted) !important;
    font-weight: 600;
    font-size: .82rem !important;
    letter-spacing: .02em;
    margin-bottom: 6px;
}

.gr-auth .form-control,
.gr-auth .form-control-solid {
    background: #fff;
    border: 1px solid var(--gr-line);
    border-radius: 12px;
    padding: 12px 15px;
    height: auto;
    font-size: .98rem;
    color: var(--gr-ink);
    box-shadow: none;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.gr-auth .form-control::placeholder { color: #a8b4c6; }

.gr-auth .form-control:focus,
.gr-auth .form-control-solid:focus {
    background: #fff;
    border-color: #a9c4ea;
    box-shadow: 0 0 0 4px rgba(36, 86, 160, .12);
    outline: none;
}

.gr-auth .input-group .form-control { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.gr-auth .input-group-append .btn {
    border-radius: 0 12px 12px 0;
    border: 1px solid var(--gr-line);
    border-left: 0;
    background: #fff;
    color: var(--gr-muted);
}
.gr-auth .input-group-append .btn:hover { color: var(--gr-navy); background: var(--gr-navy-050); }

.gr-auth select.form-control { appearance: none; background-image: none; }

/* ---------- buttons ---------- */
.gr-auth .btn-primary,
.gr-auth .btn-success,
.gr-auth [id^="btn-"]:not(.toggle-password):not(.btn-outline-secondary) {
    background: var(--gr-navy);
    border-color: var(--gr-navy);
    color: #fff !important;
    font-weight: 600;
    border-radius: 999px;
    padding: 13px 26px;
    box-shadow: 0 8px 20px rgba(26, 63, 122, .25);
    transition: transform .18s ease, background-color .18s ease, box-shadow .18s ease;
}

.gr-auth .btn-primary:hover,
.gr-auth .btn-success:hover,
.gr-auth [id^="btn-"]:not(.toggle-password):not(.btn-outline-secondary):hover {
    background: var(--gr-navy-600);
    border-color: var(--gr-navy-600);
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 26px rgba(26, 63, 122, .32);
}

.gr-auth .btn:focus-visible { outline: 3px solid #8fb4ea; outline-offset: 3px; }

/* ---------- links ---------- */
.gr-auth a:not(.btn):not(.auth-brand) { color: var(--gr-navy-600); font-weight: 600; }
.gr-auth a:not(.btn):not(.auth-brand):hover { color: var(--gr-navy); }

.gr-auth .shul-code-registered a { font-size: .88rem; }

/* ---------- messages ---------- */
.gr-auth .error { color: #c0392b; font-size: .85rem; margin-top: 5px; }

.gr-auth .alert {
    border: 0;
    border-radius: 12px;
    font-size: .95rem;
}
.gr-auth .alert-danger, .gr-auth .alert-danger.alert-solid { background: #fdecea; color: #a33227; }
.gr-auth .alert-info, .gr-auth .alert-info.alert-solid { background: var(--gr-teal-050); color: #14685a; }

/* ---------- footer ---------- */
.gr-auth #layoutAuthentication_footer .footer {
    background: transparent !important;
    color: var(--gr-muted);
    font-size: .85rem;
    padding: 26px 0 30px;
}
.gr-auth #layoutAuthentication_footer .footer .small { color: var(--gr-muted); }

@media (max-width: 575px) {
    .auth-brand { padding: 24px 20px 0; font-size: 1.18rem; }
    .gr-auth .card-body, .gr-auth .card-body.p-5 { padding: 26px 22px !important; }
}

@media (prefers-reduced-motion: reduce) {
    .gr-auth .card { animation: none; }
    .gr-auth .btn:hover { transform: none; }
}
