<?php include "loader.php"; ?><?php
session_start();
include "include/config.php";
if(isset($_SESSION['email'])){
header("location:dashboard");

}             
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="theme-color" content="#3DB39D">
    <title> Sign Up</title>
    
    <link rel="stylesheet" href="css/all.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css">
    <link rel="stylesheet" href="css/fontawesome.min.css">
        <link rel="stylesheet" href="res/bootstrap@5.2.0.min.css">
        <link rel="stylesheet" href="res/chartist.min.css">
        <link rel="stylesheet" href="font-awesome@6.2.1/css/all.css">
        <link rel="stylesheet" href="font-awesome@6.2.1/css/fontawesome.min.css">
        <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
        <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
        <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
        <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lato&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Open+Sans&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Nunito&family=Nunito+Sans&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mukta&display=swap" rel="stylesheet">
   <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.4.24/sweetalert2.all.js"></script>
    <style>
    

.background-clip{

    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
}

@media (min-aspect-ratio:16/9) {
    .background-clip{
        width: 100%;
        height: auto;
    }
}

@media (max-aspect-ratio:16/9) {
    .background-clip{
        width: auto;
        height: 100%;
    }
}


   body{
      height: 100%; 
      width: 100%;
      padding: 0px;
      background:#3DB39D ;
      background-blend-mode: darken;
      background-size: cover;
      font-family: 'Roboto', sans-serif;
    }
      .form-control{
        
        border:1px solid #3DB39D;
        border-radius:7px;
        height: 40px;
        margin-top: 10px;
        color:#9CA2AE;
        margin-top:10px;
      }
      .form-control:hover{
         
         box-shadow:none;
         color:#3DB39D;
      }
      form{
        width: 380px;
        background: ;
        padding:10px;
        color:black;
        margin-top:-10px;
      }
      .card{
      box-shadow: 0px;
        border-radius:4px;
        border: white;
        width 370px;
    background: trans;
        padding: 10px;
        
        color:black;
      }
      .btn{
        background: #3DB39D;
        width: 100%;
        height: 52px;
        margin-top: 10px;
        color: ;
        font-weight: bold;
        height:40px;
      }
        .btn:hover{
        background: ;
      }
      .fp a{
        padding: 10px;
        margin-top: 10px;
        color: #3DB39D;
      }
      .fp{
        margin-top: 15px;
        margin-bottom: 10px;
      }
      .db{
        margin-top:500px;
      }
      .db p{
        margin-bottom: -3px;
        font-size: 12px;
        text-align: center;
      }
      .db span{
        font-weight: bold;
      }
      h1{
        background: whit;
        padding: 4px;
        border-radius:6px;
        width: 130px;
      }
      hr{
      color:white;
      }
      #btn{
      display:;
      }
      @media only screen and (max-width:500px){
        .db {
          margin-top:550px;
          
        } 
        .card{
        border-radius:4px;
        border: none;
        width 340px;
    background: ;
        padding: 10px;
        height:100vh;
        
      }
      form{
        width: 310px;
        background: ;
        padding:10px;
      }
      }
    </style>
</head>
<body>

   <br>
   
   
 </div>
 <div class="car_d">

   <div class="cardq">
    <?php
    if (isset($_GET['error'])) {?>
  <div class="alert text-danger" style="text-align:center">
  <p style="margin-top:-30px; magin-bottom:-50px;"> <i class="fa fa-warning text-danger"></i>  <?php echo $_GET['error'];?></p>
  </div>
  <?php
  }
  ?>
     <?php
    if (isset($_GET['regi'])) {?>
  <div class="alert text-success" style="text-align:center">
  <p style="margin-top:-30px; magin-bottom:-50px;"> <?php echo $_GET['regi'];?></p>
  </div>
  <?php
  }
  ?>
     
   <div class="flex">
  <div class="card">
   <center>

     <img class="ic" src="logo1.png" alt="" width="100px" height=""> 
    
    

     
