@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

:root {
  --ep-bg: #060b16;
  --ep-card: #0d1628;
  --ep-border: #1e3a5f;
  --ep-text: #e8eef8;
  --ep-muted: #7a90b0;
  --ep-accent: #3b82f6;
  --ep-cyan: #38bdf8;
  color-scheme: dark !important;
}

html,
body,
#app {
  background: radial-gradient(1200px 700px at 8% -10%, rgba(59, 130, 246, 0.22), transparent 45%),
    radial-gradient(900px 500px at 100% 0%, rgba(14, 165, 233, 0.12), transparent 40%),
    var(--ep-bg) !important;
  color: var(--ep-text) !important;
  font-family: 'Plus Jakarta Sans', 'Segoe UI', sans-serif;
}

a {
  color: var(--ep-cyan);
}

button[color="primary"],
button[variant="primary"],
button[variant="contained"] {
  background: var(--ep-accent) !important;
  color: #fff !important;
  box-shadow: 0 10px 28px rgba(59, 130, 246, 0.32);
}

table tbody tr:hover td {
  background: rgba(59, 130, 246, 0.08) !important;
}

.login__Wrapper {
  background:
    radial-gradient(900px 480px at 18% -8%, rgba(59, 130, 246, 0.28), transparent 55%),
    linear-gradient(165deg, #050914 0%, #0b1d3a 48%, #07111f 100%) !important;
}

.login__Wrapper > div {
  background: #0d1628 !important;
  color: #e8eef8 !important;
  border: 1px solid #1e3a5f !important;
  border-radius: 20px !important;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(3, 12, 36, 0.65) !important;
}

.login__Wrapper > div > div:first-child {
  background: linear-gradient(180deg, #1e3a8a 0%, #0b1d3a 100%) !important;
  color: #e8eef8 !important;
}

.login__Wrapper h2,
.login__Wrapper h5,
.login__Wrapper p,
.login__Wrapper label,
.login__Wrapper span,
.login__Wrapper div {
  color: #e8eef8 !important;
}

.login__Wrapper input {
  background: #0b1220 !important;
  color: #e8eef8 !important;
  border: 1px solid rgba(56, 189, 248, 0.28) !important;
  border-radius: 10px !important;
}

.login__Wrapper button {
  background: #3b82f6 !important;
  color: #fff !important;
}

.login-password-toggle {
  background: transparent !important;
  color: var(--ep-muted) !important;
  box-shadow: none !important;
}

.login-password-toggle:hover {
  color: var(--ep-cyan) !important;
}
