<?php 
session_start();
?>
<!DOCTYPE html>
<html lang="en">
    
<?php 
    require_once('inc/head.php');
?>

    <style>
        /* Registration Page Specific Styles */
        .register-hero {
            background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
            color: #fff;
            padding: 100px 0 60px;
            position: relative;
            overflow: unset;
        }
        .register-hero::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: url('assets/img/bg/slide2.jpg') center/cover no-repeat;
            opacity: 0.2;
            z-index: 1;
        }
        .register-hero .container {
            position: relative;
            z-index: 2;
        }
        .register-hero h1 {
            font-size: 3rem;
            font-weight: 700;
            margin-bottom: 15px;
            color: #fff;
        }
        .register-hero p {
            font-size: 1.1rem;
            max-width: 700px;
            margin: 0 auto;
            opacity: 0.9;
        }
        .breadcrumb {
            background: transparent;
            justify-content: center;
            margin-bottom: 30px;
        }
        .breadcrumb-item a {
            color: #f7921a;
            text-decoration: none;
        }
        .breadcrumb-item.active {
            color: #fff;
        }
        .breadcrumb-item+.breadcrumb-item::before {
            color: #fff;
        }

        /* Registration Form Section */
        .register-content {
            padding: 80px 0;
            background: #f9f9f9;
        }
        .register-container {
            background: #fff;
            border-radius: 12px;
            padding: 50px;
            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
        }
        .register-content h1 {
            font-size: 2.5rem;
            font-weight: 700;
            color: #333;
            margin-bottom: 20px;
            border-bottom: 2px solid #f7921a;
            padding-bottom: 15px;
        }
        .register-content h2 {
            font-size: 1.8rem;
            font-weight: 600;
            color: #333;
            margin: 40px 0 20px;
            padding-bottom: 10px;
            border-bottom: 1px solid #eee;
        }
        .register-content h3 {
            font-size: 1.4rem;
            font-weight: 600;
            color: #333;
            margin: 30px 0 15px;
        }
        .register-content p {
            color: #555;
            line-height: 1.7;
            margin-bottom: 20px;
        }
        .register-content ul, .register-content ol {
            margin-bottom: 25px;
            padding-left: 20px;
        }
        .register-content li {
            color: #555;
            line-height: 1.7;
            margin-bottom: 10px;
        }
        .register-content strong {
            color: #333;
            font-weight: 600;
        }
        .register-content a {
            color: #f7921a;
            text-decoration: none;
            transition: color 0.3s ease;
        }
        .register-content a:hover {
            color: #e07b00;
            text-decoration: underline;
        }
        
        /* Form Styling */
        .single-field {
            margin-bottom: 25px;
        }
        .box-label {
            font-weight: 600;
            color: #333;
            margin-bottom: 8px;
            display: block;
        }
        .required-field {
            color: #e74c3c;
        }
        .box-input, .site-nice-select {
            border: 1px solid #ddd;
            border-radius: 8px;
            padding: 12px 15px;
            font-size: 1rem;
            transition: all 0.3s ease;
            width: 100%;
        }
        .box-input:focus, .site-nice-select:focus {
            border-color: #f7921a;
            box-shadow: 0 0 0 0.2rem rgba(247, 146, 26, 0.25);
            outline: none;
        }
        .joint-input .input-group-text {
            background-color: #f8f9fa;
            border: 1px solid #ddd;
            border-right: none;
            border-radius: 8px 0 0 8px;
        }
        .joint-input .form-control {
            border-left: none;
            border-radius: 0 8px 8px 0;
        }
        .check-input {
            margin-right: 10px;
        }
        .check-input:checked {
            background-color: #f7921a;
            border-color: #f7921a;
        }
        .check-input:focus {
            border-color: #f7921a;
            box-shadow: 0 0 0 0.2rem rgba(247, 146, 26, 0.25);
        }
        .form-check-label {
            color: #555;
        }
        .form-check-label a {
            color: #f7921a;
        }
        .site-btn {
            background-color: #f7921a;
            border-color: #f7921a;
            padding: 12px 30px;
            font-weight: 600;
            font-size: 1.1rem;
            border-radius: 8px;
            transition: all 0.3s ease;
            color: white;
            border: none;
            width: 100%;
        }
        .site-btn:hover, .site-btn:focus {
            background-color: #e07b00;
            border-color: #e07b00;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(247, 146, 26, 0.3);
            color: white;
        }
        .site-btn:active {
            background-color: #c96d00 !important;
            border-color: #c96d00 !important;
        }
        .login-link {
            text-align: center;
            margin-top: 25px;
            color: #555;
        }
        .login-link a {
            color: #f7921a;
            font-weight: 600;
        }
        
        /* Password Strength Indicator */
        .password-strength {
            height: 5px;
            margin-top: 8px;
            border-radius: 5px;
            background-color: #eee;
            overflow: hidden;
        }
        .password-strength-bar {
            height: 100%;
            width: 0;
            border-radius: 5px;
            transition: width 0.3s ease, background-color 0.3s ease;
        }
        .password-strength-text {
            font-size: 0.85rem;
            margin-top: 5px;
            color: #777;
        }
        
        /* Verification Steps */
        .verification-steps {
            display: flex;
            justify-content: space-between;
            margin-bottom: 30px;
            position: relative;
        }
        .verification-steps::before {
            content: '';
            position: absolute;
            top: 15px;
            left: 0;
            width: 100%;
            height: 2px;
            background-color: #eee;
            z-index: 1;
        }
        .step {
            display: flex;
            flex-direction: column;
            align-items: center;
            position: relative;
            z-index: 2;
        }
        .step-icon {
            width: 30px;
            height: 30px;
            border-radius: 50%;
            background-color: #eee;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-bottom: 8px;
            color: #777;
            font-size: 0.9rem;
        }
        .step.active .step-icon {
            background-color: #f7921a;
            color: #fff;
        }
        .step-text {
            font-size: 0.85rem;
            color: #777;
            text-align: center;
        }
        .step.active .step-text {
            color: #f7921a;
            font-weight: 600;
        }
        
        /* Back to Top Button */
        .back-to-top {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 50px;
            height: 50px;
            background: #f7921a;
            color: #fff;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
            cursor: pointer;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
            z-index: 1000;
            box-shadow: 0 4px 12px rgba(247, 146, 26, 0.3);
        }
        .back-to-top.visible {
            opacity: 1;
            visibility: visible;
        }
        .back-to-top:hover {
            background: #e07b00;
            transform: translateY(-3px);
        }

        /* Responsive Adjustments */
        @media (max-width: 768px) {
            .register-hero h1 {
                font-size: 2.2rem;
            }
            .register-container {
                padding: 30px 20px;
            }
            .register-content h1 {
                font-size: 2rem;
            }
            .register-content h2 {
                font-size: 1.5rem;
            }
            .register-content h3 {
                font-size: 1.2rem;
            }
            .back-to-top {
                bottom: 20px;
                right: 20px;
                width: 45px;
                height: 45px;
            }
            .verification-steps {
                flex-direction: column;
                align-items: flex-start;
            }
            .verification-steps::before {
                display: none;
            }
            .step {
                flex-direction: row;
                margin-bottom: 15px;
            }
            .step-icon {
                margin-right: 10px;
                margin-bottom: 0;
            }
        }

        @media (max-width: 576px) {
            .register-hero {
                padding: 80px 0 40px;
            }
            .register-content {
                padding: 60px 0;
            }
            .register-container {
                padding: 25px 15px;
            }
        }
    </style>

