@use "@styles/abstracts/functions" as fun;
@use "@styles/abstracts/mixins" as mix;

.wrapper {
  display: flex;
  flex-flow: column wrap;
  gap: var(--spacing-xs);
  place-items: center;
  place-content: center;
  padding: var(--spacing-md) 0 calc(var(--toolbar-size) + var(--spacing-md));

  @include mix.media("screen") {
    @include mix.dimensions("sm") {
      --toolbar-size: 0px;

      flex-flow: row wrap;
      font-size: var(--font-size-sm);
    }
  }
}

.nav {
  display: flex;
  flex-flow: row wrap;

  @include mix.media("screen") {
    @include mix.dimensions("sm") {
      &::before {
        content: "\2022";
        margin-right: var(--spacing-2xs);
      }
    }
  }
}

.back-to-top {
  position: fixed;
  bottom: calc(var(--toolbar-size, 0px) + var(--spacing-md));
  right: var(--spacing-md);
  transition: all 0.4s ease-in 0s;
}