.power-epos-loader {
    display: inline-flex;
    max-width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    vertical-align: middle;
    color: inherit;
}

.power-epos-loader:not(.power-epos-loader--inline) {
    width: 100%;
    height: 100%;
}

.power-epos-loader--inline {
    flex-direction: row;
}

.power-epos-loader__icon {
    position: relative;
    display: block;
    width: var(--power-epos-loader-size, 64px);
    height: var(--power-epos-loader-size, 64px);
    flex-shrink: 0;
    --loader-logo: var(--pe-primary, #14426f);
    --loader-bolt: var(--power-epos-loader-bolt-color, #029db9);
    --loader-core: var(--power-epos-loader-bolt-color, #087c9a);
}

@supports (color: light-dark(white, black)) {
    .power-epos-loader__icon {
        --loader-logo: light-dark(var(--pe-primary, #14426f), var(--pe-primary-light, #659ac9));
        --loader-bolt: var(--power-epos-loader-bolt-color, light-dark(#029db9, #42dcf5));
        --loader-core: var(--power-epos-loader-bolt-color, light-dark(#087c9a, #edfdff));
    }
}

.power-epos-loader__artwork,
.power-epos-loader__bolt,
.power-epos-loader__fill,
.power-epos-loader__trace {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.power-epos-loader__artwork,
.power-epos-loader__trace {
    clip-path: inset(13.636364% 0 0);
}

.power-epos-loader__mark {
    fill: var(--power-epos-loader-color, var(--loader-logo));
}

.power-epos-loader__guide {
    fill: var(--loader-bolt);
    fill-opacity: 0.06;
    stroke: var(--loader-bolt);
    stroke-width: 0.8;
    stroke-opacity: 0.16;
    stroke-linejoin: round;
}

.power-epos-loader__bolt {
    /* BoltPath coordinates normalized into the SVG viewport. */
    clip-path: polygon(37.454545% 13.636364%, 64.118182% 13.636364%, 54% 31.363636%, 67.454545% 31.636364%, 28.636364% 69.363636%, 43.727273% 39.545455%, 26.636364% 39.545455%);
}

.power-epos-loader__fill {
    background: var(--loader-bolt);
    will-change: transform, opacity;
    animation: power-epos-loader-charge var(--power-epos-loader-duration, 3.4s) cubic-bezier(0.22, 0.61, 0.36, 1) infinite;
}

.power-epos-loader__trace {
    will-change: opacity;
    animation: power-epos-loader-fade var(--power-epos-loader-duration, 3.4s) linear infinite;
}

.power-epos-loader__segment {
    position: absolute;
    height: 1.636364%;
    transform-origin: 0 0;
}

.power-epos-loader__line {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 999px;
    background: var(--loader-bolt);
    transform-origin: 0 50%;
    will-change: transform;
    animation-duration: var(--power-epos-loader-duration, 3.4s);
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.power-epos-loader__glow {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: 0 0 calc(var(--power-epos-loader-size, 64px) * 0.011364) calc(var(--power-epos-loader-size, 64px) * 0.005455) var(--loader-bolt);
    opacity: var(--power-epos-loader-glow, 1);
}

.power-epos-loader__core {
    position: absolute;
    inset: 29.166667% 0 auto;
    height: 41.666667%;
    border-radius: inherit;
    background: var(--loader-core);
}

.power-epos-loader__line-0 .power-epos-loader__core {
    /* Keep the closing edge's highlight flush with the P, rather than inset by the line width. */
    top: 0;
}

.power-epos-loader__label {
    overflow-wrap: anywhere;
}

.power-epos-loader__label--hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

@keyframes power-epos-loader-fade {
    0%, 5% {
        opacity: 0;
    }
    9%, 76% {
        opacity: 1;
    }
    96%, 100% {
        opacity: 0;
    }
}

@keyframes power-epos-loader-charge {
    0%, 40% {
        transform: translate3d(0, 80%, 0);
        opacity: 0;
    }
    41% {
        opacity: 0.82;
    }
    72%, 82% {
        transform: translate3d(0, 0, 0);
        opacity: 0.82;
    }
    98%, 100% {
        transform: translate3d(0, 0, 0);
        opacity: 0;
    }
}

.power-epos-loader__line-0 {
    animation-name: power-epos-loader-line-0;
}

@keyframes power-epos-loader-line-0 {
    0%, 5% {
        transform: scaleX(0);
    }
    10.132929%, 100% {
        transform: scaleX(1);
    }
}

.power-epos-loader__line-1 {
    animation-name: power-epos-loader-line-1;
}

@keyframes power-epos-loader-line-1 {
    0%, 10.132929% {
        transform: scaleX(0);
    }
    13.898636%, 100% {
        transform: scaleX(1);
    }
}

.power-epos-loader__line-2 {
    animation-name: power-epos-loader-line-2;
}

@keyframes power-epos-loader-line-2 {
    0%, 13.898636% {
        transform: scaleX(0);
    }
    16.501506%, 100% {
        transform: scaleX(1);
    }
}

.power-epos-loader__line-3 {
    animation-name: power-epos-loader-line-3;
}

@keyframes power-epos-loader-line-3 {
    0%, 16.501506% {
        transform: scaleX(0);
    }
    26.971407%, 100% {
        transform: scaleX(1);
    }
}

.power-epos-loader__line-4 {
    animation-name: power-epos-loader-line-4;
}

@keyframes power-epos-loader-line-4 {
    0%, 26.971407% {
        transform: scaleX(0);
    }
    33.435288%, 100% {
        transform: scaleX(1);
    }
}

.power-epos-loader__line-5 {
    animation-name: power-epos-loader-line-5;
}

@keyframes power-epos-loader-line-5 {
    0%, 33.435288% {
        transform: scaleX(0);
    }
    36.740956%, 100% {
        transform: scaleX(1);
    }
}

.power-epos-loader__line-6 {
    animation-name: power-epos-loader-line-6;
}

@keyframes power-epos-loader-line-6 {
    0%, 36.740956% {
        transform: scaleX(0);
    }
    42%, 100% {
        transform: scaleX(1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .power-epos-loader--respect-reduced-motion .power-epos-loader__line,
    .power-epos-loader--respect-reduced-motion .power-epos-loader__trace,
    .power-epos-loader--respect-reduced-motion .power-epos-loader__fill {
        animation: none;
        will-change: auto;
    }

    .power-epos-loader--respect-reduced-motion .power-epos-loader__line {
        transform: scaleX(1);
    }

    .power-epos-loader--respect-reduced-motion .power-epos-loader__trace {
        opacity: 0.65;
    }

    .power-epos-loader--respect-reduced-motion .power-epos-loader__fill {
        transform: none;
        opacity: 0.15;
    }
}

@media (forced-colors: active) {
    .power-epos-loader__mark {
        fill: CanvasText;
    }

    .power-epos-loader__guide {
        fill: Highlight;
        stroke: Highlight;
    }

    .power-epos-loader__fill,
    .power-epos-loader__line,
    .power-epos-loader__core {
        forced-color-adjust: none;
        background: Highlight;
    }
}