<body class="home-4">
    
      <?php 
    require_once('inc/preloader.php');
    ?>
  <?php 
    require_once('inc/ticker.php');
    ?>

  <?php 
    require_once('inc/header.php');
?>
    <!-- START REGISTER HERO SECTION -->
    <section class="register-hero">
        <div class="container">
            <div class="row">
                <div class="col-12 text-center">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="index.html">Home</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Register</li>
                        </ol>
                    </nav>
                    <h1 data-aos="fade-down" data-aos-duration="1000">Create Your Account</h1>
                    <p data-aos="fade-up" data-aos-duration="1000" data-aos-delay="200">
                        Join Speedbitplus today and start your cryptocurrency trading journey with confidence.
                    </p>
                </div>
            </div>
        </div>
    </section>
    <!-- END REGISTER HERO SECTION -->

    
 
  <?php if(!isset($_SESSION['user_registered'])){ ?>
    <!-- START REGISTER CONTENT SECTION -->
    <section class="register-content">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-xl-10 col-12">
                    <div class="register-container">
                        <h1 data-aos="fade-up" data-aos-duration="1000">Register</h1>
                        
                        <!-- Registration Steps -->
                        <div class="verification-steps" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="200">
                            <div class="step active">
                                <div class="step-icon">1</div>
                                <div class="step-text">Account Details</div>
                            </div>

                        </div>
                        
                        <!-- Registration Form -->
                        <form method="POST" action="php/reg.php" class="row" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="400">
                            <input type="hidden" name="_token" value="iO5qSlxVyNYylmxXuS43S1PXY9v4RvsvSkIsdp17">
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="name">First Name<span class="required-field">*</span></label>
                                    <input class="box-input" type="text" placeholder="Your First Name" name="first_name" value="" required />
                                </div>
                            </div>
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="name">Last Name<span class="required-field">*</span></label>
                                    <input class="box-input" type="text" placeholder="Your Last Name" name="last_name" value="" required />
                                </div>
                            </div>
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="email">Email Address<span class="required-field">*</span></label>
                                    <input class="box-input" type="email" name="email" value="" placeholder="Enter Your Email Address" required />
                                </div>
                            </div>
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="username">User Name<span class="required-field">*</span></label>
                                    <input class="box-input" type="text" placeholder="Enter Your User Name" name="username" value="" required />
                                </div>
                            </div>
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="username">Select Country<span class="required-field">*</span></label>
                                    <select name="country" id="countrySelect" class="site-nice-select">
                                        <option value="Afghanistan:+93">Afghanistan</option>
                                        <option value="Aland Islands:+358">Aland Islands</option>
                                        <option value="Albania:+355">Albania</option>
                                        <option value="Algeria:+213">Algeria</option>
                                        <option value="AmericanSamoa:+1684">AmericanSamoa</option>
                                        <option value="Andorra:+376">Andorra</option>
                                        <option value="Angola:+244">Angola</option>
                                        <option value="Anguilla:+1264">Anguilla</option>
                                        <option value="Antarctica:+672">Antarctica</option>
                                        <option value="Antigua and Barbuda:+1268">Antigua and Barbuda</option>
                                        <option value="Argentina:+54">Argentina</option>
                                        <option value="Armenia:+374">Armenia</option>
                                        <option value="Aruba:+297">Aruba</option>
                                        <option value="Australia:+61">Australia</option>
                                        <option value="Austria:+43">Austria</option>
                                        <option value="Azerbaijan:+994">Azerbaijan</option>
                                        <option value="Bahamas:+1242">Bahamas</option>
                                        <option value="Bahrain:+973">Bahrain</option>
                                        <option value="Bangladesh:+880">Bangladesh</option>
                                        <option value="Barbados:+1246">Barbados</option>
                                        <option value="Belarus:+375">Belarus</option>
                                        <option value="Belgium:+32">Belgium</option>
                                        <option value="Belize:+501">Belize</option>
                                        <option value="Benin:+229">Benin</option>
                                        <option value="Bermuda:+1441">Bermuda</option>
                                        <option value="Bhutan:+975">Bhutan</option>
                                        <option value="Bolivia, Plurinational State of:+591">Bolivia, Plurinational State of</option>
                                        <option value="Bosnia and Herzegovina:+387">Bosnia and Herzegovina</option>
                                        <option value="Botswana:+267">Botswana</option>
                                        <option value="Brazil:+55">Brazil</option>
                                        <option value="British Indian Ocean Territory:+246">British Indian Ocean Territory</option>
                                        <option value="Brunei Darussalam:+673">Brunei Darussalam</option>
                                        <option value="Bulgaria:+359">Bulgaria</option>
                                        <option value="Burkina Faso:+226">Burkina Faso</option>
                                        <option value="Burundi:+257">Burundi</option>
                                        <option value="Cambodia:+855">Cambodia</option>
                                        <option value="Cameroon:+237">Cameroon</option>
                                        <option value="Canada:+1">Canada</option>
                                        <option value="Cape Verde:+238">Cape Verde</option>
                                        <option value="Cayman Islands:+ 345">Cayman Islands</option>
                                        <option value="Central African Republic:+236">Central African Republic</option>
                                        <option value="Chad:+235">Chad</option>
                                        <option value="Chile:+56">Chile</option>
                                        <option value="China:+86">China</option>
                                        <option value="Christmas Island:+61">Christmas Island</option>
                                        <option value="Cocos (Keeling) Islands:+61">Cocos (Keeling) Islands</option>
                                        <option value="Colombia:+57">Colombia</option>
                                        <option value="Comoros:+269">Comoros</option>
                                        <option value="Congo:+242">Congo</option>
                                        <option value="The Democratic Republic of the Congo:+243">The Democratic Republic of the Congo</option>
                                        <option value="Cook Islands:+682">Cook Islands</option>
                                        <option value="Costa Rica:+506">Costa Rica</option>
                                        <option value="Cote d&#039;Ivoire:+225">Cote d&#039;Ivoire</option>
                                        <option value="Croatia:+385">Croatia</option>
                                        <option value="Cuba:+53">Cuba</option>
                                        <option value="Cyprus:+357">Cyprus</option>
                                        <option value="Czech Republic:+420">Czech Republic</option>
                                        <option value="Denmark:+45">Denmark</option>
                                        <option value="Djibouti:+253">Djibouti</option>
                                        <option value="Dominica:+1767">Dominica</option>
                                        <option value="Dominican Republic:+1849">Dominican Republic</option>
                                        <option value="Ecuador:+593">Ecuador</option>
                                        <option value="Egypt:+20">Egypt</option>
                                        <option value="El Salvador:+503">El Salvador</option>
                                        <option value="Equatorial Guinea:+240">Equatorial Guinea</option>
                                        <option value="Eritrea:+291">Eritrea</option>
                                        <option value="Estonia:+372">Estonia</option>
                                        <option value="Ethiopia:+251">Ethiopia</option>
                                        <option value="Falkland Islands (Malvinas):+500">Falkland Islands (Malvinas)</option>
                                        <option value="Faroe Islands:+298">Faroe Islands</option>
                                        <option value="Fiji:+679">Fiji</option>
                                        <option value="Finland:+358">Finland</option>
                                        <option value="France:+33">France</option>
                                        <option value="French Guiana:+594">French Guiana</option>
                                        <option value="French Polynesia:+689">French Polynesia</option>
                                        <option value="Gabon:+241">Gabon</option>
                                        <option value="Gambia:+220">Gambia</option>
                                        <option value="Georgia:+995">Georgia</option>
                                        <option value="Germany:+49">Germany</option>
                                        <option value="Ghana:+233">Ghana</option>
                                        <option value="Gibraltar:+350">Gibraltar</option>
                                        <option value="Greece:+30">Greece</option>
                                        <option value="Greenland:+299">Greenland</option>
                                        <option value="Grenada:+1473">Grenada</option>
                                        <option value="Guadeloupe:+590">Guadeloupe</option>
                                        <option value="Guam:+1671">Guam</option>
                                        <option value="Guatemala:+502">Guatemala</option>
                                        <option value="Guernsey:+44">Guernsey</option>
                                        <option value="Guinea:+224">Guinea</option>
                                        <option value="Guinea-Bissau:+245">Guinea-Bissau</option>
                                        <option value="Guyana:+595">Guyana</option>
                                        <option value="Haiti:+509">Haiti</option>
                                        <option value="Holy See (Vatican City State):+379">Holy See (Vatican City State)</option>
                                        <option value="Honduras:+504">Honduras</option>
                                        <option value="Hong Kong:+852">Hong Kong</option>
                                        <option value="Hungary:+36">Hungary</option>
                                        <option value="Iceland:+354">Iceland</option>
                                        <option value="India:+91">India</option>
                                        <option value="Indonesia:+62">Indonesia</option>
                                        <option value="Islamic Republic of Persian Gulf:+98">Islamic Republic of Persian Gulf</option>
                                        <option value="Iraq:+964">Iraq</option>
                                        <option value="Ireland:+353">Ireland</option>
                                        <option value="Isle of Man:+44">Isle of Man</option>
                                        <option value="Israel:+972">Israel</option>
                                        <option value="Italy:+39">Italy</option>
                                        <option value="Jamaica:+1876">Jamaica</option>
                                        <option value="Japan:+81">Japan</option>
                                        <option value="Jersey:+44">Jersey</option>
                                        <option value="Jordan:+962">Jordan</option>
                                        <option value="Kazakhstan:+77">Kazakhstan</option>
                                        <option value="Kenya:+254">Kenya</option>
                                        <option value="Kiribati:+686">Kiribati</option>
                                        <option value="Democratic People&#039;s Republic of Korea:+850">Democratic People&#039;s Republic of Korea</option>
                                        <option value="Republic of South Korea:+82">Republic of South Korea</option>
                                        <option value="Kuwait:+965">Kuwait</option>
                                        <option value="Kyrgyzstan:+996">Kyrgyzstan</option>
                                        <option value="Laos:+856">Laos</option>
                                        <option value="Latvia:+371">Latvia</option>
                                        <option value="Lebanon:+961">Lebanon</option>
                                        <option value="Lesotho:+266">Lesotho</option>
                                        <option value="Liberia:+231">Liberia</option>
                                        <option value="Libyan Arab Jamahiriya:+218">Libyan Arab Jamahiriya</option>
                                        <option value="Liechtenstein:+423">Liechtenstein</option>
                                        <option value="Lithuania:+370">Lithuania</option>
                                        <option value="Luxembourg:+352">Luxembourg</option>
                                        <option value="Macao:+853">Macao</option>
                                        <option value="Macedonia:+389">Macedonia</option>
                                        <option value="Madagascar:+261">Madagascar</option>
                                        <option value="Malawi:+265">Malawi</option>
                                        <option value="Malaysia:+60">Malaysia</option>
                                        <option value="Maldives:+960">Maldives</option>
                                        <option value="Mali:+223">Mali</option>
                                        <option value="Malta:+356">Malta</option>
                                        <option value="Marshall Islands:+692">Marshall Islands</option>
                                        <option value="Martinique:+596">Martinique</option>
                                        <option value="Mauritania:+222">Mauritania</option>
                                        <option value="Mauritius:+230">Mauritius</option>
                                        <option value="Mayotte:+262">Mayotte</option>
                                        <option value="Mexico:+52">Mexico</option>
                                        <option value="Federated States of Micronesia:+691">Federated States of Micronesia</option>
                                        <option value="Moldova:+373">Moldova</option>
                                        <option value="Monaco:+377">Monaco</option>
                                        <option value="Mongolia:+976">Mongolia</option>
                                        <option value="Montenegro:+382">Montenegro</option>
                                        <option value="Montserrat:+1664">Montserrat</option>
                                        <option value="Morocco:+212">Morocco</option>
                                        <option value="Mozambique:+258">Mozambique</option>
                                        <option value="Myanmar:+95">Myanmar</option>
                                        <option value="Namibia:+264">Namibia</option>
                                        <option value="Nauru:+674">Nauru</option>
                                        <option value="Nepal:+977">Nepal</option>
                                        <option value="Netherlands:+31">Netherlands</option>
                                        <option value="Netherlands Antilles:+599">Netherlands Antilles</option>
                                        <option value="New Caledonia:+687">New Caledonia</option>
                                        <option value="New Zealand:+64">New Zealand</option>
                                        <option value="Nicaragua:+505">Nicaragua</option>
                                        <option value="Niger:+227">Niger</option>
                                        <option value="Nigeria:+234">Nigeria</option>
                                        <option value="Niue:+683">Niue</option>
                                        <option value="Norfolk Island:+672">Norfolk Island</option>
                                        <option value="Northern Mariana Islands:+1670">Northern Mariana Islands</option>
                                        <option value="Norway:+47">Norway</option>
                                        <option value="Oman:+968">Oman</option>
                                        <option value="Pakistan:+92">Pakistan</option>
                                        <option value="Palau:+680">Palau</option>
                                        <option value="Palestinian Territory, Occupied:+970">Palestinian Territory, Occupied</option>
                                        <option value="Panama:+507">Panama</option>
                                        <option value="Papua New Guinea:+675">Papua New Guinea</option>
                                        <option value="Paraguay:+595">Paraguay</option>
                                        <option value="Peru:+51">Peru</option>
                                        <option value="Philippines:+63">Philippines</option>
                                        <option value="Pitcairn:+872">Pitcairn</option>
                                        <option value="Poland:+48">Poland</option>
                                        <option value="Portugal:+351">Portugal</option>
                                        <option value="Puerto Rico:+1939">Puerto Rico</option>
                                        <option value="Qatar:+974">Qatar</option>
                                        <option value="Romania:+40">Romania</option>
                                        <option value="Russia:+7">Russia</option>
                                        <option value="Rwanda:+250">Rwanda</option>
                                        <option value="Reunion:+262">Reunion</option>
                                        <option value="Saint Barthelemy:+590">Saint Barthelemy</option>
                                        <option value="Saint Helena, Ascension and Tristan Da Cunha:+290">Saint Helena, Ascension and Tristan Da Cunha</option>
                                        <option value="Saint Kitts and Nevis:+1869">Saint Kitts and Nevis</option>
                                        <option value="Saint Lucia:+1758">Saint Lucia</option>
                                        <option value="Saint Martin:+590">Saint Martin</option>
                                        <option value="Saint Pierre and Miquelon:+508">Saint Pierre and Miquelon</option>
                                        <option value="Saint Vincent and the Grenadines:+1784">Saint Vincent and the Grenadines</option>
                                        <option value="Samoa:+685">Samoa</option>
                                        <option value="San Marino:+378">San Marino</option>
                                        <option value="Sao Tome and Principe:+239">Sao Tome and Principe</option>
                                        <option value="Saudi Arabia:+966">Saudi Arabia</option>
                                        <option value="Senegal:+221">Senegal</option>
                                        <option value="Serbia:+381">Serbia</option>
                                        <option value="Seychelles:+248">Seychelles</option>
                                        <option value="Sierra Leone:+232">Sierra Leone</option>
                                        <option value="Singapore:+65">Singapore</option>
                                        <option value="Slovakia:+421">Slovakia</option>
                                        <option value="Slovenia:+386">Slovenia</option>
                                        <option value="Solomon Islands:+677">Solomon Islands</option>
                                        <option value="Somalia:+252">Somalia</option>
                                        <option value="South Africa:+27">South Africa</option>
                                        <option value="South Sudan:+211">South Sudan</option>
                                        <option value="South Georgia and the South Sandwich Islands:+500">South Georgia and the South Sandwich Islands</option>
                                        <option value="Spain:+34">Spain</option>
                                        <option value="Sri Lanka:+94">Sri Lanka</option>
                                        <option value="Sudan:+249">Sudan</option>
                                        <option value="Suriname:+597">Suriname</option>
                                        <option value="Svalbard and Jan Mayen:+47">Svalbard and Jan Mayen</option>
                                        <option value="Swaziland:+268">Swaziland</option>
                                        <option value="Sweden:+46">Sweden</option>
                                        <option value="Switzerland:+41">Switzerland</option>
                                        <option value="Syrian Arab Republic:+963">Syrian Arab Republic</option>
                                        <option value="Taiwan:+886">Taiwan</option>
                                        <option value="Tajikistan:+992">Tajikistan</option>
                                        <option value="United Republic of Tanzania:+255">United Republic of Tanzania</option>
                                        <option value="Thailand:+66">Thailand</option>
                                        <option value="Timor-Leste:+670">Timor-Leste</option>
                                        <option value="Togo:+228">Togo</option>
                                        <option value="Tokelau:+690">Tokelau</option>
                                        <option value="Tonga:+676">Tonga</option>
                                        <option value="Trinidad and Tobago:+1868">Trinidad and Tobago</option>
                                        <option value="Tunisia:+216">Tunisia</option>
                                        <option value="Turkey:+90">Turkey</option>
                                        <option value="Turkmenistan:+993">Turkmenistan</option>
                                        <option value="Turks and Caicos Islands:+1649">Turks and Caicos Islands</option>
                                        <option value="Tuvalu:+688">Tuvalu</option>
                                        <option value="Uganda:+256">Uganda</option>
                                        <option value="Ukraine:+380">Ukraine</option>
                                        <option value="United Arab Emirates:+971">United Arab Emirates</option>
                                        <option value="United Kingdom:+44">United Kingdom</option>
                                        <option selected value="United States:+1">United States</option>
                                        <option value="Uruguay:+598">Uruguay</option>
                                        <option value="Uzbekistan:+998">Uzbekistan</option>
                                        <option value="Vanuatu:+678">Vanuatu</option>
                                        <option value="Bolivarian Republic of Venezuela:+58">Bolivarian Republic of Venezuela</option>
                                        <option value="Vietnam:+84">Vietnam</option>
                                        <option value="Virgin Islands, British:+1284">Virgin Islands, British</option>
                                        <option value="Virgin Islands, U.S.:+1340">Virgin Islands, U.S.</option>
                                        <option value="Wallis and Futuna:+681">Wallis and Futuna</option>
                                        <option value="Yemen:+967">Yemen</option>
                                        <option value="Zambia:+260">Zambia</option>
                                        <option value="Zimbabwe:+263">Zimbabwe</option>
                                    </select>
                                </div>
                            </div>
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="username">Phone Number<span class="required-field">*</span></label>
                                    <div class="input-group joint-input">
                                        <span class="input-group-text" id="dial-code">+1</span>
                                        <input type="text" class="form-control" placeholder="Phone Number" name="phone" value="" aria-label="Username" aria-describedby="basic-addon1" />
                                    </div>
                                </div>
                            </div>
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="password">Password<span class="required-field">*</span></label>
                                    <div class="password">
                                        <input class="box-input" type="password" name="password" placeholder="Enter your password" required />
                                    </div>
                                    <div class="password-strength">
                                        <div class="password-strength-bar" id="passwordStrengthBar"></div>
                                    </div>
                                    <div class="password-strength-text" id="passwordStrengthText">Password strength: None</div>
                                </div>
                            </div>
                            
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-12">
                                <div class="single-field">
                                    <label class="box-label" for="password">Confirm Password<span class="required-field">*</span></label>
                                    <div class="password">
                                        <input class="box-input" type="password" name="password_confirmation" placeholder="Enter your password" required />
                                    </div>
                                    <div class="password-strength-text" id="passwordMatchText"></div>
                                </div>
                            </div>
                            
                            <div class="col-xl-12 col-lg-12 col-md-12 col-12">
                                <div class="single-field">
                                    <input class="form-check-input check-input" type="checkbox" name="i_agree" value="yes" id="flexCheckDefault" required />
                                    <label class="form-check-label" for="flexCheckDefault">
                                        I agree with
                                        <a href="privacy.html">Privacy & Policy</a> 
                                        <!--<a href="terms-and-conditions.html">Terms & Condition</a>-->
                                    </label>
                                </div>
                            </div>
                            
                            <div class="col-xl-12">
                                <button type="submit" class="site-btn grad-btn w-100">
                                    Create Account
                                </button>
                            </div>
                        </form>
                        
                        <div class="login-link">
                            Already have an account? <a href="login.html">Sign In</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- END REGISTER CONTENT SECTION -->
  <?php } ?>
  
  <?php if(isset($_SESSION['user_registered'])){ ?>
     <!-- Start success REGISTER HERO SECTION -->
    <section class="register-content">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-xl-10 col-12">
                <div class="register-container">
                    <h1 data-aos="fade-up" data-aos-duration="1000">Registration Successful</h1>
                    
                    <div class="success-message" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="200">
                        <p>Congratulations! Your account has been successfully created.</p>
                        <p>You can now sign in to access your account and start exploring.</p>
                    </div>
                    
                    <div class="col-xl-12" data-aos="fade-up" data-aos-duration="1000" data-aos-delay="400">
                        <a style="color:#fff;" href="login.html" class="site-btn grad-btn w-100">
                            Sign In Now
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

 <!-- END REGISTER HERO SECTION -->
 <?php  } unset($_SESSION['user_registered']); ?>
  
    <!-- Back to Top Button -->
    <div class="back-to-top" id="backToTop">
        <i class="fa fa-chevron-up"></i>
    </div>


