/* ===================================================================
   LOGIN THEME – light / dark adaptive
   Target markup: #login-box, .login-container and its children
   Overrides every hard-coded colour with explicit light + dark values
   =================================================================== */

/* ----------  LIGHT MODE (default) ------------------------------- */
#login-box {
    background: #f5f7fb;
    color: #333;
}

.login-container {
    background: #ffffff;
    box-shadow: 0 4px 20px rgba(0,0,0,.08);
}

.login-banner {
    filter: none;
}

.login-form-control {
    background: #ffffff;
    border: 1px solid #ced4da;
    color: #333;
}

    .login-form-control:focus {
        border-color: #4170ff;
        box-shadow: 0 0 0 2px rgba(65,112,255,.25);
    }

.btn-group-login .btn {
    background: #ffffff;
    color: #333;
    border: 1px solid #ced4da;
}

    .btn-group-login .btn.active,
    .btn-group-login .btn:hover {
        background: #E8F0FF; /* subtle fill                 */
        color: #004EAB !important; /* high-contrast blue text     */
        border-color: #0063C5;
    }

.login-form-button {
    background: #4170ff;
    color: #fff;
}

    .login-form-button:hover {
        background: #3359e6;
    }

.track-btn {
    border-color: #4170ff;
    color: #4170ff;
    background: #E8F0FF;
}

    .track-btn:hover {
        background: #4170ff;
        color: #fff;
    }

.text-danger {
    color: #d9534f !important;
}

.text-muted {
    color: #6c757d !important;
}



/* ----------  DARK MODE ------------------------------------------ */
/*@media (prefers-color-scheme: dark) {
    #login-box {
        background: #151618;
        color: #e5e5e5;
    }

    .login-container {
        background: #1e1f22;
        box-shadow: 0 4px 20px rgba(0,0,0,.6);
    }

    .login-banner {
        filter: brightness(95%);
    }

    .login-form-control {
        background: #25262a;
        border: 1px solid #3a3b3d;
        color: #e5e5e5;
    }

        .login-form-control:focus {
            border-color: #5b7cff;
            box-shadow: 0 0 0 2px rgba(91,124,255,.35);
        }

    .btn-group-login .btn {
        background: #25262a;
        color: #e5e5e5;
        border: 1px solid #3a3b3d;
    }

        .btn-group-login .btn.active,
        .btn-group-login .btn:hover {
            background: #5b7cff;
            color: #fff;
            border-color: #5b7cff;
        }

    .login-form-button {
        background: #5b7cff;
        color: #fff;
    }

        .login-form-button:hover {
            background: #4763ff;
        }

    .track-btn {
        border-color: #5b7cff;
        color: #5b7cff;
    }

        .track-btn:hover {
            background: #5b7cff;
            color: #fff;
        }

    .text-danger {
        color: #ff6b6b !important;
    }

    .text-muted {
        color: #a0a0a0 !important;
    }
}*/

/* ----------  Shared tweaks -------------------------------------- */
.login-icon {
    color: inherit;
}
/* inherit light/dark fg       */
.btn-eye {
    background: none;
    border: 0;
    padding: 0 8px;
    color: inherit;
}

.password-group {
    position: relative;
}

    .password-group .btn-eye {
        position: absolute;
        right: 6px;
        top: 50%;
        transform: translateY(-50%);
    }

.track-divider {
    border-color: currentColor;
    opacity: .15;
}

.small {
    font-size: 85%;
}

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition: none !important;
    }
}