<?php include 'db_connect.php'; ?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Post Blood Request | LifeStream Precision</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script src="theme.js"></script>
    <style>
        .theme-toggle-floating {
            position: fixed;
            bottom: 40px;
            right: 40px;
            background: var(--primary);
            color: var(--background);
            width: 56px;
            height: 56px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            box-shadow: 0 8px 32px rgba(0,0,0,0.2);
            cursor: pointer;
            z-index: 9999;
            border: none;
            transition: var(--transition);
        }
    </style>
    <style>
        .alert {
            padding: 16px;
            border-radius: 12px;
            margin-bottom: 24px;
            text-align: center;
            font-size: 14px;
            font-weight: 500;
        }
        .alert-success { background: rgba(34, 197, 94, 0.1); border: 1px solid rgba(34, 197, 94, 0.3); color: #4ade80; }
        .alert-error { background: rgba(239, 68, 68, 0.1); border: 1px solid rgba(239, 68, 68, 0.3); color: #f87171; }
        
        .urgent-badge {
            display: inline-flex;
            align-items: center;
            padding: 4px 12px;
            background: rgba(255, 85, 64, 0.1);
            border: 1px solid var(--primary);
            border-radius: 20px;
            color: var(--primary);
            font-size: 12px;
            font-weight: 600;
            margin-bottom: 16px;
            text-transform: uppercase;
        }
    </style>
</head>
<body>
    <button onclick="toggleTheme()" class="theme-toggle-floating" title="Toggle Theme">
        <i id="theme-toggle-icon" class="fas fa-sun"></i>
    </button>
    <div class="container">
        <nav>
            <div class="logo">LifeStream</div>
            <button class="nav-toggle" onclick="toggleMenu()">
                <i class="fas fa-bars"></i>
            </button>
            <ul class="nav-links">
                <li><a href="index.html">Home</a></li>
                <li><a href="donor_guide.php">Donor Guide</a></li>
                <li><a href="availability.php">Availability</a></li>
                <li><a href="donor_registration.php">Become Donor</a></li>
                <li><a href="request_blood.php" class="active">Request Blood</a></li>
                <li><a href="donor_login.php">Donor Login</a></li>
                <li><a href="admin_login.php">Admin Login</a></li>
            </ul>
        </nav>

        <div class="form-container glass" style="position: relative; overflow: hidden;">
            <svg class="flow-paths" viewBox="0 0 1000 600" preserveAspectRatio="xMidYMid meet" style="opacity: 0.1; pointer-events: none; position: absolute; top:0; left:0; width:100%; height:100%;">
                <path d="M1000,300 Q500,0 0,300" class="vascular-line" fill="none" />
                <path d="M1000,300 Q500,600 0,300" class="vascular-line" fill="none" />
            </svg>
            <div style="text-align: center; margin-bottom: 32px; position: relative; z-index: 1;">
                <div class="urgent-badge"><i class="fas fa-bolt" style="margin-right: 6px;"></i> Emergency Request</div>
                <h2 style="font-family: 'Manrope';">Post Blood Request</h2>
            </div>
            
            <?php
            if (isset($_GET['status'])) {
                if ($_GET['status'] == 'success') {
                    echo '<div class="alert alert-success"><i class="fas fa-check-circle"></i> Request Posted! Admin will contact you soon.</div>';
                } else {
                    echo '<div class="alert alert-error"><i class="fas fa-exclamation-circle"></i> Something went wrong. Please try again.</div>';
                }
            }
            ?>

            <form action="process_request.php" method="POST">
                <div class="form-group">
                    <label>Patient Name</label>
                    <input type="text" name="patient_name" class="form-control" required placeholder="Enter patient full name">
                </div>
                <div class="form-group">
                    <label>Blood Group Required</label>
                    <select name="blood_group" class="form-control" required>
                        <option value="">Select Blood Group</option>
                        <option value="A+">A+</option>
                        <option value="A-">A-</option>
                        <option value="B+">B+</option>
                        <option value="B-">B-</option>
                        <option value="O+">O+</option>
                        <option value="O-">O-</option>
                        <option value="AB+">AB+</option>
                        <option value="AB-">AB-</option>
                    </select>
                </div>
                <div class="form-group">
                    <label>Units Needed</label>
                    <input type="number" name="units" class="form-control" required min="1" placeholder="Enter number of units">
                </div>
                <div class="form-group">
                    <label>Hospital</label>
                    <select name="hospital_id" class="form-control">
                        <option value="">Direct Request (No Hospital)</option>
                        <?php
                        $hospitals = $conn->query("SELECT id, name FROM hospitals");
                        while($h = $hospitals->fetch_assoc()) echo "<option value='{$h['id']}'>{$h['name']}</option>";
                        ?>
                    </select>
                </div>
                <div class="form-group">
                    <label>Reason / Emergency Details</label>
                    <textarea name="reason" class="form-control" rows="3" required placeholder="Enter details for the medical emergency"></textarea>
                </div>
                <button type="submit" class="btn btn-primary pulse" style="width: 100%; margin-top: 16px; position: relative; z-index: 1;">
                    <i class="fas fa-ambulance" style="margin-right: 10px;"></i> Dispatch Request
                </button>
            </form>
        </div>

        <footer>
            <p>&copy; 2026 LifeStream - Precision Blood Management System. All rights reserved.</p>
        </footer>
    </div>
</body>
</html>
