/* Action-button loading: overlay + spinner.
   Never force position:!important — catalog .btn-add2cart is position:absolute. */
:root {
  --tm-action-loading-color: var(--color-red, #8C0014);
}

.tm-btn-loading {
  pointer-events: none;
  cursor: wait;
}

/* relative only without !important so .catalog-list .item .btn-add2cart (absolute) wins */
.btn.tm-btn-loading,
button.tm-btn-loading,
a.tm-btn-loading {
  position: relative;
}

.catalog-list .item .btn-add2cart.tm-btn-loading,
.catalog-list .item a.btn-add2cart.tm-btn-loading {
  position: absolute;
}

.tm-btn-loading::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  border-radius: inherit;
  background: rgba(255, 255, 255, 0.55);
  pointer-events: none;
}

.tm-btn-loading.btn-red::before,
.tm-btn-loading.btn-orange::before,
a.btn-add2cart.tm-btn-loading::before {
  background: rgba(0, 0, 0, 0.28);
}

.tm-btn-loading::after {
  content: "";
  box-sizing: border-box;
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: tm-btn-spin 0.65s linear infinite;
  pointer-events: none;
}

.tm-btn-loading:not(.btn-red):not(.btn-orange):not(.btn-add2cart)::after {
  border-color: rgba(140, 0, 20, 0.22);
  border-top-color: var(--tm-action-loading-color);
}

a.add2fav.tm-btn-loading::before,
a.add2compare.tm-btn-loading::before,
.add2fav.tm-btn-loading::before,
.add2compare.tm-btn-loading::before {
  display: none; /* icon buttons: spinner only, no white plate */
}

a.add2fav.tm-btn-loading::after,
a.add2compare.tm-btn-loading::after,
.add2fav.tm-btn-loading::after,
.add2compare.tm-btn-loading::after {
  width: 14px;
  height: 14px;
  border-color: rgba(140, 0, 20, 0.22);
  border-top-color: var(--tm-action-loading-color);
}

@keyframes tm-btn-spin {
  to {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .tm-btn-loading::after {
    animation: none;
  }
}