@extends('layouts.app')
@section('title', 'IP-Pool')
@section('heading', 'Neuer IP-Pool')

@section('content')
<form method="POST" action="{{ route('ip-pools.store') }}" class="max-w-lg space-y-4 rounded-xl border border-slate-800 bg-slate-900/60 p-6">
    @csrf
    <label class="block"><span class="text-sm text-slate-400">Name</span>
        <input name="name" required class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2"></label>
    <label class="block"><span class="text-sm text-slate-400">Typ</span>
        <select name="type" class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2">
            @foreach($types as $type)<option value="{{ $type->value }}">{{ $type->label() }}</option>@endforeach
        </select></label>
    <div class="grid grid-cols-2 gap-4">
        <label class="block"><span class="text-sm text-slate-400">Start-IP</span>
            <input name="start_ip" required class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2 font-mono"></label>
        <label class="block"><span class="text-sm text-slate-400">End-IP</span>
            <input name="end_ip" required class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2 font-mono"></label>
    </div>
    <label class="block"><span class="text-sm text-slate-400">Gateway</span>
        <input name="gateway" class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2 font-mono"></label>
    <label class="block"><span class="text-sm text-slate-400">CIDR</span>
        <input type="number" name="cidr" value="24" min="8" max="32" class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2"></label>
    <label class="block"><span class="text-sm text-slate-400">Beschreibung</span>
        <textarea name="description" rows="2" class="mt-1 w-full rounded-lg border border-slate-700 bg-slate-800 px-3 py-2"></textarea></label>
    <label class="flex items-center gap-2 text-sm">
        <input type="checkbox" name="is_active" value="1" checked class="rounded text-cyan-500"> Aktiv
    </label>
    <button class="rounded-lg bg-cyan-600 px-6 py-2 font-medium hover:bg-cyan-500">Erstellen</button>
</form>
@endsection