/* PS UX Builder Addons — Circle Counter */

.ps-uxb-circle { --ps-circle-size: 160px; --ps-circle-bar: #446084; --ps-circle-track: #eceff3; }
.ps-uxb-circle--align-center { text-align: center; }
.ps-uxb-circle--align-left { text-align: left; }
.ps-uxb-circle--align-right { text-align: right; }
.ps-uxb-circle__graph { position: relative; display: inline-block; width: var(--ps-circle-size); height: var(--ps-circle-size); }
.ps-uxb-circle__svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.ps-uxb-circle__track { stroke: var(--ps-circle-track); }
.ps-uxb-circle__bar { stroke: var(--ps-circle-bar); transition: stroke-dashoffset var(--ps-circle-duration, 1600ms) cubic-bezier(.16, 1, .3, 1); }
.ps-uxb-circle__center { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; }
.ps-uxb-circle__number { font-size: calc(var(--ps-circle-size) / 4.6); font-weight: 700; line-height: 1; color: var(--ps-circle-value, inherit); font-variant-numeric: tabular-nums; }
.ps-uxb-circle__icon { font-size: calc(var(--ps-circle-size) / 3.6); color: var(--ps-circle-bar); line-height: 1; }
.ps-uxb-circle__title { margin: .7em 0 0; }
.ps-uxb-circle__subtitle { margin: .25em 0 0; opacity: .75; font-size: .92em; }

@media (prefers-reduced-motion: reduce) {
	.ps-uxb-circle__bar { transition: none; }
}