<?php
/**
 * Wizard Step 1: Platform Category Selection
 * 
 * Vendors choose which platform category their offer belongs to.
 * The booking mode is auto-resolved from the selected category.
 * Categories are configured by the admin in Settings > Platform Categories.
 *
 * @package WahraRentalsBookings
 */

defined('ABSPATH') || exit;

// Current selections (from draft or existing product)
$current_category = $wizard_data['step_1']['platform_category'] ?? '';
$current_type = $wizard_data['step_1']['offer_type'] ?? 'day';

// Get enabled platform categories from admin settings
$enabled_categories = WAHRB_Platform_Categories::get_enabled();

// Mode display labels
$mode_labels = [
    'day'     => __('Per day', 'wahra-rentals-bookings'),
    'slot'    => __('Time slot', 'wahra-rentals-bookings'),
    'service' => __('Service', 'wahra-rentals-bookings'),
];

// If we have a current_type but no current_category, try to resolve from mode (backward compat)
if (empty($current_category) && !empty($current_type)) {
    $current_category = WAHRB_Platform_Categories::mode_to_category($current_type);
}
?>

<div class="wahrb-step wahrb-step-1" data-step="1">
    <div class="wahrb-step-header">
        <h2><?php esc_html_e('What type of rental do you offer?', 'wahra-rentals-bookings'); ?></h2>
        <p class="wahrb-step-description"><?php esc_html_e('Choose the category that best describes your rental offer', 'wahra-rentals-bookings'); ?></p>
    </div>

    <!-- Hidden field: offer_type is auto-set by JS when category is selected -->
    <input type="hidden" name="offer_type" id="wahrb_offer_type" value="<?php echo esc_attr($current_type); ?>">

    <div class="wahrb-offer-types" style="display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px;">
        <?php foreach ($enabled_categories as $cat_slug => $cat):
            $is_selected = ($current_category === $cat_slug);
            $primary_mode = $cat['booking_modes'][0] ?? 'day';
            $modes_display = array_map(function($m) use ($mode_labels) {
                return $mode_labels[$m] ?? $m;
            }, $cat['booking_modes']);
        ?>
        <label class="wahrb-offer-card <?php echo esc_attr($is_selected ? 'selected' : ''); ?>"
               data-booking-mode="<?php echo esc_attr($primary_mode); ?>"
               data-all-modes="<?php echo esc_attr(implode(',', $cat['booking_modes'])); ?>">
            <input type="radio" name="platform_category" value="<?php echo esc_attr($cat_slug); ?>"
                   <?php checked($is_selected); ?> style="display:none;">
            <div class="wahrb-offer-card-content">
                <span class="wahrb-offer-icon" style="font-size: 36px;"><?php echo esc_html($cat['emoji']); ?></span>
                <h3><?php echo esc_html($cat['label']); ?></h3>
                <p style="color: #64748b; font-size: 13px; margin: 4px 0 8px;"><?php echo esc_html($cat['description']); ?></p>
                <span style="display: inline-block; background: #eff6ff; color: #3b82f6; border-radius: 4px; padding: 2px 8px; font-size: 12px; font-weight: 500;">
                    <?php echo esc_html(implode(' / ', $modes_display)); ?>
                </span>
            </div>
            <span class="wahrb-offer-check">✓</span>
        </label>
        <?php endforeach; ?>
        
        <?php if (empty($enabled_categories)): ?>
        <div class="wahrb-alert wahrb-alert-warning" style="text-align: center; padding: 20px; grid-column: 1 / -1;">
            <p><?php esc_html_e('No categories are enabled. Please contact the administrator.', 'wahra-rentals-bookings'); ?></p>
        </div>
        <?php endif; ?>
    </div>
</div>

<?php
// Step 1 JS: card selection + auto-set offer_type is handled by wahrb-wizard-steps.js
?>
