/* v46 — Portfolio standard: carousel arrows stay out of the way and fade in only when useful. */
:root { --arrow-fade-speed: 220ms; }

/* Apply to actual media navigation arrows only. */
.simple-slider-arrow,
.carousel-arrow,
.video-coverflow-nav,
.campaign-coverflow-nav,
.artist-carousel-arrow,
.subsidy-carousel-arrow {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateZ(0) scale(.94);
  transition:
    opacity var(--arrow-fade-speed) ease,
    visibility var(--arrow-fade-speed) ease,
    transform var(--arrow-fade-speed) ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

/* Reveal while the relevant media area is being used. */
:is(
  [data-simple-slider],
  .carousel,
  .faq-phone,
  .subsidy-phone,
  [data-video-coverflow],
  [data-campaign-coverflow],
  .artist-carousel,
  .artist-feature-card
):is(:hover, :focus-within, .is-arrow-active)
:is(
  .simple-slider-arrow,
  .carousel-arrow,
  .video-coverflow-nav,
  .campaign-coverflow-nav,
  .artist-carousel-arrow,
  .subsidy-carousel-arrow
) {
  opacity: .92;
  visibility: visible;
  pointer-events: auto;
  transform: translateZ(0) scale(1);
}

/* Keyboard users should never lose the control they focused. */
:is(
  .simple-slider-arrow,
  .carousel-arrow,
  .video-coverflow-nav,
  .campaign-coverflow-nav,
  .artist-carousel-arrow,
  .subsidy-carousel-arrow
):focus-visible {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateZ(0) scale(1) !important;
}

/* Mobile portfolio standard remains: no outer floating arrows. Inner slide arrows keep existing mobile rules. */
@media (hover: none), (max-width: 760px) {
  .video-coverflow-nav,
  .campaign-coverflow-nav,
  .artist-series-controls,
  .mobile-artist-switcher,
  .subsidy-series-nav {
    display: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .simple-slider-arrow,
  .carousel-arrow,
  .video-coverflow-nav,
  .campaign-coverflow-nav,
  .artist-carousel-arrow,
  .subsidy-carousel-arrow {
    transition: none !important;
  }
}
