:root {
  --ex24-yellow: #ffd21f;
  --ex24-yellow-dark: #d6a900;
  --ex24-bg: #05080d;
  --ex24-panel: rgba(7, 12, 20, 0.80);
  --ex24-panel-soft: rgba(255, 255, 255, 0.035);
  --ex24-border: rgba(255, 255, 255, 0.14);
  --ex24-text: #f5f7fb;
  --ex24-muted: #a8b0bf;
}

body {
  background:
    linear-gradient(90deg, rgba(2, 4, 8, 0.12) 0%, rgba(2, 4, 8, 0.32) 42%, rgba(2, 4, 8, 0.86) 100%),
    url('/custom/ex24-login-bg.png') center center / cover no-repeat fixed !important;
  font-family: Inter, Arial, Helvetica, sans-serif !important;
}

.mx_AuthPage {
  background: transparent !important;
}

.mx_AuthPage::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 76% 38%, rgba(255, 210, 31, 0.10), transparent 31%),
    radial-gradient(circle at 10% 88%, rgba(255, 210, 31, 0.13), transparent 30%),
    linear-gradient(180deg, rgba(0,0,0,0.08), rgba(0,0,0,0.42));
  z-index: 0;
}

.mx_AuthPage_modal {
  background: var(--ex24-panel) !important;
  border: 1px solid var(--ex24-border) !important;
  border-radius: 28px !important;
  box-shadow:
    0 30px 110px rgba(0, 0, 0, 0.68),
    0 0 0 1px rgba(255, 210, 31, 0.08) inset !important;
  backdrop-filter: blur(16px) saturate(120%) !important;
  overflow: hidden !important;
}

.mx_AuthPage_modal > div:first-child {
  background: rgba(255, 255, 255, 0.03) !important;
}

.mx_AuthBody,
.mx_AuthPage_modalContent {
  background: transparent !important;
  color: var(--ex24-text) !important;
}

.mx_AuthHeader_logo {
  width: 310px !important;
  height: 112px !important;
  margin: 0 auto 14px auto !important;
  background: url('/custom/ex24-logo.png') center center / contain no-repeat !important;
}

.mx_AuthHeader_logo img,
.mx_AuthHeader img,
.mx_AuthPage .mx_Logo,
.mx_AuthPage_modal img[src*="element"] {
  opacity: 0 !important;
}

.mx_AuthBody h1,
.mx_AuthBody h2,
.mx_AuthHeader h1,
.mx_AuthHeader h2,
.mx_AuthPage h1,
.mx_AuthPage h2 {
  color: var(--ex24-text) !important;
  font-weight: 850 !important;
  letter-spacing: -0.025em !important;
}

.mx_AuthBody,
.mx_AuthBody label,
.mx_AuthBody span,
.mx_AuthBody p,
.mx_AuthBody div {
  color: var(--ex24-text) !important;
}

.mx_AuthBody .mx_Field label,
.mx_AuthBody .mx_ServerPicker,
.mx_AuthBody .mx_AuthBody_serverConfig {
  color: var(--ex24-muted) !important;
}

.mx_AuthPage .mx_Field,
.mx_AuthPage .mx_Dropdown,
.mx_AuthPage input,
.mx_AuthPage select {
  background: rgba(5, 10, 18, 0.78) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  border-radius: 14px !important;
  color: var(--ex24-text) !important;
}

.mx_AuthPage .mx_Field input,
.mx_AuthPage .mx_Field select,
.mx_AuthPage input[type="text"],
.mx_AuthPage input[type="password"],
.mx_AuthPage input[type="email"] {
  background: transparent !important;
  color: var(--ex24-text) !important;
}

.mx_AuthPage .mx_Field:focus-within,
.mx_AuthPage input:focus,
.mx_AuthPage select:focus {
  border-color: var(--ex24-yellow) !important;
  box-shadow: 0 0 0 2px rgba(255, 210, 31, 0.18) !important;
}

.mx_AuthPage .mx_Field input::placeholder {
  color: rgba(233, 237, 246, 0.50) !important;
}

