@extends('template')
@section('title', $title)
@push('style')
    <style>
        .hr {
            margin-top: -8px;
            border: 1px solid;
        }

        .hr-form {
            border: 1px solid;
        }

        .text-kanan {
            color: #000;
            font-size: 16px;
            font-weight: 700;
        }

        .text-left {
            color: #000;
            font-size: 15px;
            font-weight: 700;
        }

        .form-label {
            color: #000;
            font-family: Poppins;
            font-size: 15px;
            font-weight: 500;
        }

        .btn {
            margin-top: -20px;
            font-family: Poppins;
            font-size: 12px;
            font-weight: 700;
        }
    </style>
@endpush

@section('content')
    <section>
        <div class="row">
            <div class="col-8">
                <div class="card">
                    <div class="card-body">
                        <div class="d-flex justify-content-between align-items-center m-0 p-0">
                            <a class="card-title" href="/master-input" style="color: #0B4238; font-weight: 600;"><i
                                    class="bi bi-chevron-compact-left"></i>
                                <small style="color: #0B4238; font-weight: 600; margin-top: 100px">Kembali</small>
                            </a>
                            <p class="text-kanan">Edit Data Instansi</p>
                        </div>
                        <hr class="hr">
                        <form class="row g-3 needs-validation" action="/instansi/{{ $instansi->id }}" method="POST">
                            @csrf
                            @method('PUT')
                            <div class="col-4 text-left">Pemerintahan</div>
                            <div class="col-8 position-relative">
                                <label for="nama_instansi" class="form-label">Nama Instansi<span
                                        class="text-danger">*</span></label>
                                <input type="text"
                                    class="form-control @error('nama_instansi')
                          is-invalid
                          @enderror"
                                    id="nama_instansi" name="nama_instansi"
                                    value="{{ old('nama_instansi', $instansi->nama_instansi) }}">
                                @error('nama_instansi')
                                    <div class="invalid-tooltip">
                                        {{ $message }}
                                    </div>
                                @enderror
                            </div>

                            <div class="col-4"></div>
                            <div class="col-8 position-relative">
                                <label for="kota" class="form-label">Kabupaten / Kota<span
                                        class="text-danger">*</span></label>
                                                                <select name="kota"
                                    class="form-control @error('kota')
                                    is-invalid
                                    @enderror"
                                    id="">
                                    <option value="">Pilih Kabupaten / Kota</option>
                                    @foreach ($kabupaten as $a)
                                        <option value="{{ $a }}"
                                            {{ old('kota', $instansi->kota) == $a ? 'selected' : '' }}>
                                            {{ $a }}</option>
                                    @endforeach
                                </select>
                                {{-- <input type="text"
                                    class="form-control @error('kota')
                          is-invalid
                          @enderror"
                                    name="kota" id="kota" value="{{ old('kota', $instansi->kota) }}"> --}}
                                @error('kota')
                                    <div class="invalid-tooltip">
                                        {{ $message }}
                                    </div>
                                @enderror
                            </div>

                            <div class="col-4"></div>
                            <div class="col-8 position-relative">
                                <label for="kepala_dinas" class="form-label">Nama Kepala Dinas<span
                                        class="text-danger">*</span></label>
                                <input type="text"
                                    class="form-control @error('kepala_dinas')
                          is-invalid
                          @enderror"
                                    name="kepala_dinas" id="kepala_dinas"
                                    value="{{ old('kepala_dinas', $instansi->kepala_dinas) }}">
                                @error('kepala_dinas')
                                    <div class="invalid-tooltip">
                                        {{ $message }}
                                    </div>
                                @enderror
                            </div>

                            <div class="col-4"></div>
                            <div class="col-8 position-relative">
                                <label for="alamat" class="form-label">Alamat<span class="text-danger">*</span></label>
                                <input type="text"
                                    class="form-control @error('alamat')
                          is-invalid
                          @enderror"
                                    name="alamat" id="alamat" value="{{ old('alamat', $instansi->alamat) }}">
                                @error('alamat')
                                    <div class="invalid-tooltip">
                                        {{ $message }}
                                    </div>
                                @enderror
                            </div>

                            <hr class="hr-form">
                            <div class="col-4 text-left">Kontak</div>
                            <div class="col-8 position-relative">
                                <label for="no" class="form-label">Nomor Telepon / Fax<span
                                        class="text-danger">*</span></label>
                                <input type="text"
                                    class="form-control @error('no')
                          is-invalid
                          @enderror"
                                    name="no" id="no" value="{{ old('no', $instansi->no) }}">
                                @error('no')
                                    <div class="invalid-tooltip">
                                        {{ $message }}
                                    </div>
                                @enderror
                            </div>

                            <div class="col-4"></div>
                            <div class="col-8 position-relative">
                                <label for="email" class="form-label">Email Kantor / Dinas<span
                                        class="text-danger">*</span></label>
                                <input type="text"
                                    class="form-control @error('email')
                          is-invalid
                          @enderror"
                                    name="email" id="email" value="{{ old('email', $instansi->email) }}">
                                @error('email')
                                    <div class="invalid-tooltip">
                                        {{ $message }}
                                    </div>
                                @enderror
                            </div>

                            <hr class="hr-form">
                            <div class="text-end">
                                <button type="submit" class="btn btn-success">Kirim Data</button>
                            </div>
                        </form><!-- Vertical Form -->
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection