/* Reusable micro-interaction: gentle pop on hover/focus */
/* Opt-in with class="fx-pop" so it never surprises you elsewhere */

@media (hover: hover) and (pointer: fine) {
  @media (prefers-reduced-motion: no-preference) {
    .fx-pop {
      transition: transform 120ms ease, filter 120ms ease;
      will-change: transform;
      transform-origin: center;
    }
    .fx-pop:hover {
      transform: scale(1.02);
      filter: brightness(1.02);
    }
    .fx-pop:focus-visible {
      transform: scale(1.02);
      outline: 2px solid currentColor;
      outline-offset: 2px;
    }
    .fx-pop:disabled {
      transform: none !important;
      filter: none !important;
      cursor: not-allowed;
    }
  }
}

/* Optional: equal-width helpers for action rows */
.fx-actions {
  display: flex;
  gap: .5rem;
}
.fx-actions > .fx-grow {
  flex: 1;
}

/* Primary action buttons (safe, isolated, no conflicts) */
.primary-action {
    background-color: #87ace0;
    border-color: #87ace0;
    color: #fff;
    padding: 0.6rem 1rem;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.primary-action:hover,
.primary-action:focus {
    background-color: #7399d9;
    border-color: #7399d9;
}

.primary-action:active {
    background-color: #658acb;
    border-color: #658acb;
}