.promo-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--COLOR-PRIMARY);
  color: var(--COLOR-PRIMARY-OPPOSITE);
  padding: 10px;
  &:has(.promo-bar__link) {
    transition: background-color 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
    &:has(.promo-bar__link:hover) {
      background-color: var(--COLOR-PRIMARY-HOVER);
      color: var(--COLOR-PRIMARY-OPPOSITE);
    }
  }
  .promo-bar__link {
    cursor: pointer;
  }
}

.promo-bar--spacing-top {
  margin-top: 20px;
}

.promo-bar--spacing-bottom {
  margin-bottom: 20px;
}