import React from 'react';

export default function App() {
  const appName = process.env.APP_NAME || 'BigCommerce App';
  
  return (
    <div style={styles.container}>
      <h1 style={styles.title}>{appName}</h1>
      <div style={styles.content}>
        <p style={styles.description}>
          BigCommerce application interface
        </p>
      </div>
    </div>
  );
}

const styles: Record<string, React.CSSProperties> = {
  container: {
    padding: '2rem',
    backgroundColor: '#111827',
    minHeight: '100vh',
    color: '#f9fafb',
    fontFamily: 'system-ui, -apple-system, sans-serif',
  },
  title: {
    fontSize: '2rem',
    fontWeight: 'bold',
    marginBottom: '2rem',
    color: '#f9fafb',
  },
  content: {
    backgroundColor: '#1f2937',
    padding: '2rem',
    borderRadius: '0.5rem',
    border: '1px solid #374151',
  },
  description: {
    color: '#d1d5db',
    fontSize: '1.125rem',
  },
};