/* ─── Analytics Component ─── */
.maxxefy-analytics-preview {
	padding: var(--maxxefy-spacing-lg) 0;
}
.maxxefy-analytics-card {
	text-align: center;
	padding: var(--maxxefy-spacing-lg);
}
.maxxefy-analytics-metric-label {
	font-size: var(--maxxefy-font-sm);
	color: var(--maxxefy-neutral-400);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: var(--maxxefy-spacing-xs);
}
.maxxefy-analytics-metric-value {
	font-size: var(--maxxefy-font-3xl);
	font-weight: 800;
	color: var(--maxxefy-neutral-100);
}
.maxxefy-analytics-trend {
	font-size: var(--maxxefy-font-sm);
	font-weight: 600;
	margin-top: var(--maxxefy-spacing-xs);
}
.maxxefy-analytics-trend.is-up { color: var(--maxxefy-success, #4CAF50); }
.maxxefy-analytics-trend.is-down { color: var(--maxxefy-error, #F44336); }

/* Chart mockup */
.maxxefy-analytics-chart-mockup {
	margin-top: var(--maxxefy-spacing-xl);
	padding: var(--maxxefy-spacing-lg);
	background: var(--maxxefy-neutral-800);
	border-radius: var(--maxxefy-radius-lg);
	border: 1px solid var(--maxxefy-neutral-700);
}
.maxxefy-chart-bars {
	display: flex;
	align-items: flex-end;
	gap: var(--maxxefy-spacing-md);
	height: 200px;
}
.maxxefy-chart-bar-group {
	flex: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	height: 100%;
	justify-content: flex-end;
}
.maxxefy-chart-bar {
	width: 100%;
	max-width: 60px;
	background: linear-gradient(180deg, var(--maxxefy-primary), var(--maxxefy-secondary));
	border-radius: var(--maxxefy-radius-sm) var(--maxxefy-radius-sm) 0 0;
	transition: height 0.6s ease;
}
.maxxefy-chart-bar-label {
	font-size: var(--maxxefy-font-xs);
	color: var(--maxxefy-neutral-400);
	margin-top: var(--maxxefy-spacing-xs);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 80px;
}