


<!-- Header section -->
<header class="header-section clearfix">
    <div class="container-fluid">
        <a href="index.php" class="site-logo">
            <img src="images/logo.png" alt="">
        </a>
        <div class="responsive-bar"><i class="fa fa-bars"></i></div>
        <a href="#" class="user"><i class="fa fa-user"></i></a>

        <nav class="main-menu">
            <ul class="menu-list">
                <li><a href="index.php">صفحه اصلی</a></li>
                <li><a href="services.php">خدمات</a></li>
                <li><a href="blog.php">اخبار</a></li>
                <li><a href="about.php">درباره ما</a></li>
                <li><a href="contact.php">تماس با ما</a></li>
                <li><a href="#" id="loginDialogLink">ورود به پنل کاربری</a></li>
            </ul>
        </nav>
    </div>
</header>

<!-- Login Dialog -->
<!-- Login Dialog -->
<div class="login-dialog" id="loginDialog" style="display: none;">
    <img src="images/close.png" class="close-dialog" id="closeLoginDialog" alt="Close">
    <h5 class="modal-title">ورود</h5>
    <form id="loginForm">
        <div class="form-group">
            <label for="phone">لطفاً شماره تلفن همراه و رمزعبور خود را وارد کنید:</label>
            <input type="number" class="form-control" id="phone" name="phone" placeholder="شماره تلفن همراه" required>
        </div>
        <div class="form-group">
            <input type="password" class="form-control" id="password" name="password" placeholder="رمز عبور" required>
            <span class="toggle-password" onclick="togglePassword()">👁️</span>
        </div>
        <div class="form-group text-right">
            <a href="#" style="color: #007bff;">رمز عبور خود را فراموش کرده اید؟</a>
        </div>
        <div class="form-group text-center">
            <button type="submit" class="btn btn-primary">ورود</button>
            <button type="button" class="btn btn-secondary" id="registerButton">ثبت نام</button>
        </div>
    </form>
</div>


<!-- Register Dialog -->
<div class="register-dialog" id="registerDialog" style="display: none;">
    <img src="images/close.png" class="close-dialog" id="closeRegisterDialog" alt="Close">

    <h5 class="modal-title">ثبت نام</h5>
    <form id="registerForm">
        <div class="form-group">
            <label for="registerPhone">لطفا شماره تلفن همراه خود را وارد کنید:</label>
            <input type="text" class="form-control" id="registerPhone" placeholder="شماره تلفن همراه" required>
        </div>
        <div class="form-group text-center">
            <button type="button" class="btn btn-secondary" id="registerSubmit">ثبت نام</button>
            <button type="button" class="btn btn-secondary" id="backButtonRegister">برگشت</button>
        </div>
    </form>
</div>

<!-- Verification Dialog -->
<div class="verification-dialog" id="verificationDialog" style="display: none;">
    <img src="images/close.png" class="close-dialog" id="closeVerificationDialog" alt="Close">

    <h5 class="modal-title">تایید کد</h5>
    <form id="verificationForm">
        <div class="form-group">
            <label for="verificationCode">لطفا کد تایید را وارد کنید:</label>
            <input type="text" class="form-control" id="verificationCode" placeholder="کد تایید" required>
        </div>
        <div class="form-group text-center">
            <button type="button" class="btn btn-primary" id="verifySubmit">تایید</button>
            <button type="button" class="btn btn-secondary" id="backButtonVerify">برگشت</button>
        </div>
    </form>
</div>

<style>
    .login-dialog, .register-dialog,.verification-dialog {
        width: 100%;
        max-width: 400px;
        margin: 50px auto;
        padding: 20px;
        border: 1px solid #ccc;
        border-radius: 10px;
        background: white;
        box-shadow: 0 0 10px rgba(0,0,0,0.1);
        display: none; /* Initially hidden */
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        z-index: 1000;
    }
    .login-dialog .form-group, .register-dialog .form-group {
        position: relative;
    }
    .login-dialog .form-control, .register-dialog .form-control {
        padding-right: 40px;
    }
    .login-dialog .toggle-password {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        cursor: pointer;
    }
    .login-dialog .modal-title, .register-dialog .modal-title {
        text-align: center;
        margin-bottom: 20px;
    }
    .close-dialog {
        width: 20px;
        height: 20px;
        position: absolute;
        top: 10px;
        right: 10px;
        cursor: pointer;
    }
</style>

<script>
    document.addEventListener("DOMContentLoaded", function() {
        // Show login dialog
        document.getElementById('loginDialogLink').addEventListener('click', function(e) {
            e.preventDefault();
            document.getElementById('loginDialog').style.display = 'block';
        });

        // Close login dialog
        document.getElementById('closeLoginDialog').addEventListener('click', function() {
            document.getElementById('loginDialog').style.display = 'none';
        });

        // Show register dialog from login dialog
        document.getElementById('registerButton').addEventListener('click', function() {
            document.getElementById('loginDialog').style.display = 'none';
            document.getElementById('registerDialog').style.display = 'block';
        });

        // Close register dialog
        document.getElementById('closeRegisterDialog').addEventListener('click', function() {
            document.getElementById('registerDialog').style.display = 'none';
        });

        // Go back from register dialog to login dialog
        document.getElementById('backButtonRegister').addEventListener('click', function() {
            document.getElementById('registerDialog').style.display = 'none';
            document.getElementById('loginDialog').style.display = 'block';
        });

        // Show verification dialog from register dialog
        document.getElementById('registerSubmit').addEventListener('click', function() {
            document.getElementById('registerDialog').style.display = 'none';
            document.getElementById('verificationDialog').style.display = 'block';
        });

        // Close verification dialog
        document.getElementById('closeVerificationDialog').addEventListener('click', function() {
            document.getElementById('verificationDialog').style.display = 'none';
        });

        // Go back from verification dialog to register dialog
        document.getElementById('backButtonVerify').addEventListener('click', function() {
            document.getElementById('verificationDialog').style.display = 'none';
            document.getElementById('registerDialog').style.display = 'block';
        });

        // Toggle password visibility
        window.togglePassword = function() {
            var passwordField = document.getElementById("password");
            if (passwordField.type === "password") {
                passwordField.type = "text";
            } else {
                passwordField.type = "password";
            }
        }
    });




</script>




<script>
    $(document).ready(function() {
        $('#loginForm').on('submit', function(e) {
            e.preventDefault();

            var phone = $('#phone').val();
            var password = $('#password').val();

            $.ajax({
                url: 'include/login.php', // The PHP file that processes the login
                type: 'POST',
                data: {
                    phone: phone,
                    password: password
                },
                success: function(response) {
                    console.log("response");
                    console.log(response);
                    var res = JSON.parse(response);
                    if (res.success) {
                        // Redirect to the admin page
                        window.location.href = 'platform/admin/index.php';

                        Swal.fire(
                            'Amenity  Edited Successfully',
                            '',
                            'success'
                        );

                    } else {
                        // Display an error message using SweetAlert2

                        Swal.fire(
                            'شماره موبایل و رمز عبور اشتباه است',
                            'مجددا امتحان کنید',
                            'error'
                        );

                    }
                }
            });
        });
    });
</script>

