/* ClinicPro HIMS — Neumorphic (soft UI) restyle for the auth screens only.
   Loaded after style.css on login.php / forgot_password.php / reset_password.php;
   overrides the .login-* rules there. Rest of the app is unaffected. */

:root {
    --neo-bg: #E4EBF5;
    --neo-dark: rgba(163, 177, 198, 0.65);
    --neo-light: rgba(255, 255, 255, 0.95);
    --neo-text: #44476A;
    --neo-muted: #8A93AB;
    --neo-accent: #0F6FDE;
    --neo-accent2: #6C3AED;
}

body.login-page {
    background: var(--neo-bg);
    color: var(--neo-text);
}

.login-card {
    background: var(--neo-bg);
    border-radius: 28px;
    overflow: visible;
    box-shadow:
        12px 12px 24px var(--neo-dark),
        -12px -12px 24px var(--neo-light);
}

.login-header {
    background: transparent;
    border-bottom: none;
    padding: 34px 30px 10px;
}

.login-header h1 {
    color: var(--neo-text);
    letter-spacing: 0.3px;
    background: linear-gradient(135deg, var(--neo-accent), var(--neo-accent2));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.login-header p {
    color: var(--neo-muted);
}

.login-header .clinic-logo {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    padding: 8px;
    background: var(--neo-bg);
    box-shadow:
        6px 6px 12px var(--neo-dark),
        -6px -6px 12px var(--neo-light);
}

.login-body {
    padding: 24px 34px 34px;
}

.login-body label {
    color: var(--neo-text);
    font-weight: 600;
}

.login-body .form-control {
    background: var(--neo-bg);
    border: none;
    border-radius: 14px;
    padding: 13px 18px;
    color: var(--neo-text);
    box-shadow:
        inset 5px 5px 10px var(--neo-dark),
        inset -5px -5px 10px var(--neo-light);
    transition: box-shadow 0.2s ease;
}

.login-body .form-control::placeholder {
    color: var(--neo-muted);
}

.login-body .form-control:focus {
    outline: none;
    background: var(--neo-bg);
    border: none;
    box-shadow:
        inset 6px 6px 12px var(--neo-dark),
        inset -6px -6px 12px var(--neo-light),
        0 0 0 2px rgba(15, 111, 222, 0.25);
}

.login-body .btn.btn-primary {
    background: var(--neo-bg);
    border: none;
    border-radius: 14px;
    color: var(--neo-accent);
    font-weight: 700;
    letter-spacing: 0.4px;
    box-shadow:
        7px 7px 14px var(--neo-dark),
        -7px -7px 14px var(--neo-light);
    transition: box-shadow 0.15s ease, transform 0.15s ease, color 0.15s ease;
}

.login-body .btn.btn-primary:hover {
    background: var(--neo-bg);
    color: var(--neo-accent2);
    transform: translateY(-1px);
    box-shadow:
        9px 9px 18px var(--neo-dark),
        -9px -9px 18px var(--neo-light);
}

.login-body .btn.btn-primary:active {
    transform: translateY(0);
    box-shadow:
        inset 5px 5px 10px var(--neo-dark),
        inset -5px -5px 10px var(--neo-light);
}

/* Alerts as soft inset wells with colored text */
.login-body .alert {
    background: var(--neo-bg);
    border: none;
    border-radius: 14px;
    box-shadow:
        inset 4px 4px 8px var(--neo-dark),
        inset -4px -4px 8px var(--neo-light);
}

.login-body .alert-success { color: #1F8A4C; }
.login-body .alert-warning { color: #A9700A; }
.login-body .alert-danger  { color: #C0392B; }

.login-body a {
    color: var(--neo-accent) !important;
}

.login-body p {
    color: var(--neo-muted);
}