/**
 * shop-wizards.js — ویجت فروشگاه
 */
;(function (global) {
    'use strict';

    const ROUTES = [
        { key: 'ai_advisor', icon: '🤖', title: 'مشاور هوشمند' },
        { key: 'order_track', icon: '📦', title: 'پیگیری سفارش' },
        { key: 'product_question', icon: '🌿', title: 'سوال محصول' },
        { key: 'return_request', icon: '↩️', title: 'مرجوعی' },
        { key: 'wholesale', icon: '🏪', title: 'خرید عمده' },
    ];

    const FIELDS = {
        _default: [
            { key: 'name', label: 'نام *', type: 'text', required: true },
            { key: 'phone', label: 'موبایل *', type: 'tel', required: true, dir: 'ltr' },
            { key: 'complaint_text', label: 'پیام شما *', type: 'textarea', required: true },
        ],
        order_track: [
            { key: 'name', label: 'نام', type: 'text' },
            { key: 'phone', label: 'موبایل *', type: 'tel', required: true, dir: 'ltr' },
            { key: 'order_id', label: 'شماره سفارش', type: 'text', dir: 'ltr' },
            { key: 'complaint_text', label: 'توضیح', type: 'textarea' },
        ],
    };

    function esc(s) { return String(s ?? '').replace(/&/g,'&amp;').replace(/</g,'&lt;'); }
    function fieldHtml(f) {
        const id = `cw-w-${f.key}`;
        const req = f.required ? ' required' : '';
        const dir = f.dir ? ` dir="${f.dir}"` : '';
        if (f.type === 'textarea') return `<label class="cw-wiz-lbl">${esc(f.label)}</label><textarea class="cw-visitor-input" id="${id}" data-key="${f.key}" rows="3"${req}></textarea>`;
        return `<label class="cw-wiz-lbl">${esc(f.label)}</label><input class="cw-visitor-input" id="${id}" data-key="${f.key}" type="${f.type || 'text'}"${dir}${req}>`;
    }
    async function fetchFields(type) { return FIELDS[type] || FIELDS._default; }
    function collectPayload(root, serviceType) {
        const payload = { service_type: serviceType, source_portal: 'shop' };
        root.querySelectorAll('[data-key]').forEach(el => { payload[el.dataset.key] = el.value?.trim?.() ?? el.value; });
        return payload;
    }

    global.SvcWizards = {
        ROUTES, fetchFields, fieldHtml, collectPayload,
        async renderWizard(container, serviceType, serviceTitle, serviceIcon, onBack, onSubmit) {
            const fields = await fetchFields(serviceType);
            container.innerHTML = `
                <button class="cw-back-btn" id="cw-wiz-back">◀ بازگشت</button>
                <div class="cw-section-title">${serviceIcon || '🛒'} ${esc(serviceTitle)}</div>
                <div id="cw-wiz-fields">${fields.map(fieldHtml).join('')}</div>
                <button class="cw-start-btn" id="cw-w-submit">✅ ارسال</button>`;
            container.querySelector('#cw-wiz-back')?.addEventListener('click', onBack);
            container.querySelector('#cw-w-submit')?.addEventListener('click', () => onSubmit(collectPayload(container, serviceType)));
        },
    };
})(typeof window !== 'undefined' ? window : globalThis);
