<html dir="rtl" lang="ar">
    
<head>
  <meta charset="utf-8">
  <title>نموذج طلب تحريك مركبة</title>
  <link rel="stylesheet" type="text/css" href="style_3.css">
  <script src="JavaScript_2.js"></script>
  
</head>

<body>
  <?php
  $pop=$_GET['pop'];

if($pop == 1){?>
  <script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> 

            <script>
                  swal({
                        title: "شكرا لك على وقتك",
                    // text: "يمكنك مشاهدة طلبك في قائمة طلباتي",
                    text: "رأيك يهمنا، و نتمنى لك يوما سعيدا",
                    icon: "success",
                    button: null,
                    timer: 4000
                           
                         });
                     
            </script>
    <meta http-equiv="refresh" content="3;URL='form.php?pop='">
    <?php 
    }elseif($pop == 2){
        ?>
	<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script> 

    <script>
                  swal({
                    title: "خطأ في ارسال الاستبيان",
                    // text: "يمكنك مشاهدة طلبك في قائمة طلباتي",
                    text: "لم نتمكن من ارسال الاستبيان ، نرجوا المحاولة مرة أخرى",
                    icon: "error",
                    button: null,
                    timer: 4000
                           
                         });
                     
                     </script>
        </body>
     <meta http-equiv="refresh" content="3;URL='form.php?pop='">
        <?php
    }
    ?>
  <div class="login-root">
    <div class="box-root flex-flex flex-direction--column" style="min-height: 100vh;flex-grow: 1;">
      <div class="loginbackground box-background--white padding-top--64">
        <div class="loginbackground-gridContainer">
          <div class="box-root flex-flex" style="grid-area: top / start / 8 / end;">
            <div class="box-root" style="background-image: linear-gradient(white 0%, rgb(247, 250, 252) 33%); flex-grow: 1;">
            </div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 4 / 2 / auto / 5;">
            <div class="box-root box-divider--light-all-2 animationLeftRight tans3s" style="flex-grow: 1;"></div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 6 / start / auto / 2;">
            <div class="box-root box-background--blue800" style="flex-grow: 1;"></div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 7 / start / auto / 4;">
            <div class="box-root box-background--blue animationLeftRight" style="flex-grow: 1;"></div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 8 / 4 / auto / 6;">
            <div class="box-root box-background--gray100 animationLeftRight tans3s" style="flex-grow: 1;"></div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 2 / 15 / auto / end;">
            <div class="box-root box-background--cyan200 animationRightLeft tans4s" style="flex-grow: 1;"></div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 3 / 14 / auto / end;">
            <div class="box-root box-background--blue animationRightLeft" style="flex-grow: 1;"></div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 4 / 17 / auto / 20;">
            <div class="box-root box-background--gray100 animationRightLeft tans4s" style="flex-grow: 1;"></div>
          </div>
          <div class="box-root flex-flex" style="grid-area: 5 / 14 / auto / 17;">
            <div class="box-root box-divider--light-all-2 animationRightLeft tans3s" style="flex-grow: 1;"></div>
          </div>
        </div>
      </div>
      <div class="box-root padding-top--24 flex-flex flex-direction--column" style="flex-grow: 1; z-index: 9;">
        <div class="box-root padding-top--48 padding-bottom--24 flex-flex flex-justifyContent--center">
          <h1><a href="" rel="dofollow">استبيان رغبة العميل في التأجير التشغيلي
</a></h1>
        </div>
        <div class="formbg-outer">
          <div class="formbg">
            <div class="formbg-inner padding-horizontal--48" style="margin-bottom:100px;">
              <span class="padding-bottom--15"><pre><h3>المميزات:</h3><p style="font-size:16px;">- عقد طويل الأمد حسب رغبة العميل يصل إلى 60 شهر</p><p style="font-size:16px;">- ضمان السيارة مدة العقد</p><p style="font-size:16px;">- التأمين الشامل على السيارة مدة العقد</p><p style="font-size:16px;">- الصيانة الدورية على السيارة مدة العقد حسب جدول الصيانة
</p><p style="font-size:16px;">- استبدال الكفرات حسب الشروط</p><p style="font-size:16px;">- المساعدة على الطريق </p></pre></span><br>
              <form id="stripe-login" action="procssing.php" method="post">
              <!-- <div class="field padding-bottom--24">
                  <div class="grid--50-50">
                    <label>رقم الهيكل</label>   
                  </div>
                  <input type="text" name="vin" required>
                </div> -->
                <div class="field padding-bottom--24" style="padding: 0px;">
                <label style="padding: 0px;">هل لك رغبة في اخذ سيارة حسب طلبك بنظام التأجير التشغيلي طويل الأمد؟</label>   

                <div style="display: flex; gap: 1px;">

                                            <div style="width:auto%;">
                  <li style="color:#fff;" >
    <input id="r1" type="radio" name="radio" value="نعم لدي رغبة" checked style="width: 70%;box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(00, 00, 00, 0.0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px;">
  </li>
</div>
<div style="width:auto;" >
               
                  
                <label for="r1" style="margin-top:33px">نعم لدي رغبة</label>


</div>
<div style="width:30%;" >
               
                  
                <!-- <label for="r1" style="margin-top:33px">نعم لدي رغبة</label> -->


</div>
<div style="width:auto%;">

  <li style="color:#fff;">
    <input id="r2" type="radio" name="radio" value="لا ليس لدي رغبة"  style="width: 70%;box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(00, 00, 00, 0.0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px;">

  </li>      
  </div>
  <div style="width:auto;">
<label for="r2" style="margin-top:33px">لا ليس لدي رغبة</label>
</div>
</div>
          </div>
          <div class="field padding-bottom--24" id="month" style="padding:0px;">
                  <!-- <label for="email">المهنة</label> -->
                  <select name="month1" class="select" id="month1" required>
    <option value="">اختر المدة المناسبة</option>
    <option value="12">12 شهر </option>
    <option value="24">24 شهر</option>
    <option value="36">36 شهر</option>
    <option value="48">48 شهر</option>
    <option value="60">60 شهر</option>
   


    <!-- يمكنك إضافة المزيد من الخيارات هنا -->
                    </select>                
                </div>
          <div style="display: flex; gap: 1px;padding:0px;">
                <div style="width:55%;">
                <div class="field padding-bottom--24" style="padding:0px;margin-top:27px;">
             

                <select name="month1" class="select" id="month1" required>
    <option value="">الفئة العمرية</option>
    <option value="18-24">18-24</option>
    <option value="25-34">25-34</option>
    <option value="35-44">35-44</option>
    <option value="45-54">45-54</option>
    <option value="55-64">55-64</option>
    <option value=">65">أكبر من 65</option>



    <!-- يمكنك إضافة المزيد من الخيارات هنا -->
                    </select>                      </div>

                </div>

                <div style="display: flex; gap: 1px;padding:0px;">
                <div style="width:45%;margin-top:7px;">

                <div class="field padding-bottom--24" style="padding:0px;">
                <div style="display: flex; gap: 1px;padding:0px;">
                <div style="width:auto;">
                <label style="margin-top:33px;padding: 0px 10px 0px 0px;">الجنس: </label>
  </div>
                                            <div style="width:auto;">
                  <li style="color:#fff;padding: 0px 20px 0px 0px;" >

    <input id="G1" type="radio" name="radioG" value="ذكر" checked style="width: 170%;box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(00, 00, 00, 0.0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px;">
  </li>
</div>
<div style="width:auto;" >
               
                  
                <label for="G1" style="margin-top:33px;padding: 0px 10px 0px 0px;">ذكر</label>


</div>

<div style="width:auto%;">

  <li style="color:#fff;padding: 0px 20px 0px 0px;">
    <input id="G2" type="radio" name="radioG" value="أنثى"  style="width: 170%;box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(00, 00, 00, 0.0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px;">

  </li>      
  </div>
  <div style="width:auto;">
