<template>
  <div id="app">
    <header class="header">
      <router-link to="/" class="logo">
        <h1>📊 LogHunter</h1>
      </router-link>
      <nav>
        <router-link to="/">대시보드</router-link>
        <router-link to="/errors">에러 이력</router-link>
        <router-link to="/stats/monthly">월별현황</router-link>
        <router-link to="/stats/daily">일별현황</router-link>
        <router-link to="/servers">서버 관리</router-link>
        <router-link to="/patterns">패턴 관리</router-link>
        <router-link to="/settings">설정</router-link>
      </nav>
    </header>
    <main class="main">
      <router-view />
    </main>
  </div>
</template>

<script setup>
</script>

<style>
* {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

#app {
  min-height: 100vh;
  background: #f5f5f5;
}

.header {
  background: #2c3e50;
  color: white;
  padding: 1rem 2rem;
  display: flex;
  align-items: center;
  gap: 2rem;
}

.header h1 {
  font-size: 1.5rem;
  margin: 0;
}

.header .logo {
  text-decoration: none;
  color: white;
}

.header nav {
  display: flex;
  gap: 1rem;
}

.header nav a {
  color: #ecf0f1;
  text-decoration: none;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  transition: background 0.2s;
}

.header nav a:hover {
  background: #34495e;
}

.header nav a.router-link-active {
  background: #3498db;
}

.main {
  padding: 1.5rem;
}
</style>
