/* ==========================================================================
   Coffer Backstage — Phase 4 + 5 supplemental styles
   Built on top of /opt/sure/branding/coffer-brand.css (Phase 1 owns vars + keyframes).
   This file ONLY adds row-level polish for accounts and transactions.
   ========================================================================== */

/* Account rows — subtle inner highlight on hover to feel like a Backstage panel. */
.coffer-account-row {
  position: relative;
  isolation: isolate;
}
.coffer-account-row::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  transition: opacity 200ms ease;
  background:
    radial-gradient(120% 60% at 50% 0%, rgb(255 255 255 / 0.04), transparent 60%);
  z-index: -1;
}
.coffer-account-row:hover::before {
  opacity: 1;
}

/* New-row ticker flash — apply `.coffer-row-flash` to a transaction row to
   trigger the one-shot emerald wash. Reuses Phase 1 keyframes. */
.coffer-row-flash {
  animation: coffer-ticker-flash 1s ease-out 1;
}

/* Reduced motion — honor Phase 1's policy. */
@media (prefers-reduced-motion: reduce) {
  .coffer-row-flash { animation: none !important; }
}
