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

<head>
  <title> EMSO - Permit App </title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <!-- ------ Meta Contents Start ----------------------------- -->
  <meta name="description" content="" />
  <meta name="keywords" content="">
  <meta name="copyright" content="">
  <!-- ------ Meta Contents End ----------------------------- -->

  <?php include 'includes/header.php'; ?>
  <?php include 'includes/main-menu.php'; ?>
  

  <!-- ........... Page-Event-Permit Start ..................  -->
  <section class="page-main-wrapper">
    <div class="custom-container">

      <div class="mainFlexWrapper">
        <!-------------- Start Main-Wrapper-Body-container ---------------->
        <div class="body-container my-container menu-wrapper-container active">

          <!-------- Start Profile-head --->
          <?php include 'includes/profile-head.php'; ?>
          <!-------- End Profile-head ----->  

          <!-------- Start body-content-area-wrap --->
          <div class="body-content-area-wrap">
            <div class="head overwrite-full-width">
              <h3 class="title">Event Permit Request</h3>              
            </div>            

            <!-------- event-table-data-wrapper Start --->
            <div class="event-table-data-wrapper">
              <form action="" method="POST" class="custom-form input-bg-white">
                <div class="filter-wrpper">
                  <div class="col">
                    <div class="input-group">
                        <input type="text" class="form-control" placeholder="Search by Name">
                        <div class="input-group-append">
                          <button class="filter-search-btn" type="button">
                            <i class="fa fa-search"></i>
                          </button>
                        </div>
                    </div>
                  </div>

                  <div class="form-group col">
                    <label for="name" class="form-label">Discipline</label>
                    <select class="form-select" aria-label="Select a department">
                      <option value=""> Moto </option>
                      <option value=""> Auto </option>
                      <option value=""> Karting </option>
                      <option value=""> E-sports </option>
                    </select> 
                  </div>

                  <div class="form-group col">
                    <label for="name" class="form-label">Discipline</label>
                    <select class="form-select" aria-label="Select a department">
                      <option value=""> Club </option>
                      <option value=""> National </option>
                      <option value=""> International </option>
                    </select> 
                  </div>

                  <!-- <div class="form-group col">
                    <label for="name" class="form-label">Discipline</label>
                    <select class="form-select" aria-label="Select a department">
                      <option value=""> MOTO – Motocross </option>
                      <option value=""> MOTO – Supercross  </option>
                      <option value=""> MOTO – Endurocross  </option>
                      <option value=""> MOTO – Arenacross  </option>
                      <option value=""> MOTO – Circuit racing </option>
                      <option value=""> MOTO – Rally </option>
                      <option value=""> MOTO – Baja/Cross Country </option>
                      <option value=""> MOTO – Drag </option>
                      <option value=""> MOTO – Trial  </option>
                      <option value=""> MOTO – E-bike </option>
                    </select> 
                  </div> -->  

                  <div class="form-group col">
                      <label class="form-label" for="start-date">Start Date </label>
                      <input type="date" class="form-control" id="start-date" placeholder="Start-Date" required>
                  </div>

                  <div class="form-group col">
                      <label class="form-label" for="end-date">End Date </label>
                      <input type="date" class="form-control" id="end-date" placeholder="End-Date" required>
                  </div>

                  <div class="form-group col">
                    <label for="name" class="form-label">Dates</label>
                    <select class="form-select" aria-label="Select a department">
                       <option value=""> Upcoming </option>
                       <option value=""> This Month </option>
                       <option value=""> Next 3 Months </option>
                       <option value=""> Next 12 Months </option>
                       <option value=""> Next Year </option>
                       <option value=""> Past </option>
                    </select> 
                  </div>           
                  

                  <!-- <div class="form-group col">
                    <label for="name" class="form-label">Circuit Issues</label>
                    <select class="form-select" aria-label="Select a department">
                      <option selected>All </option>
                      <option value="1">Option 1</option>
                      <option value="2">Option 2</option>
                      <option value="3">Option 3</option>
                    </select> 
                  </div> -->

                </div>
              </form>

              <!-- =======event Table Start ===== -->
              <div class="event-table-wrapper">
                <div class="table-responsive">
                  <table class="table table-bordered align-middle event-table">
                    <thead class="table-dark">
                      <tr>
                        <th>Event Name</th>
                         <th>Competition category</th>
                        <th>Competition status</th>
                       
                        <th>Venue</th>                        
                        <!-- <th>--</th>  -->
                        <th>Start Date - End Date</th> 
                        <th>Action</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr>
                       <td>ABC Company</td>
                        <td>Moto</td>
                        <td>Club </td>
                       
                        <!-- <td>--</td> -->
                        <td>Al Ain Raceway</td>
                        <td class="date"> <div class="wrap"><img src="images/icon-calendar.svg" alt=""> 10/04/2026 - 10/05/2026 </div></td>
                        
                        
                        <td>
                          <a href="apply-event-permit.php" class="btn btn-sm btn-primary">Apply</a>
                        </td>
                      </tr>

                      <tr>
                        <td>ABC Group</td>                        
                        <td>Auto</td>
                        <td>National </td>
                        <!-- <td>--</td> -->
                        <td>Al Ain Raceway</td>
                        <td class="date"> <div class="wrap"><img src="images/icon-calendar.svg" alt=""> 10/04/2026 - 10/05/2026 </div></td>
                        
                        
                        <td>
                          <a href="apply-event-permit.php" class="btn btn-sm btn-primary">Apply</a>
                        </td>
                      </tr>

                      <tr>
                        <td>ABC Company</td>
                        <td>Moto </td>
                        <td>Karting</td>
                        <!-- <td>--</td> -->
                        <td>Al Forsan Kart Circuit</td>
                        <td class="date"> <div class="wrap"><img src="images/icon-calendar.svg" alt=""> 10/04/2026 - 10/05/2026 </div></td>
                        
                        
                        <td>
                          <a href="apply-event-permit.php" class="btn btn-sm btn-primary">Apply</a>
                        </td>
                      </tr>

                      <tr>
                        <td>ABC Technologies</td>                        
                        <td>E-sports</td>
                        <td>Club</td>
                        <!-- <td>--</td> -->
                        <td>Yas Marina Circuit</td>
                        <td class="date"> <div class="wrap"><img src="images/icon-calendar.svg" alt=""> 10/04/2026 - 10/05/2026 </div></td>
                        
                        
                        <td>
                          <a href="apply-event-permit.php" class="btn btn-sm btn-primary">Apply</a>
                        </td>
                      </tr>

                      <tr>
                        <td>ABC Co-orporates</td>                        
                        <td>Moto</td>
                        <td>National</td>
                        <!-- <td>--</td> -->
                        <td>Jebel Ali Motocross Track</td>
                        <td class="date"> <div class="wrap"><img src="images/icon-calendar.svg" alt=""> 10/04/2026 - 10/05/2026 </div></td>
                        
                        
                        <td>
                          <a href="apply-event-permit.php" class="btn btn-sm btn-primary">Apply</a>
                        </td>
                      </tr>

                      <!-- Add more rows as needed -->
                    </tbody>
                  </table>
                </div>
              </div>
              <!-- =======event Table End ===== -->

              <a href="calendar-inscription.php" class="btn theme-btn green"><img src="images/icon-check.svg" alt=""><span class="text">New Event? Apply for Calendar Inscription</span></a>

              <!-- <a  class="btn theme-btn green " data-bs-toggle="modal" data-bs-target=".Calendar-Approval-Modal" >
                <img src="images/icon-check.svg" alt=""><span class="text">Apply for Calendar Approval</span>
              </a> -->


            </div>              
            <!-------- event-table-data-wrapper End --->
          
          </div>
          <!-------- End body-content-area-wrap --->
          
        </div>
        <!-------------- End Main-Wrapper-Body-container ---------------->
      </div>

    </div> 
  </section>
  <!-- ........... Page-Event-Permit End .................. -->

  <!-- Calendar-Approval Popup start ------>
  <div  class="modal fade Calendar-Approval-Modal common-modal" role="dialog">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close close-btn" data-bs-dismiss="modal">&times;</button>
          <h4 class="modal-title center">Calendar Approval Request</h4>          
        </div>
        <div class="modal-body">

          <div class="form-sec calendar-approval-form active">
            <form action="" method="POST" class="custom-form input-bg-white">   
              <div class="common-form-wrapper"> 

                <div class="form-group row-half">
                    <label for="name" class="form-label">Start Date</label>
                    <input type="text" class="form-control" id="name" name="name" placeholder="Start from" required>
                    <span class="right-icon"><img src="images/icon-calendar.svg" alt=""></span>
                </div>

                <div class="form-group row-half">
                    <label for="name" class="form-label">End Date</label>
                    <input type="text" class="form-control" id="name" name="name" placeholder="End Date" required>
                    <span class="right-icon"><img src="images/icon-calendar.svg" alt=""></span>
                </div>


                <div class="form-group row-half">
                    <label for="name" class="form-label">Event status and category</label>
                    <select class="form-select" aria-label="Event-status-and-category">                          
                      <option value=""> Moto club </option>
                      <option value=""> Moto national </option>
                      <option value=""> Moto international </option>
                      <option value=""> Auto club </option>
                      <option value=""> Auto national </option>
                      <option value=""> Auto international </option>
                      <option value=""> Karting club </option>
                      <option value=""> Karting national </option>
                      <option value=""> Karting international </option>
                      <option value=""> E-sports club </option>
                      <option value=""> E-sports national </option>
                      <option value=""> E-sports international </option>

                    </select>                      
                </div>                

                <div class="form-group row-half">
                    <label for="name" class="form-label">Discipline</label>
                    <select class="form-select" aria-label="Discipline">
                      <option value=""> MOTO – Motocross </option>
                      <option value=""> MOTO – Supercross  </option>
                      <option value=""> MOTO – Endurocross  </option>
                      <option value=""> MOTO – Arenacross  </option>
                      <option value=""> MOTO – Circuit racing </option>
                      <option value=""> MOTO – Rally </option>
                      <option value=""> MOTO – Baja/Cross Country </option>
                      <option value=""> MOTO – Drag </option>
                      <option value=""> MOTO – Trial  </option>
                      <option value=""> MOTO – E-bike </option>

                    </select>                      
                </div>

                <div class="form-group row-half">
                    <label for="name" class="form-label">Event location</label>
                    <select class="form-select" aria-label="Event-location">                          
                      <option value=""> Al Ain Raceway </option>
                      <option value=""> Al Forsan Kart Circuit </option>
                      <option value=""> Dubai Autodrome </option>
                      <option value=""> Dubai Kartdrome </option>
                      <option value=""> Jebel Ali Karting Circuit </option>
                      <option value=""> Jebel Ali Motocross Track </option>
                      <option value=""> MX Ride Dubai Endurocross Track </option>
                      <option value=""> MX Ride Dubai Junior Supercross Track </option>
                      <option value=""> RAK Track </option>
                      <option value=""> Sahara Karting Circuit </option>
                      <option value=""> Yas Marina Circuit </option>
                      <option value=""> Yas Marina Kartdrome </option>
                      <option value=""> OTHER  </option>
                    </select>                      
                </div>          

                <div class="input-btn-wrapper row-full">
                  <div class="custom-input-group modal-btn-wrapper">
                    <a class="btn theme-btn green" href="apply-event-permit.php">
                      <img src="images/icon-check.svg" alt=""><span class="text">Submit</span>
                    </a>
                  </div>
                </div>                

              </div>  
            </form>
          </div>


                                   
        </div>
        
      </div>
    </div>
  </div>      
  <!-- Calendar-Approval Popup end   ------->

 


  <?php include 'includes/footer.php'; ?>
       
