html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden !important;
  overscroll-behavior: none;
  background: #000 !important;
  scrollbar-width: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
#root::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

#root {
  position: fixed !important;
  inset: 0;
  overflow: hidden !important;
  background: transparent !important;
}

#dexiAuthBackground {
  position: fixed;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

body > :not(#dexiAuthBackground) {
  position: relative;
  z-index: 1;
}

:root {
  --dexi-gradient: linear-gradient(
    105deg,
    #833ab4 0%,
    #c13584 34%,
    #e1306c 58%,
    #fd1d1d 78%,
    #fcaf45 100%
  );
}

.MuiButton-containedPrimary,
button[type="submit"] {
  border: 1px solid rgba(225, 48, 108, 0.42) !important;
  background: var(--dexi-gradient) !important;
  background-size: 180% 180% !important;
  box-shadow:
    0 8px 28px rgba(193, 53, 132, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  color: #fff !important;
}

.MuiButton-containedPrimary:hover,
button[type="submit"]:hover {
  background-position: 100% 50% !important;
  box-shadow:
    0 10px 34px rgba(225, 48, 108, 0.25),
    inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}

.MuiButton-outlinedPrimary,
.MuiButton-textPrimary,
a:not([class*="MuiButton-contained"]) {
  color: #df3f7f !important;
  border-color: rgba(225, 48, 108, 0.42) !important;
}

.MuiButton-outlinedPrimary:hover,
.MuiButton-textPrimary:hover,
a:not([class*="MuiButton-contained"]):hover {
  color: #fc6a61 !important;
  border-color: rgba(252, 106, 97, 0.66) !important;
  background-color: rgba(193, 53, 132, 0.08) !important;
}

.MuiInputLabel-root.Mui-focused,
.MuiFormLabel-root.Mui-focused {
  color: #d53b79 !important;
}

.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: #d53b79 !important;
  box-shadow: 0 0 0 1px rgba(225, 48, 108, 0.14);
}

.MuiCheckbox-colorPrimary.Mui-checked,
.MuiRadio-colorPrimary.Mui-checked,
.MuiSwitch-colorPrimary.Mui-checked,
.MuiSvgIcon-colorPrimary {
  color: #d53b79 !important;
}

h1,
h2,
h3,
.MuiTypography-h1,
.MuiTypography-h2,
.MuiTypography-h3,
.MuiTypography-h4,
.MuiTypography-h5 {
  width: fit-content;
  margin-inline: auto;
  background: var(--dexi-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

.MuiPaper-root,
.MuiCard-root {
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  background-color: rgba(12, 10, 14, 0.72) !important;
  box-shadow:
    0 18px 60px rgba(0, 0, 0, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.045) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

button:has(.MuiSvgIcon-root[data-testid="LanguageIcon"]),
button[aria-label*="language" i],
button[aria-label*="язык" i] {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.dexi-language-control {
  position: fixed !important;
  top: max(14px, env(safe-area-inset-top)) !important;
  right: auto !important;
  left: 50% !important;
  z-index: 20 !important;
  transform: translateX(calc(-50% + var(--dexi-center-shift, 0px))) !important;
  width: auto !important;
  min-width: 0 !important;
  height: 42px !important;
  padding: 0 14px !important;
  gap: 9px !important;
  border: 1px solid rgba(255, 255, 255, 0.11) !important;
  border-radius: 999px !important;
  background: rgba(10, 8, 12, 0.56) !important;
  box-shadow:
    0 10px 32px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.dexi-language-control::after {
  content: "dexi_code";
  display: inline-block;
  background: var(--dexi-gradient);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.045em;
  line-height: 1;
  white-space: nowrap;
}

.dexi-language-control:hover {
  border-color: rgba(225, 48, 108, 0.32) !important;
  background: rgba(193, 53, 132, 0.09) !important;
  box-shadow:
    0 12px 36px rgba(193, 53, 132, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.075) !important;
}

.dexi-language-shell {
  border: 0 !important;
  border-color: transparent !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.dexi-language-shell::before,
.dexi-language-shell::after {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

button:has(.MuiSvgIcon-root[data-testid="LanguageIcon"]):hover,
button[aria-label*="language" i]:hover,
button[aria-label*="язык" i]:hover {
  border: 0 !important;
  background: rgba(193, 53, 132, 0.08) !important;
  box-shadow: none !important;
}
