<?php
$form_message = '';

if ($_SERVER["REQUEST_METHOD"] == "POST") {

    // Recolección y limpieza de datos
    $name = isset($_POST['your_name']) ? htmlspecialchars(trim($_POST['your_name'])) : '';
    $partner_name = isset($_POST['partner_name']) ? htmlspecialchars(trim($_POST['partner_name'])) : '';
    $email = isset($_POST['email']) ? filter_var(trim($_POST['email']), FILTER_SANITIZE_EMAIL) : '';
    $mobile = isset($_POST['mobile_number']) ? htmlspecialchars(trim($_POST['mobile_number'])) : '';
    $event_date = isset($_POST['event_date']) ? htmlspecialchars(trim($_POST['event_date'])) : '';
    $event_location = isset($_POST['event_location']) ? htmlspecialchars(trim($_POST['event_location'])) : '';
    $message = isset($_POST['message']) ? htmlspecialchars(trim($_POST['message'])) : '';

    $requirements_list = '';
    if (!empty($_POST['requirements']) && is_array($_POST['requirements'])) {
        $selected_requirements = array_map('htmlspecialchars', $_POST['requirements']);
        $requirements_list = implode(", ", $selected_requirements);
    }

    // Validación
    if (empty($name) || empty($email) || empty($mobile) || empty($requirements_list)) {
        $form_message = '<p class="form-feedback error">Por favor, completa todos los campos requeridos (*).</p>';
    } elseif (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        $form_message = '<p class="form-feedback error">La dirección de email no es válida.</p>';
    } else {
        
        $to = "contact@steampunkdjs.com"; // Tu email de destino
        
        // ¡IMPORTANTE! Reemplaza "tudominio.com" con el dominio de tu página web.
        $from_email = "contact@steampunkdjs.com"; 
        
        $from_name = "Steampunk DJ's Webform";
        $subject = "New inquiry for Steampunk DJ's from: " . $name;

        // Headers profesionales
        $headers = "MIME-Version: 1.0" . "\r\n";
        $headers .= "Content-type:text/html;charset=UTF-8" . "\r\n";
        $headers .= "From: " . $from_name . " <" . $from_email . ">" . "\r\n";
        $headers .= "Reply-To: " . $name . " <" . $email . ">" . "\r\n";
        $headers .= "X-Mailer: PHP/" . phpversion();

        // Cuerpo del correo en HTML
        $email_body = "<html><body style='font-family: Arial, sans-serif;'>";
        $email_body .= "<h2 style='color: #BF9250;'>New Inquiry from Steampunk DJ's Website</h2>";
        $email_body .= "<p><strong>Name:</strong> " . $name . "</p>";
        if (!empty($partner_name)) {
            $email_body .= "<p><strong>Partner's Name:</strong> " . $partner_name . "</p>";
        }
        $email_body .= "<p><strong>Email:</strong> " . $email . "</p>";
        $email_body .= "<p><strong>Mobile:</strong> " . $mobile . "</p>";
        $email_body .= "<hr>";
        $email_body .= "<p><strong>Event Date:</strong> " . $event_date . "</p>";
        $email_body .= "<p><strong>Event Location:</strong> " . $event_location . "</p>";
        $email_body .= "<p><strong>Event Requirements:</strong><br>" . $requirements_list . "</p>";
        $email_body .= "<hr>";
        $email_body .= "<p><strong>Additional Message:</strong></p>";
        $email_body .= "<p style='background-color:#f4f4f4; border-left: 4px solid #BF9250; padding: 10px;'>" . nl2br($message) . "</p>";
        $email_body .= "</body></html>";

        // Envío
        if (mail($to, $subject, $email_body, $headers)) {
            $form_message = '<p class="form-feedback success">Thank you! Your message has been sent. We will get in touch with you soon.</p>';
        } else {
            $form_message = '<p class="form-feedback error">There was an error sending the message. Please try again.</p>';
        }
    }
}
?>
<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Contact - STEAMPUNK DJ'S</title>
    <meta charset="UTF-8" />
    <meta name="description" content="STEAMPUNK DJ'S - WEDDINGS CORPORATE EVENTS" />
    <meta name="keywords" content="dj, wedding, entertainment, party, master of ceremony, corporate, compair, PA Hire, festiville, stage lighting, Northern Ireland, Co.Down" />
   
    <!-- CSS Links -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link href="https://fonts.googleapis.com/css2?family=Girassol&family=Rye&family=Tenali+Ramakrishna&display=swap" rel="stylesheet" />
    <link href="styles/style.css" rel="stylesheet" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" />
  </head>
  <body style="background-color: #000;">
    <!--NAVBAR-->
    <nav class="navbar navbar-expand-lg navbar-dark p-md-3" style="background-color: #1A191B;">
      <div class="container">
        <a class="navbar-brand" style="color: #bf9250; font-family: 'Rye', cursive" href="index.php">STEAMPUNK DJ'S</a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse justify-content-end" id="navbarNav">
          <ul class="navbar-nav ml-auto">
            <li class="nav-item">
              <a class="nav-link" href="index.php">Home</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="index.php#experience">About Us</a>
            </li>
            
            <li class="nav-item">
              <a class="nav-link" href="index.php#packages-section">Services</a>
            </li>
            <li class="nav-item">
              <a class="nav-link active" href="contacto.php">Enquiry</a>
            </li>
          </ul>
        </div>
      </div>
    </nav>

    <!-- FORMULARIO DE CONTACTO -->
    <section id="contact-form-section">
        <div class="container">
            <h1 class="page-section-heading text-center" style="font-size: 5rem; color: #fff; margin-top: 50px;">Contact Us</h1>
            <h2 class="goldcolor text-center">&boxh;&boxh;&boxh;&boxh;&boxh;&boxh;&boxh;&boxh;</h2>

            <?php if (!empty($form_message)) echo $form_message; ?>

            <form action="contacto.php" method="post" class="contact-form">
                <div class="form-grid">
                    <div class="form-group"><label for="your_name">Your Name *</label><input type="text" id="your_name" name="your_name" required></div>
                    <div class="form-group"><label for="partner_name">Partner's Name</label><input type="text" id="partner_name" name="partner_name"></div>
                    <div class="form-group"><label for="email">Email *</label><input type="email" id="email" name="email" required></div>
                    <div class="form-group"><label for="mobile_number">Mobile Number *</label><input type="tel" id="mobile_number" name="mobile_number" required></div>
                    <div class="form-group full-width" id="requirements-group">
                        <fieldset>
    <legend>Event Requirements: *</legend>

    <!-- THE PLATINUM EXPERIENCE -->
    <div class="checkbox-container">
        <input type="checkbox" id="platinum" name="requirements[]" value="The Platinum Experience">
        <label for="platinum">THE PLATINUM EXPERIENCE (Walk in Music, MC, Music During Meal, Meal Entertainment, First Dance, DJ Entire Night)</label>
    </div>

    <!-- THE GOLD EXPERIENCE -->
    <div class="checkbox-container">
        <input type="checkbox" id="gold" name="requirements[]" value="The Gold Experience">
        <label for="gold">THE GOLD EXPERIENCE (Walk in Music, MC, Music During Meal, Meal Entertainment, First Dance, DJ After The Band)</label>
    </div>

    <!-- THE SILVER EXPERIENCE -->
    <div class="checkbox-container">
        <input type="checkbox" id="silver" name="requirements[]" value="The Silver Experience">
        <label for="silver">THE SILVER EXPERIENCE (First Dance, DJ Entire Night)</label>
    </div>

    <!-- THE COPPER EXPERIENCE -->
    <div class="checkbox-container">
        <input type="checkbox" id="copper" name="requirements[]" value="The Copper Experience">
        <label for="copper">THE COPPER EXPERIENCE (DJ After The Band)</label>
    </div>

    <!-- 360 PHOTO BOOTH -->
    <div class="checkbox-container">
        <input type="checkbox" id="photo_booth" name="requirements[]" value="360 Photo Booth">
        <label for="photo_booth">360 PHOTO BOOTH (cost £350 or as add-on £250 to Platinum or Gold Package. 2 hours and includes props)</label>
    </div>

