<!DOCTYPE html>
<html lang="zxx">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="assetslixi/css/bootstrap.min.css">
    <!-- Meanmenu CSS -->
    <link rel="stylesheet" href="assetslixi/css/meanmenu.css">
    <!-- Boxicons CSS -->
    <link rel="stylesheet" href="assetslixi/css/boxicons.min.css">
    <!-- Odometer CSS -->
    <link rel="stylesheet" href="assetslixi/css/odometer.min.css">
    <!-- Popup CSS -->
    <link rel="stylesheet" href="assetslixi/css/magnific-popup.min.css">
    <!-- Owl Carousel -->
    <link rel="stylesheet" href="assetslixi/css/owl.carousel.min.css">
    <link rel="stylesheet" href="assetslixi/css/owl.theme.default.min.css">
    <!-- Nice Select CSS -->
    <link rel="stylesheet" href="assetslixi/css/nice-select.min.css">
    <!-- Style CSS -->
    <link rel="stylesheet" href="assetslixi/css/style.css">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="assetslixi/css/responsive.css">
    <!-- Theme Dark CSS -->
    <link rel="stylesheet" href="assetslixi/css/theme-dark.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">

    <title>Daftar</title>
    <link rel="icon" type="image/png" href="assetslixi/img/favicon.png">
</head>

<style>
    .btn-link {
        background-color: transparent;
        /* Set background to transparent */
        border: none;
        /* Remove border */
        color: #6c757d;
        /* Set color of the icon */
    }

    .btn-link:hover {
        color: #495057;
        /* Change color on hover */
    }

    .input-group .form-control {
        padding-right: 12.5rem;
        /* Space for the icon */
    }

    .position-relative {
        display: flex;
        align-items: center;
    }
</style>

