/* FreeHelper auth redesign — login / register / password pages.
   Design-only layer; all forms, validation and routes untouched.
   Uses theme variables so Admin color settings keep working. */

body.auth-body {
    background-image: none;
    background-color: var(--bs-primary, #2563eb);
    background-image: linear-gradient(135deg, var(--bs-primary, #2563eb) 0%, color-mix(in srgb, var(--bs-primary, #2563eb) 55%, #0b1220) 100%);
    min-height: 100vh;
}
body.auth-body .signin-container { height: auto; min-height: 100vh; padding: 40px 16px; }
body.auth-body .signin-container .signin-main {
    max-width: 880px;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.35);
}

/* ---------- FORM SIDE ---------- */
body.auth-body .form-container { padding: 48px 44px !important; border-radius: 0 !important; }
body.auth-body .form-container .navbar-brand img { max-height: 44px; }
body.auth-body .form-container h1 { font-size: 26px; font-weight: 800; margin-bottom: 6px; }
body.auth-body .form-container form { min-width: 0 !important; width: 100%; max-width: 360px; }
body.auth-body .form-container .form-control {
    height: 50px; border-radius: 14px; font-size: 15px;
    border: 1.5px solid rgba(128, 128, 128, 0.3); padding: 0 16px;
    background: var(--bs-body-bg, #fff);
}
body.auth-body .form-container .form-control:focus {
    border-color: var(--bs-primary, #2563eb);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--bs-primary, #2563eb) 15%, transparent);
}
body.auth-body .form-container .btn.btn-primary {
    min-height: 50px; border-radius: 14px; font-weight: 700; font-size: 16px;
    background: var(--bs-primary, #2563eb);
    background-image: linear-gradient(135deg, var(--bs-primary, #2563eb), color-mix(in srgb, var(--bs-primary, #2563eb) 70%, #0b1220));
    border: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}
body.auth-body .form-container .btn.btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px color-mix(in srgb, var(--bs-primary, #2563eb) 40%, transparent);
}
/* Social buttons full width */
body.auth-body .form-container .btn-outline-secondary,
body.auth-body .form-container .btn-light {
    border-radius: 14px; min-height: 48px; font-weight: 600;
}

/* ---------- SIDE PANEL ---------- */
body.auth-body .text-container { border-radius: 0 !important; padding: 48px 40px !important; }
body.auth-body .text-container .text-left h1 { font-size: 30px; font-weight: 800; margin-bottom: 10px; }
body.auth-body .text-container .text-left p { font-size: 15.5px; opacity: 0.92; }
body.auth-body .text-container .btn.btn-success {
    border-radius: 999px; padding: 12px 34px; font-weight: 700; margin-top: 14px;
    background: #fff; border: none; color: var(--bs-primary, #2563eb);
}
body.auth-body .text-container .btn.btn-success:hover { transform: translateY(-1px); color: var(--bs-primary, #2563eb); }

[theme-mode="dark"] body.auth-body .form-container { background: #141b2b; }
[theme-mode="dark"] body.auth-body .form-container .form-control { background: #1e2739; border-color: #2c3648; color: #e5e9f0; }

/* ---------- MOBILE ---------- */
@media (max-width: 767px) {
    body.auth-body .form-container { padding: 36px 24px !important; }
    body.auth-body .text-container { padding: 36px 24px !important; }
}