/*
 * WP Easy Donate: Total Raised and Goal Progress widgets.
 * Every value is a --wped-* token declared on .wped-widget; brand values come from the
 * Style settings (:root variables printed by StyleVariables). Breakdance elements override
 * these tokens on %%SELECTOR%% .wped-widget.
 */
.wped-widget {
	--wped-accent: var(--wped-color-primary, #1f5f4a);
	--wped-text: var(--wped-color-text, #1d1d1b);
	--wped-text-muted: color-mix(in srgb, var(--wped-text) 62%, transparent);
	--wped-font: var(--wped-font-body, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif);
	--wped-font-display: var(--wped-font-heading, var(--wped-font));
	--wped-fs-base: var(--wped-font-size-base, 16px);

	--wped-widget-gap: 8px;
	--wped-widget-align: start;
	--wped-label-color: var(--wped-text-muted);
	--wped-label-size: calc(var(--wped-fs-base) * 0.875);
	--wped-label-weight: 600;
	--wped-amount-color: var(--wped-text);
	--wped-amount-size: clamp(calc(var(--wped-fs-base) * 2), 7vw, calc(var(--wped-fs-base) * 3));
	--wped-amount-weight: 700;
	--wped-meta-color: var(--wped-text-muted);
	--wped-meta-size: calc(var(--wped-fs-base) * 0.875);

	--wped-goal-height: 12px;
	--wped-goal-radius: 999px;
	--wped-goal-track: color-mix(in srgb, var(--wped-text) 10%, transparent);
	--wped-goal-fill: var(--wped-accent);
	--wped-goal-ring-size: 160px;
	--wped-goal-ring-width: 12px;
	--wped-stat-label-color: var(--wped-text-muted);
	--wped-stat-label-size: calc(var(--wped-fs-base) * 0.8125);
	--wped-stat-value-color: var(--wped-text);
	--wped-stat-value-size: calc(var(--wped-fs-base) * 1.125);
	--wped-stat-value-weight: 700;

	--wped-widget-bg: transparent;
	--wped-widget-border: none;
	--wped-widget-radius: 0;
	--wped-widget-padding: 0;

	display: grid;
	gap: var(--wped-widget-gap);
	background: var(--wped-widget-bg);
	border: var(--wped-widget-border);
	border-radius: var(--wped-widget-radius);
	padding: var(--wped-widget-padding);
	font-size: var(--wped-fs-base);
	justify-items: var(--wped-widget-align);
	text-align: var(--wped-widget-text-align, inherit);
	font-family: var(--wped-font);
	color: var(--wped-text);
	box-sizing: border-box;
	max-width: 100%;
}
.wped-widget *, .wped-widget *::before, .wped-widget *::after { box-sizing: inherit; }
.wped-widget p, .wped-widget dl, .wped-widget dd { margin: 0; }

.wped-total__label, .wped-goal__label {
	color: var(--wped-label-color);
	font-size: var(--wped-label-size);
	font-weight: var(--wped-label-weight);
	line-height: 1.3;
}
.wped-total__amount {
	color: var(--wped-amount-color);
	font-family: var(--wped-font-display);
	font-size: var(--wped-amount-size);
	font-weight: var(--wped-amount-weight);
	line-height: 1.05;
	font-variant-numeric: tabular-nums;
	overflow-wrap: anywhere;
}
.wped-total__meta { color: var(--wped-meta-color); font-size: var(--wped-meta-size); }

/* Goal: bar. */
.wped-goal { justify-items: stretch; }
.wped-goal__track {
	position: relative;
	width: 100%;
	height: var(--wped-goal-height);
	border-radius: var(--wped-goal-radius);
	background: var(--wped-goal-track);
	overflow: hidden;
}
.wped-goal__fill {
	display: block;
	height: 100%;
	max-width: 100%;
	border-radius: inherit;
	background: var(--wped-goal-fill);
	transition: width 0.6s ease;
}

/* Goal: ring. */
.wped-goal--ring { justify-items: var(--wped-widget-align); }
.wped-goal__ring { position: relative; width: var(--wped-goal-ring-size); max-width: 100%; aspect-ratio: 1; }
.wped-goal__ring svg { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
.wped-goal__ring circle { fill: none; stroke-width: calc(var(--wped-goal-ring-width) * 120 / 160); }
.wped-goal__ring-track { stroke: var(--wped-goal-track); }
.wped-goal__ring-fill { stroke: var(--wped-goal-fill); stroke-linecap: round; transition: stroke-dashoffset 0.6s ease; }
.wped-goal__ring-text {
	position: absolute; inset: 0; display: grid; place-items: center;
	font-family: var(--wped-font-display);
	font-size: calc(var(--wped-goal-ring-size) * 0.2);
	font-weight: var(--wped-stat-value-weight);
	color: var(--wped-stat-value-color);
	font-variant-numeric: tabular-nums;
}

/* Stats row. */
.wped-goal__stats { display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: var(--wped-stats-justify, space-between); }
.wped-goal--ring .wped-goal__stats, .wped-goal--numbers .wped-goal__stats { justify-content: var(--wped-stats-justify, flex-start); }
.wped-goal__stats > div { display: grid; gap: 2px; min-width: 0; }
.wped-goal__stats dt { color: var(--wped-stat-label-color); font-size: var(--wped-stat-label-size); }
.wped-goal__stats dd {
	color: var(--wped-stat-value-color);
	font-size: var(--wped-stat-value-size);
	font-weight: var(--wped-stat-value-weight);
	font-variant-numeric: tabular-nums;
}

.wped-widget .wped-visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
.wped-admin-notice { padding: 8px 12px; border-left: 4px solid #b42318; background: #fef3f2; font-size: 14px; }

@media (prefers-reduced-motion: reduce) {
	.wped-goal__fill, .wped-goal__ring-fill { transition: none; }
}