</center>
<br />
    <h3 style="text-align: center; color:#3DB39D;"> <i class="fa fa-lock"></i> UFEZ Membership</h3>
    <?php
    if (isset($_GET['success'])) {?>
  <div class="alert text-success" style="text-align:center">
  <p style="margin-top:-30px; magin-bottom:-50px;"> <?php echo $_GET['success'];?></p>
  </div>
  <?php
  }
  ?>
   
   <center > <form action="insert.php" method="post">
       <div class="row">
            <div class="col-12">
    <input type="text" name="organization" class="form-control" placeholder="Name of Organisation" required>
    </div>
    <div class="col-6">
          <input type="email" name="email" class="form-control" placeholder="Email" required>
    </div>
  <div class="col-6">
    <input type="number" name="phone" class="form-control" placeholder="Phone" required>
    </div>
    <div class="col-6">
    <input type="text" name="district" class="form-control" placeholder="District" required>
</div>

<div class="col-6">
    <select name="sector" class="form-control" required>
        <option value="">Select Sector</option>
        <option value="Agriculture">Agriculture</option>
        <option value="Mining">Mining</option>
        <option value="Manufacturing">Manufacturing</option>
        <option value="Energy">Energy</option>
        <option value="Construction">Construction</option>
        <option value="Transport & Logistics">Transport & Logistics</option>
        <option value="Telecommunications">Telecommunications</option>
        <option value="Financial Services">Financial Services</option>
        <option value="Tourism & Hospitality">Tourism & Hospitality</option>
        <option value="Education">Education</option>
        <option value="Healthcare & Pharmaceuticals">Healthcare & Pharmaceuticals</option>
        <option value="Real Estate & Housing">Real Estate & Housing</option>
        <option value="Retail & Trade">Retail & Trade</option>
        <option value="Fisheries & Aquaculture">Fisheries & Aquaculture</option>
        <option value="Public Administration">Public Administration</option>
        <option value="Media & Entertainment">Media & Entertainment</option>
        <option value="Legal Services">Legal Services</option>
        <option value="Information & Communication Technology">Information & Communication Technology (ICT)</option>
        <option value="Water & Sanitation">Water & Sanitation</option>
        <option value="Textile & Garment">Textile & Garment</option>
        <option value="Automotive Industry">Automotive Industry</option>
        <option value="Security & Defense">Security & Defense</option>
        <option value="Insurance">Insurance</option>
        <option value="Non-Governmental Organizations (NGOs)">Non-Governmental Organizations (NGOs)</option>
    </select>
    </div>
<div class="col-6">
    <select name="workers" class="form-control" required>
        <option value="">No. of Workers Employed</option>
        <option value="1-5">1 to 5 Workers</option>
        <option value="6-10">6 to 10 Workers</option>
        <option value="11-15">11 to 15 Workers</option>
        <option value="16-20">16 to 20 Workers</option>
        <option value="21+">21 Workers and above</option>
    </select>
    </div>
<div class="col-6">
    <select name="membership_fee" class="form-control" required>
        <option value="">Membership Fee (Paid once only)</option>
        <option value="250">1 to 5 Employees K250.00</option>
        <option value="500">6 to 10 Employees K500.00</option>
        <option value="750">11 to 15 Employees K750.00</option>
        <option value="1000">16 to 20 Employees K1000.00</option>
        <option value="1500">21 Employees and above K1500.00</option>
    </select>
    </div>
<div class="col-6">
    <select name="subscription_fee" class="form-control" required>
        <option value="">Annual Subscription Fee</option>
        <option value="2500">1 to 5 Employees K2,500.00</option>
        <option value="5000">6 to 10 Employees K5,000.00</option>
        <option value="7500">11 to 15 Employees K7,500.00</option>
        <option value="10000">16 to 20 Employees K10,000.00</option>
        <option value="15000">21 Employees and above K15,000.00</option>
    </select>
    </div>
<div class="col-6">
    <input type="text" name="representative" class="form-control" placeholder="Representative" required>
    </div>
    <div class="col-12">
    <input type="text" name="pass" class="form-control" placeholder="Password " required>
</div>
   
</div>
    <input type="submit" class="btn" value="Submit">
</form>
        
        
  </div>

        
  
</div>
<script>
  function showpass() {
    var x = document.getElementById("pass");
    if (x.type === "password") {
      x.type = "text";
    } else {
      x.type = "password";
    }
  }
</script>
</body>
</html>
