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

<head>
  <meta charset="utf-8">
  <meta content="width=device-width, initial-scale=1.0" name="viewport">
  <title>SmartPenjaja MBIP</title>
  <meta name="description" content="">
  <meta name="keywords" content="">

  <!-- Favicons -->
  <link href="{{asset('assets/img/favicon.ico')}}" rel="icon">
  <link href="{{asset('assets/img/apple-touch-icon.png')}}" rel="apple-touch-icon">

  <!-- Fonts -->
  <link href="https://fonts.googleapis.com" rel="preconnect">
  <link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">

  <!-- Vendor CSS Files -->
  <link href="{{asset('assets/vendor/bootstrap/css/bootstrap.min.css')}}" rel="stylesheet">
  <link href="{{asset('assets/vendor/bootstrap-icons/bootstrap-icons.css')}}" rel="stylesheet">
  <link href="{{asset('assets/vendor/aos/aos.css')}}" rel="stylesheet">
  <link href="{{asset('assets/vendor/glightbox/css/glightbox.min.css')}}" rel="stylesheet">
  <link href="{{asset('assets/vendor/swiper/swiper-bundle.min.css')}}" rel="stylesheet">

  <!-- Main CSS File -->
  <link href="{{asset('assets/css/main.css')}}" rel="stylesheet">

  <!-- =======================================================
  * Template Name: Append
  * Template URL: https://bootstrapmade.com/append-bootstrap-website-template/
  * Updated: Aug 07 2024 with Bootstrap v5.3.3
  * Author: BootstrapMade.com
  * License: https://bootstrapmade.com/license/
  ======================================================== -->
</head>

<body class="index-page">

  <header id="header" class="header d-flex align-items-center fixed-top">
    <div class="container-fluid position-relative d-flex align-items-center justify-content-between">

      <a href="index.html" class="logo d-flex align-items-center me-auto me-xl-0">
        <!-- Uncomment the line below if you also wish to use an image logo -->
        <!-- <img src="{{asset('assets/img/logo.png')}}" alt=""> -->
        <h1 class="sitename">SmartPenjaja</h1>
      </a>

      <nav id="navmenu" class="navmenu">
        <ul>
          <li><a href="#hero" class="active">Home</a></li>
          <li><a href="#about">Penempatan</a></li>
          <li><a href="#faq">FAQ</a></li>
          <li><a href="manual.php">Manual Pengguna</a></li>
        </ul>
        <i class="mobile-nav-toggle d-xl-none bi bi-list"></i>
      </nav>

      <a class="btn-getstarted" href="{{route('register')}}">Daftar</a>

    </div>
  </header>

  <main class="main">
<?php /*
    <!-- Hero Section -->
    <section id="hero" class="hero section dark-background">

      <img src="{{asset('assets/img/hero-bg.png')}}" alt="" data-aos="fade-in">

      <div class="container">
        <div class="row">
          <div class="col-lg-10">
            <h2 data-aos="fade-up" data-aos-delay="100">SmartPenjaja@MBIP</h2>
          </div>
          <div class="col-lg-5" data-aos="fade-up" data-aos-delay="300">
            <form method="POST" action="{{ route('login') }}">
                @csrf
                <div class="mb-3">
                    <label for="nokp" class="form-label">No Kad Pengenalan</label>
                    <input type="text" class="form-control" name="nokp" required autofocus>
                </div>
                <div class="mb-3">
                    <label for="password" class="form-label">Katalaluan</label>
                    <input type="password" class="form-control" name="password" required>
                </div>
                <div class="d-grid">
                    <button type="submit" class="btn btn-primary">Log Masuk</button>
                </div>
            </form>
          </div>
        </div>
      </div>

    </section><!-- /Hero Section --> */ ?>
    <!-- Hero Section -->
<section id="hero" class="hero section dark-background position-relative overflow-hidden">

<!-- Background video -->
<video autoplay muted loop playsinline class="position-absolute top-0 start-0 w-100 h-100 object-fit-cover">
  <source src="{{ asset('img/fahmi_bg.mp4') }}" type="video/mp4">
  Browser anda tidak menyokong video tag.
</video>

<!-- Overlay gelap sikit kalau nak teks nampak -->
<div class="position-absolute top-0 start-0 w-100 h-100" 
     style="background: rgba(0,0,0,0.1); z-index:1;"></div>

<!-- Content -->
<div class="container position-relative z-2" style="z-index: 2;">
  <div class="row">
    <div class="col-lg-10">
      <h2 data-aos="fade-up" data-aos-delay="100" class="text-white">SmartPenjaja@MBIP</h2>
    </div>
    <div class="col-lg-5" data-aos="fade-up" data-aos-delay="300">
      <form method="POST" action="{{ route('login') }}">
        @csrf
        <div class="mb-3">
          <label for="nokp" class="form-label text-white">No Kad Pengenalan</label>
          <input type="text" class="form-control" name="nokp" required autofocus>
        </div>
        <div class="mb-3">
          <label for="password" class="form-label text-white">Katalaluan</label>
          <input type="password" class="form-control" name="password" required>
        </div>
        <div class="d-grid">
          <button type="submit" class="btn btn-primary">Log Masuk</button>
        </div>
      </form>
    </div>
  </div>