.mx_AuthPage .mx_AccessibleButton_kind_primary,
.mx_AuthPage button[type="submit"],
.mx_AuthBody .mx_AccessibleButton_kind_primary {
  background: linear-gradient(180deg, #ffe36a 0%, var(--ex24-yellow) 46%, var(--ex24-yellow-dark) 100%) !important;
  color: #0b0d12 !important;
  border: none !important;
  border-radius: 14px !important;
  font-weight: 850 !important;
  box-shadow:
    0 12px 32px rgba(255, 210, 31, 0.28),
    0 1px 0 rgba(255,255,255,0.35) inset !important;
}

.mx_AuthPage .mx_AccessibleButton_kind_primary:hover,
.mx_AuthPage button[type="submit"]:hover {
  filter: brightness(1.06) !important;
  transform: translateY(-1px);
}

.mx_AuthPage a,
.mx_AuthBody a,
.mx_AuthBody .mx_AccessibleButton_kind_link {
  color: var(--ex24-yellow) !important;
  font-weight: 750 !important;
}
.mx_AuthPage a[href="#/register"],
.mx_AuthBody a[href*="register"],
.mx_AuthBody .mx_AccessibleButton_kind_link[href*="register"],
.mx_AuthBody .mx_AuthBody_changeFlow {
  display: none !important;
}

.mx_AuthFooter,
.mx_AuthFooter a {
  color: rgba(255,255,255,0.55) !important;
}

.mx_AuthPage .mx_LanguageDropdown,
.mx_AuthPage_modal .mx_Dropdown {
  background: rgba(5, 10, 18, 0.72) !important;
  border-radius: 12px !important;
}

.mx_AuthBody .mx_ServerPicker_error,
.mx_AuthBody .mx_Field_invalid,
.mx_AuthBody .mx_AuthBody_error {
  color: #ff5d5d !important;
}

@media (max-width: 800px) {
  body {
    background-position: center center !important;
  }

  .mx_AuthPage_modal {
    border-radius: 20px !important;
    margin: 16px !important;
  }

  .mx_AuthHeader_logo {
    width: 230px !important;
    height: 84px !important;
  }
}

/* EX24 logo inside login card */
.mx_AuthBody::before {
  content: "";
  display: block;
  width: 280px;
  height: 96px;
  margin: -8px auto 18px auto;
  background: url('/custom/ex24-logo.png') center center / contain no-repeat;
  filter: drop-shadow(0 10px 28px rgba(0,0,0,0.45));
}

/* Make login title closer to corporate layout */
.mx_AuthBody h1,
.mx_AuthBody h2 {
  text-align: center !important;
}

/* Remove excess top padding after adding logo */
.mx_AuthBody {
  padding-top: 28px !important;
}

/* Slightly improve server autodiscovery error layout */
.mx_AuthBody .mx_AuthBody_error,
.mx_AuthBody .mx_ServerPicker_error {
  font-size: 13px !important;
  line-height: 1.35 !important;
  max-width: 420px !important;
  margin: 0 auto 18px auto !important;
  text-align: center !important;
}

/* EX24 final polish */

/* Hide default Matrix footer text: "На технологии Matrix" */
.mx_AuthFooter,
.mx_AuthFooter *,
.mx_AuthPage > .mx_AuthFooter {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

/* Hide autodiscovery warning after well-known was fixed */
.mx_AuthBody .mx_AuthBody_error,
.mx_AuthBody .mx_ServerPicker_error,
.mx_ServerPicker_error,
.mx_AuthBody_error {
  display: none !important;
}

/* Align logo with the form/button column */
.mx_AuthBody::before {
  width: 360px !important;
  height: 112px !important;
  margin: -12px auto 18px auto !important;
  background-position: center center !important;
  background-size: contain !important;
  transform: translateX(0px);
}

/* Make form column visually centered */
.mx_AuthBody {
  max-width: 480px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Align fields and button to same width */
.mx_AuthBody .mx_Field,
.mx_AuthBody .mx_AccessibleButton_kind_primary,
.mx_AuthBody button[type="submit"] {
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Slightly tighten vertical rhythm */
.mx_AuthBody h1,
.mx_AuthBody h2 {
  margin-top: 0 !important;
  margin-bottom: 18px !important;
}

/* Better server line */
.mx_AuthBody .mx_ServerPicker {
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Background refresh */
body {
  background:
    linear-gradient(90deg, rgba(2, 4, 8, 0.10) 0%, rgba(2, 4, 8, 0.34) 44%, rgba(2, 4, 8, 0.88) 100%),
    url('/custom/ex24-login-bg.png') center center / cover no-repeat fixed !important;
}

/* ===== EX24 HARD FINAL OVERRIDE ===== */

/* Логотип внутри карточки: принудительное выравнивание */
.mx_AuthBody::before {
  content: "" !important;
  display: block !important;
  width: 380px !important;
  height: 120px !important;
  margin-top: -10px !important;
  margin-bottom: 12px !important;
  margin-left: calc(50% - 170px) !important;
  margin-right: 0 !important;
  background-image: url('/custom/ex24-logo.png') !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;
  transform: none !important;
}

/* Скрываем сообщение автообнаружения всеми CSS-способами */
.mx_AuthBody_error,
.mx_ServerPicker_error,
.mx_ServerConfig_error,
.mx_AuthPage [class*="ServerPicker_error"],
.mx_AuthPage [class*="AuthBody_error"],
.mx_AuthPage [class*="serverConfigError"],
.mx_AuthPage [class*="error"] {
  display: none !important;
}

/* Убираем пустое место под ошибку */
.mx_AuthBody > div:empty {
  display: none !important;
}

/* Центр формы */
.mx_AuthBody {
  max-width: 500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Поля и кнопка */
.mx_AuthBody .mx_Field,
.mx_AuthBody button,
.mx_AuthBody .mx_AccessibleButton_kind_primary {
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Убрать футер Matrix */
.mx_AuthFooter,
.mx_AuthFooter *,
.mx_AuthPage .mx_AuthFooter {
  display: none !important;
}

/* ===== EX24 FINAL FIX ===== */

/* Полностью скрываем ошибку автообнаружения сервера */
.mx_AuthBody_error,
.mx_ServerPicker_error,
.mx_ServerConfig_error,
.mx_ServerPicker .mx_ServerPicker_error,
.mx_AuthBody .mx_ServerPicker_error,
.mx_AuthBody .mx_AuthBody_error,
.mx_AuthBody div[class*="error"],
.mx_AuthBody span[class*="error"],
.mx_AuthBody p[class*="error"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Убираем возможный зазор, который оставался под ошибку */
.mx_AuthBody h1 + div,
.mx_AuthBody h2 + div {
  margin-top: 0 !important;
}

/* Центруем логотип относительно формы входа */
.mx_AuthBody::before {
  width: 360px !important;
  height: 112px !important;
  margin: -12px auto 14px auto !important;
  background: url('/custom/ex24-logo.png') center center / contain no-repeat !important;
  transform: translateX(18px) !important;
}

/* Чуть опускаем заголовок после логотипа */
.mx_AuthBody h1,
.mx_AuthBody h2 {
  text-align: center !important;
  margin-top: 0 !important;
  margin-bottom: 20px !important;
}

/* Фиксируем центральную колонку формы */
.mx_AuthBody {
  max-width: 500px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Поля и кнопка одинаковой ширины и по центру */
.mx_AuthBody .mx_Field,
.mx_AuthBody .mx_AccessibleButton_kind_primary,
.mx_AuthBody button[type="submit"] {
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Домашний сервер тоже в ту же сетку */
.mx_AuthBody .mx_ServerPicker,
.mx_AuthBody .mx_ServerPicker_server,
.mx_AuthBody .mx_ServerPicker_change {
  max-width: 420px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Полностью убираем футер "На технологии Matrix" */
.mx_AuthFooter,
.mx_AuthFooter *,
.mx_AuthPage > .mx_AuthFooter,
.mx_AuthPage .mx_AuthFooter {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Немного выравниваем нижний языковой селектор */
.mx_AuthPage_modal .mx_LanguageDropdown,
.mx_AuthPage_modal .mx_Dropdown {
  margin-left: 0 !important;
}