/**
 * StockWP — Design tokens
 * Neutrals first; brand accents used sparingly.
 * Brand: #162967 / #008ffd / #8ac8fc
 */

:root {
	/* Brand accents (sparingly) */
	--swp-navy: #162967;
	--swp-accent: #008ffd;
	--swp-soft: #8ac8fc;

	/* Light — white / gray */
	--swp-canvas: #eceef2;
	--swp-bg: #f7f8fa;
	--swp-bg-elevated: #ffffff;
	--swp-bg-muted: #f0f2f5;
	--swp-ink: #111214;
	--swp-text: #1a1b1e;
	--swp-text-muted: rgba(26, 27, 30, 0.58);
	--swp-text-inverse: #ffffff;
	--swp-border: rgba(17, 18, 20, 0.08);
	--swp-border-strong: rgba(17, 18, 20, 0.14);

	--swp-link: var(--swp-accent);
	--swp-link-hover: #0076d6;
	--swp-focus: rgba(0, 143, 253, 0.28);

	--swp-sidebar-bg: var(--swp-bg-elevated);
	--swp-panel-bg: var(--swp-bg-elevated);
	--swp-sidebar-width: 225px;
	--swp-sidebar-collapsed-width: 80px;
	--swp-topbar-height: 56px;
	--swp-shell-gap: 8px;
	--swp-shell-pad: 8px;
	--swp-radius-pill: 12px;

	--swp-radius-sm: 8px;
	--swp-radius: 12px;
	--swp-radius-lg: 16px;
	--swp-shadow: none;
	--swp-transition: 180ms ease;

	--swp-font: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--swp-font-display: "Klarheit", "Geist", ui-sans-serif, system-ui, sans-serif;
	--swp-font-mono: ui-monospace, "Cascadia Code", "Segoe UI Mono", monospace;
}

html[data-theme="dark"] {
	--swp-canvas: #0a0a0b;
	--swp-bg: #121214;
	--swp-bg-elevated: #17171a;
	--swp-bg-muted: #1e1e22;
	--swp-ink: #f4f4f5;
	--swp-text: #f2f2f3;
	--swp-text-muted: rgba(242, 242, 243, 0.58);
	--swp-text-inverse: #111214;
	--swp-border: rgba(255, 255, 255, 0.08);
	--swp-border-strong: rgba(255, 255, 255, 0.14);

	--swp-link: var(--swp-accent);
	--swp-link-hover: var(--swp-soft);
	--swp-focus: rgba(0, 143, 253, 0.4);

	--swp-sidebar-bg: var(--swp-bg-elevated);
	--swp-panel-bg: var(--swp-bg-elevated);
}

.swp-logo-light {
	display: none;
}

html[data-theme="dark"] .swp-logo-dark {
	display: none;
}

html[data-theme="dark"] .swp-logo-light {
	display: inline-block;
}

/* Pair logo: exclusive visibility (fixes ghosting) */
.swp-logo--pair {
	display: inline-grid;
	align-items: center;
	justify-items: start;
}

.swp-logo--pair img {
	grid-area: 1 / 1;
	display: block;
	max-width: 100%;
	height: auto;
}

.swp-logo--pair .swp-logo-for-dark {
	display: none !important;
}

html[data-theme="dark"] .swp-logo--pair .swp-logo-for-light {
	display: none !important;
}

html[data-theme="dark"] .swp-logo--pair .swp-logo-for-dark {
	display: block !important;
}