Füge Collapse-Funktionalität zu Admin-Management-Abschnitten hinzu

app/[locale]/admin/page.tsx

@@ -162,6 +162,9 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
     const [dailyPuzzles, setDailyPuzzles] = useState<any[]>([]);
     const [playingPuzzleId, setPlayingPuzzleId] = useState<number | null>(null);
     const [showDailyPuzzles, setShowDailyPuzzles] = useState(false);
+    const [showSpecials, setShowSpecials] = useState(false);
+    const [showGenres, setShowGenres] = useState(false);
+    const [showNews, setShowNews] = useState(false);
     const fileInputRef = useRef<HTMLInputElement>(null);
 
     // Check for existing auth on mount
@@ -1086,7 +1089,26 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
 
             {/* Special Management */}
             <div className="admin-card" style={{ marginBottom: '2rem' }}>
-                <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>Manage Specials</h2>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
+                    <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
+                        Manage Specials
+                    </h2>
+                    <button
+                        onClick={() => setShowSpecials(!showSpecials)}
+                        style={{
+                            padding: '0.5rem 1rem',
+                            background: '#f3f4f6',
+                            border: '1px solid #d1d5db',
+                            borderRadius: '0.25rem',
+                            cursor: 'pointer',
+                            fontSize: '0.875rem'
+                        }}
+                    >
+                        {showSpecials ? '▼ Hide' : '▶ Show'}
+                    </button>
+                </div>
+                {showSpecials && (
+                    <>
                         <form onSubmit={handleCreateSpecial} style={{ marginBottom: '1rem' }}>
                     <div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'flex-end' }}>
                         <div style={{ display: 'flex', flexDirection: 'column' }}>
@@ -1176,11 +1198,32 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
                         </div>
                     </div>
                 )}
+                    </>
+                )}
             </div>
 
             {/* Genre Management */}
             <div className="admin-card" style={{ marginBottom: '2rem' }}>
-                <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>Manage Genres</h2>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
+                    <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
+                        Manage Genres
+                    </h2>
+                    <button
+                        onClick={() => setShowGenres(!showGenres)}
+                        style={{
+                            padding: '0.5rem 1rem',
+                            background: '#f3f4f6',
+                            border: '1px solid #d1d5db',
+                            borderRadius: '0.25rem',
+                            cursor: 'pointer',
+                            fontSize: '0.875rem'
+                        }}
+                    >
+                        {showGenres ? '▼ Hide' : '▶ Show'}
+                    </button>
+                </div>
+                {showGenres && (
+                    <>
                         <div style={{ display: 'flex', gap: '0.5rem', marginBottom: '1rem', alignItems: 'center' }}>
                     <input
                         type="text"
@@ -1335,11 +1378,32 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
                         </button>
                     </div>
                 )}
+                    </>
+                )}
             </div>
 
             {/* News Management */}
             <div className="admin-card" style={{ marginBottom: '2rem' }}>
-                <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>Manage News & Announcements</h2>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
+                    <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
+                        Manage News & Announcements
+                    </h2>
+                    <button
+                        onClick={() => setShowNews(!showNews)}
+                        style={{
+                            padding: '0.5rem 1rem',
+                            background: '#f3f4f6',
+                            border: '1px solid #d1d5db',
+                            borderRadius: '0.25rem',
+                            cursor: 'pointer',
+                            fontSize: '0.875rem'
+                        }}
+                    >
+                        {showNews ? '▼ Hide' : '▶ Show'}
+                    </button>
+                </div>
+                {showNews && (
+                    <>
                         <form onSubmit={handleCreateNews} style={{ marginBottom: '1rem' }}>
                     <div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
                         <input
@@ -1492,6 +1556,8 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
                         </p>
                     )}
                 </div>
+                    </>
+                )}
             </div>
 
             <div className="admin-card" style={{ marginBottom: '2rem' }}>