@charset "utf-8";

:root, :host { --van-loading-text-color: var(--van-text-color-2); --van-loading-text-font-size: var(--van-font-size-md); --van-loading-spinner-color: var(--van-gray-5); --van-loading-spinner-size: min(8vw, 40px); --van-loading-spinner-duration: .8s; }

.van-loading { position: relative; color: var(--van-loading-spinner-color); font-size: 0px; vertical-align: middle; }

.van-loading__spinner { position: relative; display: inline-block; width: var(--van-loading-spinner-size); max-width: 100%; height: var(--van-loading-spinner-size); max-height: 100%; vertical-align: middle; animation: van-rotate var(--van-loading-spinner-duration) linear infinite; }

.van-loading__spinner--spinner { animation-timing-function: steps(12); }

.van-loading__spinner--circular { animation-duration: 2s; }

.van-loading__line { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }

.van-loading__line::before { display: block; width: min(0.533vw, 2.667px); height: 25%; margin: 0px auto; background-color: currentcolor; border-radius: 40%; content: " "; }

.van-loading__circular { display: block; width: 100%; height: 100%; }

.van-loading__circular circle { animation: 1.5s ease-in-out 0s infinite normal none running van-circular; stroke: currentcolor; stroke-width: 3; stroke-linecap: round; }

.van-loading__text { display: inline-block; margin-left: var(--van-padding-xs); color: var(--van-loading-text-color); font-size: var(--van-loading-text-font-size); vertical-align: middle; }

.van-loading--vertical { display: flex; flex-direction: column; align-items: center; }

.van-loading--vertical .van-loading__text { margin: var(--van-padding-xs) 0 0; }

@keyframes van-circular { 
  0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0; }
  50% { stroke-dasharray: 90, 150; stroke-dashoffset: -40; }
  100% { stroke-dasharray: 90, 150; stroke-dashoffset: -120; }
}

.van-loading__line--1 { transform: rotate(30deg); opacity: 1; }

.van-loading__line--2 { transform: rotate(60deg); opacity: 0.9375; }

.van-loading__line--3 { transform: rotate(90deg); opacity: 0.875; }

.van-loading__line--4 { transform: rotate(120deg); opacity: 0.8125; }

.van-loading__line--5 { transform: rotate(150deg); opacity: 0.75; }

.van-loading__line--6 { transform: rotate(180deg); opacity: 0.6875; }

.van-loading__line--7 { transform: rotate(210deg); opacity: 0.625; }

.van-loading__line--8 { transform: rotate(240deg); opacity: 0.5625; }

.van-loading__line--9 { transform: rotate(270deg); opacity: 0.5; }

.van-loading__line--10 { transform: rotate(300deg); opacity: 0.4375; }

.van-loading__line--11 { transform: rotate(330deg); opacity: 0.375; }

.van-loading__line--12 { transform: rotate(360deg); opacity: 0.3125; }