<?php

session_start();

header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Pragma: no-cache");
header("Expires: 0");

?>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta
        name="viewport"
        content="width=device-width, initial-scale=1.0"
    >

    <title>
        Forgot Password | Complete Bliss Solutions
    </title>


    <!-- FONTS -->
    <link
        href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@600;700;800&display=swap"
        rel="stylesheet"
    >


    <!-- FONT AWESOME -->
    <link
        rel="stylesheet"
        href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css"
    >


    <!-- SAME AUTH CSS AS LOGIN -->
    <link
        rel="stylesheet"
        href="assets/css/login.css?v=<?= filemtime(__DIR__ . '/assets/css/login.css') ?>"
    >

</head>


<body>


<div class="cbx-login-page">


    <!-- =====================================================
         LEFT SIDE
    ====================================================== -->

    <section class="cbx-login-visual">


        <div class="cbx-login-bg">

            <img
                src="public-site/assets/images/how-it-works.png"
                alt=""
            >

        </div>


        <div class="cbx-login-overlay"></div>



        <div class="cbx-login-brand">

            <a href="index.php">

                <img
                    src="public-site/assets/images/logo.png"
                    alt="Complete Bliss Solutions"
                >

            </a>

        </div>



        <div class="cbx-login-visual-content">


            <div class="cbx-login-visual-badge">

                <i class="fa-solid fa-shield-halved"></i>

                <span>
                    ACCOUNT RECOVERY
                </span>

            </div>


            <h1>

                Get back into

                <span>
                    your account.
                </span>

            </h1>


            <p>
                Enter the phone number connected to your
                Complete Bliss account and we'll guide you
                through the available recovery method.
            </p>



            <div class="cbx-forgot-trust">


                <div>

                    <i class="fa-solid fa-envelope"></i>

                    <span>

                        <strong>
                            Email Recovery
                        </strong>

                        <small>
                            Members with an email can receive
                            a secure reset link.
                        </small>

                    </span>

                </div>


                <div>

                    <i class="fa-solid fa-headset"></i>

                    <span>

                        <strong>
                            Support Fallback
                        </strong>

                        <small>
                            Accounts without an email can be
                            assisted securely by support.
                        </small>

                    </span>

                </div>


            </div>


        </div>



        <div class="cbx-login-visual-bottom">

            <span>

                <i class="fa-solid fa-lock"></i>

                Secure Complete Bliss account recovery

            </span>

        </div>


    </section>



    <!-- =====================================================
         RIGHT SIDE
    ====================================================== -->

    <section class="cbx-login-form-side">


        <div class="cbx-login-mobile-header">


            <a href="index.php">

                <img
                    src="public-site/assets/images/logo.png"
                    alt="Complete Bliss Solutions"
                >

            </a>


            <a
                href="login.php"
                class="cbx-login-home-mobile"
            >

                <i class="fa-solid fa-arrow-left"></i>

                Login

            </a>


        </div>



        <div class="cbx-login-form-wrap">


            <a
                href="login.php"
                class="cbx-login-back"
            >

                <i class="fa-solid fa-arrow-left"></i>

                Back to Login

            </a>



            <div class="cbx-login-heading">


                <div class="cbx-login-icon">

                    <i class="fa-solid fa-key"></i>

                </div>


                <span>
                    PASSWORD RECOVERY
                </span>


                <h2>
                    Forgot your password?
                </h2>


                <p>
                    No problem. Enter the phone number registered
                    to your Complete Bliss account to continue.
                </p>


            </div>



            <!-- =================================================
                 FORM
            ================================================== -->

            <form
                action="auth/forgot_password_process.php"
                method="POST"
                class="cbx-login-form"
            >


                <div class="cbx-form-group">


                    <label for="phone">
                        Registered Phone Number
                    </label>


                    <div class="cbx-input-wrap">


                        <div class="cbx-input-icon">

                            <i class="fa-solid fa-phone"></i>

                        </div>


                        <input
                            type="tel"
                            id="phone"
                            name="phone"
                            placeholder="Enter your registered phone number"
                            value="<?= htmlspecialchars($_SESSION['old_reset_phone'] ?? '') ?>"
                            autocomplete="tel"
                            required
                        >


                    </div>


                </div>



                <div class="cbx-forgot-info">

                    <div>

                        <i class="fa-solid fa-circle-info"></i>

                    </div>


                    <p>
                        If your account has an email address,
                        we'll use it for secure password recovery.
                        Otherwise, we'll provide another recovery option.
                    </p>

                </div>



                <button
                    type="submit"
                    class="cbx-login-btn"
                >

                    <span>
                        Continue Recovery
                    </span>

                    <i class="fa-solid fa-arrow-right"></i>

                </button>



               <div class="cbx-login-register">


    <span>
        Already have a reset code?
    </span>


    <a href="reset-password.php">

        Reset Password

        <i class="fa-solid fa-arrow-right"></i>

    </a>


</div>


<div class="cbx-login-register">


    <span>
        Remember your password?
    </span>


    <a href="login.php">

        Back to Login

        <i class="fa-solid fa-arrow-right"></i>

    </a>


</div>


            </form>



            <div class="cbx-login-form-footer">


                <i class="fa-solid fa-shield-halved"></i>

                <span>
                    Secure password recovery
                </span>


                <span class="cbx-login-dot"></span>


                <a href="index.php#contact">
                    Need help?
                </a>


            </div>


        </div>


    </section>


</div>



<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>


<?php if (isset($_SESSION['reset_error'])): ?>

<script>

document.addEventListener(
    "DOMContentLoaded",
    function () {

        Swal.fire({

            icon: "error",

            title: "Unable to Continue",

            text:
                <?= json_encode($_SESSION['reset_error']); ?>,

            confirmButtonColor: "#2563eb"

        });

    }
);

</script>

<?php

unset($_SESSION['reset_error']);

endif;

?>



<?php if (isset($_SESSION['reset_message'])): ?>

<script>

document.addEventListener(
    "DOMContentLoaded",
    function () {

        Swal.fire({

            icon: "success",

            title: "Check Your Next Step",

            text:
                <?= json_encode($_SESSION['reset_message']); ?>,

            confirmButtonColor: "#2563eb"

        });

    }
);

</script>

<?php

unset($_SESSION['reset_message']);

endif;

?>


<?php
unset($_SESSION['old_reset_phone']);
?>


</body>

</html>