ul.menu-text li:has(.linkedin, .facebook, .twitter, .instagram, .tiktok, .youtube, .bluesky, .pinterest) {
  display: inline-block;
  margin-right: 1rem;
}
.linkedin,
.facebook,
.twitter,
.instagram, 
.tiktok, 
.youtube,
.bluesky,
.pinterest {
  text-transform: capitalize;
  text-indent:-9999px;
  position:relative;
  display:inline-block;
  margin:var(--d-space-xxs) 0 0 0;
  border-radius: calc(var(--d-social-media-size) / 2);
}
.linkedin span,
.facebook span,
.twitter span,
.instagram span, 
.tiktok span, 
.youtube span,
.bluesky span,
.pinterest span {
  width: var(--d-social-media-size);
  height: var(--d-social-media-size);
  -webkit-mask-image: url('../../images/icons/social-media.svg');
  mask-image: url('../../images/icons/social-media.svg');
  -webkit-mask-size: calc(var(--d-social-media-size) * 8) var(--d-social-media-size); /* width = var(--d-social-media-size) x (no. of icons + 1) */
  mask-size: calc(var(--d-social-media-size) * 8) var(--d-social-media-size); /* width = var(--d-social-media-size) x (no. of icons + 1) */
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
  border-radius: calc(var(--d-social-media-size) / 2);
  background-color: var(--d-social-media-color);
  color: var(--d-body-bg) !important;/* Override the colour in the span to the dark background colour of the footer for accessibility reasons */
  display: block;
}
.twitter span {
  -webkit-mask-position: calc(var(--d-social-media-size) * -1) 0;
  mask-position: calc(var(--d-social-media-size) * -1) 0;
}
.facebook span {
  -webkit-mask-position: calc(var(--d-social-media-size) * -2) 0;
  mask-position: calc(var(--d-social-media-size) * -2) 0;
}
.instagram span {
  -webkit-mask-position: calc(var(--d-social-media-size) * -3) 0;
  mask-position: calc(var(--d-social-media-size) * -3) 0;
}
.tiktok span {
  -webkit-mask-position: calc(var(--d-social-media-size) * -4) 0;
  mask-position: calc(var(--d-social-media-size) * -4) 0;
}
.youtube span {
  -webkit-mask-position: calc(var(--d-social-media-size) * -5) 0;
  mask-position: calc(var(--d-social-media-size) * -5) 0;
}
.bluesky span {
  -webkit-mask-position: calc(var(--d-social-media-size) * -6) 0;
  mask-position: calc(var(--d-social-media-size) * -6) 0;
}
.pinterest span {
  -webkit-mask-position: calc(var(--d-social-media-size) * -7) 0;
  mask-position: calc(var(--d-social-media-size) * -7) 0;
}
.linkedin:hover span,
.facebook:hover span,
.twitter:hover span,
.instagram:hover span,
.tiktok:hover span
.youtube:hover span,
.bluesky:hover span,
.pinterest:hover span,
.linkedin:focus-visible span,
.facebook:focus-visible span,
.twitter:focus-visible span,
.instagram:focus-visible span,
.tiktok:focus-visible span,
.youtube:focus-visible span,
.bluesky:focus-visible span,
.pinterest:focus-visible span {
  background-color: var(--d-social-media-color-hover);
}