<?php
$settingsFile = __DIR__ . '/data/settings.json';
$settings = file_exists($settingsFile) ? json_decode(file_get_contents($settingsFile), true) : [];
$pageSettings = $settings['pages'] ?? [];
$brandingSettings = $settings['branding'] ?? [];

$siteName = $brandingSettings['siteName'] ?? 'Weather Portal';
$contactEmail = $pageSettings['contactEmail'] ?? 'contact@weatherportal.com';
$contactPhone = $pageSettings['contactPhone'] ?? '';
$contactAddress = $pageSettings['contactAddress'] ?? '';
$contactIntro = $pageSettings['contactIntro'] ?? 'Have questions, suggestions, or feedback? We\'re here to help! Fill out the form below and we\'ll get back to you as soon as possible.';

include 'header.php';
?>

<div class="page-header">
    <h1 class="page-title" data-translate="contact_us">Contact Us</h1>
    <p class="page-subtitle" data-translate="contact_subtitle">We'd love to hear from you</p>
</div>

<div class="content-card">
    <h2 data-translate="get_in_touch">Get in Touch</h2>
    <p><?php echo htmlspecialchars($contactIntro); ?></p>
    
    <form id="contactForm" method="post" action="" style="margin-top: 30px; max-width: 600px;">
        <div class="form-group">
            <label for="name" data-translate="your_name">Your Name</label>
            <input type="text" id="name" name="name" class="form-control" data-placeholder="enter_name" placeholder="Enter your name" required>
        </div>
        
        <div class="form-group">
            <label for="email" data-translate="email_address">Email Address</label>
            <input type="email" id="email" name="email" class="form-control" data-placeholder="enter_email" placeholder="Enter your email" required>
        </div>
        
        <div class="form-group">
            <label for="subject" data-translate="subject">Subject</label>
            <select id="subject" name="subject" class="form-control" required>
                <option value="" data-translate="select_subject">Select a subject</option>
                <option value="general" data-translate="general_inquiry">General Inquiry</option>
                <option value="feedback" data-translate="feedback">Feedback</option>
                <option value="bug" data-translate="report_bug">Report a Bug</option>
                <option value="feature" data-translate="feature_request">Feature Request</option>
                <option value="other" data-translate="other">Other</option>
            </select>
        </div>
        
        <div class="form-group">
            <label for="message" data-translate="your_message">Your Message</label>
            <textarea id="message" name="message" class="form-control" data-placeholder="enter_message" placeholder="Write your message here..." required></textarea>
        </div>
        
        <div id="successMessage" style="display: none; background: #d4edda; color: #155724; padding: 1rem; border-radius: 0.5rem; margin-bottom: 1rem;">
            <span data-translate="message_sent">Thank you! Your message has been sent successfully.</span>
        </div>
        
        <button type="submit" class="submit-btn" data-translate="send_message">Send Message</button>
    </form>
</div>

<div class="content-card">
    <h2 data-translate="contact_info">Contact Information</h2>
    
    <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin-top: 20px;">
        <?php if (!empty($contactEmail)): ?>
        <div style="padding: 20px; background: var(--bg-secondary); border-radius: var(--radius-md);">
            <h4 style="margin-bottom: 10px;" data-translate="email">Email</h4>
            <p style="color: var(--text-secondary);"><a href="mailto:<?php echo htmlspecialchars($contactEmail); ?>"><?php echo htmlspecialchars($contactEmail); ?></a></p>
        </div>
        <?php endif; ?>
        
        <?php if (!empty($contactPhone)): ?>
        <div style="padding: 20px; background: var(--bg-secondary); border-radius: var(--radius-md);">
            <h4 style="margin-bottom: 10px;" data-translate="phone">Phone</h4>
            <p style="color: var(--text-secondary);"><a href="tel:<?php echo htmlspecialchars($contactPhone); ?>"><?php echo htmlspecialchars($contactPhone); ?></a></p>
        </div>
        <?php endif; ?>
        
        <div style="padding: 20px; background: var(--bg-secondary); border-radius: var(--radius-md);">
            <h4 style="margin-bottom: 10px;" data-translate="response_time">Response Time</h4>
            <p style="color: var(--text-secondary);" data-translate="response_info">We typically respond within 24-48 hours</p>
        </div>
        
        <?php if (!empty($contactAddress)): ?>
        <div style="padding: 20px; background: var(--bg-secondary); border-radius: var(--radius-md);">
            <h4 style="margin-bottom: 10px;" data-translate="address">Address</h4>
            <p style="color: var(--text-secondary);"><?php echo nl2br(htmlspecialchars($contactAddress)); ?></p>
        </div>
        <?php endif; ?>
    </div>
</div>

<div class="content-card">


<div class="ad-space">Advertisement Space</div>

<?php include 'footer.php'; ?>

<script>
document.getElementById('contactForm').addEventListener('submit', function(e) {
    e.preventDefault();
    document.getElementById('successMessage').style.display = 'block';
    this.reset();
    setTimeout(function() {
        document.getElementById('successMessage').style.display = 'none';
    }, 5000);
});
</script>
