/* Shared loading animation: a ring of dots whose brightness chases around the circle.
   Markup comes from tasda_dot_spinner() in inc-dot-spinner.php. Size: --dot-spinner-size, colour: --dot-spinner-color. */
.dot-spinner{--dot-spinner-size:44px;--dot-spinner-color:var(--primary,#52e5a5);position:relative;display:inline-block;flex:none;width:var(--dot-spinner-size);height:var(--dot-spinner-size)}
.dot-spinner i{position:absolute;inset:0;transform:rotate(calc(var(--i) * 30deg))}
.dot-spinner i::before{content:'';position:absolute;top:0;left:50%;width:calc(var(--dot-spinner-size) * .15);height:calc(var(--dot-spinner-size) * .15);margin-left:calc(var(--dot-spinner-size) * -.075);border-radius:50%;background:var(--dot-spinner-color);opacity:.15;animation:dot-spinner-chase 1.2s linear infinite;animation-delay:calc(var(--i) * .1s - 1.2s)}
.dot-spinner-lg{--dot-spinner-size:72px}
.dot-spinner-sm{--dot-spinner-size:24px}
@keyframes dot-spinner-chase{0%{opacity:1;transform:scale(1)}100%{opacity:.15;transform:scale(.5)}}
@media (prefers-reduced-motion:reduce){.dot-spinner i::before{animation-duration:2.4s}}