'use client';

import { Bell } from 'lucide-react';
import { usePageHeader } from '@client/contexts/PageHeaderContext';
import { useLanguage } from '@client/contexts/LanguageContext';

export default function AdminNotificationsPage() {
  const { t } = useLanguage();
  usePageHeader(
    t('adminNotifications.title', 'Notifications'),
    t('adminNotifications.subtitle', 'Platform-wide alerts and system notifications')
  );

  return (
    <div className="max-w-2xl mx-auto">
      <div className="card p-12 flex flex-col items-center text-center">
        <div className="w-16 h-16 rounded-full flex items-center justify-center mb-4" style={{ backgroundColor: 'hsl(var(--primary-light))' }}>
          <Bell size={28} style={{ color: 'hsl(var(--primary))' }} />
        </div>
        <h2 className="text-lg font-bold mb-2" style={{ color: 'hsl(var(--foreground))' }}>
          {t('adminNotifications.emptyTitle', 'Admin Notifications')}
        </h2>
        <p className="text-sm" style={{ color: 'hsl(var(--muted-foreground))' }}>
          {t('adminNotifications.emptyDesc', 'Platform-wide notifications will appear here. This feature is coming soon.')}
        </p>
      </div>
    </div>
  );
}