/* Three.js background — keep canvas behind all UI */
body {
  background: transparent !important;
}
#bg-canvas {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: -1 !important;
  pointer-events: none !important;
  display: block !important;
}
/* Ensure Element UI renders above the canvas */
#matrixchat {
  position: relative !important;
  z-index: 0 !important;
}

/* Remove competing backgrounds */
.mx_AuthPage {
  background: transparent !important;
}
.mx_AuthPage::before {
  display: none !important;
}

/* Remove the white glow and blur from the modal */
.mx_AuthPage_modal_withBlur::before,
.mx_AuthPage_modal::before {
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}
.mx_AuthPage_modal_withBlur,
.mx_AuthPage_modal {
  box-shadow: 0 2px 12px rgba(0,0,0,0.4) !important;
}

/* Three.js bg-canvas handles its own positioning via inline style */
.mx_AuthPage_modal,
.mx_AuthFooter {
  position: relative !important;
  z-index: 1 !important;
}

/* Hide the actual blur DOM element (not a pseudo-element) */
.mx_AuthPage_modalBlur {
  display: none !important;
}

/* ── Custom logo override ── */
/* Auth header logo (login page) */
aside.mx_AuthHeaderLogo {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
}

aside.mx_AuthHeaderLogo img {
  content: url(/logo.png) !important;
  width: 90px !important;
  height: 90px !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
}

/* ── Welcome page logo override ── */
.mx_Welcome .mx_Welcome_logo img,
.mx_WelcomePage .mx_Welcome_logo img {
  content: url(/logo.png) !important;
  width: 80px !important;
  height: 80px !important;
  object-fit: contain !important;
}

/* Welcome page — flame logo replaces Element swirl */
img.mx_Logo {
  content: url('/logo.png') !important;
  width: 60px !important;
  height: 60px !important;
  object-fit: contain !important;
}

/* Login page — larger centered flame logo */
aside.mx_AuthHeaderLogo {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
}
aside.mx_AuthHeaderLogo img {
  content: url('/logo.png') !important;
  width: 90px !important;
  height: 90px !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
}

/* Rebrand welcome title (hardcoded in this Element version) */
h1.mx_Header_title {
  color: transparent !important;
}
h1.mx_Header_title::after {
  content: "Welcome to Bootnet Chat" !important;
  color: #ffffff !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  text-align: center !important;
  font: inherit !important;
}

/* Hide subtitle */
.mx_WelcomePage_body > p,
p.mx_Header_byline {
  display: none !important;
}