fix: Template editor UX improvements

## ✅ All 5 Issues Fixed!

### 1. Default Value in RichTextEditor ✅
- Added `useEffect` to sync content prop with editor
- Editor now properly displays default template content
- Fixed: `editor.commands.setContent(content)` when prop changes

### 2. Removed Duplicate Variable Section ✅
- Removed "Variable Reference" section (was redundant)
- Variables already available in rich text editor toolbar
- Kept small badge list under editor for quick reference

### 3. User-Friendly Preview ✅
- Preview now renders HTML (not raw code)
- Subject separated in dialog header
- Complete email template preview (header + content + footer)
- Variables highlighted in yellow for clarity
- Uses iframe with full base.html styling

### 4. Fixed Dialog Scrolling ✅
**New Structure:**
```
[Header] ← Fixed (title + subject input)
[Body]   ← Scrollable (tabs: editor/preview)
[Footer] ← Fixed (action buttons)
```
- No more annoying full-dialog scroll
- Each section scrolls independently
- Better UX with fixed header/footer

### 5. Editor/Preview Tabs ✅
**Tabs Implementation:**
- [Editor] tab: Rich text editor + variable badges
- [Preview] tab: Full email preview with styling
- Clean separation of editing vs previewing
- Preview shows complete email (not just content)
- 500px iframe height for comfortable viewing

---

**Benefits:**
- ✨ Default content loads properly
- 🎨 Beautiful HTML preview
- 📱 Better scrolling UX
- 👁️ See exactly how email looks
- 🚀 Professional editing experience

**Next:** Email appearance settings + card insert buttons

admin-spa/src/components/ui/rich-text-editor.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } from 'react';
 import { useEditor, EditorContent } from '@tiptap/react';
 import StarterKit from '@tiptap/starter-kit';
 import Placeholder from '@tiptap/extension-placeholder';
@@ -55,6 +55,13 @@ export function RichTextEditor({
     },
   });
 
+  // Update editor content when prop changes (fix for default value not showing)
+  useEffect(() => {
+    if (editor && content !== editor.getHTML()) {
+      editor.commands.setContent(content);
+    }
+  }, [content, editor]);
+
   if (!editor) {
     return null;
   }