<?php 
    require_once('inc/footer.php');
    ?>	
    <!-- Bootstrap JS Bundle with Popper -->
    <!--<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>-->
    <!-- AOS JS -->
    <!--<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>-->
    <!-- jQuery -->
    <!--<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>-->
    
     	 <?php 
    require_once('incx/script.php');
    ?>
    
    <script>
        $(document).ready(function(){
            // Initialize AOS
            AOS.init();

            // Update dial code when country changes
            $('#countrySelect').on('change', function() {
                const selectedValue = $(this).val();
                const dialCode = selectedValue.split(':')[1];
                $('#dial-code').text(dialCode);
            });

            // Password Strength Checker
            $('input[name="password"]').on('input', function() {
                const password = $(this).val();
                const strengthBar = $('#passwordStrengthBar');
                const strengthText = $('#passwordStrengthText');
                
                let strength = 0;
                let text = 'Password strength: ';
                
                // Check password length
                if (password.length >= 8) strength += 25;
                
                // Check for lowercase letters
                if (/[a-z]/.test(password)) strength += 25;
                
                // Check for uppercase letters
                if (/[A-Z]/.test(password)) strength += 25;
                
                // Check for numbers and special characters
                if (/[0-9]/.test(password) || /[^A-Za-z0-9]/.test(password)) strength += 25;
                
                // Update strength bar and text
                strengthBar.css('width', strength + '%');
                
                if (strength === 0) {
                    strengthBar.css('background-color', '#eee');
                    text += 'None';
                } else if (strength <= 25) {
                    strengthBar.css('background-color', '#ff4d4d');
                    text += 'Weak';
                } else if (strength <= 50) {
                    strengthBar.css('background-color', '#ffa64d');
                    text += 'Fair';
                } else if (strength <= 75) {
                    strengthBar.css('background-color', '#66cc66');
                    text += 'Good';
                } else {
                    strengthBar.css('background-color', '#339933');
                    text += 'Strong';
                }
                
                strengthText.text(text);
            });
            
            // Password Match Checker
            $('input[name="password_confirmation"]').on('input', function() {
                const password = $('input[name="password"]').val();
                const confirmPassword = $(this).val();
                const matchText = $('#passwordMatchText');
                
                if (confirmPassword === '') {
                    matchText.text('');
                    matchText.css('color', '');
                } else if (password === confirmPassword) {
                    matchText.text('Passwords match');
                    matchText.css('color', 'green');
                } else {
                    matchText.text('Passwords do not match');
                    matchText.css('color', 'red');
                }
            });
            
            // Back to Top Button
            const backToTopButton = $('#backToTop');
            
            $(window).scroll(function() {
                if ($(window).scrollTop() > 300) {
                    backToTopButton.addClass('visible');
                } else {
                    backToTopButton.removeClass('visible');
                }
            });
            
            backToTopButton.click(function() {
                $('html, body').animate({ scrollTop: 0 }, 800);
                return false;
            });
        });
    </script>
    
    <?php
        require_once('incx/ticker.php');
    ?>	
	
	
  <?php 
    require_once('incx/preloader.php');
    ?>
    
      <?php 
    require_once('incx/faq.php');
    ?>
        <script src="assets/js/scripts.js"></script>

</body>
</html>