<?php
?>
<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>DWSAS</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            background-image: url('../images/logo.png');
            background-size: cover;     
            background-repeat: no-repeat;
            background-position: center;   
            background-attachment: fixed;
            color: #333;
            position: relative; 
            z-index: 1;
        }

        body::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(2, 141, 32, 0.5);
        opacity: 1;
        z-index: 0;
        }

    .container {
        margin: 0 15px;
        position: relative;
        z-index: 1;
    }
    .form-box {
        width: 100%;
        max-width: 500px;
        padding: 30px;
        background: #fff;
        border-radius: 10px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
        display: none;
        opacity: .8;
    }
    .form-box.active {
        display: block;
    }
    h2 {
        font-size: 34px;
        text-align: center;
        margin-bottom: 20px;
    }
    input,
    select {
        width: 100%;
        padding: 12px;
        background: #eee;
        border-radius: 6px;
        border: none;
        font-size: 16px;
        color: #333;
        margin-bottom: 20px;
    }
    a{
        width: 100%;
        padding: 12px;
        background: #012a0dff;
        border-radius: 6px;
        border: none;
        cursor: pointer;
        font-size: 16px;
        color: #fff;
        font-weight: 500;
        margin-bottom: 20px;
        transition: 0.5s;
        margin-left: 210px;
        text-decoration: none;
    }
    a:hover {
        background: #5f7e62ff;
    }
    input[type='text'],[type='email']{
        border: 2px solid #2b5820; 
        border-radius: 6px;       
        padding: 10px;
        width: 95%;
    }
    button {
    width: 100%;
    padding: 12px;
    background: #012a0dff;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    margin-bottom: 20px;
    transition: 0.5s;
    }
    button:hover {
        background: #5f7e62ff;
    }

    </style>
</head>

<body>

    <div class="container">
        <div class="form-box active" id="login-form">
            <form action="login_process.php" method="POST">
                <h2>Admin Login</h2>
                <input type="email" name="email" placeholder="Email" required>
                <input type="password" name="password" placeholder="Password" required>
                <button type="submit">Login</button>
            </form>

        </div>
    </div>

    <script src="../Jscript/login.js"></script>
</body>


</html>