</div>

</section><!-- /Hero Section -->

    <!-- About Section -->
    <section id="about" class="about section light-background">

      <div class="container" data-aos="fade-up" data-aos-delay="100">
        <div class="row align-items-xl-center gy-5">

          <div class="col-xl-5 content">
            <h3>Penjaja</h3>
            <h2>Penempatan yang Disediakan</h2>
            <p>Terdapat beberapa kaedah penempatan penjaja dalam kawasan MBIP.</p>
          </div>

          <div class="col-xl-7">
            <div class="row gy-4 icon-boxes">

              <div class="col-md-6" data-aos="fade-up" data-aos-delay="200">
                <div class="icon-box">
                <i class="bi bi-clipboard2-heart"></i>
                  <h3>Penempatan Penjaja Buah Bermusim</h3>
                  <a href="" class="btn btn-primary disabled" >Senarai</a>
                </div>
              </div> <!-- End Icon Box -->

              <div class="col-md-6" data-aos="fade-up" data-aos-delay="300">
                <div class="icon-box">
                <i class="bi bi-clipboard2-heart"></i>
                  <h3>Penempatan Penjaja MyKiosk</h3>
                  <a href="" class="btn btn-primary disabled" >Senarai</a>
                </div>
              </div> <!-- End Icon Box -->

              <div class="col-md-6" data-aos="fade-up" data-aos-delay="400">
                <div class="icon-box">
                <i class="bi bi-clipboard2-heart"></i>
                  <h3>Penempatan Penjaja Sementara</h3>
                  <a href="" class="btn btn-primary disabled" >Senarai</a>
                </div>
              </div> <!-- End Icon Box -->

              <div class="col-md-6" data-aos="fade-up" data-aos-delay="500">
                <div class="icon-box">
                <i class="bi bi-clipboard2-heart"></i>
                  <h3>Senarai Pasar Malam</h3>
                  <a href="" class="btn btn-primary disabled" >Senarai</a>
                </div>
              </div> <!-- End Icon Box -->

            </div>
          </div>

        </div>
      </div>

    </section><!-- /About Section -->

    <!-- Faq Section -->
    <section id="faq" class="faq section">

      <div class="container">

        <div class="row gy-4">

          <div class="col-lg-4" data-aos="fade-up" data-aos-delay="100">
            <div class="content px-xl-5">
              <h3><strong>Soalan</strong> <span>Selalu Ditanya </span></h3>
              <p>
                Berikut adalah antara soalan yang sering ditanya oleh pemohon dan orang awam.
              </p>
            </div>
          </div>

          <div class="col-lg-8" data-aos="fade-up" data-aos-delay="200">

            <div class="faq-container">
              <div class="faq-item faq-active">
                <h3><span class="num">1.</span> <span>Kawasan mana sesuai untuk saya berniaga?</span></h3>
                <div class="faq-content">
                  <p>Boleh semak dalam senarai penempatan penjaja.</p>
                </div>
                <i class="faq-toggle bi bi-chevron-right"></i>
              </div><!-- End Faq item-->

              <div class="faq-item">
                <h3><span class="num">2.</span> <span>Kenapa kena mohon lesen penjaja?</span></h3>
                <div class="faq-content">
                  <p>MBIP ada menyediakan pelbagai bantuan kepada penjaja berlesen. Antaranya adalah khemah, bantuan bencana dan geran insentif Bantuan Usahawan Mikro kerajaan pusat.</p>
                </div>
                <i class="faq-toggle bi bi-chevron-right"></i>
              </div><!-- End Faq item-->

              <div class="faq-item">
                <h3><span class="num">3.</span> <span>Berapa harga lesen penjaja?</span></h3>
                <div class="faq-content">
                  <p>Kadar lesen penjaja adalah RM 300 untuk tempoh 6 bulan. </p>
                </div>
                <i class="faq-toggle bi bi-chevron-right"></i>
              </div><!-- End Faq item-->

              <div class="faq-item">
                <h3><span class="num">4.</span> <span>Boleh bukak khemah?</span></h3>
                <div class="faq-content">
                  <p>Boleh. Hanya 1 khemah dibenarkan untuk 1 lesen penjaja. Dasar MBIP membenarkan penggunaan khemah bersaiz tidak lebih 10' x 10'</p>
                </div>
                <i class="faq-toggle bi bi-chevron-right"></i>
              </div><!-- End Faq item-->

              <div class="faq-item">
                <h3><span class="num">5.</span> <span>Barang boleh tinggal?</span></h3>
                <div class="faq-content">
                  <p>Tidak dibenarkan meninggalkan barang perniagaan selepas selesai perniagaan dijalankan. Sampah juga perlu dibersihkan dan dibuang di tempat pembuangan sampah.</p>
                </div>
                <i class="faq-toggle bi bi-chevron-right"></i>
              </div><!-- End Faq item-->

              <div class="faq-item">
                <h3><span class="num">6.</span> <span>Tong sampah MBIP sediakan tak?</span></h3>
                <div class="faq-content">
                  <p>Tidak. Penjaja perlu menguruskan sendiri sampah di tempat perniagaan.</p>
                </div>
                <i class="faq-toggle bi bi-chevron-right"></i>
              </div><!-- End Faq item-->

              <div class="faq-item">
                <h3><span class="num">7.</span> <span>Boleh tak MBIP cucikan stall kitorang?</span></h3>
                <div class="faq-content">
                  <p>Penjaja bertanggungjawab sepenuhnya di atas kebersihan gerai perniagaan masing-masing. </p>
                </div>
                <i class="faq-toggle bi bi-chevron-right"></i>
              </div><!-- End Faq item-->

            </div>

          </div>
        </div>

      </div>

    </section><!-- /Faq Section -->


  </main>

  <footer id="footer" class="footer position-relative light-background">

    <div class="container footer-top">
      <div class="row gy-4">
        <div class="col-lg-5 col-md-12 footer-about">
          <a href="index.html" class="logo d-flex align-items-center">
            <span class="sitename">SmartPenjaja</span>
          </a>
          <p>Sistem permohonan penjaja dalam kawasan MBIP.</p>
        </div>

        <div class="col-lg-2 col-6 footer-links">
          <h4>di MBIP</h4>
          <ul>
            <li><a href="https://www.mbip.gov.my" target="_blank">MBIP</a></li>
            <li><a href="https://mycukai.mbip.gov.my" target="_blank">myCukai@MBIP</a></li>
            <li><a href="https://awam.di.mbip.my" target="_blank">Pembaharuan Lesen</a></li>
            <li><a href="https://jawatan.mbip.gov.my" target="_blank">eJawatan</a></li>
            <li><a href="https://voiceofiskandarputeri.mbip.my/" target="_blank">Voice of Iskandar Puteri</a></li>
          </ul>
        </div>

        <div class="col-lg-2 col-6 footer-links">
          <h4>Pembayaran Online</h4>
          <ul>
            <li><a href="https://johorpay.johor.gov.my" target="_blank">JohorPay</a></li>
            <li><a href="https://pbtpay.kpkt.gov.my/" target="_blank">PBTPay</a></li>
            <li><a href="http://ekhidmat.my/ekhidmat/" target="_blank">eKhidmat</a></li>
          </ul>
        </div>

        <div class="col-lg-3 col-md-12 footer-contact text-center text-md-start">
          <h4>Jabatan Pelesenan @MBIP</h4>
          <p>Bangunan Temenggong Ibrahim,</p>
          <p>Jalan Medini Sentral 9,</p>
          <p>Bandar Medini Iskandar,</p>
          <p>79250 Iskandar Puteri,</p>
          <p>Johor Darul Ta'zim</p>
          <p class="mt-4"><strong>Telefon:</strong> <span>+60 07-555 5000</span></p>
          <p><strong>Email:</strong> <span>pelesenan@mbip.gov.my</span></p>
        </div>

      </div>
    </div>



  </footer>

  <!-- Scroll Top -->
  <a href="#" id="scroll-top" class="scroll-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a>

  <!-- Preloader -->
  <div id="preloader"></div>

  <!-- Vendor JS Files -->
  <script src="{{asset('assets/vendor/bootstrap/js/bootstrap.bundle.min.js')}}"></script>
  <script src="{{asset('assets/vendor/php-email-form/validate.js')}}"></script>
  <script src="{{asset('assets/vendor/aos/aos.js')}}"></script>
  <script src="{{asset('assets/vendor/glightbox/js/glightbox.min.js')}}"></script>
  <script src="{{asset('assets/vendor/purecounter/purecounter_vanilla.js')}}"></script>
  <script src="{{asset('assets/vendor/imagesloaded/imagesloaded.pkgd.min.js')}}"></script>
  <script src="{{asset('assets/vendor/isotope-layout/isotope.pkgd.min.js')}}"></script>
  <script src="{{asset('assets/vendor/swiper/swiper-bundle.min.js')}}"></script>

  <!-- Main JS File -->
  <script src="{{asset('assets/js/main.js')}}"></script>
  <script src="{{ asset('assets/vendor/aos/aos.js') }}"></script>
    <script>
    AOS.init();
    </script>
</body>

</html>