.toolbar-link--has-icon.icon-play {
  --icon: url(/themes/custom/quran/media/audio/play.svg) !important;
}
.toolbar-link--has-icon.icon-pause {
  --icon: url(/themes/custom/quran/media/audio/pause.svg) !important;
}
.toolbar-link--has-icon.icon-pause,
.toolbar-link--has-icon.icon-play  {
  border-radius: var(--space-xs) !important;
  background: var(--gin-bg-layer2) !important;
  cursor: pointer !important;
  border: none !important;
  background: transparent !important;
  height: 32px !important;
  width: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: var(--gin-transition) !important;
}

.toolbar-link--has-icon.icon-pause:hover,
.toolbar-link--has-icon.icon-play:hover {
  color: var(--gin-color-primary-hover);
  background-color: var(--gin-bg-item-hover) !important;
}

.playbutton-audio-element {
  /* Drupal's standard way to visually hide an element but keep it for screen readers */
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px) !important;
  overflow: hidden !important;
  height: 1px !important;
  width: 1px !important;
  padding: 0 !important;
  border: 0 !important;
}