/*--------------------------------------------------------------
  Lavena — dark-mode.css
  Activated by data-lavena-mode="dark" on <html>, set pre-paint
  by the inline bootstrap script. Only remaps theme variables so
  Elementor content (which uses its own globals) is untouched
  unless it opts into the theme variables.
--------------------------------------------------------------*/

html[data-lavena-mode="dark"] {
	--lavena-surface: #17111F;
	--lavena-lavender: #241A31;
	--lavena-border: #342843;
	--lavena-text: #F1EAF8;
	--lavena-muted: #9B8FAB;
	--lavena-shadow-soft: 0 8px 28px rgba(0, 0, 0, 0.45);
	--lavena-shadow-float: 0 14px 40px rgba(0, 0, 0, 0.55);
	--lavena-danger-bg: #3A1B23;

	color-scheme: dark;
}

html[data-lavena-mode="dark"] body {
	background: #100A18;
}

html[data-lavena-mode="dark"] .lavena-header,
html[data-lavena-mode="dark"] .lavena-drawer,
html[data-lavena-mode="dark"] .lavena-bottomnav,
html[data-lavena-mode="dark"] .lavena-card {
	background: var(--lavena-surface);
}

html[data-lavena-mode="dark"] .lavena-badge {
	border-color: var(--lavena-surface);
}

html[data-lavena-mode="dark"] .lavena-drawer__icon {
	color: var(--lavena-primary-light);
}

html[data-lavena-mode="dark"] .lavena-overlay {
	background: rgba(0, 0, 0, calc(var(--lavena-overlay-alpha) + 0.15));
}

html[data-lavena-mode="dark"] .lavena-footer {
	background: #130D1C;
}