<!doctype html>
<html class="no-js" lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>Login | Dr Siddha diabetes combo</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="shortcut icon" type="image/x-icon" href="assets/img/favicon.png">
    <!-- CSS here -->
    <link rel="stylesheet" href="assets/css/bootstrap.min.css">
    <link rel="stylesheet" href="assets/css/animate.min.css">
    <link rel="stylesheet" href="assets/css/magnific-popup.css">
    <link rel="stylesheet" href="assets/css/fontawesome-all.min.css">
    <link rel="stylesheet" href="assets/css/mCustomScrollbar.min.css">
    <link rel="stylesheet" href="assets/css/jquery-ui.css">
    <link rel="stylesheet" href="assets/css/flaticon.css">
    <link rel="stylesheet" href="assets/css/slick.css">
    <link rel="stylesheet" href="assets/css/default.css">
    <link rel="stylesheet" href="assets/css/style.css">
    <link rel="stylesheet" href="assets/css/responsive.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css"
        crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>

<body>
    <!-- header-area (reuse from index.html) -->
    <header>
        <div id="sticky-header" class="menu-area special-header transparent-header">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="menu-wrap">
                            <nav class="menu-nav show">
                                <div class="logo">
                                    <a href="index.html"><img src="assets/img/down/DR Siddha Logo.png" alt="Logo"></a>
                                </div>
                                <div class="navbar-wrap main-menu d-none d-lg-flex">
                                    <ul class="navigation">
                                        <li><a href="index.html#home" class="section-link">Home</a></li>
                                        <li><a href="index.html#why-us" class="section-link">Why Us</a></li>
                                        <li><a href="index.html#ingredient" class="section-link">Ingredient</a></li>
                                        <li><a href="index.html#price" class="section-link">Price</a></li>
                                        <li><a href="index.html#how-to-use" class="section-link">How to Use</a></li>
                                        <li><a href="index.html#feedbacks" class="section-link">Testimonials</a></li>
                                        <li><a href="index.html#faq" class="section-link">FAQ</a></li>
                                    </ul>
                                </div>
                                <div class="header-action d-none d-sm-block">
                                    <ul>
                                        <li class="header-shop-cart"><a href="cart.html"><i
                                                    class="fa-solid fa-cart-shopping"></i><span>2</span></a>
                                        </li>
                                        <li class="offcanvas-btn d-none d-lg-block"><a href="#"
                                                class="navSidebar-button"><i class="fa-solid fa-bars"></i></a></li>
                                    </ul>
                                </div>
                            </nav>
                        </div>
                        <div class="menu-backdrop"></div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <!-- header-area-end -->

    <!-- main-area -->
    <main>
        <section class="login-area pt-120 pb-120" style="background: #f9f9f9;">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-md-6 col-lg-5">
                        <div class="section-title special-title mb-40 text-center">
                            <h2 class="title">Login</h2>
                            <p>Access your account to continue</p>
                        </div>
                        <div class="login-form p-4 rounded" style="background: #fff; box-shadow: 0 2px 10px #eee;">
                            <form>
                                <div class="mb-3">
                                    <label for="loginnumber" class="form-label">Phone Number</label>
                                    <input type="number" class="form-control" id="loginnumber" required>
                                </div>
                                <div class="mb-3">
                                    <label for="loginPassword" class="form-label">Password</label>
                                    <input type="password" class="form-control" id="loginPassword" required>
                                </div>
                                <div class="mb-3 form-check">
                                    <input type="checkbox" class="form-check-input" id="rememberMe">
                                    <label class="form-check-label" for="rememberMe">Remember me</label>
                                </div>
                                <button type="submit" class="btn special-btn w-100">Login <i class="fa-solid fa-arrow-right"></i></button>
                                <div class="text-center mt-3">
                                    <a href="#">Forgot password?</a>
                                </div>
                                <div class="text-center mt-2">
                                    <span>Don't have an account? <a href="#">Register</a></span>
                                </div>
                            </form>
                        </div>
                        <div class="text-center mt-4">
                            <a href="index.html" class="btn solid-btn"><i class="fa fa-arrow-left"></i> Back to Home</a>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </main>
    <!-- main-area-end -->

    <!-- footer-area (reuse from index.html) -->
    <footer class="footer-area special-footer">
        <div class="footer-top-wrap">
            <div class="container">
                <div class="row justify-content-between">
                    <!-- ...footer widgets as in index.html... -->
                </div>
            </div>
        </div>
        <div class="copyright-wrap">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="copyright-text">
                            <p>Copyright By @<a href="index.html">Drs siddha</a> - 2025</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </footer>
    <!-- footer-area-end -->

    <!-- JS here -->
    <script src="assets/js/vendor/jquery-3.6.0.min.js"></script>
    <script src="assets/js/bootstrap.min.js"></script>
</body>
</html>