<?php
session_start();
error_reporting(0);
include("header.php");
//include("../config/theconfig.php");

if(!(isset($_SESSION['customerid'])))
    header('Location:login.php?error=nologin');

// Fetch system settings safely (Optional but good practice)
$sbank = $sbank ?? 'Default Bank'; 
$favicon = $favicon ?? ''; 

?>

<html lang="en">
   <head>
      <meta charset="utf-8" />
      <title>Insurance | <?php echo htmlspecialchars($sbank); ?></title>
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta content="<?php echo htmlspecialchars($sbank); ?>" name="description" />
      <meta content="<?php echo htmlspecialchars($sbank); ?>" name="author" />
      
      <?php if (!empty($favicon)): ?>
      <link rel="icon" href="../<?= htmlspecialchars($favicon); ?>" type="image/<?= pathinfo($favicon, PATHINFO_EXTENSION); ?>">
      <?php endif; ?>
      
      <link href="assets/css/bootstrap.min.css" id="bootstrap-style" rel="stylesheet" type="text/css" />
      <link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" />
      <link href="assets/css/app.min.css" id="app-style" rel="stylesheet" type="text/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=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap" rel="stylesheet">
      
      <script src="assets/libs2/custom/sweetalert.min.js"></script>
      
      <style>
    /* --- PREMIUM BLUE THEME --- */
    :root {
        --primary-purple: #003399; /* Updated to Primary Blue */
        --dark-purple: #005D9D;    /* Updated to Secondary Blue */
        --soft-purple-bg: #e6efff; /* Updated to Light Blue BG */
        --bg-body: #f8fafc;
        --text-main: #0f172a;
        --text-secondary: #64748b;
    }

    body {
        font-family: 'Plus Jakarta Sans', sans-serif;
        background-color: var(--bg-body);
        color: var(--text-main);
    }

    .page-content { padding-top: 80px; }
    .swal-text { font-size: 13px; }

    .card {
        border: none;
        border-radius: 24px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
        background: #fff;
        overflow: hidden;
    }

    .card-body { padding: 40px; }
    
    .card-title {
        font-size: 1.25rem;
        font-weight: 700;
        color: var(--text-main);
        margin-bottom: 5px;
    }
    
    .card-title-desc {
        color: var(--text-secondary);
        font-size: 0.95rem;
        margin-bottom: 30px;
    }

    .form-group label {
        font-weight: 600;
        font-size: 0.85rem;
        color: var(--text-secondary);
        margin-bottom: 8px;
        display: block;
    }
    
    .form-control, .form-select {
        border-radius: 12px;
        padding: 12px 16px;
        border: 1px solid #e2e8f0;
        height: 50px;
        font-size: 0.95rem;
        color: var(--text-main);
    }
    
    .form-control:focus, .form-select:focus {
        border-color: var(--primary-purple);
        box-shadow: 0 0 0 4px var(--soft-purple-bg);
    }
    
    .row > div { margin-bottom: 20px; } 

    .btn-primary {
        background-color: var(--primary-purple);
        border: none;
        border-radius: 12px;
        padding: 14px 30px;
        font-weight: 700;
        width: 100%;
        transition: all 0.3s ease;
        font-size: 1rem;
        /* Updated shadow to match blue theme */
        box-shadow: 0 4px 12px rgba(0, 51, 153, 0.3);
        margin-top: 10px;
    }

    .btn-primary:hover {
        background-color: var(--dark-purple);
        transform: translateY(-2px);
        box-shadow: 0 6px 15px rgba(0, 51, 153, 0.4);
    }
    
    .section-header-icon {
        width: 60px;
        height: 60px;
        background: var(--soft-purple-bg);
        color: var(--primary-purple);
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 28px;
        margin-bottom: 20px;
    }
    
    /* Breadcrumb color override */
    .text-purple { color: var(--primary-purple) !important; }

    .alert-success {
        background-color: #dcfce7;
        border-color: #bbf7d0;
        color: #166534;
        border-radius: 12px;
        font-weight: 600;
        padding: 15px;
    }
