@import "~/styles/variables";

.wrap {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 0 $gap / 2;
}

.tab {
  @include outer_shadow();

  padding: $gap;
  margin-right: $gap;
  border-radius: $radius $radius 0 0;
  font: $font_14_semibold;
  text-transform: uppercase;
  cursor: pointer;
  background-color: $content_bg;
  color: white;
  text-decoration: none;
  border: none;

  &.active {
    background: lighten($content_bg, 4%);
  }
}

.tabs {
  display: flex;
  flex-direction: row;
}