/* Hux Studio · category flyout entrance and switching v99 */

/* Keep the accepted tab label treatment stable. */
#category-pills > .pill .pill-copy,
#subcategory-pills > .secondary-pill > span:not(.ui-icon):not(.pill-count),
#category-pills > .pill:not(:disabled):hover .pill-copy,
#category-pills > .pill:not(:disabled):focus-visible .pill-copy,
#subcategory-pills > .secondary-pill:not(:disabled):hover > span:not(.ui-icon):not(.pill-count),
#subcategory-pills > .secondary-pill:not(:disabled):focus-visible > span:not(.ui-icon):not(.pill-count),
#assets-view .asset-toolbar .search-wrap .ui-icon,
#assets-view .asset-toolbar .search-wrap:hover .ui-icon,
#assets-view .asset-toolbar .search-wrap:focus-within .ui-icon,
#category-pills > .pill .ui-icon,
#category-pills > .pill:not(:disabled):hover .ui-icon,
#category-pills > .pill:not(:disabled):focus-visible .ui-icon,
#subcategory-pills > .secondary-pill .ui-icon,
#subcategory-pills > .secondary-pill:not(:disabled):hover .ui-icon,
#subcategory-pills > .secondary-pill:not(:disabled):focus-visible .ui-icon,
#category-pills > .pill .pill-branch-indicator,
#category-pills > .pill:hover .pill-branch-indicator,
#category-pills > .pill:focus-visible .pill-branch-indicator,
#category-pills > .pill[aria-expanded="true"] .pill-branch-indicator {
  transform: none;
}

@media (min-width: 901px) {
  #subcategory-group.asset-category-flyout {
    animation: asset-branch-in 220ms cubic-bezier(0.22, 1, 0.36, 1) both;
    transition:
      top 148ms cubic-bezier(0.33, 1, 0.68, 1),
      left 148ms cubic-bezier(0.33, 1, 0.68, 1),
      border-color 100ms ease-out,
      box-shadow 136ms cubic-bezier(0.33, 1, 0.68, 1);
    will-change: top, opacity, transform;
  }

  #subcategory-group.asset-category-flyout.is-positioning {
    visibility: hidden;
    animation: none;
    transition: none;
  }

  @keyframes asset-branch-in {
    from {
      opacity: 0;
      transform: translateX(8px);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  #subcategory-group.asset-category-flyout {
    animation: none;
    transition-duration: 0.01ms !important;
  }
}