<label for="G2" style="margin-top:33px;padding: 0px 10px 0px 0px;">أنثى</label>
</div>
</div>

          </div>          </div>
          </div>
          </div>
<br>
<div style="display: flex; gap: 5px;padding:0px;">
                <div style="width:55%;">
                <div class="field padding-bottom--24">
                  <!-- <label for="email">المهنة</label> -->
                  <select name="Career" id="Career" class="select" required>
    <option value="">إختر نوع المهنة</option>
    <option value="قطاع حكومي">قطاع حكومي</option>
    <option value="قطاع خاص">قطاع خاص</option>
    <option value="قطاع عسكري">قطاع عسكري</option>
    <option value="متقاعد">متقاعد</option>
    <option value="طالب">طالب</option>
    <option value="غير موظف">غير موظف</option>
    <option value="أخرى">أخرى</option>



    <!-- يمكنك إضافة المزيد من الخيارات هنا -->
                    </select>                
                </div>

                <div class="field padding-bottom--24" id="othercareer" style="display:none;">
                  <div class="grid--50-50">
                    <!-- <label>رقم الهيكل</label>    -->
                  </div>
                  <input type="text" name="inputothercareer" id="inputothercareer" placeholder="أدخل إسم المهنة">
                </div>
                </div>

                <div style="width:45%;">

                <div class="field padding-bottom--24">
                  <!-- <label for="email">الجنسية</label> -->
                  <select name="Nationality" id="Nationality" class="select" required>
    <option value="">إختر الجنسية </option>
    <option value="سعودي">سعودي</option>
    <option value="غير سعودي">غير سعودي</option>
   


    <!-- يمكنك إضافة المزيد من الخيارات هنا -->
                    </select>                
                </div>

                

                <div class="field padding-bottom--24" id="otherNationality" style="display:none;">
                  <div class="grid--50-50">
                    <!-- <label>رقم الهيكل</label>    -->
                  </div>
                  <input type="text" name="inputotherotherNationality" id="inputotherotherNationality" placeholder="أدخل الجنسية">
                </div>
                </div>
                </div>
                <div class="field padding-bottom--24"  style="">
                  <!-- <label for="email">المهنة</label> -->
                  <select name="carmodel" class="select" id="month1" required>
    <option value="">نوع المركبة المرغوبة</option>
    <option value="BALENO/15">BALENO</option>
    <option value="FRONX">FRONX</option>
    <option value="DZIRE">DZIRE</option>
    <option value="VITARA">VITARA</option>
    <option value="JIMNY">JIMNY</option>
    <option value="GRVITARA">GRVITARA</option>
    <option value="CIAZ">CIAZ</option>
    <option value="CARRY">CARRY</option>
    <option value="EECO">EECO</option>
    <option value="ERTIGA">ERTIGA</option>
    <option value="SWIFT">SWIFT</option>
   


    <!-- يمكنك إضافة المزيد من الخيارات هنا -->
                    </select>                
                </div>
                <div class="field padding-bottom--24">
                  <input type="submit" name="submit" value="إرسال الطلب">
                </div>
                
                                  <script>
  // تعطيل إرسال النموذج بعد النقر على الزر
  document.getElementById("stripe-login").addEventListener("submit", function(event) {
    // تحقق مما إذا كان النموذج قد تم إرساله بالفعل
    if (this.getAttribute("data-submitted") === "true") {
      // إذا تم إرسال النموذج، قم بإلغاء إرساله مرة أخرى
      event.preventDefault();
      return;
    }
    
    // قم بتعيين السمة "data-submitted" إلى "true" بعد إرسال النموذج
    this.setAttribute("data-submitted", "true");
    
    // يمكنك هنا إضافة أي رمز إضافي لمعالجة النموذج (مثل إرساله إلى الخادم)
    // ...
  });
</script>
                
              </form>
            </div>
          </div>
         
        </div>
      </div>
    </div>
  </div>
</body>

</html>