/* DAN — Seagate NAS login branding. Reuses the real DAN brand-pack tokens
   (dark ground, single red signal colour, JetBrains-Mono-style monospace
   wordmark) already established across the estate — not a new palette. */

:root {
  --dan-bg: #0f0f12;
  --dan-bg-2: #17171b;
  --dan-text: #e8e8ec;
  --dan-text-2: #b4b4bc;
  --dan-text-3: #6b6b72;
  --dan-border: rgba(255,255,255,.10);
  --dan-red: #ff3b30;
}

body, #app {
  background: var(--dan-bg) !important;
  color: var(--dan-text) !important;
  font-family: -apple-system, "Inter", system-ui, sans-serif !important;
}

/* login card */
#login .card, .card.login-card, #login form {
  background: var(--dan-bg-2) !important;
  border: 1px solid var(--dan-border) !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.45) !important;
}

#login h1, #login .title, .login-page .title {
  font-family: "JetBrains Mono", ui-monospace, monospace !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  color: var(--dan-text) !important;
}
#login h1::before, .login-page .title::before {
  content: "[ ";
  color: var(--dan-red);
}
#login h1::after, .login-page .title::after {
  content: " ]  SEAGATE NAS";
  color: var(--dan-text);
}

input {
  background: #101013 !important;
  border: 1px solid var(--dan-border) !important;
  color: var(--dan-text) !important;
  border-radius: 9px !important;
}
input:focus {
  border-color: var(--dan-red) !important;
  outline: none !important;
}

button, .primary, input[type=submit] {
  background: var(--dan-red) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 9px !important;
  font-weight: 700 !important;
  transition: filter .15s ease;
}
button:hover, .primary:hover {
  filter: brightness(1.08);
}

::selection { background: var(--dan-red); color: #fff; }

a { color: var(--dan-red) !important; }