/* Shared Dashboard Theme System */
.dashboard-shell {
	position: relative;
}

.dashboard-shell::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(900px 260px at 10% -10%, color-mix(in srgb, var(--accent2) 22%, transparent), transparent 60%),
		radial-gradient(700px 220px at 95% 0%, color-mix(in srgb, var(--accent1) 18%, transparent), transparent 60%);
}

.dash-panel {
	border: 1px solid color-mix(in srgb, var(--texts) 22%, transparent);
	background: color-mix(in srgb, var(--card) 90%, transparent);
	backdrop-filter: blur(6px);
	box-shadow: 0 12px 28px rgba(15, 23, 42, 0.10);
}

.dark .dash-panel {
	border-color: color-mix(in srgb, var(--texts) 28%, transparent);
	background: color-mix(in srgb, var(--card) 78%, transparent);
	box-shadow: 0 14px 34px rgba(2, 6, 23, 0.52);
}

.dash-reveal {
	animation: dashFadeUp 420ms ease both;
}

@keyframes dashFadeUp {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
	.dash-reveal { animation: none !important; }
}

.dashboard-shell[data-density="compact"] .dash-panel {
	padding: 0.75rem !important;
}

.dashboard-shell[data-density="compact"] #dashboard-orders-table th,
.dashboard-shell[data-density="compact"] #dashboard-orders-table td {
	padding-top: 0.375rem !important;
	padding-bottom: 0.375rem !important;
}

.dashboard-shell[data-density="compact"] .density-soft-text {
	font-size: 0.75rem !important;
}

.density-toggle-btn {
	border: 1px solid rgba(148, 163, 184, 0.35);
	background: rgba(255, 255, 255, 0.7);
	color: rgb(71 85 105);
}

.dark .density-toggle-btn {
	border-color: rgba(71, 85, 105, 0.65);
	background: rgba(15, 23, 42, 0.7);
	color: rgb(203 213 225);
}

.density-toggle-btn[data-active="1"] {
	background: rgb(59 130 246);
	border-color: rgb(59 130 246);
	color: #fff;
}

.chart-tooltip {
	position: absolute;
	z-index: 20;
	pointer-events: none;
	padding: 6px 8px;
	border-radius: 10px;
	font-size: 11px;
	line-height: 1.2;
	background: rgba(15, 23, 42, 0.92);
	color: #e2e8f0;
	transform: translate(-50%, -115%);
	opacity: 0;
	transition: opacity .15s ease;
	white-space: nowrap;
}

.dark .chart-tooltip {
	background: rgba(2, 6, 23, 0.95);
	color: #f1f5f9;
}

.dash-accent-btn {
	background: linear-gradient(90deg, var(--accent1), var(--accent2));
	color: #fff;
}

.dash-accent-btn:hover {
	filter: brightness(1.06);
}

.dash-soft-btn {
	border: 1px solid color-mix(in srgb, var(--texts) 24%, transparent);
	background: color-mix(in srgb, var(--background) 65%, transparent);
	color: var(--textp);
}

.dash-soft-btn:hover {
	border-color: var(--accent2);
}