<body>
    <!-- Preloader -->
    {{-- <div class="loader">
        <div class="d-table">
            <div class="d-table-cell">
                <div class="spinner">
                    <div class="rect1"></div>
                    <div class="rect2"></div>
                    <div class="rect3"></div>
                    <div class="rect4"></div>
                    <div class="rect5"></div>
                </div>
            </div>
        </div>
    </div> --}}
    <!-- End Preloader -->

    <!-- Navbar Area -->
    <!-- Navbar Area -->
    <div class="navbar-area two fixed-top">
        <!-- Menu For Mobile Device -->
        <div class="mobile-nav">
            <a href="index.html" class="logo">
                <img src="assetslixi/img/logo.png" alt="Logo">
            </a>
        </div>

        <!-- Menu For Desktop Device -->
        <div class="main-nav">
            <div class="container">
                <nav class="navbar navbar-expand-md navbar-light">
                    <a class="navbar-brand" href="index.html">
                        <img src="assetslixi/img/logo.png" alt="Logo">
                    </a>
                    <div class="collapse navbar-collapse mean-menu" id="navbarSupportedContent">
                        <ul class="navbar-nav">
                            <li class="nav-item">
                                <a href="/" class="nav-link">Home</a>
                            </li>
                            <li class="nav-item">
                                <a href="/about" class="nav-link">Tentang</a>
                            </li>

                            <li class="nav-item">
                                <a href="/contact" class="nav-link">Kontak</a>
                            </li>
                        </ul>
                        <div class="side-nav">
                            <a href="{{ route('login') }}">Masuk</a>
                        </div>

                    </div>
                </nav>
            </div>
        </div>
    </div>
    <!-- End Navbar Area -->

    <!-- End Navbar Area -->

    <!-- Page Title -->
    <div class="page-title-area">
        <div class="d-table">
            <div class="d-table-cell">
                <div class="container">
                    <div class="title-item">
                        <h2>Daftar</h2>
                        <ul>
                            <li><a href="/">Home</a></li>
                            <li><i class='bx bx-chevrons-right'></i></li>
                            <li><span>Daftar</span></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- End Page Title -->

    <!-- User Form -->
    <div class="user-form-area ptb-100">
        <div class="container">
            <div class="user-item">
                <h2>Daftar</h2>
                @if ($errors->any())
                    <div class="alert alert-danger">
                        <strong>Ada beberapa masalah dengan input Anda:</strong>
                        <ul>
                            @foreach ($errors->all() as $error)
                                <li>{{ $error }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif


                <form method="POST" action="{{ route('register') }}" enctype="multipart/form-data">
                    @csrf
                    <div class="custom-divider">
                        <div class="row">
                            <!-- Role Selection -->
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="role" class="form-label">Pilih Role<span
                                        style="color: red;">*</span></label>
                                    {{-- <select id="role" name="role" class="form-control" required>
                                        <option value="">Pilihan Role</option>
                                        <option value="pemerintah">Pemerintah</option>
                                        <option value="umkm">UMKM</option>
                                        <option value="investor">Investor</option>
                                        <option value="akademisi">Akademisi</option>
                                        <option value="komunitas">Komunitas</option>
                                    </select> --}}

                                    <select id="role" name="role" class="form-control" required>
                                        <option value="">Pilihan Role</option>
                                        <option value="pemerintah" {{ old('role') == 'pemerintah' ? 'selected' : '' }}>
                                            Pemerintah</option>
                                        <option value="umkm" {{ old('role') == 'umkm' ? 'selected' : '' }}>UMKM
                                        </option>
                                        <option value="investor" {{ old('role') == 'investor' ? 'selected' : '' }}>
                                            Investor</option>
                                        <option value="akademisi" {{ old('role') == 'akademisi' ? 'selected' : '' }}>
                                            Akademisi</option>
                                        <option value="komunitas" {{ old('role') == 'komunitas' ? 'selected' : '' }}>
                                            Komunitas</option>
                                    </select>

                                    @error('role')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <!-- Form Fields -->

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="full_name" class="form-label">Nama Lengkap<span
                                        style="color: red;">*</span></label>
                                    <input type="text" id="full_name" name="full_name" class="form-control"
                                        placeholder="Nama Lengkap" value="{{ old('full_name') }}" required>
                                    @error('full_name')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="nik" class="form-label">NIK<span
                                        style="color: red;">*</span></label>
                                    <input type="text" id="nik" name="nik" class="form-control"
                                        placeholder="NIK" value="{{ old('nik') }}" required>
                                    @error('nik')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="birthdate" class="form-label">Tanggal Lahir<span
                                        style="color: red;">*</span></label>
                                    <input type="date" id="birthdate" name="birthdate" class="form-control"
                                        value="{{ old('birthdate') }}" required>
                                    @error('birthdate')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="email" class="form-label">Email<span
                                        style="color: red;">*</span></label>
                                    <input type="email" id="email" name="email" class="form-control"
                                        placeholder="Email" value="{{ old('email') }}" required>
                                    @error('email')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="phone_number" class="form-label">No. Telepon<span
                                        style="color: red;">*</span></label>
                                    <input type="text" id="phone_number" name="phone_number" class="form-control"
                                        placeholder="No. Telepon" value="{{ old('phone_number') }}" required>
                                    @error('phone_number')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="address" class="form-label">Alamat<span
                                        style="color: red;">*</span></label>
                                    <textarea id="address" name="address" class="form-control" placeholder="Alamat" required>{{ old('address') }}</textarea>
                                    @error('address')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="foto" class="form-label">Foto<span
                                        style="color: red;">*</span></label>
                                    <input type="file" id="foto" name="foto" class="form-control"
                                        accept="image/jpeg, image/png, image/jpg">
                                    <!-- Mengizinkan semua jenis gambar -->
                                    @error('foto')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                    <!-- Keterangan untuk pengguna -->
                                    <small class="form-text text-muted">Unggah foto dalam format JPEG,JPG, PNG.
                                        Maksimal ukuran file 2MB.</small>
                                </div>
                            </div>

                            <!-- Elemen untuk menampilkan preview foto -->
                            <div class="col-lg-6" id="fotoPreviewContainer" style="display: none;">
                                <h5>Preview Foto:</h5>
                                <img id="fotoPreview" style="width: 100%; height: auto;" alt="Preview Foto">
                            </div>

                            <script>
                                // JavaScript untuk menampilkan preview foto
                                document.getElementById('foto').addEventListener('change', function(event) {
                                    const file = event.target.files[0];
                                    const previewContainer = document.getElementById('fotoPreviewContainer');
                                    const previewImage = document.getElementById('fotoPreview');

                                    // Menampilkan preview hanya jika file adalah gambar
                                    if (file && file.type.startsWith('image/')) {
                                        const reader = new FileReader();
                                        reader.onload = function(e) {
                                            previewImage.src = e.target.result; // Set src dari preview image
                                            previewContainer.style.display = 'block'; // Tampilkan container preview
                                        };
                                        reader.readAsDataURL(file);
                                    } else {
                                        alert('Silakan unggah file gambar (JPEG/PNG).'); // Pesan peringatan jika bukan gambar
                                    }
                                });
                            </script>


                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="password" class="form-label">Kata Sandi<span
                                        style="color: red;">*</span></label>
                                    <div class="input-group">
                                        <div class="position-relative">
                                            <input type="password" id="password" name="password"
                                                class="form-control" placeholder="Password"
                                                value="{{ old('password') }}" required>
                                            <button type="button"
                                                class="btn btn-link position-absolute top-50 end-0 translate-middle-y"
                                                id="togglePassword">
                                                <i class="fa fa-eye" id="eyeIcon"></i>
                                            </button>
                                        </div>
                                    </div>
                                    @error('password')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                    <small class="form-text text-muted">Minimal 8 karakter</small>
                                </div>
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label for="password_confirmation" class="form-label">Konfirmasi Kata
                                        Sandi<span
                                        style="color: red;">*</span></label>
                                    <div class="input-group">
                                        <div class="position-relative">
                                            <input type="password" id="password_confirmation"
                                                name="password_confirmation" class="form-control"
                                                placeholder="Konfirmasi Kata Sandi"
                                                value="{{ old('password_confirmation') }}" required>
                                            <button type="button"
                                                class="btn btn-link position-absolute top-50 end-0 translate-middle-y"
                                                id="togglePasswordConfirmation">
                                                <i class="fa fa-eye" id="eyeIconConfirmation"></i>
                                            </button>
                                        </div>
                                    </div>
                                    @error('password_confirmation')
                                        <span class="error">{{ $message }}</span>
                                    @enderror
                                    <small class="form-text text-muted">Minimal 8 karakter. Pastikan sama dengan kata sandi yang dimasukkan sebelumnya</small>
                                </div>
                            </div>


                            <!-- Role-specific fields -->
                            <div id="role-specific-fields">

                                <!-- Fields for Pemerintah -->
                                <div id="pemerintah-fields" class="role-fields">
                                    <div class="row">

                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="institution_name" class="form-label">Nama Instansi<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="institution_name" name="institution_name"
                                                    class="form-control" placeholder="Nama Instansi"
                                                    value="{{ old('institution_name') }}" required>
                                                @error('institution_name')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                        {{-- <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="description_pemerintah" class="form-label">Deskripsi
                                                    Pemerintah</label>
                                                <textarea id="description_pemerintah" name="description_pemerintah" class="form-control"
                                                    placeholder="Deskripsi Pemerintah"></textarea>
                                                @error('description_pemerintah')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div> --}}

                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="description_pemerintah" class="form-label">Deskripsi
                                                    Pemerintah<span
                                                    style="color: red;">*</span></label>
                                                <textarea id="description_pemerintah" name="description_pemerintah" class="form-control"
                                                    placeholder="Deskripsi Pemerintah">{{ old('description_pemerintah') }}</textarea>
                                                @error('description_pemerintah')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                    </div>
                                </div>

                                <!-- Fields for UMKM -->
                                <div id="umkm-fields" class="role-fields">
                                    <div class="row">
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="umkm_name" class="form-label">Nama UMKM<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="umkm_name" name="umkm_name"
                                                    class="form-control" placeholder="Nama UMKM"
                                                    value="{{ old('umkm_name') }}">
                                                @error('umkm_name')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="establishment_date_umkm" class="form-label">Tanggal
                                                    Pendirian<span
                                                    style="color: red;">*</span></label>
                                                <input type="date" id="establishment_date_umkm"
                                                    name="establishment_date_umkm" class="form-control"
                                                    value="{{ old('establishment_date_umkm') }}">
                                                @error('establishment_date_umkm')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="product" class="form-label">Produk<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="product" name="product"
                                                    class="form-control" value="{{ old('product') }}">
                                                @error('product')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="laporan_keuangan" class="form-label">Laporan
                                                    Keuangan<span
                                                    style="color: red;">*</span></label>
                                                <input type="file" id="laporan_keuangan" name="laporan_keuangan"
                                                    class="form-control" accept=".pdf">
                                                @error('laporan_keuangan')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                                <small class="form-text text-muted">Unggah file Laporan Keuangan dalam
                                                    format PDF.</small>
                                            </div>
                                        </div>


                                        <!-- Tambahkan elemen untuk menampilkan preview -->
                                        <div class="col-lg-6" id="laporanPreviewContainer" style="display: none;">
                                            <h5>Preview Laporan Keuangan:</h5>
                                            <iframe id="laporanPreviewFrame" style="width: 100%; height: 400px;"
                                                frameborder="0"></iframe>
                                        </div>

                                        <script>
                                            document.getElementById('laporan_keuangan').addEventListener('change', function(event) {
                                                const file = event.target.files[0]; // Ambil file pertama dari input
                                                const laporanPreviewContainer = document.getElementById('laporanPreviewContainer');
                                                const laporanPreviewFrame = document.getElementById('laporanPreviewFrame');

                                                if (file) {
                                                    // Periksa apakah file adalah PDF
                                                    if (file.type === 'application/pdf') {
                                                        const fileURL = URL.createObjectURL(file); // Membuat URL objek untuk file yang diunggah
                                                        laporanPreviewFrame.src = fileURL; // Atur src iframe untuk PDF
                                                        laporanPreviewContainer.style.display = 'block'; // Tampilkan container preview
                                                    } else {
                                                        alert('Hanya file PDF yang dapat dilihat sebagai preview.');
                                                        laporanPreviewContainer.style.display = 'none'; // Sembunyikan preview jika file tidak didukung
                                                    }
                                                } else {
                                                    laporanPreviewContainer.style.display = 'none'; // Sembunyikan preview jika tidak ada file
                                                }
                                            });
                                        </script>



                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="siup_number_umkm" class="form-label">Nomor NIB<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="siup_number_umkm" name="siup_number_umkm"
                                                    class="form-control" value="{{ old('siup_number_umkm') }}">
                                                @error('siup_number_umkm')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                        {{-- <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="profit_umkm" class="form-label">Kategori Pendapatan
                                                    UMKM</label>
                                                <select id="profit_umkm" name="profit_umkm" class="form-control">
                                                    <option value="">Pilih Kategori Pendapatan</option>
                                                    <option value="< Rp 5 juta">
                                                        < Rp 5 juta</option>
                                                    <option value="Rp 5 juta - Rp 10 juta">Rp 5 juta - Rp 10 juta
                                                    </option>
                                                    <option value="Rp 10 juta - Rp 20 juta">Rp 10 juta - Rp 20 juta
                                                    </option>
                                                    <option value="Rp 20 juta - Rp 50 juta">Rp 20 juta - Rp 50 juta
                                                    </option>
                                                    <option value="> Rp 50 juta">> Rp 50 juta</option>
                                                </select>
                                                @error('profit_umkm')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div> --}}

                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="profit_umkm" class="form-label">Kategori Pendapatan
                                                    UMKM (Bulan)<span
                                                    style="color: red;">*</span></label>
                                                <select id="profit_umkm" name="profit_umkm" class="form-control">
                                                    <option value="">Pilih Kategori Pendapatan</option>
                                                    <option value="< Rp 5 juta"
                                                        {{ old('profit_umkm') == '< Rp 5 juta' ? 'selected' : '' }}>
                                                        < Rp 5 juta</option>
                                                    <option value="Rp 5 juta - Rp 10 juta"
                                                        {{ old('profit_umkm') == 'Rp 5 juta - Rp 10 juta' ? 'selected' : '' }}>
                                                        Rp 5 juta - Rp 10 juta</option>
                                                    <option value="Rp 10 juta - Rp 20 juta"
                                                        {{ old('profit_umkm') == 'Rp 10 juta - Rp 20 juta' ? 'selected' : '' }}>
                                                        Rp 10 juta - Rp 20 juta</option>
                                                    <option value="Rp 20 juta - Rp 50 juta"
                                                        {{ old('profit_umkm') == 'Rp 20 juta - Rp 50 juta' ? 'selected' : '' }}>
                                                        Rp 20 juta - Rp 50 juta</option>
                                                    <option value="> Rp 50 juta"
                                                        {{ old('profit_umkm') == '> Rp 50 juta' ? 'selected' : '' }}>
                                                        > Rp 50 juta</option>
                                                </select>
                                                @error('profit_umkm')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>


                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="description_umkm" class="form-label">Deskripsi
                                                    UMKM<span
                                                    style="color: red;">*</span></label>
                                                <textarea id="description_umkm" name="description_umkm" class="form-control">{{ old('description_umkm') }}</textarea>
                                                @error('description_umkm')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                        <!-- Tambahkan field untuk PIRT -->
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="pirt" class="form-label">Nomor PIRT</label>
                                                <input type="text" id="pirt" name="pirt"
                                                    class="form-control" value="{{ old('pirt') }}">
                                                @error('pirt')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                        <!-- Tambahkan field untuk Sertifikat Halal MUI -->
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="sertifikat_halal_mui" class="form-label">Sertifikat Halal
                                                    MUI</label>
                                                <input type="file" id="sertifikat_halal_mui"
                                                    name="sertifikat_halal_mui" class="form-control" accept=".pdf">
                                                @error('sertifikat_halal_mui')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                                <small class="form-text text-muted">Unggah file Sertifikat Halal MUI
                                                    dalam format PDF.</small>
                                            </div>
                                        </div>

                                        <!-- Tambahkan elemen untuk menampilkan preview -->
                                        <div class="col-lg-6" id="previewContainer" style="display: none;">
                                            <h5>Preview Sertifikat Halal MUI:</h5>
                                            <iframe id="previewFrame" style="width: 100%; height: 400px;"
                                                frameborder="0"></iframe>
                                        </div>


                                        <script>
                                            document.getElementById('sertifikat_halal_mui').addEventListener('change', function(event) {
                                                const file = event.target.files[0]; // Ambil file pertama dari input
                                                const previewContainer = document.getElementById('previewContainer');
                                                const previewFrame = document.getElementById('previewFrame');

                                                if (file) {
                                                    const fileURL = URL.createObjectURL(file); // Membuat URL objek untuk file yang diunggah

                                                    // Tampilkan preview hanya jika file adalah PDF
                                                    if (file.type === 'application/pdf') {
                                                        previewFrame.src = fileURL; // Atur src iframe dengan URL file
                                                        previewContainer.style.display = 'block'; // Tampilkan container preview
                                                    } else {
                                                        alert('Hanya file PDF yang dapat dilihat sebagai preview.');
                                                        previewContainer.style.display = 'none'; // Sembunyikan preview jika file bukan PDF
                                                    }
                                                } else {
                                                    previewContainer.style.display = 'none'; // Sembunyikan preview jika tidak ada file
                                                }
                                            });
                                        </script>




                                        <!-- Tambahkan field untuk BPOM -->
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="bpom" class="form-label">Nomor BPOM</label>
                                                <input type="text" id="bpom" name="bpom"
                                                    class="form-control" value="{{ old('bpom') }}">
                                                @error('bpom')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>

                                    </div>
                                </div>

                                <!-- Investor-specific fields -->
                                <div id="investor-fields" class="role-fields">
                                    <div class="row">
                                        {{-- <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="category" class="form-label">Kategori</label>
                                                <select id="category" name="category" class="form-control">
                                                    <option value="">Pilih Kategori</option>
                                                    <option value="personal">Personal</option>
                                                    <option value="perusahaan">Perusahaan</option>
                                                </select>
                                                @error('category')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div> --}}

                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="category" class="form-label">Kategori<span
                                                    style="color: red;">*</span></label>
                                                <select id="category" name="category" class="form-control">
                                                    <option value="">Pilih Kategori</option>
                                                    <option value="personal"
                                                        {{ old('category') == 'personal' ? 'selected' : '' }}>Personal
                                                    </option>
                                                    <option value="perusahaan"
                                                        {{ old('category') == 'perusahaan' ? 'selected' : '' }}>
                                                        Perusahaan</option>
                                                </select>
                                                @error('category')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>


                                        <!-- Personal Fields -->
                                        <div id="personal-fields" class="form-group" style="display: none;">
                                            <div class="row">
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="npwp_number_inves_personal"
                                                            class="form-label">Nomor NPWP<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="npwp_number_inves_personal"
                                                            name="npwp_number_inves_personal"
                                                            value="{{ old('npwp_number_inves_personal') }}"
                                                            class="form-control" required>
                                                        @error('npwp_number_inves_personal')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="job" class="form-label">Pekerjaan<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="job" name="job"
                                                            value="{{ old('job') }}" class="form-control"
                                                            required>
                                                        @error('job')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="profit_inves_personal"
                                                            class="form-label">Profit(Rp Per Bulan)<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="profit_inves_personal"
                                                            name="profit_inves_personal"
                                                            value="{{ old('profit_inves_personal') }}"
                                                            class="form-control" required>
                                                        @error('profit_inves_personal')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="total_assets" class="form-label">Total
                                                            Aset(Rp)<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="total_assets" name="total_assets"
                                                            value="{{ old('total_assets') }}" class="form-control"
                                                            required>
                                                        @error('total_assets')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>

                                            </div>
                                        </div>

                                        <!-- Perusahaan Fields -->
                                        <div id="perusahaan-fields" class="form-group" style="display: none;">
                                            <div class="row">
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="company_name" class="form-label">Nama
                                                            Perusahaan<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="company_name" name="company_name"
                                                            class="form-control" value="{{ old('company_name') }}"
                                                            required>
                                                        @error('company_name')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="npwp_number_inves_perusahaan"
                                                            class="form-label">Nomor NPWP<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="npwp_number_inves_perusahaan"
                                                            name="npwp_number_inves_perusahaan"
                                                            value="{{ old('npwp_number_inves_perusahaan') }}"
                                                            class="form-control" required>
                                                        @error('npwp_number_inves_perusahaan')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="siup_number_inves_perusahaan"
                                                            class="form-label">Nomor SIUP<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="siup_number_inves_perusahaan"
                                                            name="siup_number_inves_perusahaan"
                                                            value="{{ old('siup_number_inves_perusahaan') }}"
                                                            class="form-control" required>
                                                        @error('siup_number_inves_perusahaan')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="nib_number" class="form-label">Nomor NIB<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="nib_number" name="nib_number"
                                                            value="{{ old('nib_number') }}" class="form-control"
                                                            required>
                                                        @error('nib_number')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="establishment_date_inves_perusahaan"
                                                            class="form-label">Tanggal Pendirian<span
                                                            style="color: red;">*</span></label>
                                                        <input type="date" id="establishment_date_inves_perusahaan"
                                                            name="establishment_date_inves_perusahaan"
                                                            class="form-control"
                                                            value="{{ old('establishment_date_inves_perusahaan') }}">
                                                        @error('establishment_date_inves_perusahaan')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="profit_inves_perusahaan"
                                                            class="form-label">Profit<span
                                                            style="color: red;">*</span></label>
                                                        <input type="text" id="profit_inves_perusahaan"
                                                            name="profit_inves_perusahaan"
                                                            value="{{ old('profit_inves_perusahaan') }}"
                                                            class="form-control" required>
                                                        @error('profit_inves_perusahaan')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div class="form-group">
                                                        <label for="description_inves_perusahaan"
                                                            class="form-label">Deskripsi<span
                                                            style="color: red;">*</span></label>
                                                        <textarea id="description_inves_perusahaan" name="description_inves_perusahaan" class="form-control">{{ old('description_inves_perusahaan') }}</textarea>
                                                        @error('description_inves_perusahaan')
                                                            <span class="error">{{ $message }}</span>
                                                        @enderror
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Fields for Akademisi -->
                                <div id="akademisi-fields" class="role-fields">
                                    <div class="row">
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="university_name" class="form-label">Nama
                                                    Universitas<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="university_name" name="university_name"
                                                    class="form-control" value="{{ old('university_name') }}">
                                                @error('university_name')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="faculty" class="form-label">Fakultas<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="faculty" name="faculty"
                                                    class="form-control" value="{{ old('faculty') }}">
                                                @error('faculty')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="study_program" class="form-label">Program Studi<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="study_program" name="study_program"
                                                    class="form-control" value="{{ old('study_program') }}">
                                                @error('study_program')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="expertise_field" class="form-label">Bidang
                                                    Keahlian<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="expertise_field" name="expertise_field"
                                                    class="form-control" value="{{ old('expertise_field') }}">
                                                @error('expertise_field')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="description_akademisi"
                                                    class="form-label">Deskripsi<span
                                                    style="color: red;">*</span></label>
                                                <textarea id="description_akademisi" name="description_akademisi" class="form-control">{{ old('description_akademisi') }}</textarea>
                                                @error('description_akademisi')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <!-- Fields for Komunitas -->
                                <div id="komunitas-fields" class="role-fields">
                                    <div class="row">
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="community_name" class="form-label">Nama Komunitas<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="community_name" name="community_name"
                                                    class="form-control" value="{{ old('community_name') }}">
                                                @error('community_name')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="establishment_date_komunitas" class="form-label">Tanggal
                                                    Pendirian<span
                                                    style="color: red;">*</span></label>
                                                <input type="date" id="establishment_date_komunitas"
                                                    name="establishment_date_komunitas" class="form-control"
                                                    value="{{ old('establishment_date_komunitas') }}">
                                                @error('establishment_date_komunitas')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="description_komunitas"
                                                    class="form-label">Deskripsi<span
                                                    style="color: red;">*</span></label>
                                                <textarea id="description_komunitas" name="description_komunitas" class="form-control">{{ old('description_komunitas') }}</textarea>
                                                @error('description_komunitas')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                        <div class="col-lg-6">
                                            <div class="form-group">
                                                <label for="community_license" class="form-label">Lisensi
                                                    Komunitas<span
                                                    style="color: red;">*</span></label>
                                                <input type="text" id="community_license" name="community_license"
                                                    class="form-control" value="{{ old('community_license') }}">
                                                @error('community_license')
                                                    <span class="error">{{ $message }}</span>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-lg-12">
                                <div class="form-group">
                                    <button type="submit" class="btn btn-primary">Daftar</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>

                <script>
                    document.addEventListener('DOMContentLoaded', function() {
                        // Get elements
                        const roleSelect = document.getElementById('role');
                        const roleFields = document.querySelectorAll('.role-fields');
                        const categorySelect = document.getElementById('category');
                        const personalFields = document.getElementById('personal-fields');
                        const perusahaanFields = document.getElementById('perusahaan-fields');

                        // Handle role selection
                        roleSelect.addEventListener('change', function() {
                            roleFields.forEach(field => {
                                field.style.display = 'none';
                                field.querySelectorAll('input, select, textarea').forEach(input => {
                                    input.disabled = true;
                                    input.required = false;
                                });
                            });

                            const selectedRole = roleSelect.value;
                            if (selectedRole) {
                                const activeFields = document.getElementById(`${selectedRole}-fields`);
                                if (activeFields) {
                                    activeFields.style.display = 'block';
                                    activeFields.querySelectorAll('input, select, textarea').forEach(input => {
                                        input.disabled = false;
                                        if (input.hasAttribute('data-required')) {
                                            input.required = true;
                                        }
                                    });
                                }
                            }
                        });

                        // Handle category selection for investors
                        categorySelect.addEventListener('change', function() {
                            const selectedCategory = categorySelect.value;
                            if (selectedCategory === 'personal') {
                                showFields(personalFields);
                                hideFields(perusahaanFields);
                            } else if (selectedCategory === 'perusahaan') {
                                showFields(perusahaanFields);
                                hideFields(personalFields);
                            } else {
                                hideFields(personalFields);
                                hideFields(perusahaanFields);
                            }
                        });

                        function showFields(fields) {
                            fields.style.display = 'block';
                            fields.querySelectorAll('input, select, textarea').forEach(input => {
                                input.disabled = false;
                                if (input.hasAttribute('data-required')) {
                                    input.required = true;
                                }
                            });
                        }

                        function hideFields(fields) {
                            fields.style.display = 'none';
                            fields.querySelectorAll('input, select, textarea').forEach(input => {
                                input.disabled = true;
                                input.required = false;
                            });
                        }

                        // Initialize the form
                        roleSelect.dispatchEvent(new Event('change'));
                        if (categorySelect) {
                            categorySelect.dispatchEvent(new Event('change'));
                        }
                    });

                    // Toggle password visibility
                    document.getElementById('togglePassword').addEventListener('click', function() {
                        const passwordInput = document.getElementById('password');
                        const eyeIcon = document.getElementById('eyeIcon');
                        if (passwordInput.type === 'password') {
                            passwordInput.type = 'text';
                            eyeIcon.classList.remove('bx-show');
                            eyeIcon.classList.add('bx-hide');
                        } else {
                            passwordInput.type = 'password';
                            eyeIcon.classList.remove('bx-hide');
                            eyeIcon.classList.add('bx-show');
                        }
                    });

                    // Toggle password confirmation visibility
                    document.getElementById('togglePasswordConfirmation').addEventListener('click', function() {
                        const passwordConfirmationInput = document.getElementById('password_confirmation');
                        const eyeIconConfirmation = document.getElementById('eyeIconConfirmation');
                        if (passwordConfirmationInput.type === 'password') {
                            passwordConfirmationInput.type = 'text';
                            eyeIconConfirmation.classList.remove('bx-show');
                            eyeIconConfirmation.classList.add('bx-hide');
                        } else {
                            passwordConfirmationInput.type = 'password';
                            eyeIconConfirmation.classList.remove('bx-hide');
                            eyeIconConfirmation.classList.add('bx-show');
                        }
                    });
                </script>


            </div>
        </div>
    </div>
    <!-- End User Form -->

    <!-- Footer Area -->
    <!-- Footer -->
    <footer class="pt-100">
        <div class="container">
            <div class="row">
                <div class="col-sm-6 col-lg-3">
                    <div class="footer-item">
                        <div class="footer-logo">
                            <a href="index.html">
                                <img src="assetslixi/img/logo.png" alt="Logo">
                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6 col-lg-3">
                    <div class="footer-item">
                        <div class="footer-company">
                            <h3>Sosial Media</h3>
                            <ul>
                                <li>
                                    <a href="https://www.facebook.com/yourprofile" target="_blank">
                                        <i class="fab fa-facebook"></i> Facebook
                                    </a>
                                </li>
                                <li>
                                    <a href="https://www.instagram.com/yourprofile" target="_blank">
                                        <i class="fab fa-instagram"></i> Instagram
                                    </a>
                                </li>
                                <li>
                                    <a href="https://www.youtube.com/yourprofile" target="_blank">
                                        <i class="fab fa-youtube"></i> Youtube
                                    </a>
                                </li>
                                <li>
                                    <a href="https://www.twitter.com/yourprofile" target="_blank">
                                        <i class="fab fa-twitter"></i> Twitter
                                    </a>
                                </li>
                                <li>
                                    <a href="https://www.tiktok.com/@yourprofile" target="_blank">
                                        <i class="fab fa-tiktok"></i> Tiktok
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>

                <!-- Include Font Awesome CDN link for the icons -->
                <link rel="stylesheet"
                    href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">

                <div class="col-sm-6 col-lg-3">
                    <div class="footer-item">
                        <div class="footer-contact" style="color: white;">
                            <h3>Info Kontak</h3>
                            <ul style="list-style: none; padding: 0; line-height: 1.8;">
                                <li>
                                    <i class="fas fa-map-marker-alt"></i>
                                    <strong>Lokasi:</strong> <br>
                                    Malang Creative Center, Jl. Ahmad Yani No.53, Blimbing, Kec. Blimbing, Kota Malang,
                                    Jawa Timur 65118
                                </li>


                                <li>
                                    <i class="fas fa-envelope"></i>
                                    <strong>Email:</strong> <br>
                                    <a href="mailto:kerjasama.mcc@gmail.com"
                                        style="color: white; text-decoration: none;">kerjasama.mcc@gmail.com</a>
                                </li>
                                <li>
                                    <i class="fas fa-phone"></i>
                                    <strong>Phone:</strong> <br>
                                    <a href="tel:+62895423422252" style="color: white; text-decoration: none;">+62
                                        895-4234-22252</a>
                                </li>
                            </ul>
                        </div>

                    </div>
                </div>
            </div>
            <div class="copyright-area">
                <p>2024 – Now © Copyright by <a href="https://mcc.or.id/" target="_blank">Malang Creative Center</a>
                </p>
            </div>
        </div>
    </footer>

    <!-- JS Files -->
    <script src="assetslixi/js/jquery.min.js"></script>
    <script src="assetslixi/js/bootstrap.bundle.min.js"></script>
    <script src="assetslixi/js/jquery.meanmenu.js"></script>
    <script src="assetslixi/js/odometer.min.js"></script>
    <script src="assetslixi/js/jquery.magnific-popup.min.js"></script>
    <script src="assetslixi/js/owl.carousel.min.js"></script>
    <script src="assetslixi/js/jquery.nice-select.min.js"></script>
    <script src="assetslixi/js/main.js"></script>



</body>

</html>
