@layer components {
  .tabs_container {
    width: 100%;
    padding-inline: var(--spacing-m);
    border-bottom: 1px solid var(--color-border);
    display: flex;
    gap: calc(var(--spacing) * 4);
  }
  .tab {
    border-bottom: calc(var(--spacing) * 2) solid transparent;
    padding-inline: var(--spacing-l);
    padding-block: var(--spacing-xs);
    font-size: var(--font-size-s);
    &.actived {
      color: var(--color-primary);
      border-bottom-color: var(--color-primary);
    }
    &:hover {
      color: var(--color-primary-hover);
    }
  }
}