@import url("./mobile-stability.css");

/* Mantém a apresentação MOTRIX independente do tema interno do painel. */
html[data-theme="light"] .login-view,
html[data-theme="dark"] .login-view {
    background: #07111f !important;
    color: #eef5ff !important;
}

html[data-theme="light"] .login-card .field input,
html[data-theme="dark"] .login-card .field input,
html[data-theme="light"] .login-card .password-field,
html[data-theme="dark"] .login-card .password-field {
    border-color: rgba(134,164,207,.18) !important;
    background: rgba(6,17,31,.72) !important;
    color: #f7fbff !important;
}

html[data-theme="light"] .login-card .field input::placeholder,
html[data-theme="dark"] .login-card .field input::placeholder {
    color: #60758f !important;
}

html[data-theme="light"] .login-card .field input:focus,
html[data-theme="dark"] .login-card .field input:focus,
html[data-theme="light"] .login-card .password-field:focus-within,
html[data-theme="dark"] .login-card .password-field:focus-within {
    border-color: rgba(72,214,255,.65) !important;
    box-shadow: 0 0 0 3px rgba(72,214,255,.08), 0 0 24px rgba(47,123,255,.12) !important;
}

html[data-theme="light"] .login-brand,
html[data-theme="dark"] .login-brand,
html[data-theme="light"] .login-heading h1,
html[data-theme="dark"] .login-heading h1 {
    color: #ffffff !important;
}

html[data-theme="light"] .login-heading p,
html[data-theme="dark"] .login-heading p,
html[data-theme="light"] .login-footer,
html[data-theme="dark"] .login-footer {
    color: #95a9c5 !important;
}