@import url("../../elastic/styles/styles.min.css");

html.dark-mode #layout-login,
#layout-login {
    background: linear-gradient(135deg, #0f2027 0%, #203a43 50%, #2c5364 100%) !important;
}
#login-form {
    background: rgba(255,255,255,0.06);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 16px;
    padding: 40px 36px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.45);
}
#login-form .input-group input.form-control {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.18);
    color: #fff;
    border-radius: 8px;
}
#login-form input.form-control::placeholder { color: rgba(255,255,255,0.55); }
#login-form .input-group-text { background: rgba(255,255,255,0.10); border-color: rgba(255,255,255,0.18); color:#fff; }
#login-form button.btn-primary {
    background: linear-gradient(90deg, #00b4d8, #0077b6);
    border: 0;
    border-radius: 8px;
    font-weight: 600;
    letter-spacing: .5px;
    text-transform: uppercase;
    transition: all .2s;
}
#login-form button.btn-primary:hover { filter: brightness(1.15); transform: translateY(-1px); }
#layout-login .footer, #login-footer { color: rgba(255,255,255,0.4); }