/* Shared public action states. Layout, selected states and disabled controls
   retain their own component styles. The private staff area does not load this. */
:root {
  --igea-action-hover: #ffd467;
  --igea-action-ink: #201e1d;
  --igea-action-edge: #d49e00;
}

/* Action links and ordinary controls share the same hover treatment.
   Photo containers, image thumbnails and slide dots keep their media behavior. */
@media (hover: hover) {
  html body :is(
    a.button, a.team-button, a.header-ticket, a.menu-tickets, a.header-cta,
    a.cp-all, a.club-cta, a.stadium-link, a.campo-button, a.ticket-link,
    a.p-button, a.academy-button, a.af-button, a.sc-button, a.youth-cta,
    a.service-cta, a.family-button, a.action, a.cta, a.shop-worn-cta,
    a.discover, a.visit, a.back-partners, a.coach-profile-link,
    a.inquiry-profile, a.it-button, a.it-primary, a.back-link,
    a.footer-back-top, a.back-top, a.chapter-back, a.msp-back,
    .player-pagination > a,
    .archive-teaser > a, .story-index > a, .cms-status-actions > a,
    .fc-nav > a, .mc-tabs > a,
    button:where(:not(
      .slide-dots button, .player-open, .individual-photo,
      .staff-portrait-stage, .group-reference, .product-photo-open,
      .store-image, .detail-gallery > button,
      .detail-thumbs button, .product-thumbnails button
    )),
    input[type="button"], input[type="submit"], input[type="reset"]
  ):where(:not(
    :disabled, [aria-disabled="true"], .disabled,
    [aria-pressed="true"], [aria-selected="true"], .active, .is-active
  )):hover {
    /* Important is local to these action states: older pages contain ID-based
       color rules and the shared tools include an important primary style. */
    background: var(--igea-action-hover) !important;
    color: var(--igea-action-ink) !important;
    border-color: var(--igea-action-edge) !important;
  }

  html body :is(
    a.button, a.team-button, a.header-ticket, a.menu-tickets, a.header-cta,
    a.cp-all, a.club-cta, a.stadium-link, a.campo-button, a.ticket-link,
    a.p-button, a.academy-button, a.af-button, a.sc-button, a.youth-cta,
    a.service-cta, a.family-button, a.action, a.cta, a.shop-worn-cta,
    a.discover, a.visit, a.back-partners, a.coach-profile-link,
    a.inquiry-profile, a.it-button, a.it-primary, a.back-link,
    a.footer-back-top, a.back-top, a.chapter-back, a.msp-back,
    .player-pagination > a,
    .archive-teaser > a, .story-index > a, .cms-status-actions > a,
    .fc-nav > a, .mc-tabs > a,
    button:where(:not(
      .slide-dots button, .player-open, .individual-photo,
      .staff-portrait-stage, .group-reference, .product-photo-open,
      .store-image, .detail-gallery > button,
      .detail-thumbs button, .product-thumbnails button
    ))
  ):where(:not(
    :disabled, [aria-disabled="true"], .disabled,
    [aria-pressed="true"], [aria-selected="true"], .active, .is-active
  )):hover :where(span, small, strong, b, em, i, .index-top, .index-desc) {
    color: inherit !important;
  }

  html body .slide-dots button:not([aria-pressed="true"]):hover::after {
    background: var(--igea-action-hover) !important;
  }

  /* The season links use only an arrow tile as their filled action area. */
  html body .season-link:hover {
    color: var(--igea-action-ink) !important;
  }

  html body .season-link:hover span {
    background: var(--igea-action-hover) !important;
    color: var(--igea-action-ink) !important;
  }

  html body :is(.shirt-detail-photo:hover .detail-photo-hint,
    .shop-real-photo:hover .shop-real-expand) {
    background: var(--igea-action-hover) !important;
    color: var(--igea-action-ink) !important;
  }
}