Lozenge: Programme (Events)

.lozenge {
  display: inline-block;
  background-color: $gray-200;
  padding: 0.125rem 0.5rem;
  border-bottom-right-radius: 0.5rem;
  border-top-left-radius: 0.5rem;

  &--programme {
    font-size: 0.8rem;
    text-transform: uppercase;

    @each $name, $hex in $genre-colours {
      &__#{$name} {
        background-color: $hex;
        color: $white;
      }
    }

    &__family {
      color: inherit;
    }
  }

  &--content {
    background-color: $primary;
  }
}