@import 'src/css/quasar.variables.scss';

.wrapper--assets {
  position: relative;
  @media (min-width: $lg) {
    padding-top: 16px;
  }
  @media (min-width: $xxxl) {
    display: flex;
    justify-content: center;
  }
}

.container--assets {
  width: 100%;
  max-width: $container-max-width;
  margin: auto;
  gap: 32px;
  @media (min-width: $xl) {
    display: flex;
    justify-content: center;
    gap: 40px;
  }
}

.column--main {
  flex: 1;
  z-index: 1;
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 32px;
}

.title--account {
  margin-bottom: 24px;
}

.column--links {
  display: none;
  width: 272px;
  @media (min-width: $xl) {
    display: flex;
    flex-direction: column;
    gap: 48px;
  }
}

.container {
  border: solid 1px $gray-2;
  background-color: white;
  box-shadow: none;
  border-radius: 16px;
  padding: 16px 0;
  @media (min-width: $sm) {
    padding-left: 24px;
    padding-right: 24px;
  }
}
.body--dark {
  .container {
    background-color: $navy-1;
    border-color: $navy-3;
    box-shadow: 0px 3px 8px 0px rgba(0, 0, 0, 0.8);
  }
}
