/* THE BUTTON STANDARD (FIX-LIST rows 117, 118, 119, 121): one piece for the control plane, the portal and the website.
   A button dips and darkens at the instant of the press; the button whose action runs shows a small spinner and cannot be pressed again; a slow action shows the centred "Please wait" box over a dimmed page
   (the event8 mark turning, the seconds, a bar that fills). The look of a button (solid blue, outlined, red) stays with each site's own style sheet; this file only adds what happens when one is pressed. */
button:active:not(:disabled),input[type="submit"]:active:not(:disabled),input[type="button"]:active:not(:disabled),.btn:active,a.button:active,.button-link:active,.button-like:active{transform:translateY(1px) scale(.98);filter:brightness(.85)}
button.is-busy::before{content:"";display:inline-block;width:.9em;height:.9em;margin-right:.5em;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:e8spin .8s linear infinite;vertical-align:-.1em}
button.is-busy:disabled,input.is-busy:disabled{opacity:1;cursor:progress}
.e8-wait-backdrop{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);padding:16px}
.e8-wait-backdrop[hidden]{display:none}
.e8-wait{width:min(460px,100%);display:flex;flex-direction:column;align-items:center;gap:12px;padding:24px 20px;border-radius:12px;background:var(--card,#fff);color:var(--ink,var(--text,#1d2330));box-shadow:0 8px 32px rgba(0,0,0,.35);text-align:center;font:15px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif}
.e8-wait-logo{width:64px;height:64px;object-fit:contain;animation:e8spin 1.6s linear infinite}
.e8-wait-title{margin:0;font-size:1.25rem;font-weight:700}
.e8-wait-note{margin:0;font-size:.9rem;opacity:.75}
@media (min-width:600px){.e8-wait-note{white-space:nowrap}}
.e8-wait-bar{width:100%;height:10px;border-radius:5px;background:rgba(127,127,127,.3);overflow:hidden}
.e8-wait-bar span{display:block;height:100%;width:0;background:var(--accent,#2457d6);border-radius:5px;transition:width .3s ease-out}
@keyframes e8spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.e8-wait-logo{animation:none}button.is-busy::before{animation-duration:3s}}

/* ONE SIZE FOR EVERY BUTTON AND BUTTON-LIKE LINK (FIX-LIST-JS row 244): the same height (at least 44 px), text size, weight, radius and side padding for the solid and the outlined alike, sized by its words.
   Only the size lives here: the colours stay with each site's own style sheet. Left out on purpose: the bar of the page (menu items, the header buttons), tab strips, the chips and the quiet link-like buttons. */
:root :is(button, input[type="submit"], input[type="button"], .btn, .button, .button-link, a.button):not(.tab, .menu-item, .quiet-button, .link-quiet, .link, .x, .icon-button, .score-btn, summary):not(header *, .site-header *, .nav *, .tabs *) {
  box-sizing: border-box; min-height: 44px; padding: .5rem 1.1rem; font-size: 1rem; font-weight: 600; line-height: 1.25; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center; text-align: center; gap: .5rem;
}

/* ONE LOOK FOR EVERY SECONDARY (OUTLINE) BUTTON (FIX-LIST-JS row 251): a clear 2 px border and the text in the accent blue, a white face that differs from the page, a tint on hover, a visible focus ring; the solid primary is unchanged.
   The view-as bar's buttons are SOLID blue like the primary ones (they sit on a yellow bar, where an outline did not look like a button). Left out as in the size rule: the bar of the page, tabs, chips, link-like buttons. */
:root :is(button.secondary, button.quiet, .btn.secondary, .btn.quiet, .button-link.secondary, a.button-link.secondary, .button-link.outline, a.button.secondary, .secondary.button-like):not(.tab, .menu-item, .quiet-button, .link-quiet, .link, .x, .icon-button, .score-btn):not(header *, .site-header *, .nav *, .tabs *, .viewas-bar *) {
  background: #fff; color: var(--accent, #1d4ed8); border: 2px solid var(--accent, #1d4ed8);
}
:root :is(button.secondary, button.quiet, .btn.secondary, .btn.quiet, .button-link.secondary, a.button-link.secondary, .button-link.outline, a.button.secondary):not(.tab, .menu-item, .quiet-button, .link-quiet, .link, .x, .icon-button, .score-btn):not(header *, .site-header *, .nav *, .tabs *, .viewas-bar *):hover:not(:disabled) {
  background: #eef3ff; filter: none;
}
:root :is(button, .btn, .button-link, a.button):focus-visible { outline: 3px solid #1d4ed8; outline-offset: 2px; }
:root :is(button.secondary, button.quiet):disabled { opacity: .55; }
:root .viewas-bar :is(button, button.secondary, button.small) { background: var(--accent, #1d4ed8); color: #fff; border: 2px solid var(--accent, #1d4ed8); }
:root .viewas-bar :is(button, button.secondary, button.small):hover:not(:disabled) { filter: brightness(1.12); background: var(--accent, #1d4ed8); }
