/* ═══ CSS VARIABLES FOR LIGHT THEME ═══ */
:root[data-theme="light"] {
	--accent: #2563eb;
	--accent-hover: #1d4ed8;
	--accent-soft: rgba(37, 99, 235, 0.1);
	--accent-glow: rgba(37, 99, 235, 0.25);
	--success: #22c55e;
	--success-soft: rgba(34, 197, 94, 0.1);
	--warning: #f59e0b;
	--warning-soft: rgba(245, 158, 11, 0.1);
	--danger: #ef4444;
	--danger-soft: rgba(239, 68, 68, 0.1);
	--bg-primary: #ffffff;
	--bg-secondary: #f8fafc;
	--bg-tertiary: #f1f5f9;
	--text-primary: #1e293b;
	--text-secondary: #475569;
	--text-tertiary: #94a3b8;
	--border: #e2e8f0;
	--radius-sm: 6px;
	--radius-md: 8px;
	--radius-lg: 8px;
}

/* ═══ NOTIFY STYLES ═══ */
.sf-notify {
	background: var(--bg-primary) !important;
	border: 1px solid var(--border) !important;
	color: var(--text-primary) !important;
}

.sf-notify-header {
	background: var(--bg-secondary) !important;
	color: var(--text-primary) !important;
	border-bottom: 1px solid var(--border) !important;
}

.sf-notify-content {
	background: var(--bg-primary) !important;
	color: var(--text-secondary) !important;
}

.sf-notify-footer {
	background: var(--bg-secondary) !important;
	border-top: 1px solid var(--border) !important;
}

.sf-notify-close {
	color: var(--text-tertiary) !important;
}

.sf-notify-close:hover {
	color: var(--text-primary) !important;
}