</fieldset>

                    </div>
                    <div class="form-group"><label for="event_date">Event Date</label><input type="date" id="event_date" name="event_date"></div>
                    <div class="form-group"><label for="event_location">Event Location</label><input type="text" id="event_location" name="event_location" placeholder="Address"></div>
                    <div class="form-group full-width"><label for="message">Leave us a message...</label><textarea id="message" name="message" rows="5"></textarea></div>
                    <div class="form-group full-width"><button type="submit">Submit</button></div>
                </div>
            </form>
        </div>
    </section>

    <!-- FOOTER -->
    <footer id="footer" class="text-center" style="margin-top: 80px;">
      <h2 class="text-uppercase text-center" style="color: #bf9250; font-family: 'Rye', cursive">STEAMPUNK DJ'S</h2>
      <p style="font-variant: small-caps">&#x2756; Weddings Corporate Events &#x2756;</p>
      <p class="lead mb-0">
        <a href="mailto:steampunkinfo@icloud.com" style="color: inherit; text-decoration: none;">&#9993; steampunkinfo@icloud.com</a><br />
        <a href="tel:+447874880406" style="color: inherit; text-decoration: none;">&phone; +44 787 488 0406</a>
      </p>
      <div class="text-center">
        <a href="https://wa.me/447874880406" target="_blank" class="fa fa-whatsapp"></a>
        <a href="https://www.instagram.com/steampunk_djs/?igsh=MTg1YTF4MWFvM3J4eQ%3D%3D#" target="_blank" class="fa fa-instagram"></a>
      </div>
      <div class="page-section text-sm-center mb-0" id="copyright">
  <div class="container">
    <br>
    <p style="font-size: 1rem">
      by: <a href="https://nommadedigital.cl" target="_blank" rel="noopener noreferrer" style="color: pink;">
        nommadedigital.cl
      </a>
    </p>
    <br>
  </div>
</div>
    </footer>

    <!-- JavaScripts -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
  </body>
</html>