/* Minimal, conflict-free spinner styles (namespaced with `mm-`) */

/* Border spinner (like Bootstrap's spinner-border) */
.mm-spinner-border {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  vertical-align: text-bottom;
  border: 0.25em solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: mm-spinner-rotate .75s linear infinite;
  color: #126ce2; /* default color */
}

/* Growing dot spinner (like Bootstrap's spinner-grow) */
.mm-spinner-grow {
  display: inline-block;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background-color: currentColor;
  animation: mm-spinner-grow .75s linear infinite;
  color: #126ce2; /* default color */
}

/* Sizes */
.mm-spinner-sm { width: 1rem; height: 1rem; }
.mm-spinner-lg { width: 3rem; height: 3rem; }

/* Simple centering helper */
.mm-spinner-center { display: block; margin: 40px auto; }

/* Accessibility helper (visually hidden) */
.mm-visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

@keyframes mm-spinner-rotate {
  to { transform: rotate(360deg); }
}

@keyframes mm-spinner-grow {
  0% { transform: scale(0); opacity: 0.3; }
  50% { opacity: 0.8; }
  100% { transform: scale(1); opacity: 0.3; }
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  .mm-spinner-border, .mm-spinner-grow {
    animation-duration: 1.5s;
  }
}
