<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tambah Admin - INUFA</title>
    <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-white">
    <div class="flex h-screen">
        <!-- Sidebar -->
        <div class="w-40 h-full bg-white shadow-md">
            <!-- Logo -->
            <div class="p-4 flex justify-center">
                <img src="{{ asset('assets/images/logo.png') }}" alt="INUFA Logo" class="w-28 h-28 object-contain">
            </div>
            
            <!-- Sidebar Menu -->
            <nav class="mt-4">
                <a href="{{ route('dashboard') }}" class="block py-3 px-4 text-gray-800 font-semibold mb-1 hover:bg-gray-100">
                    Dashboard
                </a>
                <a href="{{ route('pengguna') }}" class="block py-3 px-4 text-white font-semibold mb-1 bg-blue-800">
                    Pengguna
                </a>
                <a href="{{ route('barang') }}" class="block py-3 px-4 text-gray-800 font-semibold mb-1 hover:bg-gray-100">
                    Barang
                </a>
                <a href="#" class="block py-3 px-4 text-gray-800 font-semibold mb-1 hover:bg-gray-100">
                    Paket
                </a>
                <a href="#" class="block py-3 px-4 text-gray-800 font-semibold mb-1 hover:bg-gray-100">
                    Sewa
                </a>
                <a href="#" class="block py-3 px-4 text-gray-800 font-semibold mb-1 hover:bg-gray-100">
                    Riwayat
                </a>
            </nav>
        </div>
        
        <!-- Main Content -->
        <div class="flex-1 flex flex-col">
            <!-- Header -->
            <header class="bg-[#1e3a8a] text-white py-4 px-6 flex justify-between items-center">
                <div class="flex space-x-8">
                    <a href="{{ route('pengguna') }}" class="font-semibold">Data User</a>
                    <a href="{{ route('admin') }}" class="font-semibold border-b-2 border-white pb-1">Data Admin</a>
                </div>
                <a href="{{ route('profile.index') }}" class="font-semibold flex items-center space-x-2">
                    <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
                        <path fill-rule="evenodd" d="M10 9a3 3 0 100-6 3 3 0 000 6zm-7 9a7 7 0 1114 0H3z" clip-rule="evenodd" />
                    </svg>
                    <span>Profile</span>
                </a>
            </header>
            
            <!-- Content -->
            <main class="flex-1 p-6 bg-gradient-to-b from-[#1e3a8a] to-[#0d1b3a]">
                <div class="bg-white rounded shadow-md p-6 max-w-2xl mx-auto">
                    <h2 class="text-2xl font-bold mb-6">Tambah Admin Baru</h2>
                    
                    <form action="{{ route('admin.store') }}" method="POST" class="space-y-4">
                        @csrf
                        
                        <!-- Username -->
                        <div class="grid grid-cols-3 items-center">
                            <label for="username" class="font-semibold">Username:</label>
                            <div class="col-span-2">
                                <input type="text" id="username" name="username" placeholder="Masukkan username" class="w-full p-2 border border-gray-300 rounded" required>
                            </div>
                        </div>
                        
                        <!-- Email -->
                        <div class="grid grid-cols-3 items-center">
                            <label for="email" class="font-semibold">Email:</label>
                            <div class="col-span-2">
                                <input type="email" id="email" name="email" placeholder="Masukkan email" class="w-full p-2 border border-gray-300 rounded" required>
                            </div>
                        </div>
                        
                        <!-- No. Telp -->
                        <div class="grid grid-cols-3 items-center">
                            <label for="no_telp" class="font-semibold">No. Telp:</label>
                            <div class="col-span-2">
                                <input type="text" id="no_telp" name="no_telp" placeholder="Masukkan nomor telepon" class="w-full p-2 border border-gray-300 rounded" required>
                            </div>
                        </div>
                        
                        <!-- Alamat -->
                        <div class="grid grid-cols-3 items-start">
                            <label for="alamat" class="font-semibold pt-2">Alamat:</label>
                            <div class="col-span-2">
                                <textarea id="alamat" name="alamat" rows="3" placeholder="Masukkan alamat" class="w-full p-2 border border-gray-300 rounded" required></textarea>
                            </div>
                        </div>
                        
                        <!-- Password -->
                        <div class="grid grid-cols-3 items-center">
                            <label for="password" class="font-semibold">Password:</label>
                            <div class="col-span-2">
                                <input type="password" id="password" name="password" placeholder="Masukkan password" class="w-full p-2 border border-gray-300 rounded" required>
                            </div>
                        </div>
                        
                        <!-- Konfirmasi Password -->
                        <div class="grid grid-cols-3 items-center">
                            <label for="password_confirmation" class="font-semibold">Konfirmasi Password:</label>
                            <div class="col-span-2">
                                <input type="password" id="password_confirmation" name="password_confirmation" placeholder="Konfirmasi password" class="w-full p-2 border border-gray-300 rounded" required>
                            </div>
                        </div>
                        
                        <!-- Tombol -->
                        <div class="flex justify-end space-x-4 pt-4">
                            <a href="{{ route('admin') }}" class="px-4 py-2 bg-gray-200 text-gray-700 rounded hover:bg-gray-300">
                                Batal
                            </a>
                            <button type="submit" class="px-4 py-2 bg-blue-800 text-white rounded hover:bg-blue-700">
                                Simpan
                            </button>
                        </div>
                    </form>
                </div>
            </main>
        </div>
    </div>
</body>
</html> 