import AppLayout from './components/layout/AppLayout'
import Button from './components/ui/Button'
import DigitalProgressBar from './components/ui/DigitalProgressBar'
import Panel from './components/ui/Panel'

// Scaffold-only demo composition proving the primitives + theme render.
// Replaced by real routed pages in the frontend feature tickets (#52–#56).
function App() {
  return (
    <AppLayout>
      <Panel className="mx-auto max-w-md space-y-4">
        <h2 className="text-primary font-bold uppercase tracking-wider">
          Emergency Fund
        </h2>
        <DigitalProgressBar current={750} capacity={1000} />
        <p className="font-digital text-primary text-xl">$750 / $1000</p>
        <Button glow>+ Add Bucket</Button>
      </Panel>
    </AppLayout>
  )
}

export default App