/* Press, ripple, and loading states for every control */
button,
a.btn,
a.nav-item,
.btn,
.acct,
.dest,
[role="button"]{
  -webkit-tap-highlight-color:transparent;
  position:relative;
}
button:active:not(:disabled):not(.is-busy),
a.btn:active:not(.is-busy),
a.nav-item:active,
.btn:active:not(.is-busy),
.acct:active,
.dest:active,
[role="button"]:active:not(:disabled):not(.is-busy){
  transform:translateY(1px) scale(.98);
  filter:brightness(.96);
}
.btn-ripple-layer{
  position:absolute;
  inset:0;
  overflow:hidden;
  border-radius:inherit;
  pointer-events:none;
  z-index:2;
}
.btn-ripple{
  position:absolute;
  border-radius:50%;
  background:currentColor;
  opacity:.22;
  transform:scale(0);
  animation:btn-ripple .55s ease-out forwards;
  pointer-events:none;
}
@keyframes btn-ripple{to{transform:scale(2.6);opacity:0}}

.btn-spin{
  width:1em;
  height:1em;
  border:2px solid currentColor;
  border-right-color:transparent;
  border-radius:50%;
  animation:btn-spin .65s linear infinite;
  flex:0 0 auto;
}
@keyframes btn-spin{to{transform:rotate(360deg)}}

button.is-busy,
a.btn.is-busy,
.btn.is-busy{
  pointer-events:none;
  cursor:wait;
  opacity:.88;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55em;
  transform:none !important;
  filter:none;
}
.searchbtn.is-busy,
.dr-pay.is-busy,
.acct-btn.is-busy,
.cta.is-busy,
.rbtn.is-busy,
.bk-cta.is-busy,
.am-item.is-busy,
.nav-item.is-busy,
.qf-chip.is-busy{
  display:flex;
}

@media (prefers-reduced-motion:reduce){
  .btn-ripple{animation:none;opacity:0}
  button:active:not(:disabled),
  a.btn:active,
  .btn:active{transform:none;filter:none}
  .btn-spin{animation-duration:1.4s}
}