#modalEmailCode {
  background-color: #060c18;
  color: #f8fafc;
  -webkit-text-fill-color: #f8fafc;
  caret-color: #67e8f9;
}
#modalEmailCode::placeholder {
  color: #64748b;
  opacity: 1;
}
#modalEmailCode:-webkit-autofill,
#modalEmailCode:-webkit-autofill:hover,
#modalEmailCode:-webkit-autofill:focus {
  -webkit-text-fill-color: #f8fafc;
  box-shadow: 0 0 0 1000px #060c18 inset;
  -webkit-box-shadow: 0 0 0 1000px #060c18 inset;
  transition: background-color 9999s ease-out 0s;
}

#loginForm input:-webkit-autofill,
#loginForm input:-webkit-autofill:hover,
#loginForm input:-webkit-autofill:focus,
#loginEmpleadoForm input:-webkit-autofill,
#loginEmpleadoForm input:-webkit-autofill:hover,
#loginEmpleadoForm input:-webkit-autofill:focus,
#twofaForm input:-webkit-autofill,
#twofaForm input:-webkit-autofill:hover,
#twofaForm input:-webkit-autofill:focus {
  -webkit-text-fill-color: #f8fafc !important;
  caret-color: #f8fafc;
  box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0.10) inset !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0.10) inset !important;
  transition: background-color 9999s ease-out 0s;
}

:root[data-ui-theme="light"] h1.mt-4.text-2xl.font-semibold.tracking-wide {
  color: #0f172a !important;
}

:root[data-ui-theme="light"] h1.mt-4.text-2xl.font-semibold.tracking-wide + p.text-sm {
  color: #475569 !important;
}

:root[data-ui-theme="light"] #fxLoginShell {
  background: #f8fafc !important;
}

:root[data-ui-theme="light"] #fxLoginCard {
  background: #ffffff !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12) !important;
  backdrop-filter: none !important;
}

:root[data-ui-theme="light"] #fxLoginCard .fx-login-deco {
  display: none !important;
}

#fxLoginLogo {
  background: transparent !important;
  border: 0 !important;
  color: inherit !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#fxLoginLogo img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

#fxLoginKnowMore {
  position: fixed;
  top: 16px;
  left: 16px;
  z-index: 70;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 12px;
  border: 1px solid #1d4ed8;
  background: #2563eb;
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 12px;
  text-decoration: none;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

#fxLoginKnowMore:hover {
  background: #1d4ed8;
  border-color: #1e40af;
  color: #ffffff;
}

:root[data-ui-theme="light"] #fxLoginCard #btnLoginEmpleado,
:root[data-ui-theme="light"] #fxLoginCard #volverLoginPrincipal,
:root[data-ui-theme="light"] #fxLoginCard a {
  color: #334155 !important;
}

:root[data-ui-theme="light"] #fxLoginCard #btnLoginEmpleado:hover,
:root[data-ui-theme="light"] #fxLoginCard #volverLoginPrincipal:hover,
:root[data-ui-theme="light"] #fxLoginCard a:hover {
  color: #0f172a !important;
}

:root[data-ui-theme="light"] #loginForm,
:root[data-ui-theme="light"] #loginEmpleadoForm,
:root[data-ui-theme="light"] #twofaForm {
  color: #0f172a !important;
}

:root[data-ui-theme="light"] #loginForm label,
:root[data-ui-theme="light"] #loginEmpleadoForm label,
:root[data-ui-theme="light"] #twofaForm label,
:root[data-ui-theme="light"] #loginForm .text-slate-300,
:root[data-ui-theme="light"] #loginForm .text-slate-400,
:root[data-ui-theme="light"] #loginEmpleadoForm .text-slate-300,
:root[data-ui-theme="light"] #loginEmpleadoForm .text-slate-400,
:root[data-ui-theme="light"] #twofaForm .text-slate-300,
:root[data-ui-theme="light"] #twofaForm .text-slate-400 {
  color: #475569 !important;
}

:root[data-ui-theme="light"] #twofaForm .text-white,
:root[data-ui-theme="light"] #twofaForm .text-slate-200 {
  color: #0f172a !important;
}

:root[data-ui-theme="light"] #loginForm input,
:root[data-ui-theme="light"] #loginEmpleadoForm input,
:root[data-ui-theme="light"] #twofaForm input {
  color: #0f172a !important;
  -webkit-text-fill-color: #0f172a !important;
  background: #ffffff !important;
  border-color: #cbd5e1 !important;
}

:root[data-ui-theme="light"] #loginForm input::placeholder,
:root[data-ui-theme="light"] #loginEmpleadoForm input::placeholder,
:root[data-ui-theme="light"] #twofaForm input::placeholder {
  color: #64748b !important;
}

:root[data-ui-theme="light"] #loginForm input:-webkit-autofill,
:root[data-ui-theme="light"] #loginForm input:-webkit-autofill:hover,
:root[data-ui-theme="light"] #loginForm input:-webkit-autofill:focus,
:root[data-ui-theme="light"] #loginEmpleadoForm input:-webkit-autofill,
:root[data-ui-theme="light"] #loginEmpleadoForm input:-webkit-autofill:hover,
:root[data-ui-theme="light"] #loginEmpleadoForm input:-webkit-autofill:focus,
:root[data-ui-theme="light"] #twofaForm input:-webkit-autofill,
:root[data-ui-theme="light"] #twofaForm input:-webkit-autofill:hover,
:root[data-ui-theme="light"] #twofaForm input:-webkit-autofill:focus {
  -webkit-text-fill-color: #0f172a !important;
  caret-color: #0f172a !important;
  box-shadow: 0 0 0 1000px #ffffff inset !important;
  -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
}

:root[data-ui-theme="light"] #loginForm .bg-white\/10,
:root[data-ui-theme="light"] #loginEmpleadoForm .bg-white\/10,
:root[data-ui-theme="light"] #twofaForm .bg-white\/10,
:root[data-ui-theme="light"] #twofaForm .bg-white\/5 {
  background: #ffffff !important;
}

:root[data-ui-theme="light"] #loginForm .border-white\/20,
:root[data-ui-theme="light"] #loginEmpleadoForm .border-white\/20,
:root[data-ui-theme="light"] #twofaForm .border-white\/10,
:root[data-ui-theme="light"] #twofaForm .border-white\/15 {
  border-color: #cbd5e1 !important;
}

:root[data-ui-theme="light"] #loginForm button[type="submit"],
:root[data-ui-theme="light"] #loginEmpleadoForm button[type="submit"],
:root[data-ui-theme="light"] #twofaForm button[type="submit"][formaction$="/login/2fa"] {
  background: #2563eb !important;
  color: #ffffff !important;
}

:root[data-ui-theme="light"] #loginForm button[data-toggle-pass],
:root[data-ui-theme="light"] #loginEmpleadoForm button[data-toggle-pass] {
  color: #64748b !important;
}

:root[data-ui-theme="light"] #fxLoginCopyright {
  color: #475569 !important;
}
