/* RoyalSonic Vault — neat enterprise login */
:root {
  --rs-bg: #2f4f52;
  --rs-card: #ffffff;
  --rs-ink: #1e293b;
  --rs-muted: #475569;
  --rs-accent: #3b82f6;
  --rs-accent-deep: #2563eb;
  --rs-line: #e2e8f0;
  --rs-font: "Segoe UI", "Helvetica Neue", "Noto Sans", ui-sans-serif, system-ui, sans-serif;
}

html, body {
  font-family: var(--rs-font) !important;
  background: var(--rs-bg) !important;
  color: var(--rs-ink) !important;
  min-height: 100% !important;
}

body.rs-vault-login,
body.rs-vault-login #app,
body.rs-vault-login #app > div {
  background: var(--rs-bg) !important;
}

/* Hide download / install promo bar */
[class*="download"],
[class*="Download"],
a[href*="download"],
.top-bar,
.announcement,
.banner-download,
.rs-hide-vendor,
[data-rs-hide="1"] {
  display: none !important;
}

#app, #app > div, body > div {
  background: var(--rs-bg) !important;
  min-height: 100vh !important;
}

/* Compact white login card (not the full teal page shell) */
.rs-login-card {
  background: var(--rs-card) !important;
  color: var(--rs-ink) !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28) !important;
  padding: 1.5rem 1.35rem 1.15rem !important;
  border: 0 !important;
  max-width: 400px !important;
  width: min(400px, 92vw) !important;
  margin: 2.5rem auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.rs-login-card > * {
  max-width: 100% !important;
}

/* Logo — never crop */
.rs-login-card img,
body.rs-vault-login img[src*="logo"],
body.rs-vault-login img[src*="Logo"],
body.rs-vault-login img[src*="royalsonic"],
body.rs-vault-login img[alt*="RoyalSonic" i] {
  display: block !important;
  max-height: 48px !important;
  width: auto !important;
  max-width: 200px !important;
  height: auto !important;
  margin: 0 auto 1.1rem !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  clip: auto !important;
  overflow: visible !important;
}

[class*="logo"] svg,
.logo svg {
  display: none !important;
}

body [class*="logo"] span,
body .logo-text,
body header .brand-name,
body a[href="/"] span,
body .mdc-top-app-bar__title {
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
}

h1, h2, .login-title, [class*="title"] {
  font-family: var(--rs-font) !important;
  color: var(--rs-ink) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* Floating labels sit above the field, not on the border */
.rs-login-card .mdc-text-field {
  margin-top: 0.85rem !important;
  margin-bottom: 0.35rem !important;
  background: #fff !important;
  border-radius: 8px !important;
  overflow: visible !important;
}

.rs-login-card .mdc-floating-label,
.rs-login-card .MuiFormLabel-root,
.rs-login-card .MuiInputLabel-root,
.rs-login-card label.mdc-floating-label {
  color: var(--rs-muted) !important;
  font-weight: 600 !important;
  font-family: var(--rs-font) !important;
  background: #fff !important;
  padding: 0 0.35rem !important;
  z-index: 3 !important;
  max-width: calc(100% - 2rem) !important;
}

.rs-login-card .mdc-floating-label--float-above,
.rs-login-card .mdc-floating-label--shake {
  transform: translateY(-1.4rem) scale(0.78) !important;
  color: var(--rs-ink) !important;
}

.rs-login-card .mdc-notched-outline__notch {
  border-top: none !important;
}

.rs-login-card .mdc-text-field--outlined .mdc-notched-outline__leading,
.rs-login-card .mdc-text-field--outlined .mdc-notched-outline__notch,
.rs-login-card .mdc-text-field--outlined .mdc-notched-outline__trailing,
.rs-login-card .MuiOutlinedInput-notchedOutline {
  border-color: var(--rs-line) !important;
}

.rs-login-card .mdc-text-field--focused .mdc-notched-outline__leading,
.rs-login-card .mdc-text-field--focused .mdc-notched-outline__notch,
.rs-login-card .mdc-text-field--focused .mdc-notched-outline__trailing {
  border-color: #93c5fd !important;
}

input,
input[type="text"],
input[type="password"],
input[type="email"],
.mdc-text-field__input,
.MuiInputBase-input,
textarea {
  font-family: var(--rs-font) !important;
  color: var(--rs-ink) !important;
  background: #fff !important;
  border-radius: 8px !important;
}

[class*="domain"],
span[class*="suffix"] {
  color: var(--rs-muted) !important;
  font-weight: 500 !important;
}

button[type="submit"],
button.mdc-button--raised,
button.mdc-button--unelevated,
.btn-primary,
.MuiButton-containedPrimary,
button.primary {
  background: var(--rs-accent) !important;
  border-color: var(--rs-accent) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  font-family: var(--rs-font) !important;
  min-height: 44px !important;
  min-width: 120px !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
}

button[type="submit"]:hover,
.MuiButton-containedPrimary:hover {
  background: var(--rs-accent-deep) !important;
}

button.mdc-button--text,
a.register,
button[class*="register" i] {
  color: var(--rs-ink) !important;
  text-transform: none !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
}

/* Checkboxes / trust options — readable on white card */
.rs-login-card .mdc-form-field,
.rs-login-card .mdc-form-field label,
.rs-login-card label span,
.rs-login-card .MuiFormControlLabel-label {
  color: var(--rs-ink) !important;
  font-size: 0.9rem !important;
  opacity: 1 !important;
}

body.rs-vault-login .mdc-form-field,
body.rs-vault-login .mdc-checkbox-parent,
body.rs-vault-login label[for] {
  color: #f8fafc !important;
}

/* When form-field is inside white card, force dark text */
.rs-login-card .mdc-form-field,
.rs-login-card .mdc-form-field label,
.rs-login-card label {
  color: var(--rs-ink) !important;
}

/* Footer links under card */
body.rs-vault-login a[href*="lost"],
body.rs-vault-login a[href*="password"],
body.rs-vault-login a[href*="delete"],
body.rs-vault-login .footer a,
body.rs-vault-login footer a {
  color: rgba(255, 255, 255, 0.88) !important;
  text-decoration: none !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
}

.rs-login-card a[href*="lost"],
.rs-login-card a[href*="password"],
.rs-login-card a[href*="delete"] {
  color: var(--rs-muted) !important;
}

.mdc-icon-button,
button[aria-label*="info" i],
button[title*="info" i] {
  color: var(--rs-muted) !important;
  opacity: 0.75;
}

/* Kill tall empty teal “cards” mis-tagged as login */
body.rs-vault-login [class*="login"][style*="height"],
body.rs-vault-login .rs-login-card[style*="min-height"] {
  min-height: 0 !important;
  height: auto !important;
}