import React from 'react';
import { BarChart2 } from 'lucide-react';

export default function ReportingPage() {
  return (
    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', minHeight: '60vh' }}>
      <div style={{ textAlign: 'center' }}>
        <div style={{
          width: '72px', height: '72px', borderRadius: '1rem', margin: '0 auto 1.5rem',
          background: 'rgba(245, 158, 11, 0.1)',
          border: '1px solid rgba(245, 158, 11, 0.3)',
          display: 'flex', alignItems: 'center', justifyContent: 'center'
        }}>
          <BarChart2 style={{ width: '36px', height: '36px', color: '#F59E0B' }} />
        </div>
        <h2 style={{ fontFamily: 'monospace', fontSize: '1.5rem', fontWeight: '700', color: '#F59E0B', textTransform: 'uppercase', letterSpacing: '0.1em', marginBottom: '0.5rem' }}>
          Reporting
        </h2>
        <p style={{ color: '#475569', fontSize: '0.875rem', fontFamily: 'monospace' }}>
          Under construction — coming soon
        </p>
      </div>
    </div>
  );
}