/* In-button / in-link busy state (global). Toggle .action-loading-on via action-loading.js or window.ActionBusy.set(el, true). */

.action-loading-on {
  position: relative !important;
  pointer-events: none;
  cursor: wait;
  /* Avoid clipping the ring on iOS / inside rounded cards */
  overflow: visible !important;
}

/* Flex controls: spinner stays geometrically centered with label + icons */
button.action-loading-on,
.btn.action-loading-on,
a.btn.action-loading-on,
.btn-primary.action-loading-on,
.btn-secondary.action-loading-on,
.btn-accent.action-loading-on,
.btn-red.action-loading-on,
.btn-blue.action-loading-on,
.btn-ghost.action-loading-on,
.abt.action-loading-on,
.page-btn.action-loading-on,
.table-pager-btn.action-loading-on,
.login-btn.action-loading-on,
.nav-item.action-loading-on,
.sub-item.action-loading-on {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.action-loading-on:hover {
  transform: none !important;
}

.action-loading-on > * {
  opacity: 0.28;
  transition: opacity 0.12s ease;
}

/* Centered ring (translate kept in sync with rotation) */
.action-loading-on::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1.125rem;
  height: 1.125rem;
  margin: 0;
  /* Default: visible on light surfaces; solid / sidebar buttons override below */
  border: 2px solid rgba(0, 0, 0, 0.1);
  border-top-color: var(--accent, #8f967d);
  border-radius: 50%;
  transform: translate(-50%, -50%) translateZ(0);
  -webkit-transform: translate(-50%, -50%) translateZ(0);
  -webkit-animation: actionBusySpin 0.65s linear infinite;
  animation: actionBusySpin 0.65s linear infinite;
  z-index: 3;
  box-sizing: border-box;
  will-change: transform;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.abt.action-loading-on::after {
  width: 0.875rem;
  height: 0.875rem;
  border-width: 2px;
}

@-webkit-keyframes actionBusySpin {
  from {
    -webkit-transform: translate(-50%, -50%) translateZ(0) rotate(0deg);
    transform: translate(-50%, -50%) translateZ(0) rotate(0deg);
  }
  to {
    -webkit-transform: translate(-50%, -50%) translateZ(0) rotate(360deg);
    transform: translate(-50%, -50%) translateZ(0) rotate(360deg);
  }
}

@keyframes actionBusySpin {
  from {
    -webkit-transform: translate(-50%, -50%) translateZ(0) rotate(0deg);
    transform: translate(-50%, -50%) translateZ(0) rotate(0deg);
  }
  to {
    -webkit-transform: translate(-50%, -50%) translateZ(0) rotate(360deg);
    transform: translate(-50%, -50%) translateZ(0) rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .action-loading-on::after {
    -webkit-animation: actionBusySpinReduced 1.1s ease-in-out infinite alternate;
    animation: actionBusySpinReduced 1.1s ease-in-out infinite alternate;
  }
}

@-webkit-keyframes actionBusySpinReduced {
  from {
    opacity: 0.35;
  }
  to {
    opacity: 1;
  }
}

@keyframes actionBusySpinReduced {
  from {
    opacity: 0.35;
  }
  to {
    opacity: 1;
  }
}

@media (max-width: 860px) {
  .action-loading-on:not(.abt)::after {
    width: 1.25rem;
    height: 1.25rem;
  }
}

/* Sidebar (dark chrome) */
.sidebar .nav-item.action-loading-on::after,
.sidebar a.sub-item.action-loading-on::after {
  border-color: rgba(255, 255, 255, 0.2);
  border-top-color: rgba(255, 255, 255, 0.95);
}

/* Light surfaces: secondary, icon cells, pagination (inactive) */
.btn-secondary.action-loading-on::after,
.btn-ghost.action-loading-on::after,
.abt.action-loading-on::after,
.page-btn:not(.active).action-loading-on::after,
.table-pager-btn.action-loading-on::after {
  border-color: rgba(0, 0, 0, 0.1);
  border-top-color: var(--accent, #8f967d);
}

/* Solid / gradient primaries */
.btn-primary.action-loading-on::after,
.btn-accent.action-loading-on::after,
.btn-red.action-loading-on::after,
.btn-blue.action-loading-on::after,
.login-btn.action-loading-on::after {
  border-color: rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
}

.page-btn.active.action-loading-on::after {
  border-color: rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
}

/* Invoice view (inv-modern) */
.inv-modern .btn.action-loading-on::after,
.inv-modern a.btn.action-loading-on::after {
  border-color: rgba(0, 0, 0, 0.12);
  border-top-color: var(--primary, #8f967d);
}

.inv-modern .btn.primary.action-loading-on::after,
.inv-modern a.btn.primary.action-loading-on::after {
  border-color: rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
}

.inv-modern .btn.danger.action-loading-on::after {
  border-color: rgba(181, 69, 58, 0.3);
  border-top-color: #b5453a;
}

.inv-modern .btn-secondary.action-loading-on::after {
  border-color: rgba(0, 0, 0, 0.12);
  border-top-color: var(--primary, #8f967d);
}

.inv-modern .btn-mini.action-loading-on::after {
  width: 0.8125rem;
  height: 0.8125rem;
}

/* Invoice dropdown rows (white surface, not .btn — needs explicit ring colors) */
.inv-modern .inv-actions-item.action-loading-on::after,
.inv-modern a.inv-actions-item.action-loading-on::after {
  border-color: rgba(0, 0, 0, 0.1);
  border-top-color: var(--primary, #8f967d);
}

/* Plain text links in main (not styled as buttons) */
.main a.action-loading-on:not(.btn):not(.btn-primary):not(.btn-secondary):not(.abt):not(.page-btn):not(.nav-item):not(.sub-item)::after {
  border-color: rgba(0, 0, 0, 0.1);
  border-top-color: var(--accent, #8f967d);
}

body.dark .main a.action-loading-on:not(.btn):not(.btn-primary):not(.btn-secondary):not(.abt):not(.page-btn):not(.nav-item):not(.sub-item)::after {
  border-color: rgba(255, 255, 255, 0.12);
  border-top-color: var(--accent2, #9b94ff);
}

/* Light theme sidebar */
body.light .sidebar .nav-item.action-loading-on::after,
body.light .sidebar a.sub-item.action-loading-on::after {
  border-color: rgba(0, 0, 0, 0.1);
  border-top-color: var(--accent, #8f967d);
}

/* Public proposal signature (brand button on green) */
body.proposal-public .btn-signature-submit.action-loading-on::after {
  border-color: rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
}
