/* Shared UI motion (Jaspr main.css does not emit @keyframes reliably). */

@keyframes nemu-spin {
  to {
    transform: rotate(360deg);
  }
}

@keyframes nemu-busy-pulse {
  0%,
  100% {
    opacity: 0.55;
  }
  50% {
    opacity: 1;
  }
}

.nemu-spinner {
  display: inline-block;
  width: 18px;
  height: 18px;
  box-sizing: border-box;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  animation: nemu-spin 0.65s linear infinite;
  flex-shrink: 0;
  will-change: transform;
}

.nemu-spinner--medium {
  width: 32px;
  height: 32px;
  border-width: 3px;
}

.nemu-btn--secondary .nemu-spinner {
  border-color: rgba(15, 15, 20, 0.15);
  border-top-color: var(--nemu-primary, #7c3aed);
}

.nemu-btn--ghost .nemu-spinner,
.nemu-btn--destructive .nemu-spinner {
  border-color: rgba(15, 15, 20, 0.15);
  border-top-color: currentColor;
}

.nemu-btn--loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  cursor: wait;
  opacity: 1 !important;
}

.auth-page__busy-banner .nemu-spinner {
  animation-duration: 0.55s;
}

.auth-page__loading .nemu-spinner {
  animation-duration: 0.75s;
}

.app-loading .nemu-spinner {
  border-color: rgba(15, 15, 20, 0.12);
  border-top-color: var(--nemu-primary, #7c3aed);
}

@media (prefers-reduced-motion: reduce) {
  .nemu-spinner {
    animation: nemu-busy-pulse 1.1s ease-in-out infinite;
    border-top-color: inherit;
  }
}

/* Pill / chip controls: no rectangular tap flash; hover only on fine pointers. */
button,
.nemu-btn,
.landing-hero__tab,
.landing-hero__chip,
.feed-filters__chip,
.marketing-header__nav-link,
.marketing-header__menu-btn,
.landing-signed-in-bar__link,
.app-shell__nav-link,
.app-shell__menu-btn {
  -webkit-tap-highlight-color: transparent;
}

.app-shell__menu-btn::-webkit-details-marker,
.marketing-header__menu-btn::-webkit-details-marker,
.marketing-header__drawer > summary::-webkit-details-marker {
  display: none;
}

.app-shell__menu-btn::marker,
.marketing-header__menu-btn::marker,
.marketing-header__drawer > summary::marker {
  content: '';
}

.landing-hero__tab:active,
.landing-hero__chip:active,
.feed-filters__chip:active,
.marketing-header__nav-link:active,
.landing-signed-in-bar__link:active,
.app-shell__nav-link:active,
.detail-action-row:active:not(.detail-action-row--disabled),
.nemu-btn:active:not(.nemu-btn--disabled):not(.nemu-btn--loading),
.marketing-header__menu-btn:active,
.app-shell__menu-btn:active {
  transform: scale(0.98);
}

.landing-hero__tab:not(.landing-hero__tab--active):active,
.landing-hero__chip:not(.landing-hero__chip--active):active,
.feed-filters__chip:not(.feed-filters__chip--active):active {
  background-color: var(--nemu-surface-container-high);
}

@media (hover: hover) and (pointer: fine) {
  .marketing-header__nav-link:hover {
    background-color: var(--nemu-surface-container-high);
  }

  .landing-signed-in-bar__link:hover {
    background-color: color-mix(in srgb, var(--nemu-primary) 8%, transparent);
  }

  .landing-hero__skip:hover {
    opacity: 0.85;
  }

  .app-shell__nav-link:hover:not(.app-shell__nav-link--active) {
    color: var(--nemu-on-surface);
    background-color: var(--nemu-surface-container-high);
  }

  .landing-hero__tab:not(.landing-hero__tab--active):hover,
  .landing-hero__chip:not(.landing-hero__chip--active):hover,
  .feed-filters__chip:not(.feed-filters__chip--active):hover {
    background-color: var(--nemu-surface-container-high);
  }

  .nemu-btn:hover:not(.nemu-btn--disabled):not(.nemu-btn--loading) {
    opacity: 0.92;
  }

  .detail-action-row:hover:not(.detail-action-row--disabled) {
    background-color: var(--nemu-surface-container);
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing-hero__tab:active,
  .landing-hero__chip:active,
  .feed-filters__chip:active,
  .marketing-header__nav-link:active,
  .landing-signed-in-bar__link:active,
  .app-shell__nav-link:active,
  .detail-action-row:active:not(.detail-action-row--disabled),
  .nemu-btn:active:not(.nemu-btn--disabled):not(.nemu-btn--loading),
  .marketing-header__menu-btn:active,
  .app-shell__menu-btn:active {
    transform: none;
  }
}
