.mx_AuthHeader {
  display: none !important;
}

.mx_AuthPage {
  position: relative;
  background:
    radial-gradient(circle at 85% 14%, rgba(254, 213, 132, 0.28), transparent 22%),
    radial-gradient(circle at 15% 88%, rgba(26, 90, 143, 0.35), transparent 26%),
    linear-gradient(135deg, rgba(0, 60, 102, 0.96), rgba(0, 45, 74, 0.98)),
    url('/usercontent/branding/dalli-auth-bg.svg') center center / cover no-repeat !important;
}

.mx_AuthPage::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(196, 212, 224, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(196, 212, 224, 0.06) 1px, transparent 1px);
  background-size: 56px 56px;
  pointer-events: none;
}

.mx_AuthPage_modal {
  position: relative;
  margin-top: 72px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(254, 213, 132, 0.26);
  border-radius: 28px !important;
  box-shadow: 0 24px 64px rgba(0, 23, 39, 0.38) !important;
  overflow: hidden;
  backdrop-filter: blur(14px);
}

.mx_AuthPage_modal.mx_AuthPage_modal_withBlur,
.mx_AuthPage_modal.mx_AuthPage_modal_withBlur .mx_AuthPage_modalContent {
  background: transparent !important;
  box-shadow: none !important;
}

.mx_AuthBody {
  position: relative;
  width: min(560px, calc(100vw - 32px)) !important;
  padding: 124px 44px 38px !important;
  border-radius: 28px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: #50657a !important;
}

.mx_AuthBody::before {
  content: "";
  position: absolute;
  top: 30px;
  left: 44px;
  width: 190px;
  height: 56px;
  background: url('/usercontent/branding/dalli-logo.png') left center / contain no-repeat;
  filter: brightness(0) saturate(100%) invert(16%) sepia(58%) saturate(1131%) hue-rotate(175deg) brightness(92%) contrast(101%);
  opacity: 0.98;
}

.mx_AuthBody::after {
  content: "Secure workspace";
  position: absolute;
  top: 86px;
  left: 44px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #1A5A8F;
}

.mx_AuthBody h1 {
  margin-top: 0 !important;
  color: #002D4A !important;
  font-size: 2rem !important;
}

.mx_AuthBody h2,
.mx_Login_type_container,
.mx_AuthBody .mx_Field label,
.mx_AuthBody,
.mx_AuthBody .mx_AccessibleButton_kind_link {
  color: #54687b !important;
}

.mx_AuthBody a,
.mx_AuthBody a:link,
.mx_AuthBody a:visited,
.mx_Login_forgot {
  color: #0E5687 !important;
}

.mx_AuthBody .mx_Field,
.mx_Login_type_container .mx_Field {
  box-shadow: none !important;
  outline: none !important;
}

.mx_AuthBody .mx_Field input,
.mx_AuthBody .mx_Field select,
.mx_AuthBody input[type='text'],
.mx_AuthBody input[type='password'],
.mx_AuthBody .cpd-text-input,
.mx_AuthBody .cpd-select {
  min-height: 52px;
  border-radius: 14px !important;
  border: 1px solid rgba(26, 90, 143, 0.28) !important;
  background: #ffffff !important;
  color: #002D4A !important;
  box-shadow: none !important;
  outline: none !important;
}

.mx_AuthBody .mx_Field,
.mx_AuthBody .mx_Field > div,
.mx_AuthBody .mx_Field > label,
.mx_AuthBody .mx_Field > input,
.mx_AuthBody .mx_Field > select,
.mx_AuthBody .cpd-text-input__prefix,
.mx_AuthBody .cpd-text-input__suffix,
.mx_AuthBody .cpd-text-input__input,
.mx_AuthBody .cpd-select__trigger,
.mx_AuthBody .cpd-select__container,
.mx_AuthBody .cpd-select__control {
  box-shadow: none !important;
}

.mx_AuthBody .mx_Field input:focus,
.mx_AuthBody .mx_Field select:focus,
.mx_AuthBody input[type='text']:focus,
.mx_AuthBody input[type='password']:focus,
.mx_AuthBody .cpd-text-input:focus,
.mx_AuthBody .cpd-select:focus,
.mx_AuthBody .cpd-select__trigger:focus {
  border-color: #1A5A8F !important;
  box-shadow: 0 0 0 3px rgba(26, 90, 143, 0.10) !important;
}

