@reference "#styles/assets/tailwind.css";

.lg-next, .lg-prev {
  @apply flex bg-surface-default-default hover:bg-surface-turquoise-hover text-icon-petrol-default hover:text-icon-turquoise-default p-2 lg:p-4 transition-default text-lg lg:text-xl leading-none shadow-custom;
  &::before,
  &::after {
    display: none;
  }
}

.lg-prev {
  @apply scale-x-[-1];
}

.lg-counter,
.lg-sub-html,
.lg-toolbar .lg-icon {
  @apply font-display text-white;
}

.lg-sub-html {
  @apply text-xl;
}

body:not(.lg-from-hash) .lg-outer.lg-start-zoom .lg-item:not(.lg-zoomable).lg-complete .lg-img-wrap {
  @apply lg:scale-75;
}

.lg-backdrop {
  @apply bg-petrol/85;
}