.ads-ArrowButton {
  @apply inline-flex
    items-center
    text-white
    cursor-pointer
    font-medium
    no-underline;

  font-size: 18px;
}

.ads-ArrowButton-arrow {
  @apply flex
    items-center
    justify-center
    bg-gray-900
    text-gold-400
    border
    rounded-full
    ml-4
    w-14
    h-14;

  border-color: rgba(255, 255, 255, 0.3);
}

.ads-ArrowButton:not(.ads-ArrowButton--disabled):hover .ads-ArrowButton-arrow,
.ads-ArrowButton:not(.ads-ArrowButton--disabled):active .ads-ArrowButton-arrow,
.ads-ArrowButton:not(.ads-ArrowButton--disabled):focus .ads-ArrowButton-arrow {
  @apply bg-gold-400
    border-gold-400
    text-gray-900;
}

.ads-ArrowButton--disabled {
  @apply cursor-default
    opacity-50;
}

.ads-ArrowButton-arrow path {
  @apply fill-current;
}