<template>
  <div class="app-layout">
    <header>
      <h1>Shared Components Demo</h1>
      <nav>
        <router-link to="/">Home</router-link> |
        <router-link to="/fileupload">FileUpload Demo</router-link>
      </nav>
    </header>
    <main>
      <router-view />
    </main>
  </div>
</template>

<style scoped>
.app-layout {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}
header {
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid #eaeaea;
}
nav {
  margin: 12px 0;
}
nav a {
  margin-right: 16px;
  color: #2c3e50;
  text-decoration: none;
}
nav a.router-link-exact-active {
  color: #42b983;
  font-weight: bold;
}
</style>
