<script lang="ts">
  import Header from "./components/Header.svelte";
</script>

<div class="flex flex-col min-h-screen">
  <Header />

  <main class="main-layout flex-grow">
    
    <section class="buzzer-card p-6 h-64">
      <h3 class="text-sm font-bold text-slate-500 uppercase tracking-widest">Dateiverarbeitung</h3>
      </section>

    <section class="buzzer-card p-6 h-64">
      <h3 class="text-sm font-bold text-slate-500 uppercase tracking-widest">Buzzer Status</h3>
      </section>

    <section class="buzzer-card p-6 h-96 lg:col-span-1">
      <h3 class="text-sm font-bold text-slate-500 uppercase tracking-widest">Lokale Sounds</h3>
    </section>

    <section class="buzzer-card p-6 h-96 lg:col-span-1">
      <h3 class="text-sm font-bold text-slate-500 uppercase tracking-widest">Buzzer Sounds</h3>
    </section>

  </main>

  <footer class="hidden sm:flex justify-center items-center py-4 bg-slate-50 border-t border-slate-200 text-[10px] text-slate-400 uppercase tracking-widest">
    &copy; 2026 Edis Buzzer Management Studio | Nerd Mode Active
  </footer>
</div>