<?php
 
// Include required files
include "include/db.php";
include "include/header.php";
// Initialize variables
$errors = [];
$success = '';
$landing_id = intval($_GET['id'] ?? 0);
$order_form_config = []; // Default config array
$available_products = []; // For product dropdown
// Default configuration if not set (UPDATED: changed charge_text to charge_amount in delivery_options)
$default_config = [
    'title' => 'অর্ডার করুন – নিরাপদ পেমেন্ট',
    'subtext' => 'ঘরে বসে অর্ডার করুন, পেমেন্ট করুন হাতে পেয়ে। সারা বাংলাদেশে ফ্রি ডেলিভারি!',
    'personal_info_active' => true, // NEW: Active flag for Personal Information section
    'name_label' => 'আপনার নাম *',
    'name_placeholder' => 'যেমন: রাকিব হোসেন',
    'name_error' => 'নাম লিখুন',
    'name_required' => true, // NEW: Required toggle for name
    'name_hidden' => false, // NEW: Hidden toggle for name
    'email_label' => 'ইমেইল (অপশনাল)',
    'email_placeholder' => 'যেমন: example@gmail.com',
    // No error for email as it's optional
    'email_required' => false, // NEW: Required toggle for email
    'email_hidden' => false, // NEW: Hidden toggle for email
    'phone_label' => 'মোবাইল নাম্বার *',
    'phone_placeholder' => '01XXXXXXXXX',
    'phone_error' => 'সঠিক ১১ ডিজিট দিন',
    'phone_required' => true, // NEW: Required toggle for phone
    'phone_hidden' => false, // NEW: Hidden toggle for phone
    'address_label' => 'পূর্ণ ঠিকানা *',
    'address_placeholder' => 'বাড়ি, রোড, থানা, জেলা',
    'address_error' => 'ঠিকানা লিখুন',
    'address_required' => true, // NEW: Required toggle for address
    'address_hidden' => false, // NEW: Hidden toggle for address
    'product_breakdown_active' => true, // NEW: Active flag for Product & Price Breakdown section
    'default_selected_products' => [], // UPDATED: Now an array/object with full details: ['id' => '', 'name' => '', 'price' => '', 'image_url' => '']
];
// FETCH CURRENT DATA based on ID
if ($landing_id > 0) {
    $landing_result = $conn->query("SELECT * FROM manage_landing WHERE id = $landing_id LIMIT 1");
    if ($landing_result->num_rows > 0) {
        $landing = $landing_result->fetch_assoc();
        $config_json = $landing['order_form_config'] ?? null;
        if ($config_json) {
            $order_form_config = json_decode($config_json, true) ?: $default_config;
            // NEW: Ensure all active flags are boolean (default to true if missing)
            $active_flags = ['personal_info_active', 'product_breakdown_active'];
            foreach ($active_flags as $flag) {
                $order_form_config[$flag] = (bool)($order_form_config[$flag] ?? true);
            }
            // NEW: Ensure required/hidden flags for personal fields (migrate old data)
            $personal_fields = ['name', 'email', 'phone', 'address'];
            foreach ($personal_fields as $field) {
                $order_form_config[$field . '_required'] = (bool)($order_form_config[$field . '_required'] ?? ($field !== 'email'));
                $order_form_config[$field . '_hidden'] = (bool)($order_form_config[$field . '_hidden'] ?? false);
            }
            // UPDATED: Handle default_selected_products as full object with migration from old string ID
            if (!isset($order_form_config['default_selected_products']) || empty($order_form_config['default_selected_products'])) {
                $order_form_config['default_selected_products'] = $default_config['default_selected_products'];
            } else {
                // Migration: If it's a string (old ID), fetch details from available_products
                if (is_string($order_form_config['default_selected_products'])) {
                    $old_id = $order_form_config['default_selected_products'];
                    $selected_product = null;
                    foreach ($available_products as $product) { // available_products will be loaded below, but for migration, we need to load first
                        $prod_id = (string) ($product['id'] ?? $product['slug'] ?? array_search($product, $available_products));
                        if ($prod_id === $old_id) {
                            $selected_product = [
                                'id' => $prod_id,
                                'name' => $product['name'] ?? $product['title'] ?? $product['product_name'] ?? 'Unnamed Product',
                                'price' => is_numeric($product['price'] ?? null) ? '৳' . number_format($product['price'], 0) : ($product['price'] ?? 'N/A'),
                                'image_url' => $product['image'] ?? $product['image_url'] ?? ''
                            ];
                            break;
                        }
                    }
                    $order_form_config['default_selected_products'] = $selected_product ?: [];
                } elseif (!is_array($order_form_config['default_selected_products'])) {
                    $order_form_config['default_selected_products'] = $default_config['default_selected_products'];
                }
            }
        } else {
            $order_form_config = $default_config;
        }
        // Fetch available products from products_json (must be after landing fetch)
        $products_json = $landing['products_json'] ?? null;
        if ($products_json) {
            $available_products = json_decode($products_json, true) ?: [];
            // Ensure it's an array of assoc arrays
            if (!is_array($available_products)) $available_products = [];
        }
        // Re-migrate if needed after products load
        if (is_string($order_form_config['default_selected_products'])) {
            $old_id = $order_form_config['default_selected_products'];
            $selected_product = null;
            foreach ($available_products as $product) {
                $prod_id = (string) ($product['id'] ?? $product['slug'] ?? array_search($product, $available_products));
                if ($prod_id === $old_id) {
                    $selected_product = [
                        'id' => $prod_id,
                        'name' => $product['name'] ?? $product['title'] ?? $product['product_name'] ?? 'Unnamed Product',
                        'price' => is_numeric($product['price'] ?? null) ? '৳' . number_format($product['price'], 0) : ($product['price'] ?? 'N/A'),
                        'image_url' => $product['image'] ?? $product['image_url'] ?? ''
                    ];
                    break;
                }
            }
            $order_form_config['default_selected_products'] = $selected_product ?: [];
        }
    } else {
        $errors[] = "Invalid Landing Page ID.";
    }
} else {
    $errors[] = "No Landing Page ID provided.";
}
// HANDLE FORM UPDATE
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['update_order_form'])) {
    if ($landing_id > 0) {
        // Extract all config fields from POST
        $new_config = $default_config; // Start with defaults
        foreach (array_keys($default_config) as $key) {
            if ($key === 'default_selected_products') {
                // UPDATED: Handle radio selection - extract full details from available_products
                $selected_id = trim($_POST[$key] ?? '');
                $selected_product = [];
                if (!empty($selected_id)) {
                    foreach ($available_products as $product) {
                        $prod_id = (string) ($product['id'] ?? $product['slug'] ?? array_search($product, $available_products));
                        if ($prod_id === $selected_id) {
                            $selected_product = [
                                'id' => $prod_id,
                                'name' => $product['name'] ?? $product['title'] ?? $product['product_name'] ?? 'Unnamed Product',
                                'price' => is_numeric($product['price'] ?? null) ? '৳' . number_format($product['price'], 0) : ($product['price'] ?? 'N/A'),
                                'image_url' => $product['image'] ?? $product['image_url'] ?? ''
                            ];
                            break;
                        }
                    }
                }
                $new_config[$key] = $selected_product;
            } elseif (in_array($key, ['personal_info_active', 'product_breakdown_active'])) {
                // Handle boolean toggles (active flags)
                $new_config[$key] = isset($_POST[$key]);
            } elseif (strpos($key, '_required') !== false || strpos($key, '_hidden') !== false) {
                // NEW: Handle required/hidden toggles for personal fields
                $new_config[$key] = isset($_POST[$key]);
            } else {
                $new_config[$key] = trim($_POST[$key] ?? $default_config[$key]);
            }
        }
        // Basic validation
        if (empty($new_config['title'])) {
            $errors[] = "Order Form Title is required.";
        }
        if (empty($new_config['subtext'])) {
            $errors[] = "Order Form Subtext is required.";
        }
        if (empty($new_config['name_label']) || empty($new_config['phone_label']) || empty($new_config['address_label'])) {
            $errors[] = "Personal info labels are required.";
        }
        if (empty($errors)) {
            $config_json = json_encode($new_config);
            $stmt = $conn->prepare("UPDATE manage_landing SET order_form_config = ? WHERE id = ?");
            $stmt->bind_param("si", $config_json, $landing_id);
            if ($stmt->execute()) {
                $success = "Order Form Section updated successfully!";
                // Refresh data
                $order_form_config = $new_config;
            } else {
                $errors[] = "Database error: " . $stmt->error;
            }
            $stmt->close();
        }
    } else {
        $errors[] = "Invalid Landing Page ID.";
    }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Edit Order Form Details - <?php echo htmlspecialchars($landing['landing_name'] ?? 'Milk Booster'); ?></title>
    <!-- External Scripts -->
    <script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
    <!-- Inline CSS - Adapted from main manage_landing.php -->
</head>
<body>
<div id="content" class="content p-4 min-h-screen">
    <?php include "include/topnav.php"; ?>
    <div class="max-w-6xl mx-auto my-4">
        <h2 class="text-2xl font-bold text-gray-800 mb-4 text-center">
            Edit Order Form Details - <?php echo htmlspecialchars($landing['landing_name'] ?? 'Milk Booster'); ?>
            (ID: <?php echo $landing_id; ?>)
        </h2>
        <?php if ($success): ?>
            <div class="success"><?php echo htmlspecialchars($success); ?></div>
        <?php endif; ?>
        <?php if (!empty($errors)): ?>
            <div class="error">
                <?php foreach ($errors as $e): ?>
                    <p><?php echo htmlspecialchars($e); ?></p>
                <?php endforeach; ?>
            </div>
        <?php endif; ?>
        <?php if ($landing_id > 0): ?>
            <form method="POST" class="space-y-4" id="orderFormEdit">
                <input type="hidden" name="update_order_form" value="1">
                <!-- ORDER FORM TITLE -->
                <div class="form-card">
                    <h3>Order Form Title (h2 Text)</h3>
                    <input type="text" name="title" value="<?php echo htmlspecialchars($order_form_config['title'] ?? ''); ?>"
                           placeholder="Enter Order Form Title (e.g. অর্ডার করুন – নিরাপদ পেমেন্ট)" required class="mb-2">
                </div>
                <!-- ORDER FORM SUBTEXT -->
                <div class="form-card">
                    <h3>Order Form Subtext (p Text)</h3>
                    <textarea name="subtext" rows="3" placeholder="Enter Order Form Subtext (e.g. ঘরে বসে অর্ডার করুন, পেমেন্ট করুন হাতে পেয়ে। সারা বাংলাদেশে ফ্রি ডেলিভারি!)"
                              required><?php echo htmlspecialchars($order_form_config['subtext'] ?? ''); ?></textarea>
                </div>
                <!-- PERSONAL INFORMATION FIELDS (UPDATED: Added required/hidden toggles for each field) -->
                <div class="form-card">
                    <div class="flex items-center justify-between mb-2">
                        <h3>Personal Information Fields</h3>
                        <label class="flex items-center cursor-pointer">
                            <input type="checkbox" name="personal_info_active" <?php echo ($order_form_config['personal_info_active'] ?? true) ? 'checked' : ''; ?> class="mr-2">
                            <span>Active</span>
                        </label>
                    </div>
                    <!-- Name Field -->
                    <div class="mb-4 p-2 border rounded">
                        <h4 class="font-semibold mb-2">Name Field</h4>
                        <div class="input-group mb-2">
                            <div>
                                <label>Name Label *</label>
                                <input type="text" name="name_label" value="<?php echo htmlspecialchars($order_form_config['name_label'] ?? ''); ?>" placeholder="আপনার নাম *" required class="w-full p-2 border rounded">
                            </div>
                            <div>
                                <label>Name Placeholder</label>
                                <input type="text" name="name_placeholder" value="<?php echo htmlspecialchars($order_form_config['name_placeholder'] ?? ''); ?>" placeholder="যেমন: রাকিব হোসেন" class="w-full p-2 border rounded">
                            </div>
                        </div>
                        <div class="input-group mb-2">
                            <div>
                                <label>Name Error Message</label>
                                <input type="text" name="name_error" value="<?php echo htmlspecialchars($order_form_config['name_error'] ?? ''); ?>" placeholder="নাম লিখুন" class="w-full p-2 border rounded">
                            </div>
                            <div class="flex items-center">
                                <label class="flex items-center cursor-pointer mr-4">
                                    <input type="checkbox" name="name_required" <?php echo ($order_form_config['name_required'] ?? true) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Required</span>
                                </label>
                                <label class="flex items-center cursor-pointer">
                                    <input type="checkbox" name="name_hidden" <?php echo ($order_form_config['name_hidden'] ?? false) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Hidden</span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <!-- Email Field -->
                    <div class="mb-4 p-2 border rounded">
                        <h4 class="font-semibold mb-2">Email Field</h4>
                        <div class="input-group mb-2">
                            <div>
                                <label>Email Label</label>
                                <input type="text" name="email_label" value="<?php echo htmlspecialchars($order_form_config['email_label'] ?? ''); ?>" placeholder="ইমেইল (অপশনাল)" required class="w-full p-2 border rounded">
                            </div>
                            <div>
                                <label>Email Placeholder</label>
                                <input type="text" name="email_placeholder" value="<?php echo htmlspecialchars($order_form_config['email_placeholder'] ?? ''); ?>" placeholder="যেমন: example@gmail.com" class="w-full p-2 border rounded">
                            </div>
                        </div>
                        <div class="input-group">
                            <div class="flex items-center">
                                <label class="flex items-center cursor-pointer mr-4">
                                    <input type="checkbox" name="email_required" <?php echo ($order_form_config['email_required'] ?? false) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Required</span>
                                </label>
                                <label class="flex items-center cursor-pointer">
                                    <input type="checkbox" name="email_hidden" <?php echo ($order_form_config['email_hidden'] ?? false) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Hidden</span>
                                </label>
                            </div>
                            <div></div> <!-- Empty for balance -->
                        </div>
                    </div>
                    <!-- Phone Field -->
                    <div class="mb-4 p-2 border rounded">
                        <h4 class="font-semibold mb-2">Phone Field</h4>
                        <div class="input-group mb-2">
                            <div>
                                <label>Phone Label *</label>
                                <input type="text" name="phone_label" value="<?php echo htmlspecialchars($order_form_config['phone_label'] ?? ''); ?>" placeholder="মোবাইল নাম্বার *" required class="w-full p-2 border rounded">
                            </div>
                            <div>
                                <label>Phone Placeholder</label>
                                <input type="text" name="phone_placeholder" value="<?php echo htmlspecialchars($order_form_config['phone_placeholder'] ?? ''); ?>" placeholder="01XXXXXXXXX" class="w-full p-2 border rounded">
                            </div>
                        </div>
                        <div class="input-group mb-2">
                            <div>
                                <label>Phone Error Message</label>
                                <input type="text" name="phone_error" value="<?php echo htmlspecialchars($order_form_config['phone_error'] ?? ''); ?>" placeholder="সঠিক ১১ ডিজিট দিন" class="w-full p-2 border rounded">
                            </div>
                            <div class="flex items-center">
                                <label class="flex items-center cursor-pointer mr-4">
                                    <input type="checkbox" name="phone_required" <?php echo ($order_form_config['phone_required'] ?? true) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Required</span>
                                </label>
                                <label class="flex items-center cursor-pointer">
                                    <input type="checkbox" name="phone_hidden" <?php echo ($order_form_config['phone_hidden'] ?? false) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Hidden</span>
                                </label>
                            </div>
                        </div>
                    </div>
                    <!-- Address Field -->
                    <div class="mb-4 p-2 border rounded">
                        <h4 class="font-semibold mb-2">Address Field</h4>
                        <div class="input-group mb-2">
                            <div>
                                <label>Address Label *</label>
                                <input type="text" name="address_label" value="<?php echo htmlspecialchars($order_form_config['address_label'] ?? ''); ?>" placeholder="পূর্ণ ঠিকানা *" required class="w-full p-2 border rounded">
                            </div>
                            <div>
                                <label>Address Placeholder</label>
                                <input type="text" name="address_placeholder" value="<?php echo htmlspecialchars($order_form_config['address_placeholder'] ?? ''); ?>" placeholder="বাড়ি, রোড, থানা, জেলা" class="w-full p-2 border rounded">
                            </div>
                        </div>
                        <div class="input-group">
                            <div>
                                <label>Address Error Message</label>
                                <input type="text" name="address_error" value="<?php echo htmlspecialchars($order_form_config['address_error'] ?? ''); ?>" placeholder="ঠিকানা লিখুন" class="w-full p-2 border rounded">
                            </div>
                            <div class="flex items-center">
                                <label class="flex items-center cursor-pointer mr-4">
                                    <input type="checkbox" name="address_required" <?php echo ($order_form_config['address_required'] ?? true) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Required</span>
                                </label>
                                <label class="flex items-center cursor-pointer">
                                    <input type="checkbox" name="address_hidden" <?php echo ($order_form_config['address_hidden'] ?? false) ? 'checked' : ''; ?> class="mr-2">
                                    <span>Hidden</span>
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
                <!-- PRODUCT & PRICE BREAKDOWN -->
                <div class="form-card">
                    <div class="flex items-center justify-between mb-2">
                        <h3>Product Line & Price Breakdown</h3>
                        <label class="flex items-center cursor-pointer">
                            <input type="checkbox" name="product_breakdown_active" <?php echo ($order_form_config['product_breakdown_active'] ?? true) ? 'checked' : ''; ?> class="mr-2">
                            <span>Active</span>
                        </label>
                    </div>
                    <div class="input-group">
                        <div>
                            <!-- Radio buttons for single product selection (UPDATED: Show image, name & price with fallbacks; value is ID, checked by ID match) -->
                            <label>Default Selected Product (Select one only)</label>
                            <div class="radio-group" style="max-height: 250px; overflow-y: auto; border: 1px solid #d1d5db; padding: 0.5rem; border-radius: 0.25rem;">
                                <?php if (empty($available_products)): ?>
                                    <p class="text-sm text-gray-500">No products available in products_json</p>
                                <?php else: ?>
                                    <?php
                                    $selected_id = $order_form_config['default_selected_products']['id'] ?? '';
                                    foreach ($available_products as $index => $product): ?>
                                        <?php
                                        // Robust ID extraction: 'id' first, then 'slug', fallback to string index
                                        $prod_id = (string) ($product['id'] ?? $product['slug'] ?? $index);
                                        // Robust name extraction: 'name' first, then 'title', 'product_name', fallback
                                        $prod_name = $product['name'] ?? $product['title'] ?? $product['product_name'] ?? 'Unnamed Product';
                                        // Robust price extraction: 'price' key, format as '৳X', fallback 'N/A'
                                        $prod_price_raw = $product['price'] ?? null;
                                        $prod_price = is_numeric($prod_price_raw) ? '৳' . number_format($prod_price_raw, 0) : ($prod_price_raw ? $prod_price_raw : 'N/A');
                                        // Robust image extraction: 'image' or 'image_url', fallback to placeholder
                                        $prod_image = $product['image'] ?? $product['image_url'] ?? null;
                                        $image_src = $prod_image ? htmlspecialchars($prod_image) : 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHZpZXdCb3g9IjAgMCA1MCA1MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjUiIGZpbGw9IiM5Q0EiPjwvY2lyY2xlPgo8L3N2Zz4='; // Simple gray circle placeholder
                                        $is_checked = ($prod_id === $selected_id);
                                        ?>
                                        <label class="flex items-center p-2 cursor-pointer border-b border-gray-100 last:border-b-0 hover:bg-gray-50 rounded">
                                            <input type="radio" name="default_selected_products"
                                                   value="<?php echo htmlspecialchars($prod_id); ?>"
                                                   <?php echo $is_checked ? 'checked' : ''; ?>
                                                   class="mr-3 w-4 h-4 text-blue-600">
                                            <img src="<?php echo $image_src; ?>" alt="<?php echo htmlspecialchars($prod_name); ?>" class="w-12 h-12 object-cover rounded mr-3 flex-shrink-0" onerror="this.src='data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTAiIGhlaWdodD0iNTAiIHZpZXdCb3g9IjAgMCA1MCA1MCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGNpcmNsZSBjeD0iMjUiIGN5PSIyNSIgcj0iMjUiIGZpbGw9IiM5Q0EiPjwvY2lyY2xlPgo8L3N2Zz4=';">
                                            <div class="flex-1 min-w-0">
                                                <div class="font-medium text-sm truncate"><?php echo htmlspecialchars($prod_name); ?></div>
                                                <div class="text-xs text-gray-500"><?php echo htmlspecialchars($prod_price); ?></div>
                                            </div>
                                        </label>
                                    <?php endforeach; ?>
                                <?php endif; ?>
                            </div>
                            <?php if (empty($available_products)): ?>
                                <p class="text-sm text-gray-500 mt-1">Add products in manage_landing first to enable selection.</p>
                            <?php endif; ?>
                            <!-- Debug: Show current selected product details -->
                            <?php if (!empty($order_form_config['default_selected_products'])): ?>
                                <details class="mt-2 p-2 bg-gray-50 rounded text-xs">
                                    <summary>Current Selected: <?php echo htmlspecialchars($order_form_config['default_selected_products']['name'] ?? 'None'); ?></summary>
                                    <p>ID: <?php echo htmlspecialchars($order_form_config['default_selected_products']['id'] ?? ''); ?></p>
                                    <p>Price: <?php echo htmlspecialchars($order_form_config['default_selected_products']['price'] ?? ''); ?></p>
                                    <p>Image: <?php echo htmlspecialchars($order_form_config['default_selected_products']['image_url'] ?? ''); ?></p>
                                </details>
                            <?php endif; ?>
                        </div>
                    </div>
                </div>
                <!-- SUBMIT BUTTONS -->
                <div class="flex gap-2">
                    <button type="submit"
                            class="flex-1 bg-yellow-500 text-white p-2 rounded hover:bg-yellow-600 font-bold">
                        Update Order Form
                    </button>
                    <a href="manage_landing.php"
                       class="flex-1 bg-gray-600 text-white p-2 rounded text-center font-bold">
                        Back to Landing Management
                    </a>
                </div>
            </form>
        <?php else: ?>
            <div class="form-card text-center py-8">
                <p class="text-red-600">Unable to load details. Please go back.</p>
                <a href="manage_landing.php" class="bg-gray-600 text-white px-4 py-2 rounded mt-2 inline-block">Back</a>
            </div>
        <?php endif; ?>
    </div>
</div>
<script>
// JS for dynamic personal fields (removed as section is removed)
// JS for dynamic delivery options (removed as section is removed)
// NEW: JS for toggling free delivery message input (removed as section is removed)
</script>
<style>
/* ========================================================
 * Adapted CSS from manage_landing.php
 * ========================================================
 */
@import url('https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css');
body {
    overflow-x: hidden;
    font-family: 'Inter', sans-serif;
    background: #f9fafb;
}
.content {
    transition: margin-left 0.3s ease;
}
.top-nav {
    background: linear-gradient(90deg, #1F2937, #374151);
}
.form-card {
    background: white;
    padding: 1rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
    margin-bottom: 1rem;
}
.error {
    color: #DC2626;
    background: #FEE2E2;
    padding: 0.5rem;
    border-radius: 0.25rem;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}
.success {
    color: #10B981;
    background: #ECFDF5;
    padding: 0.75rem;
    border-radius: 0.25rem;
    text-align: center;
    font-weight: bold;
    margin-bottom: 0.5rem;
    font-size: 0.875rem;
}
.input-group {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}
input, textarea, select {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    box-sizing: border-box;
}
textarea {
    resize: vertical;
}
h3 {
    font-size: 1.125rem;
    margin-bottom: 0.75rem;
}
h4 {
    font-size: 1rem;
    color: #374151;
}
label {
    font-weight: bold;
    margin-bottom: 0.25rem;
    display: block;
}
.mb-2 {
    margin-bottom: 0.5rem;
}
.radio-group label {
    font-weight: normal;
    margin-bottom: 0.25rem;
}
.radio-group input[type="radio"] {
    width: auto;
    margin-right: 0.5rem;
}
.personal-field-row, .delivery-option-row {
    clear: both;
}
@media (max-width: 768px) {
    .content {
        margin-left: 0 !important;
    }
    .input-group {
        grid-template-columns: 1fr;
    }
}
@media (min-width: 769px) {
    .content {
        margin-left: 250px;
    }
}
/* NEW: Enhanced radio group styling for product preview */
.radio-group label {
    display: flex;
    align-items: center;
    padding: 0.5rem;
    border: none;
    border-radius: 0.25rem;
    transition: background-color 0.2s;
}
.radio-group label:hover {
    background-color: #f3f4f6;
}
.radio-group label img {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 0.25rem;
    margin-right: 0.75rem;
}
.radio-group label div {
    flex: 1;
    min-width: 0;
}
.radio-group label .font-medium {
    font-weight: 500;
    font-size: 0.875rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.radio-group label .text-xs {
    font-size: 0.75rem;
    color: #6b7280;
}
</style>
</body>
</html>