</style>
   </head>

   <body data-sidebar="colored">
      <div id="preloader"> <div id="status"> <div class="spinner-chase"> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> <div class="chase-dot"></div> </div> </div> </div>

      <div id="layout-wrapper">
         <div class="main-content">
            <div class="page-content">
               <div class="container-fluid">
                  
                  <div class="row mb-4">
                      <div class="col-12">
                          <div class="d-flex align-items-center justify-content-between">
                              <div>
                                  <h4 class="mb-1 fw-bold text-dark">Insurance Services</h4>
                                  <p class="text-secondary mb-0">Protect yourself and your assets.</p>
                              </div>
                              <div class="d-none d-md-block">
                                  <nav aria-label="breadcrumb">
                                      <ol class="breadcrumb m-0">
                                          <li class="breadcrumb-item"><a href="dashboard.php" class="text-decoration-none text-muted">Dashboard</a></li>
                                          <li class="breadcrumb-item active text-purple fw-bold">Insurance</li>
                                      </ol>
                                  </nav>
                              </div>
                          </div>
                      </div>
                  </div>

                  <div class="row justify-content-center">
                     <div class="col-xl-8 col-lg-10">
                        <div class="card">
                           <div class="card-body">
                              
                              <div class="text-center mb-4">
                                  <div class="section-header-icon mx-auto">
                                      <i class="bx bx-shield-quarter"></i>
                                  </div>
                                  <h5 class="card-title">Insurance Application</h5>
                                  <p class="card-title-desc">Fill out the form below to apply for coverage.</p>
                              </div>
                              
                              <?php
                              $successMessage = ''; 
                              if ($_SERVER["REQUEST_METHOD"] == "POST" && isset($_POST['submit'])) {
                                  $successMessage = '<div class="alert alert-success d-flex align-items-center mb-4" role="alert">
                                                        <i class="bx bx-check-circle fs-4 me-2"></i>
                                                        <div>Thank you for your application! We will review it shortly.</div>
                                                     </div>';
                              }
                              echo $successMessage; 
                              ?>
                              
                              <form method="post">
                                 <div class="row">
                                    <div class="col-md-6">
                                       <div class="form-group">
                                          <label for="firstName">First Name</label>
                                          <input type="text" class="form-control" id="firstName" placeholder="e.g. John" required>
                                       </div>
                                    </div>
                                    <div class="col-md-6">
                                       <div class="form-group">
                                          <label for="lastName">Last Name</label>
                                          <input type="text" class="form-control" id="lastName" placeholder="e.g. Doe" required>
                                       </div>
                                    </div>
                                 </div>

                                 <div class="form-group mb-3">
                                    <label for="email">Email Address</label>
                                    <input type="email" class="form-control" id="email" placeholder="name@example.com" required>
                                 </div>

                                 <div class="row">
                                    <div class="col-md-4">
                                       <div class="form-group">
                                          <label for="age">Age</label>
                                          <input type="number" class="form-control" id="age" placeholder="25" required>
                                       </div>
                                    </div>
                                    <div class="col-md-4">
                                       <div class="form-group">
                                          <label for="gender">Gender</label>
                                          <select class="form-select" id="gender">
                                             <option selected>Select...</option>
                                             <option>Male</option>
                                             <option>Female</option>
                                             <option>Other</option>
                                          </select>
                                       </div>
                                    </div>
                                    <div class="col-md-4">
                                       <div class="form-group">
                                          <label for="insuranceType">Insurance Type</label>
                                          <select class="form-select" id="insuranceType">
                                             <option selected>Select Plan...</option>
                                             <option>Health Insurance</option>
                                             <option>Life Insurance</option>
                                             <option>Auto Insurance</option>
                                             <option>Home Insurance</option>
                                          </select>
                                       </div>
                                    </div>
                                 </div>

                                 <div class="form-group mb-3">
                                    <label for="address">Street Address</label>
                                    <input type="text" class="form-control" id="address" placeholder="123 Main St" required>
                                 </div>

                                 <div class="row">
                                    <div class="col-md-6">
                                       <div class="form-group">
                                          <label for="city">City</label>
                                          <input type="text" class="form-control" id="city" placeholder="City" required>
                                       </div>
                                    </div>
                                    <div class="col-md-6">
                                       <div class="form-group">
                                          <label for="zipcode">Zip Code</label>
                                          <input type="text" class="form-control" id="zipcode" placeholder="Zip Code" required>
                                       </div>
                                    </div>
                                 </div>

                                 <div class="mt-4">
                                     <button type="submit" name="submit" class="btn btn-primary">Submit Application <i class="bx bx-send ms-1"></i></button>
                                 </div>
                              </form>
                           </div>
                        </div>
                     </div>
                  </div>

               </div>
            </div>
            <?php include 'footer.php' ?>
         </div>
      </div>
      
      <script src="assets/libs/jquery/jquery.min.js"></script>
      <script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script>
      <script src="assets/libs/simplebar/simplebar.min.js"></script>
      <script src="assets/libs/node-waves/waves.min.js"></script>
      <script src="assets/js/app.js"></script>
   </body>
</html>