html {
  text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html.e2e-test * {
  transition: none !important;
  animation-duration: 0s !important;
  animation-delay: -2s !important;
}

html,
body {
  width: 100%;
  height: 100%;

  margin: 0;
  padding: 0;
}

body {
  overflow-y: scroll;
  overscroll-behavior-y: none;
  background-color: rgb(255, 255, 255);

  padding-top: 50px;

  min-width: 300px;

  -ms-overflow-style: -ms-autohiding-scrollbar;
}

@supports (padding-top: constant(safe-area-inset-top)) {
  body {
    --safe-area-inset-top: constant(safe-area-inset-top);
    padding-top: calc(50px + var(--safe-area-inset-top));
  }
}

@supports (padding-top: env(safe-area-inset-top)) {
  body {
    --safe-area-inset-top: env(safe-area-inset-top);
    padding-top: calc(50px + var(--safe-area-inset-top));
  }
}

#root {
  display: flex;
  flex-direction: column;

  margin: 0;
  padding: 0;

  position: relative;
  height: 100%;
}

* {
  box-sizing: border-box;
}

body,
input,
textarea,
select,
button {
  font-family: 'Avenir Next', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell,
    'Helvetica Neue', sans-serif;

  color: #12273f;

  font-weight: normal;
}

input,
textarea,
select,
button {
  -webkit-appearance: none;
  appearance: none;

  padding: 0;
}

.bring-forward {
  z-index: 1;
}

.bring-front {
  z-index: 2;
}


.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}

.uppercase {
  text-transform: uppercase;
}

.no-wrap {
  white-space: nowrap;
}

.disable-scroll {
  overflow: hidden;
  touch-action: none;
  max-height: 100%;

  -webkit-overflow-scrolling: auto;
}

.responsive-vault {
  max-width: 100%;
}

.border-color-transparent {
  border-color: transparent;
}

/*
  Media queries for the left hand vault panel from:
  https://codepen.io/jtoon/pen/qMaEOK
*/
@media (min-width: 1000px) {
  html,
  body {
    overflow: hidden;
  }

  #root {
    height: 100%;
  }

  .responsive-vault {
    max-width: 360px;
    min-width: 360px;
  }
}

@media (min-width: 1281px) {
  .responsive-vault {
    max-width: 420px;
    min-width: 420px;
  }
}

/* SPLASH SCREEN Hide Style and Animation */
.splash-screen.hide {
  background-color: transparent;
}

.splash-screen .splash-screen-img {
  transition: transform 0.2s ease-in 0.4s, opacity 0.3s ease-out 0.4s;
}

.splash-screen.hide .splash-screen-img {
  opacity: 0;
  transform: scale(2);
}