fix(cms): apply dark mode to CMS editor, public CMS, and admin modals

frontend/src/components/common/CMSContentBlock.tsx

@@ -50,7 +50,10 @@ export const CMSContentBlock: React.FC<CMSContentBlockProps> = ({ slug, fallback
 
   if (isLoading) {
     return (
-      <div className="min-h-screen bg-neutral-50 flex items-center justify-center">
+      <div
+        className="min-h-screen flex items-center justify-center"
+        style={{ backgroundColor: 'var(--color-background, #fafafa)' }}
+      >
         <Loading size="lg" />
       </div>
     );
@@ -80,11 +83,20 @@ export const CMSContentBlock: React.FC<CMSContentBlockProps> = ({ slug, fallback
       <main className="flex-1 flex items-start justify-center px-4">
         <div className="max-w-2xl w-full">
           <Card padding="lg">
-            <h1 className="text-2xl sm:text-3xl font-bold text-neutral-900 dark:text-neutral-100 mb-6">
+            {/*
+             * Heading + body now read from theme tokens so dark themes
+             * (and force-dark mode) render correctly without dark: variants
+             * fighting the CSS variables.
+             */}
+            <h1
+              className="text-2xl sm:text-3xl font-bold mb-6"
+              style={{ color: 'var(--color-text)' }}
+            >
               {page.title}
             </h1>
             <div
               className="prose prose-neutral dark:prose-invert max-w-none"
+              style={{ color: 'var(--color-text)' }}
               dangerouslySetInnerHTML={{
                 __html: DOMPurify.sanitize(page.content, {
                   ALLOWED_TAGS,
@@ -97,7 +109,8 @@ export const CMSContentBlock: React.FC<CMSContentBlockProps> = ({ slug, fallback
             <div className="mt-8">
               <Link
                 to="/"
-                className="text-sm font-medium text-primary-600 hover:text-primary-700"
+                className="text-sm font-medium hover:underline"
+                style={{ color: 'var(--color-accent)' }}
               >
                 {lang === 'de' ? '← Zur Startseite' : '← Back to home'}
               </Link>
@@ -106,13 +119,16 @@ export const CMSContentBlock: React.FC<CMSContentBlockProps> = ({ slug, fallback
         </div>
       </main>
 
-      <footer className="py-8 text-center text-xs text-neutral-500">
+      <footer
+        className="py-8 text-center text-xs"
+        style={{ color: 'var(--color-muted-text)' }}
+      >
         <div className="flex justify-center gap-4">
-          <Link to="/impressum" className="hover:text-neutral-700">
+          <Link to="/impressum" className="hover:underline">
             {lang === 'de' ? 'Impressum' : 'Legal Notice'}
           </Link>
-          <span className="text-neutral-400">•</span>
-          <Link to="/datenschutz" className="hover:text-neutral-700">
+          <span style={{ color: 'var(--color-surface-border)' }}>•</span>
+          <Link to="/datenschutz" className="hover:underline">
             {lang === 'de' ? 'Datenschutz' : 'Privacy Policy'}
           </Link>
         </div>