.mx_Login_submit,
.mx_Login_fullWidthButton,
.mx_AuthBody .cpd-button-primary {
  min-height: 52px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: linear-gradient(180deg, #FED584, #E8BF6A) !important;
  color: #253140 !important;
  font-weight: 800 !important;
  box-shadow: 0 16px 34px rgba(0, 45, 74, 0.18) !important;
}

.mx_Login_submit:hover,
.mx_Login_fullWidthButton:hover,
.mx_AuthBody .cpd-button-primary:hover {
  filter: brightness(1.03);
}

.mx_AuthPage .cpd-theme-light,
.mx_AuthPage .cpd-theme-light .cpd-theme {
  --cpd-color-text-action-accent: #0E5687;
}

@media (max-width: 640px) {
  .mx_AuthPage_modal {
    margin-top: 16px !important;
    border-radius: 22px !important;
  }

  .mx_AuthBody {
    width: calc(100vw - 20px) !important;
    padding: 112px 20px 28px !important;
    border-radius: 22px !important;
  }

  .mx_AuthBody::before {
    left: 20px;
    width: 164px;
    height: 48px;
  }

  .mx_AuthBody::after {
    left: 20px;
  }
}
.mx_AuthBody .mx_Field,
.mx_AuthBody .mx_Field *,
.mx_AuthBody .cpd-text-input,
.mx_AuthBody .cpd-text-input *,
.mx_AuthBody .cpd-select,
.mx_AuthBody .cpd-select *,
.mx_AuthBody [class*='cpd-text-input'],
.mx_AuthBody [class*='cpd-select'] {
  box-shadow: none !important;
}

.mx_AuthBody .mx_Field::before,
.mx_AuthBody .mx_Field::after,
.mx_AuthBody .cpd-text-input::before,
.mx_AuthBody .cpd-text-input::after,
.mx_AuthBody .cpd-select::before,
.mx_AuthBody .cpd-select::after,
.mx_AuthBody [class*='cpd-text-input']::before,
.mx_AuthBody [class*='cpd-text-input']::after,
.mx_AuthBody [class*='cpd-select']::before,
.mx_AuthBody [class*='cpd-select']::after {
  box-shadow: none !important;
  border: 0 !important;
  outline: none !important;
}

.mx_AuthBody .mx_Field input,
.mx_AuthBody .mx_Field select,
.mx_AuthBody input[type='text'],
.mx_AuthBody input[type='password'],
.mx_AuthBody .cpd-text-input,
.mx_AuthBody .cpd-select,
.mx_AuthBody [class*='cpd-text-input'],
.mx_AuthBody [class*='cpd-select'] {
  outline: none !important;
}
/* auth input border cleanup */
.mx_AuthBody .mx_Field,
.mx_AuthBody .mx_Field > div,
.mx_AuthBody .mx_Field > span,
.mx_AuthBody [class*='cpd-text-input'],
.mx_AuthBody [class*='cpd-select'],
.mx_AuthBody [class*='cpd-dropdown'],
.mx_AuthBody [class*='cpd-field'] {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

.mx_AuthBody .mx_Field input,
.mx_AuthBody .mx_Field select,
.mx_AuthBody input[type='text'],
.mx_AuthBody input[type='password'],
.mx_AuthBody select,
.mx_AuthBody [class*='cpd-text-input'],
.mx_AuthBody [class*='cpd-select'],
.mx_AuthBody [role='combobox'] {
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 1px solid rgba(26, 90, 143, 0.28) !important;
  outline: 0 !important;
  box-shadow: none !important;
  background-clip: padding-box !important;
}

.mx_AuthBody .mx_Field input:hover,
.mx_AuthBody .mx_Field select:hover,
.mx_AuthBody input[type='text']:hover,
.mx_AuthBody input[type='password']:hover,
.mx_AuthBody select:hover,
.mx_AuthBody [class*='cpd-text-input']:hover,
.mx_AuthBody [class*='cpd-select']:hover,
.mx_AuthBody [role='combobox']:hover {
  border: 1px solid rgba(26, 90, 143, 0.42) !important;
  box-shadow: none !important;
}

.mx_AuthBody .mx_Field input:focus,
.mx_AuthBody .mx_Field select:focus,
.mx_AuthBody input[type='text']:focus,
.mx_AuthBody input[type='password']:focus,
.mx_AuthBody select:focus,
.mx_AuthBody [class*='cpd-text-input']:focus,
.mx_AuthBody [class*='cpd-select']:focus,
.mx_AuthBody [role='combobox']:focus,
.mx_AuthBody *:focus-visible {
  outline: 0 !important;
}

.mx_AuthBody input:-webkit-autofill,
.mx_AuthBody input:-webkit-autofill:hover,
.mx_AuthBody input:-webkit-autofill:focus,
.mx_AuthBody select:-webkit-autofill,
.mx_AuthBody select:-webkit-autofill:hover,
.mx_AuthBody select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #fff inset !important;
  box-shadow: 0 0 0 1000px #fff inset !important;
  border: 1px solid rgba(26, 90, 143, 0.28) !important;
}
/* auth invalid state */
.mx_AuthBody [aria-invalid='true'] label,
.mx_AuthBody [data-invalid] label,
.mx_AuthBody .mx_Login_error {
  color: #C93B3B !important;
}

.mx_AuthBody [aria-invalid='true'] input,
.mx_AuthBody [aria-invalid='true'] select,
.mx_AuthBody [aria-invalid='true'] button,
.mx_AuthBody [data-invalid],
.mx_AuthBody [data-invalid] input,
.mx_AuthBody [data-invalid] select,
.mx_AuthBody [data-invalid] button,
.mx_AuthBody input[aria-invalid='true'],
.mx_AuthBody select[aria-invalid='true'] {
  border-color: #C93B3B !important;
  box-shadow: none !important;
}

.mx_AuthBody [aria-invalid='true']:focus,
.mx_AuthBody [aria-invalid='true'] input:focus,
.mx_AuthBody [aria-invalid='true'] select:focus,
.mx_AuthBody [aria-invalid='true'] button:focus,
.mx_AuthBody [data-invalid]:focus,
.mx_AuthBody [data-invalid] input:focus,
.mx_AuthBody [data-invalid] select:focus,
.mx_AuthBody [data-invalid] button:focus,
.mx_AuthBody input[aria-invalid='true']:focus,
.mx_AuthBody select[aria-invalid='true']:focus {
  border-color: #C93B3B !important;
  box-shadow: 0 0 0 3px rgba(201, 59, 59, 0.14) !important;
  outline: 0 !important;
}
/* server-side login error fallback */
.mx_AuthBody:has(.mx_Login_error) .mx_Field input,
.mx_AuthBody:has(.mx_Login_error) .mx_Field select,
.mx_AuthBody:has(.mx_Login_error) input[type='text'],
.mx_AuthBody:has(.mx_Login_error) input[type='password'],
.mx_AuthBody:has(.mx_Login_error) select,
.mx_AuthBody:has(.mx_Login_error) [class*='cpd-text-input'],
.mx_AuthBody:has(.mx_Login_error) [class*='cpd-select'],
.mx_AuthBody:has(.mx_Login_error) [role='combobox'] {
  border-color: #C93B3B !important;
}

.mx_AuthBody:has(.mx_Login_error) .mx_Field input:focus,
.mx_AuthBody:has(.mx_Login_error) .mx_Field select:focus,
.mx_AuthBody:has(.mx_Login_error) input[type='text']:focus,
.mx_AuthBody:has(.mx_Login_error) input[type='password']:focus,
.mx_AuthBody:has(.mx_Login_error) select:focus,
.mx_AuthBody:has(.mx_Login_error) [class*='cpd-text-input']:focus,
.mx_AuthBody:has(.mx_Login_error) [class*='cpd-select']:focus,
.mx_AuthBody:has(.mx_Login_error) [role='combobox']:focus {
  border-color: #C93B3B !important;
  box-shadow: 0 0 0 3px rgba(201, 59, 59, 0.14) !important;
}
/* hide auth footer links */
.mx_AuthFooter,
.mx_AuthPage_footer,
.mx_AuthBody_footer,
.mx_Login_footer,
.mx_LoginSplashView_splashButtons,
.mx_AuthPage .mx_HomePage_footer,
.mx_AuthPage [class*='footer'] {
  display: none !important;
}
/* hide homeserver block on auth screens */
.mx_AuthBody .mx_Login_underlinedServerName,
.mx_AuthBody .mx_Login_serverUrl,
.mx_AuthBody .mx_ServerPicker,
.mx_AuthBody [class*='serverName'],
.mx_AuthBody [class*='serverUrl'],
.mx_AuthBody [class*='homeserver'],

/* keep auth cross-links visible, hide only homeserver line */
.mx_AuthBody .mx_Login_underlinedServerName,
.mx_AuthBody .mx_Login_serverUrl,
.mx_AuthBody .mx_ServerPicker,
.mx_AuthBody [class*='serverName'],
.mx_AuthBody [class*='serverUrl'],
.mx_AuthBody [class*='homeserver'] {
  display: none !important;
}
/* restore register/login cross-links */
.mx_Register_footerActions {
  display: flex !important;
  justify-content: space-between !important;
  margin-top: 16px !important;
  padding-top: 16px !important;
}

.mx_Register_footer,
.mx_AuthBody_changeFlow {
  display: block !important;
}

/* BEGIN: disable message hover highlight */
.mx_EventTile[data-layout=group]:hover .mx_EventTile_line,
.mx_EventTile[data-layout=irc]:hover .mx_EventTile_line {
  background-color: transparent !important;
  box-shadow: none !important;
}

.mx_EventTile[data-layout=bubble]:hover:before,
.mx_MessageEditHistoryDialog_edits .mx_EventTile:hover:before {
  background: transparent !important;
}

.mx_EventTile[data-layout=bubble]:hover .mx_EventTile_avatar {
  border-color: transparent !important;
}

.mx_EventTile[data-layout=bubble]:hover .mx_EventTile_avatar img {
  box-shadow: none !important;
}
/* END: disable message hover highlight */
