/* Reset CSS */
* {
  background: inherit !important;
  color: inherit !important;
  border: inherit !important;
  width: inherit !important;
  height: inherit !important;
  max-width: inherit !important;
  max-height: inherit !important;
}

/* Weird they do it this way */
*::after,
*::before {
  display: none !important;
}

/* Custom CSS */
:root {
  --branding: #7B7BBE;
  --branding-hover: hsl(240, 34%, 71%);
}

body {
  background: #141414 !important;
  color: white !important;
  font-family: Arial, Helvetica, sans-serif !important;
}

script,
iframe,
style {
  display: none !important;
}

a {color: var(--branding) !important}
a:hover {color: var(--branding-hover) !important}
[type="submit"] {
  width: 100%;
  border-radius: 6px !important;
  border: 2px #ffffff21 solid;
  background: var(--branding) !important;
  transition: 0.3s background;
}
[type="submit"]:hover {
  background: var(--branding-hover) !important;
  transition: 0.3s background;
}

input {
  background: #ffffff3d !important;
  color: white !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  margin: 6px 0px !important;
  border: 2px #ffffff21 solid !important;
  width: 100% !important;
  display: block !important;
}
input:focus {
  outline: none !important;
}

[href="/realms/Wormhole/account/introduction"] { /* Broken Page */
  pointer-events: none !important;
  filter: brightness(0.5);
}
[href="/realms/master/account/introduction"] { /* Broken Page */
  pointer-events: none !important;
  filter: brightness(0.5);
}

.pf-c-card {
  max-width: 500px !important;
}
.pf-c-card h2 {
  font-weight: bold !important;
  font-size: 24px !important;
  margin-bottom: 12px;
}

.pf-v5-c-button.pf-m-primary {
  border-radius: 3rem !important;
}
.pf-v5-c-button.pf-m-secondary,
.pf-v5-c-button.pf-m-link.pf-v5-u-display-none.pf-v5-u-display-inline-flex-on-lg {
  background: white !important;
  color: black !important;
  border-radius: 3rem !important;
}

#delete-account-btn {
  background: #983b3b !important;
  color: white !important;
  border-radius: 3rem !important;
  width: max-content !important;
}

._brand_1gmge_1 {
  width: 32px !important;
}
.pf-v5-c-menu-toggle::after,
.pf-v5-c-menu-toggle::before {
  display: none !important;
}
.pf-v5-c-menu-toggle {
  background: white !important;
  color: black !important;
  border-radius: 3rem !important;
  padding: 6px 10px 6px 16px !important;
}
.pf-v5-c-menu__item {
  border-radius: 6px;
  padding: 6px 12px;
  transition: 0.3s background;
}
.pf-v5-c-menu__item:hover {
  background: #343434 !important;
  transition: 0.3s background;
}
.pf-v5-c-menu__list {
  background: #4e4e4e !important;
  border-radius: 6px;
  margin-top: 6px;
  padding: 2px !important;
  gap: 2px;
  display: flex;
  flex-direction: column;
}

#content-account-console,
.pf-v5-c-data-list__expandable-content-body {
  background: #050505 !important;
  border-radius: 12px !important;
  width: calc(100% - 12px) !important;
}

.pf-v5-c-alert.pf-m-inline {
  background: #050505 !important;
  border-radius: 12px !important;
  width: calc(100% - 12px) !important;
}

.pf-v5-c-nav__link,
.pf-v5-c-nav__link.pf-m-current {
  background: transparent !important;
  transition: 0.3s background;
  border-radius: 6px;
  margin: 0px !important;
  padding: 6px 12px !important;
  font-size: 16px !important;
  width: fit-content !important;
  color: white !important;
}
.pf-v5-c-nav__link:hover {
  background: rgba(20, 20, 20, 0.5) !important;
}
.pf-v5-c-nav__link.pf-m-current {
  background: #141414 !important;
  transition: 0.3s background;
  color: hsl(240, 34%, 71%) !important;
}

svg.pf-v5-c-spinner.pf-m-xl {
  width: 48px !important;
  height: 48px !important;
  position: fixed;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%);
}

/* Layout Change */
body {
  background: #0a0a0a !important;
  margin: 0px 12px;
}
#app {
  max-width: 1024px !important;
  margin: auto !important;
}
.pf-v5-c-masthead__brand,
.pf-v5-c-masthead__toggle,
.pf-v5-c-masthead.pf-m-display-inline,
.pf-v5-c-masthead__content {
  display: none !important;
}
.pf-v5-c-page__sidebar.pf-m-collapsed {
  border: inherit !important;
  transform: inherit !important;
}

@media screen and (max-width: 870px) {
  .pf-v5-c-nav__list {
    flex-direction: column !important;
  }
  .pf-v5-c-nav__link,
  .pf-v5-c-nav__link.pf-m-current {
    width: 100% !important;
    padding: 12px !important;
  }
}

.pf-v5-c-page {
  grid-template-columns: none !important;
  grid-template-areas: none !important;
  display: flex !important;
  flex-direction: column;
}
.pf-v5-c-page__main {
  background: #141414 !important;
  border-radius: 0px 0px 12px 12px !important;
  box-shadow: 0px 0px 0px 2px #050505;
  max-width: calc(100% - 4px) !important;
  margin-left: 2px;
}
.pf-v5-c-nav__list {
  background: #050505 !important;
  border-radius: 12px 12px 0px 0px !important;
  padding: 12px;
  display: flex;
  gap: 6px;
  margin-top: 24px;
  box-shadow: 0px 0px 0px 2px #050505;
}