/* Индикатор за зареждане на жест, който още работи (ProcessGate): върху самия елемент, без добавени възли. */
.is-busy {
  position: relative;
  cursor: progress;
}

/* Бутон: съдържанието се скрива и в средата се върти спинер (цветът е на самия бутон). */
.is-busy--button {
  color: transparent !important;
}

.is-busy--button > * {
  visibility: hidden;
}

.is-busy--button::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.1em;
  height: 1.1em;
  box-sizing: border-box;
  border: 0.16em solid var(--sensor-fg, currentColor);
  border-right-color: transparent;
  border-radius: 50%;
  animation: sensor-spin 0.7s linear infinite;
}

/* Всичко друго (карта, ред, връзка): лента за неопределено зареждане най-горе; съдържанието си остава четимо. */
.is-busy--surface {
  overflow: hidden;
}

.is-busy--surface::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, var(--bs-primary, #0d6efd) 50%, transparent 100%);
  background-size: 40% 100%;
  background-repeat: no-repeat;
  animation: sensor-bar 1.1s ease-in-out infinite;
}

/* Заключен контейнер (lock): другите елементи в него не реагират, докато процесът върви (блокира ProcessGate, не CSS —
   иначе падат и несвързаните жестове върху същите елементи, напр. двоен клик). */
.is-locked {
  cursor: progress;
}

.is-locked:not(.is-busy) > * {
  opacity: 0.85;
}

@keyframes sensor-spin {
  to { transform: rotate(360deg); }
}

@keyframes sensor-bar {
  from { background-position: -40% 0; }
  to   { background-position: 140% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .is-busy--button::after { animation-duration: 2s; }
  .is-busy--surface::after { animation-duration: 3s; }
}