<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="utf-8"/>
<meta content="width=device-width, initial-scale=1.0" name="viewport"/>
<title>종량제 물류시스템</title>
<script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet"/>
<script>
tailwind.config = {
  theme: {
    extend: {
      fontFamily: { sans: ['Pretendard', '"Malgun Gothic"', '"Noto Sans KR"', 'sans-serif'] },
      colors: {
        'navy': '#1a2b4b',
        'title-bar': '#1a2b4b',
        'portal-bg': '#f0f4f8',
        'btn-search': '#243a5e',
      }
    }
  }
}
</script>
<style>body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; letter-spacing: -0.01em; }</style>
</head>
<body class="bg-portal-bg text-gray-700 flex flex-col h-screen font-sans antialiased">
<header class="bg-navy text-white h-12 flex items-center justify-between px-4 shrink-0 shadow">
  <a href="<?= base_url() ?>" class="flex items-center gap-2 tracking-tight hover:opacity-90" title="GBLS (Garbage Bag Logistics System)">
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="h-6 w-6 text-white shrink-0" aria-hidden="true" focusable="false">
      <path fill="currentColor" d="M9 3a1 1 0 00-1 1v1H5.75a.75.75 0 000 1.5h12.5a.75.75 0 000-1.5H16V4a1 1 0 00-1-1H9zm9 4H6v11a2 2 0 002 2h8a2 2 0 002-2V7zM10 9a.75.75 0 01.75.75v6a.75.75 0 01-1.5 0v-6A.75.75 0 0110 9zm4 0a.75.75 0 01.75.75v6a.75.75 0 01-1.5 0v-6A.75.75 0 0114 9z"/>
    </svg>
    <span class="leading-none flex flex-col">
      <strong class="text-base font-extrabold tracking-wide">GBLS</strong>
      <span class="text-[0.56rem] font-medium text-white/65 tracking-tight whitespace-nowrap">Garbage Bag Logistics System</span>
    </span>
  </a>
  <nav class="flex gap-3 text-sm font-medium">
    <a class="px-3 py-1 rounded hover:bg-white/10" href="<?= base_url('login') ?>">로그인</a>
    <a class="px-3 py-1 rounded hover:bg-white/10" href="<?= base_url('register') ?>">회원가입</a>
  </nav>
</header>

<main class="flex-grow flex items-center justify-center p-6">
  <section class="w-full max-w-xl bg-white border border-[#dde4ec] rounded-2xl shadow-[0_2px_12px_rgba(26,43,75,0.08)] overflow-hidden">
    <div class="bg-gradient-to-br from-navy to-[#007bff] text-white px-8 py-8 text-center">
      <div class="inline-flex h-14 w-14 items-center justify-center rounded-full bg-white/15 mb-3">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" class="h-7 w-7 text-white" aria-hidden="true" focusable="false">
          <path fill="currentColor" d="M9 3a1 1 0 00-1 1v1H5.75a.75.75 0 000 1.5h12.5a.75.75 0 000-1.5H16V4a1 1 0 00-1-1H9zm9 4H6v11a2 2 0 002 2h8a2 2 0 002-2V7zM10 9a.75.75 0 01.75.75v6a.75.75 0 01-1.5 0v-6A.75.75 0 0110 9zm4 0a.75.75 0 01.75.75v6a.75.75 0 01-1.5 0v-6A.75.75 0 0114 9z"/>
        </svg>
      </div>
      <h1 class="text-xl font-bold">종량제 쓰레기봉투 물류시스템</h1>
      <p class="text-sm text-white/75 mt-1">발주 · 입고 · 재고 · 판매 · 수불 통합 관리</p>
    </div>
    <div class="px-8 py-7 text-center">
      <p class="text-gray-600 mb-5 text-sm">서비스 이용을 위해 로그인해 주세요.</p>
      <div class="flex gap-2 justify-center">
        <a href="<?= base_url('login') ?>" class="bg-btn-search text-white px-5 py-2.5 rounded-lg text-sm font-semibold shadow hover:brightness-110 transition">
          <i class="fa-solid fa-right-to-bracket mr-1"></i> 로그인
        </a>
        <a href="<?= base_url('register') ?>" class="bg-white text-gray-700 border border-gray-300 px-5 py-2.5 rounded-lg text-sm shadow-sm hover:bg-gray-50 transition">회원가입</a>
      </div>
    </div>
  </section>
</main>
<footer class="bg-[#eef2f7] border-t border-[#dde4ec] px-4 py-1.5 text-xs text-gray-500 shrink-0 text-center">종량제 물류시스템</footer>
</body>
</html>
