/* GLOBAL BUSY INDICATOR (static/busy.js, 12 Oct 2026). The bubble is the pull-to-refresh spinner
   (static/ptr.js): 36px, raised surface #152420, a 1px green ring, the green arc turning every
   0.7s, top-centre just under the safe-area inset. It never takes a tap (pointer-events: none), so it
   can never block the call outcome lock, a sheet or the bell panel underneath it. Where the browser
   supports popovers it sits in the top layer (over an open <dialog>); otherwise z-index just under
   the 32-bit maximum, the same layer as ptr.js. */
.irg-busy {
  position: fixed; inset: auto; left: 50%; top: calc(env(safe-area-inset-top, 0px) + 16px);
  z-index: 2147483000; margin: 0 0 0 -60px; padding: 0; border: 0; background: transparent; overflow: visible;
  width: 120px; height: auto; max-width: none; max-height: none;
  display: flex; flex-direction: column; align-items: center; gap: 8px; color: inherit;
  pointer-events: none; opacity: 0; visibility: hidden; transition: opacity .15s ease, visibility 0s linear .15s;
}
.irg-busy[popover]:not(:popover-open) { display: none; }
.irg-busy.is-on { opacity: 1; visibility: visible; transition: opacity .15s ease; }
.irg-bubble {
  width: 36px; height: 36px; border-radius: 50%; flex: none;
  display: flex; align-items: center; justify-content: center;
  background: #152420; border: 1px solid rgba(16,185,129,0.35); box-shadow: 0 4px 14px rgba(0,0,0,0.5);
  color: #10B981;
}
.irg-bubble svg { display: block; animation: irg-busy-spin .7s linear infinite; transform-origin: 50% 50%; }
.irg-busy-note {
  font: 600 12px/16px Inter, system-ui, -apple-system, sans-serif; white-space: nowrap;
  padding: 4px 10px; border-radius: 9999px; color: rgba(255,255,255,0.92);
  background: #152420; border: 1px solid rgba(16,185,129,0.35); box-shadow: 0 4px 14px rgba(0,0,0,0.5);
}
.irg-busy-note[hidden] { display: none; }
/* Client portal: the solid light design (client/base.html). */
.irg-busy--light .irg-bubble, .irg-busy--light .irg-busy-note {
  background: #ffffff; border-color: #bfe8d7; box-shadow: 0 4px 14px rgba(19,32,25,0.18);
}
.irg-busy--light .irg-bubble { color: #0b8f66; }
.irg-busy--light .irg-busy-note { color: #132019; }
.irg-busy-sr {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* The tapped control while its work is in flight: an inline spinner, and no second tap. It is never
   `disabled` (a disabled submit button's name/value would not be sent). */
/* No pointer-events:none: a second tap must reach busy.js's capture-phase guard (which swallows it),
   not fall through to whatever is underneath. */
[data-irg-busy] { cursor: progress; }
button[data-irg-busy], a[data-irg-busy], [role="button"][data-irg-busy] { opacity: .8; }
button[data-irg-busy]::after, a[data-irg-busy]::after, [role="button"][data-irg-busy]::after {
  content: ""; display: inline-block; vertical-align: -0.125em; flex: none;
  width: .85em; height: .85em; margin-left: .45em; box-sizing: border-box;
  border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
  animation: irg-busy-spin .7s linear infinite;
}
input[data-irg-busy] { opacity: .7; }

@keyframes irg-busy-spin { to { transform: rotate(360deg); } }
@keyframes irg-busy-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }
@media (prefers-reduced-motion: reduce) {
  .irg-busy, .irg-busy.is-on { transition: none; }
  .irg-bubble svg, button[data-irg-busy]::after, a[data-irg-busy]::after, [role="button"][data-irg-busy]::after {
    animation: irg-busy-pulse 1.6s ease-in-out infinite;
  }
}

/* A full page load is on its way (static/busy.js holds it for a paint first). */
html.irg-navigating, html.irg-navigating * { cursor: progress; }
