اگر فروشگاه اینترنتی شما با ووکامرس ساخته شده است، می‌توانید با استفاده از یک کد اختصاصی، امکان ارتباط مستقیم مشتریان با بخش پشتیبانی هر محصول را فراهم کنید. این قابلیت به مشتری کمک می‌کند پیش از خرید، درباره مشخصات محصول، موجودی، سازگاری یا شرایط خرید سوال بپرسد و از طریق پیام رسان مورد نظر با مسئول مربوطه ارتباط بگیرد.

قطعه کد به نسخه 2.0.0 آپدیت شد . برای مشاهده امکانات جدید انتها پست را مطالعه کنید .

در این مطلب از آی کدیتو، کد رایگان پشتیبانی محصولات ووکامرس را معرفی می‌کنیم که امکان تعیین پیام رسان پشتیبانی برای دسته بندی‌های اصلی و محصولات را فراهم می‌کند. این کد بدون نیاز به نصب یک افزونه جداگانه اجرا می‌شود و می‌توانید آن را از طریق افزونه Code Snippets به سایت خود اضافه کنید.

کد پشتیبانی محصولات ووکامرس چه کاربردی دارد؟

کد پشتیبانی محصولات ووکامرس

با استفاده از این کد می‌توانید برای هر گروه از محصولات فروشگاه، یک روش ارتباطی مشخص در نظر بگیرید. برای مثال، مشتریان بخش موبایل از طریق واتساپ با پشتیبانی ارتباط برقرار کنند و مشتریان بخش لپ تاپ از طریق تلگرام سوالات خود را مطرح کنند.

این روش برای فروشگاه‌هایی که چند گروه کالایی مختلف دارند و می‌خواهند ارتباط با مشتریان را به شکل منظم‌تری مدیریت کنند، کاربردی است.

امکانات کد پشتیبانی محصول

  • تنظیم پشتیبانی برای دسته بندی‌های اصلی: دسته بندی‌های اصلی محصولات ووکامرس به صورت خودکار شناسایی می‌شوند و می‌توانید برای هر کدام تنظیمات جداگانه‌ای تعریف کنید.
  • پشتیبانی از چند پیام رسان: امکان انتخاب واتساپ، تلگرام، بله، ایتا و روبیکا برای ارتباط با مشتریان وجود دارد.
  • نمایش دکمه ارتباط در صفحه محصول: دکمه پشتیبانی می‌تواند در بخش اطلاعات محصول و زیر دکمه افزودن به سبد خرید نمایش داده شود.
  • تنظیمات اختصاصی برای هر محصول: در صفحه ویرایش محصول می‌توانید پیام رسان، شماره یا شناسه پشتیبانی و متن دکمه را به صورت اختصاصی مشخص کنید.
  • اولویت تنظیمات محصول: در صورت فعال بودن پشتیبانی اختصاصی محصول، اطلاعات همان محصول نسبت به تنظیمات دسته بندی اولویت دارد.
  • ارث بری تنظیمات از دسته بندی اصلی: محصولات قرارگرفته در زیر دسته‌ها نیز می‌توانند از تنظیمات دسته بندی اصلی خود استفاده کنند.
  • تغییر عنوان دکمه: متن دکمه ارتباط با مشتری قابل شخصی سازی است؛ برای مثال می‌توانید از عبارت «مشاوره خرید» یا «ارتباط با مدیر بخش» استفاده کنید.
  • رابط کاربری واکنش گرا: طراحی دکمه‌ها و پنل تنظیمات با هدف نمایش مناسب در اندازه‌های مختلف صفحه انجام شده است.

این کد برای چه فروشگاه‌هایی مناسب است؟

این کد می‌تواند برای فروشگاه‌های اینترنتی ارتباط مستقیم با مشتری نیاز دارند، مفید باشد.

برای نمونه، مدیر فروشگاه می‌تواند پشتیبانی دسته بندی موبایل را روی واتساپ تنظیم کند، برای لپ تاپ از تلگرام استفاده کند و برای هدفون یک روش ارتباطی دیگر در نظر بگیرد. در نتیجه، لازم نیست تمام محصولات فروشگاه به یک شماره یا شناسه پشتیبانی متصل باشند.

آموزش نصب و فعال سازی کد

برای استفاده از این قابلیت، ابتدا باید افزونه ووکامرس روی سایت شما نصب و فعال باشد. سپس مراحل زیر را دنبال کنید.

  1. وارد پیشخوان وردپرس شوید.
  2. از بخش افزونه‌ها، افزونه Code Snippets را نصب و فعال کنید؛ اگر از قبل نصب شده است، نیازی به نصب مجدد نیست.
  3. وارد بخش Code Snippets شوید و گزینه افزودن Snippet جدید را انتخاب کنید.
  4. یک نام مشخص مانند «پشتیبانی محصولات ووکامرس» برای کد وارد کنید.
  5. کد PHP ارائه شده در این صفحه را به صورت کامل در ویرایشگر قرار دهید.
  6. گزینه اجرای کد در سراسر سایت را انتخاب کنید و Snippet را ذخیره و فعال کنید.

نکته: کد باید به صورت کامل و بدون حذف بخش‌های آن وارد شود. اگر از ویرایشگر PHP افزونه Code Snippets استفاده می‌کنید، مطابق روش معمول این افزونه، تگ آغازین <?php را اضافه نکنید.

تنظیم پیام رسان برای دسته بندی‌های اصلی

تنظیمات پیشخوان کد پشتیبانی محصولات ووکامرس

پس از فعال سازی کد، وارد بخش «محصولات ← پشتیبانی محصول» در پیشخوان وردپرس شوید.

در این قسمت، دسته بندی‌های اصلی فروشگاه نمایش داده می‌شوند. برای هر دسته بندی می‌توانید پشتیبانی را فعال کنید، پیام رسان مورد نظر را انتخاب کنید، شماره یا شناسه ارتباطی را وارد کنید و متن دکمه را تغییر دهید.

برای مثال، اگر دسته بندی اصلی شما «موبایل» باشد، می‌توانید واتساپ را انتخاب و شماره پشتیبانی را با کد کشور وارد کنید. محصولات موجود در زیر دسته‌های این گروه نیز در صورت نداشتن تنظیمات اختصاصی، از تنظیمات دسته بندی اصلی استفاده خواهند کرد.

تنظیم پشتیبانی اختصاصی برای یک محصول

تنظیمات پیشخوان کد پشتیبانی محصولات ووکامرس

اگر می‌خواهید یک محصول از شماره یا پیام رسان متفاوتی استفاده کند، وارد صفحه ویرایش همان محصول شوید و بخش «پشتیبانی این محصول» را پیدا کنید.

در این بخش می‌توانید حالت استفاده از تنظیمات دسته بندی را انتخاب کنید یا پشتیبانی اختصاصی محصول را فعال کرده و پیام رسان، شماره یا شناسه و عنوان دکمه را وارد کنید.

برای مثال، ممکن است پشتیبانی عمومی دسته موبایل از طریق واتساپ انجام شود، اما برای یک گوشی خاص، ارتباط با کارشناس فنی از طریق تلگرام در نظر گرفته شود. در این حالت، با فعال کردن تنظیمات اختصاصی محصول، اطلاعات همان محصول استفاده می‌شود.

نکات مهم پیش از استفاده

  • شماره واتساپ را با کد کشور و بدون علامت مثبت وارد کنید؛ برای نمونه، شماره ایران باید با پیش شماره 98 ثبت شود.
  • برای تلگرام و سایر پیام رسان‌ها، شناسه یا اطلاعات ارتباطی معتبر وارد کنید.
  • معتبر بودن قالب شماره یا شناسه لزوماً به معنی فعال بودن حساب کاربری یا امکان ارتباط با آن نیست.
  • قبل از استفاده در فروشگاه اصلی، عملکرد کد را در یک محیط آزمایشی بررسی کنید؛ به ویژه نمایش دکمه در صفحه محصول، ذخیره تنظیمات و باز شدن لینک پیام رسان‌ها.
  • پیش از افزودن کدهای PHP به سایت، از فایل‌ها و پایگاه داده نسخه پشتیبان تهیه کنید.

دریافت رایگان کد پشتیبانی محصولات ووکامرس

کد کامل PHP سیستم پشتیبانی محصولات ووکامرس قرار داده شده است. می‌توانید آن را به صورت رایگان دریافت کنید و با استفاده از افزونه Code Snippets در فروشگاه خود فعال کنید.

این کد برای افزودن یک روش ارتباطی مستقیم میان مشتری و پشتیبانی محصول طراحی شده است و به شما اجازه می‌دهد تنظیمات هر دسته بندی را جداگانه مدیریت کنید.

اگر هنگام نصب یا تنظیم کد با مشکلی مواجه شدید، ابتدا فعال بودن ووکامرس و کامل بودن کد وارد شده را بررسی کنید.

دریافت و درج کد در Code Snippets

کد زیر را به صورت کامل کپی کنید و در یک Snippet جدید در افزونه Code Snippets قرار دهید. پس از ذخیره و فعال سازی، زیرمنوی «پشتیبانی محصول» در بخش محصولات ووکامرس اضافه می‌شود.

محل درج کد: پیشخوان وردپرس ← Code Snippets ← افزودن Snippet جدید

نوع کد: PHP

نحوه اجرا: در سراسر سایت

پیش نیاز: نصب و فعال بودن ووکامرس

<?php
/**
 * Icodito Product Support System for WooCommerce
 * سیستم پشتیبانی محصولات ووکامرس
 *
 * @author Icodito
 * @link   https://icodito.ir/
 * @version 2.0.0
 */

if (!defined('ABSPATH')) {
    exit;
}

if (!class_exists('WooCommerce')) {
    add_action('admin_notices', function () {
        echo '<div class="notice notice-error"><p><strong>سیستم پشتیبانی محصول:</strong> افزونه ووکامرس فعال نیست. لطفاً ابتدا ووکامرس را نصب و فعال کنید.</p></div>';
    });
    return;
}

if (!defined('ICODITO_PS_VERSION')) {
    define('ICODITO_PS_VERSION', '2.0.0');
}
if (!defined('ICODITO_PS_OPTION_KEY')) {
    define('ICODITO_PS_OPTION_KEY', 'icodito_product_support_settings');
}
if (!defined('ICODITO_PS_META_PREFIX')) {
    define('ICODITO_PS_META_PREFIX', '_icodito_ps_');
}
if (!defined('ICODITO_PS_GLOBAL_OPTION_KEY')) {
    define('ICODITO_PS_GLOBAL_OPTION_KEY', 'icodito_product_support_global');
}

if (!defined('ICODITO_PS_STYLE_OPTION_KEY')) {
    define('ICODITO_PS_STYLE_OPTION_KEY', 'icodito_product_support_style');
}

if (!function_exists('icodito_ps_get_messengers')) {
    function icodito_ps_get_messengers()
    {
        return array(
            'whatsapp' => array(
                'label' => 'واتساپ',
                'icon' => 'whatsapp',
                'placeholder' => '989121234567',
                'hint' => 'شماره موبایل با کد کشور، بدون + و بدون صفر (مثال: 989121234567)',
                'validate' => 'phone',
            ),
            'telegram' => array(
                'label' => 'تلگرام',
                'icon' => 'telegram',
                'placeholder' => 'example_support',
                'hint' => 'شناسه کاربری عمومی بدون @ (مثال: example_support)',
                'validate' => 'username',
            ),
            'bale' => array(
                'label' => 'بله',
                'icon' => 'bale',
                'placeholder' => 'example_support',
                'hint' => 'شناسه کاربری یا شماره (مثال: example_support یا 989121234567)',
                'validate' => 'bale',
            ),
            'eitaa' => array(
                'label' => 'ایتا',
                'icon' => 'eitaa',
                'placeholder' => 'example_support',
                'hint' => 'شناسه کاربری (مثال: example_support)',
                'validate' => 'username',
            ),
            'rubika' => array(
                'label' => 'روبیکا',
                'icon' => 'rubika',
                'placeholder' => 'example_support',
                'hint' => 'شناسه کاربری (مثال: example_support)',
                'validate' => 'username',
            ),
        );
    }
}

/**
 * دریافت پریست‌های استایل دکمه
 */
if (!function_exists('icodito_ps_get_button_presets')) {
    function icodito_ps_get_button_presets()
    {
        return array(
            'default' => array(
                'label' => 'حرفه‌ای',
                'description' => 'دکمه پر با سایه نرم',
                'preview_bg' => '#6366f1',
                'preview_color' => '#ffffff',
                'preview_border' => 'transparent',
                'style' => array(
                    'text_color' => '#ffffff',
                    'bg_color' => '#6366f1',
                    'bg_color_2' => '#6366f1',
                    'bg_type' => 'solid',
                    'border_color' => 'transparent',
                    'border_width' => 0,
                    'border_radius' => 12,
                    'padding_y' => 14,
                    'padding_x' => 24,
                    'font_size' => 15,
                    'font_weight' => '600',
                    'shadow' => '0 4px 14px rgba(99,102,241,.35)',
                    'hover_bg_color' => '#4f46e5',
                    'hover_bg_color_2' => '#4f46e5',
                    'hover_text_color' => '#ffffff',
                    'hover_shadow' => '0 8px 22px rgba(99,102,241,.45)',
                ),
            ),
            'minimal' => array(
                'label' => 'مینیمال',
                'description' => 'سبک و بی‌پیرایه',
                'preview_bg' => '#ffffff',
                'preview_color' => '#1e293b',
                'preview_border' => '#e2e8f0',
                'style' => array(
                    'text_color' => '#1e293b',
                    'bg_color' => '#ffffff',
                    'bg_color_2' => '#ffffff',
                    'bg_type' => 'solid',
                    'border_color' => '#e2e8f0',
                    'border_width' => 1,
                    'border_radius' => 10,
                    'padding_y' => 12,
                    'padding_x' => 22,
                    'font_size' => 14,
                    'font_weight' => '500',
                    'shadow' => '0 1px 3px rgba(15,23,42,.06)',
                    'hover_bg_color' => '#f8fafc',
                    'hover_bg_color_2' => '#f8fafc',
                    'hover_text_color' => '#0f172a',
                    'hover_shadow' => '0 4px 12px rgba(15,23,42,.10)',
                ),
            ),
            'outline' => array(
                'label' => 'خطی',
                'description' => 'قاب رنگی شفاف',
                'preview_bg' => '#ffffff',
                'preview_color' => '#6366f1',
                'preview_border' => '#6366f1',
                'style' => array(
                    'text_color' => '#6366f1',
                    'bg_color' => '#ffffff',
                    'bg_color_2' => '#ffffff',
                    'bg_type' => 'solid',
                    'border_color' => '#6366f1',
                    'border_width' => 2,
                    'border_radius' => 12,
                    'padding_y' => 12,
                    'padding_x' => 24,
                    'font_size' => 15,
                    'font_weight' => '600',
                    'shadow' => 'none',
                    'hover_bg_color' => '#6366f1',
                    'hover_bg_color_2' => '#6366f1',
                    'hover_text_color' => '#ffffff',
                    'hover_shadow' => '0 6px 18px rgba(99,102,241,.35)',
                ),
            ),
            'gradient' => array(
                'label' => 'گرادیانت',
                'description' => 'طیف رنگی مدرن',
                'preview_bg' => 'linear-gradient(135deg,#6366f1,#a855f7)',
                'preview_color' => '#ffffff',
                'preview_border' => 'transparent',
                'style' => array(
                    'text_color' => '#ffffff',
                    'bg_color' => '#6366f1',
                    'bg_color_2' => '#a855f7',
                    'bg_type' => 'gradient',
                    'border_color' => 'transparent',
                    'border_width' => 0,
                    'border_radius' => 12,
                    'padding_y' => 14,
                    'padding_x' => 24,
                    'font_size' => 15,
                    'font_weight' => '600',
                    'shadow' => '0 6px 20px rgba(139,92,246,.40)',
                    'hover_bg_color' => '#4f46e5',
                    'hover_bg_color_2' => '#9333ea',
                    'hover_text_color' => '#ffffff',
                    'hover_shadow' => '0 10px 28px rgba(139,92,246,.50)',
                ),
            ),
            'soft' => array(
                'label' => 'نرم',
                'description' => 'پس‌زمینه ملایم',
                'preview_bg' => '#eef2ff',
                'preview_color' => '#4f46e5',
                'preview_border' => 'transparent',
                'style' => array(
                    'text_color' => '#4f46e5',
                    'bg_color' => '#eef2ff',
                    'bg_color_2' => '#eef2ff',
                    'bg_type' => 'solid',
                    'border_color' => 'transparent',
                    'border_width' => 0,
                    'border_radius' => 12,
                    'padding_y' => 13,
                    'padding_x' => 24,
                    'font_size' => 14,
                    'font_weight' => '600',
                    'shadow' => '0 2px 8px rgba(99,102,241,.10)',
                    'hover_bg_color' => '#e0e7ff',
                    'hover_bg_color_2' => '#e0e7ff',
                    'hover_text_color' => '#4338ca',
                    'hover_shadow' => '0 6px 16px rgba(99,102,241,.20)',
                ),
            ),
            'dark' => array(
                'label' => 'تیره',
                'description' => 'مدرن و قدرتمند',
                'preview_bg' => '#0f172a',
                'preview_color' => '#ffffff',
                'preview_border' => 'transparent',
                'style' => array(
                    'text_color' => '#ffffff',
                    'bg_color' => '#0f172a',
                    'bg_color_2' => '#1e293b',
                    'bg_type' => 'gradient',
                    'border_color' => 'transparent',
                    'border_width' => 0,
                    'border_radius' => 12,
                    'padding_y' => 14,
                    'padding_x' => 24,
                    'font_size' => 15,
                    'font_weight' => '600',
                    'shadow' => '0 6px 20px rgba(15,23,42,.30)',
                    'hover_bg_color' => '#1e293b',
                    'hover_bg_color_2' => '#334155',
                    'hover_text_color' => '#ffffff',
                    'hover_shadow' => '0 10px 28px rgba(15,23,42,.45)',
                ),
            ),
        );
    }
}

if (!function_exists('icodito_ps_get_messenger_icon')) {
    function icodito_ps_get_messenger_icon($messenger)
    {
        $icons = array(
            'whatsapp' => '<svg viewBox="0 0 24 24" width="18" height="18" fill="currentColor" aria-hidden="true"><path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z"/></svg>',
            'telegram' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path fill="currentColor" d="M20.464 4.41a.75.75 0 0 1 .277.707l-2.065 13.049l-.003.02a4 4 0 0 1-.064.343a1.1 1.1 0 0 1-.26.49a1.06 1.06 0 0 1-.758.327a1.1 1.1 0 0 1-.53-.145a4 4 0 0 1-.296-.186l-.018-.011l-2.467-1.649l-2.353 1.921a5 5 0 0 1-.342.264a1.1 1.1 0 0 1-.605.21a1.06 1.06 0 0 1-.836-.39a1.1 1.1 0 0 1-.227-.605a5 5 0 0 1-.011-.43v-.01l-.136-3.748l-5.256-1.55l-.026-.007a7 7 0 0 1-.504-.16c-.11-.043-.402-.156-.577-.44a1.05 1.05 0 0 1-.056-1.003c.143-.303.42-.447.525-.501c.134-.07.308-.142.483-.215l15.353-6.384a.75.75 0 0 1 .752.104M10.298 13.16l5.23-4.903l-9.892 3.529zm7.617-5.097l-6.208 5.827l2.944 1.91l2.605 1.741z"/></svg>',
            'bale' => '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 100 100"><g transform="rotate(0 50 50) translate(14.27 0) scale(0.12)"><path d="M0 0 C10.16888405 6.59451569 20.07714491 13.58075916 29.9375 20.625 C30.71512695 21.17833008 31.49275391 21.73166016 32.29394531 22.30175781 C34.57422328 23.92584068 36.85061977 25.55516969 39.125 27.1875 C39.85299805 27.70892578 40.58099609 28.23035156 41.33105469 28.76757812 C45.18760438 31.5539138 48.95766215 34.41471661 52.6640625 37.3984375 C53.43339111 38.01130615 54.20271973 38.6241748 54.99536133 39.25561523 C56.46642118 40.43453391 57.92534747 41.62880254 59.36987305 42.84008789 C60.02769775 43.36594482 60.68552246 43.89180176 61.36328125 44.43359375 C61.93473877 44.90595459 62.50619629 45.37831543 63.0949707 45.86499023 C64.9995315 46.86750833 64.9995315 46.86750833 67.34375 45.99291992 C70.13447195 44.5211188 72.50901416 42.85057037 75.01171875 40.9296875 C80.68849269 36.71981701 86.57097611 33.16856948 92.75 29.75 C94.37905273 28.84664917 94.37905273 28.84664917 96.04101562 27.92504883 C167.56652016 -11.21714814 250.78112602 -19.09103771 328.85253906 3.46728516 C382.11163928 19.31969969 434.75742985 52.02113796 469.66796875 95.796875 C471.97153323 98.66740974 474.35579548 101.45485214 476.75 104.25 C487.70043035 117.42102846 496.664973 131.65771181 504.9375 146.625 C505.36272949 147.37974609 505.78795898 148.13449219 506.22607422 148.91210938 C544.21000034 216.49750349 551.21148764 299.08937076 530.77734375 373.26171875 C515.1127555 428.24745326 482.92134349 480.63241558 438.9375 517.625 C438.39480469 518.08148926 437.85210937 518.53797852 437.29296875 519.00830078 C391.41772881 557.40548367 335.66231712 582.89492136 275.9375 589.625 C274.71341431 589.76639404 274.71341431 589.76639404 273.46459961 589.91064453 C263.08971631 590.94342162 252.66568348 590.86870441 242.25 590.875 C240.74475769 590.87601212 240.74475769 590.87601212 239.20910645 590.87704468 C223.89964207 590.86070603 209.04297596 590.31818366 193.9375 587.625 C192.92993652 587.45339355 191.92237305 587.28178711 190.88427734 587.10498047 C133.221793 577.11514923 81.05670842 551.04271011 37.9375 511.625 C36.9784375 510.77035156 36.019375 509.91570313 35.03125 509.03515625 C8.15034688 484.99139125 -13.75821123 454.28082699 -29.08398438 421.70166016 C-29.75710697 420.27312203 -30.4385868 418.84850153 -31.12695312 417.42724609 C-44.15961992 390.47123201 -51.99687007 361.8049048 -56.375 332.25 C-56.53460205 331.18273682 -56.6942041 330.11547363 -56.85864258 329.01586914 C-59.48552498 309.84441428 -59.21585121 290.42462324 -59.22363281 271.1171875 C-59.22774614 268.40467651 -59.23327906 265.69216873 -59.23867798 262.97966003 C-59.25211569 255.67242207 -59.25826029 248.36518968 -59.26268864 241.05794144 C-59.26547073 236.48539365 -59.26971092 231.91284791 -59.27419281 227.34030151 C-59.28635645 214.64525995 -59.29666785 201.95021999 -59.3000679 189.25517273 C-59.30028747 188.44686557 -59.30050703 187.63855842 -59.30073325 186.80575711 C-59.30095153 185.99572403 -59.30116981 185.18569095 -59.3013947 184.35111141 C-59.30183814 182.71014849 -59.30228471 181.06918557 -59.30273438 179.42822266 C-59.3029558 178.61428012 -59.30317723 177.80033758 -59.30340537 176.96173012 C-59.30736203 163.74380319 -59.32485543 150.52593108 -59.3480939 137.30802536 C-59.37183554 123.69294267 -59.38427069 110.07788753 -59.38543582 96.46278381 C-59.38634993 88.83573396 -59.39203724 81.20875602 -59.41025543 73.58172607 C-59.42569311 67.09703107 -59.43075455 60.61243032 -59.42251733 54.12772042 C-59.41862648 50.8248289 -59.42111609 47.52216557 -59.43357468 44.21928978 C-59.44632028 40.62918595 -59.44040305 37.03956387 -59.42999268 33.44946289 C-59.43804908 32.4202667 -59.44610548 31.39107052 -59.45440602 30.33068657 C-59.38128425 19.49576827 -57.67854825 9.6757542 -50.0625 1.625 C-49.49789062 0.99722656 -48.93328125 0.36945312 -48.3515625 -0.27734375 C-33.98209748 -14.61649345 -15.17750021 -9.63381837 0 0 Z M318.90039062 184.56445312 C317.62161305 185.84515401 316.34260455 187.12562435 315.06338501 188.40588379 C312.32943162 191.14297649 309.59703389 193.88160906 306.86585999 196.62147522 C302.54905288 200.95188368 298.22836305 205.27840432 293.90710449 209.60437012 C284.74759034 218.77494106 275.59234113 227.94976441 266.4375 237.125 C256.52486751 247.05966673 246.61149141 256.99358498 236.69325781 266.92266035 C232.39470618 271.22620098 228.09860554 275.53216918 223.80435085 279.83999729 C221.14211365 282.5096695 218.4778281 285.17729009 215.81296921 287.84434509 C214.57447301 289.08471998 213.33684482 290.32596224 212.10013199 291.56811523 C210.41770935 293.25770826 208.73227031 294.94423273 207.04602051 296.63000488 C206.55284411 297.12677624 206.05966771 297.6235476 205.55154657 298.13537264 C202.16568698 301.51090651 202.16568698 301.51090651 199.9375 302.625 C199.69978882 302.06262634 199.46207764 301.50025269 199.21716309 300.9208374 C197.64775019 298.10516126 195.74131944 296.17446181 193.46289062 293.89160156 C192.07003845 292.48929291 192.07003845 292.48929291 190.64904785 291.05865479 C189.6308679 290.0440579 188.61242852 289.0297213 187.59375 288.015625 C186.54410075 286.96462682 185.4947484 285.91333205 184.44567871 284.86175537 C182.24306673 282.6561951 180.03688109 280.45428954 177.828125 278.25488281 C175.02202338 275.46009123 172.22488493 272.65652997 169.43045807 269.85007095 C167.26170088 267.67401485 165.0881133 265.50283338 162.91313171 263.33300018 C161.88162654 262.30281384 160.85156207 261.27118254 159.82307434 260.2379837 C144.92699564 245.28873587 129.68255729 233.83073698 107.8125 233.1875 C91.09164839 233.8898664 76.90761937 239.93111415 64.9375 251.625 C52.31698314 266.16228478 48.93447322 281.41007534 49.7421875 300.12548828 C50.17603483 305.67764944 51.71589891 310.5530428 53.9375 315.625 C54.32679687 316.54023438 54.71609375 317.45546875 55.1171875 318.3984375 C62.91875091 334.50935838 79.6590102 347.53960213 92.12109375 360.046875 C93.08543158 361.01527464 94.04974162 361.98370195 95.01402473 362.95215607 C99.54192285 367.49899092 104.07215294 372.04348616 108.6053223 376.5850656 C113.79061195 381.78014385 118.9674844 386.98342704 124.1374802 392.19372439 C128.17068853 396.25726463 132.21170693 400.31293435 136.25846058 404.3629849 C138.65972094 406.76657209 141.05770487 409.1732059 143.44735527 411.58834076 C160.23531249 429.26530496 160.23531249 429.26530496 181.4375 440.625 C182.5615625 440.99625 183.685625 441.3675 184.84375 441.75 C199.9735843 446.02914506 215.59320068 443.9979882 229.625 437.0625 C242.70168371 429.14594618 253.41266884 416.30926011 264.16137695 405.578125 C265.86587398 403.8799063 267.5705555 402.18187275 269.27540588 400.48400879 C274.35030086 395.42817431 279.4210329 390.36817667 284.49087051 385.30727196 C286.40605518 383.39560929 288.32155063 381.48425821 290.23706061 379.57292151 C298.70051838 371.12789526 307.16263627 362.68152906 315.62073994 354.23114014 C317.68017436 352.17361498 319.73961438 350.11609542 321.79907227 348.05859375 C322.31081704 347.54733271 322.82256182 347.03607167 323.34981402 346.50931787 C331.65343011 338.21401553 339.96554134 329.92728005 348.28119753 321.64404917 C356.84671205 313.1116596 365.40462649 304.57170642 373.95519036 296.02433395 C378.74517914 291.23650299 383.53835825 286.45196765 388.34008217 281.67590332 C392.85267331 277.18662942 397.35560207 272.68788235 401.85141563 268.18180847 C403.49785345 266.5348763 405.14768849 264.89133189 406.80123901 263.25154114 C421.51150206 248.67821034 421.51150206 248.67821034 430.8125 230.375 C431.20179688 229.25609375 431.59109375 228.1371875 431.9921875 226.984375 C436.20683198 212.00671281 434.01795344 195.94873845 426.6015625 182.33984375 C417.22645895 167.04478045 404.31859226 157.92615862 386.9375 153.625 C357.12113356 147.9114577 338.32387883 165.05429068 318.90039062 184.56445312 Z " fill="currentColor" transform="translate(59.0625,9.375)"></path><path d="M0 0 C3.5187794 1.98689699 5.69792092 4.09376277 7 8 C7.10500323 10.82756547 7.15410533 13.63149609 7.15771484 16.45947266 C7.16279556 17.32327545 7.16787628 18.18707825 7.17311096 19.07705688 C7.18381574 20.95460622 7.1924355 22.83216832 7.19923019 24.70973587 C7.21102662 27.68655279 7.23048359 30.66322512 7.25234985 33.63998413 C7.31392581 42.10450386 7.36791953 50.56901014 7.40136719 59.03369141 C7.42237734 64.21144471 7.45773597 69.38893645 7.50212479 74.56653976 C7.51623961 76.53515914 7.52499697 78.50382482 7.52817917 80.47249222 C7.53311832 83.23665739 7.55635474 86.00013585 7.58349609 88.76416016 C7.58048996 89.56865601 7.57748383 90.37315186 7.5743866 91.20202637 C7.70600062 100.28213932 10.45219158 108.53667943 17 115 C25.11477205 120.5901763 32.22755161 121.78001298 42 121 C49.02848286 119.39071979 54.86045791 115.98277103 59 110 C62.84366961 103.19196992 63.56673816 97.34230215 63.50390625 89.61328125 C63.51332748 88.55263962 63.52274872 87.49199799 63.53245544 86.3992157 C63.56094688 83.036777 63.56418863 79.67504925 63.5625 76.3125 C63.56611281 72.93934383 63.57567438 69.56669878 63.60325623 66.19364929 C63.61999071 64.10241653 63.62296293 62.01101507 63.61024475 59.91975403 C63.65566831 53.64070227 64.15221807 48.84778193 68.8125 44.1875 C71.66502872 42.63898441 73.74630304 42.13014788 77 42 C81.86476212 43.68777461 85.53982992 46.44089004 88 51 C88.70629317 54.66895293 88.65408747 58.26168283 88.59375 61.98828125 C88.59379028 63.0460527 88.59383057 64.10382416 88.59387207 65.19364929 C88.58852213 67.42693026 88.57096213 69.66021108 88.54199219 71.89331055 C88.50026656 75.29079549 88.50091712 78.68628717 88.5078125 82.08398438 C88.49731429 84.2604303 88.4843728 86.43686608 88.46875 88.61328125 C88.46854858 89.61982254 88.46834717 90.62636383 88.46813965 91.66340637 C88.36358411 97.97786578 87.32819089 103.13965516 85 109 C84.69578125 109.9075 84.3915625 110.815 84.078125 111.75 C79.70543526 123.63051551 70.35805199 134.28139891 59 140 C45.26297035 145.81182024 31.23494626 147.06343726 17 142 C9.38765026 138.68444469 2.61995158 134.1611321 -3 128 C-3 127.34 -3 126.68 -3 126 C-3.46148437 126.42410156 -3.92296875 126.84820313 -4.3984375 127.28515625 C-17.40248418 138.97851838 -29.58261167 145.39592785 -47.3046875 145.2109375 C-61.24157147 144.41538598 -73.57082742 138.25811083 -83 128 C-91.18789699 117.71413653 -94.7737117 107.79756707 -95.9375 94.875 C-96.79481757 85.59540229 -98.85155825 78.74653194 -105.6875 72.0625 C-111.44708591 67.46350862 -118.57637902 65.34126933 -125.94140625 65.7265625 C-134.94002953 66.92182555 -140.94774363 70.16959638 -147 77 C-151.45155094 82.91490609 -152.22515284 89.73882089 -152 97 C-150.76494157 105.24163988 -147.24589082 111.80019822 -140.57421875 116.828125 C-133.48256872 121.02622488 -127.34207674 121.54587669 -119.31933594 121.04296875 C-114.36930465 120.76397095 -111.32391502 121.23531494 -107 124 C-104.02341693 127.47268024 -103.44620312 130.62485991 -103.6640625 135.07421875 C-104.2467799 138.41468015 -105.43663923 139.8117652 -108 142 C-116.52701161 146.64768984 -127.44373362 146.10397797 -136.625 143.875 C-150.50131379 139.48763608 -160.6523867 132.45076096 -168.39453125 120.1015625 C-173.06829169 111.07244866 -174.65986833 103.84294669 -174.5625 93.625 C-174.58634766 92.48289062 -174.61019531 91.34078125 -174.63476562 90.1640625 C-174.61127186 76.38105467 -169.07389238 66.36410335 -159.71484375 56.62109375 C-149.21308933 46.51877215 -136.46989452 42.17798148 -122 42 C-106.98814836 43.04869339 -95.08550715 49.4484207 -84.8125 60.1875 C-76.9945881 69.33180414 -73.27833514 79.49686445 -72.625 91.3125 C-72.04227777 99.83604725 -69.96508145 108.18934837 -63.87109375 114.49609375 C-56.78576012 120.19098613 -49.34605521 121.83256517 -40.375 121.48828125 C-32.99371406 120.42038687 -26.59874658 116.91267417 -22 111 C-15.18234628 101.80141656 -16.32236501 91.210423 -16.3984375 80.328125 C-16.39293077 78.31653995 -16.38480026 76.30496053 -16.37417603 74.293396 C-16.35138081 69.02178031 -16.35547826 63.75058086 -16.36798096 58.47894287 C-16.38635006 50.02867598 -16.37630683 41.57864996 -16.34212112 33.12844086 C-16.33602864 30.18466175 -16.34925792 27.24140635 -16.36410522 24.29766846 C-16.36115711 22.49043646 -16.35750236 20.68320543 -16.35302734 18.87597656 C-16.36696281 17.65552391 -16.36696281 17.65552391 -16.38117981 16.41041565 C-16.3387174 10.33974027 -15.02950855 6.20346642 -10.8125 1.625 C-7.16832227 -0.48052491 -4.05703151 -0.93501898 0 0 Z " fill="currentColor" transform="translate(344,658)"></path><path d="M0 0 C3.08193978 1.6281946 5.26420667 3.03009062 7.375 5.8125 C8.72789093 10.54761825 8.5517493 13.91693656 6.3125 18.3125 C3.81094957 21.21970726 2.72680887 22.23769819 -1 23 C-6.21719088 23 -8.0130355 22.88196828 -11.9375 19.375 C-14.21641897 15.64585986 -15 13.36120395 -15 9 C-12.12542611 2.13296238 -7.40758075 -1.03966046 0 0 Z " fill="currentColor" transform="translate(388,818)"></path></g></svg>',
            'eitaa' => '<svg height="18" viewBox="5.312 -.192 501.099 512.323" width="18" xmlns="http://www.w3.org/2000/svg" fill="currentColor" aria-hidden="true"><path d="m127.317 510.763a141.312 141.312 0 0 1 -49.749-17.707c-34.56-19.819-60.352-55.317-68.629-94.421-3.221-15.296-3.627-34.624-3.2-153.749.405-128.193.106-121.579 6.208-142.699 3.029-10.517 11.456-28.587 17.557-37.696 22.507-33.494 55.616-54.998 96.64-62.784 8.192-1.557 20.053-1.707 129.195-1.707 133.355 0 128.96-.192 150.741 6.699a145.216 145.216 0 0 1 92.032 89.259c7.04 19.989 7.381 23.189 7.872 75.84l.427 47.573-8.341 5.717c-11.904 8.128-27.52 22.613-49.408 45.867-25.216 26.795-50.688 51.627-63.616 62.016-27.925 22.421-53.504 35.221-79.488 39.765-13.525 2.347-35.883 1.429-49.109-2.027-11.797-3.072-11.029-3.584-15.488 9.899a135.573 135.573 0 0 0 -6.784 32.981l-.661 8.683-3.115-.64c-25.92-5.141-51.605-27.413-61.525-53.333a76.437 76.437 0 0 1 -5.547-26.005l-.341-7.253-6.592-6.059c-13.739-12.587-22.677-27.989-25.493-43.968-4.523-25.451 7.253-54.229 32.811-80.128 26.965-27.371 66.709-48.853 105.664-57.173 14.037-2.987 38.784-3.776 51.264-1.6 24.277 4.224 44.096 16.491 56.427 34.965 3.883 5.781 4.16 6.613 3.776 11.84a17.323 17.323 0 0 1 -3.904 10.517c-9.92 13.888-39.424 28.757-71.168 35.84-56 12.48-91.605-3.029-86.037-37.525.555-3.477.853-6.485.661-6.677-.683-.683-6.251 2.219-12.267 6.4-10.219 7.125-19.264 20.992-22.4 34.283-.768 3.328-1.067 8.661-.725 13.867.427 7.061 1.131 9.685 4.096 15.701 1.963 3.968 5.867 9.6 8.704 12.565l5.12 5.355-2.048 2.603a103.36 103.36 0 0 0 -14.443 25.963 77.547 77.547 0 0 0 -2.24 38.72c2.197 9.835 8.981 23.36 15.765 31.317 5.163 6.08 17.003 16.299 18.901 16.299.512 0 .939-1.024.939-2.261.021-4.907 3.925-20.757 6.955-28.309 9.024-22.571 28.821-41.813 60.16-58.453 5.227-2.773 20.309-10.027 33.536-16.149 29.013-13.44 44.864-21.653 53.568-27.84 25.088-17.771 40.597-44.053 45.653-77.333 1.835-12.16 1.835-34.859 0-47.083-7.851-52.011-46.827-87.381-102.784-93.227-62.4-6.549-141.824 41.664-190.763 115.776-23.808 36.053-39.893 76.053-46.656 116.117-2.624 15.531-3.605 44.373-1.984 58.667 4.117 36.352 17.536 65.664 40.597 88.661a139.328 139.328 0 0 0 39.893 28.011c50.517 24.107 106.453 24.64 155.627 1.515 21.248-10.005 42.112-25.515 64.491-48 21.76-21.867 36.48-40.107 76.629-95.104 22.187-30.357 39.765-50.517 48.469-55.573l3.2-1.835-.405 65.941c-.384 63.851-.469 66.283-2.624 75.968-12.8 57.131-54.187 98.901-110.827 111.829l-9.984 2.283-123.2.213c-100.992.171-124.8-.043-132.053-1.195z" fill="#e37600"/></svg>',
            'rubika' => '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 495.37 543.04" width="18" height="18" fill="currentColor" aria-hidden="true"><path d="M246.07,0h1.76c.48,42.73-.25,128.44-.25,128.44-40.86-22.92-82-45.3-122.84-68.29q40.13-22.81,80.32-45.51c12.69-7.16,26.33-13.31,41-14.64Z" fill="#b8ce01"/><path d="M247.73,0h3C266.62,1.43,281,9,294.67,16.68Q332.91,38.25,371.05,60c-41,22.73-82.45,45.82-123.51,68.48-.35-42.73.63-85.77.15-128.5Z" fill="#7db425"/><path d="M124.77,60.11,247.61,128.4,123.92,200.66s-.06-45.85.08-68.71C123.89,108.21,124.77,60.11,124.77,60.11Z" fill="#f6a925"/><path d="M371.19,60l.35.19c-.1,42.59,0,85.18,0,127.77-.07,4.17-.11,12.77-.11,12.77L247.62,128.45S330.2,82.76,371.23,60Z" fill="#35ac9d"/><path d="M371.44,60.21c27.28,15.51,54.37,31.36,81.47,47.17,13.11,7.36,27,15.52,34.16,29.39-38.38,21.25-115.68,64-115.68,64s-.06-8.61,0-12.78q0-63.89,0-127.77Z" fill="#59d6bd"/><path d="M46.5,105c25.65-15,78.19-44.88,78.19-44.88L124,200.66S47,158.21,8.71,137C17.05,122.13,32.11,113.12,46.5,105Z" fill="#ef7414"/><path d="M247.5,128.44l123.81,72.3s-39.84,22-59.62,32.64c-21.14,12-64.09,35.82-64.09,35.82L123.94,200.66Z" fill="#fff"/><path d="M0,193C.11,174.17-.23,154.15,8.66,137,47,158.21,123.92,200.66,123.92,200.66,82.55,224.58,41.38,248.86,0,272.81,0,246.21,0,219.62,0,193Z" fill="#e74b50"/><path d="M487.07,136.77c7.54,14.1,8.64,30.5,8.22,46.19v90.11L371.41,200.76S448.69,158,487.07,136.77Z" fill="#794387"/><path d="M123.92,200.66c.19-.08,123.66,68.54,123.66,68.54s0,71.69.07,106.76c.2,11.29-.07,34.11-.07,34.11-41.27-22.78-82.32-45.76-123.6-68.54l-.07-.31V200.66Z" fill="#e4e4e4"/><path d="M0,272.81c41.35-24,82.52-48.23,123.89-72.15q-.06,70.29,0,140.56c-6.35-2.65-12.13-6.43-18.19-9.64C70.5,312.21,35.38,292.39,0,273.21v-.4Z" fill="#794387"/><path d="M371.39,200.76v86.18c-.13,18.27.46,36.47,0,54.73-41.21,22.4-123.82,68.4-123.82,68.4s.27-22.82.07-34.11c0-35.07-.07-106.76-.07-106.76Z" fill="#f1f1f1"/><path d="M371.39,200.76s123.88,72.14,123.88,72.31c-41.17,22.82-123.87,68.6-123.87,68.6h0c.46-18.26-.13-36.46,0-54.73V200.76Z" fill="#4c3683"/><path d="M0,273.21c35.36,19.21,70.43,39,105.7,58.4,6.06,3.21,11.84,7,18.19,9.64l.07.31Q67,374.79,10,408.05C6,402,4,394.86,2.53,387.8.14,376,0,364,0,352v-78.8Z" fill="#4c3683"/><path d="M495.27,273.07c.06,27.65,0,55.3,0,82.95.4,17.73-.12,36.62-9.57,52.25-34.2-20-114.33-66.6-114.33-66.6S454.1,295.89,495.27,273.07Z" fill="#e74b50"/><path d="M10,408Q67,374.72,124,341.53c-.25,46.83.08,93.67-.16,140.49q-40.35-22.75-80.49-45.86C30.82,428.76,18,420.53,10,408Z" fill="#0f68a0"/><path d="M124,341.53c41.28,22.78,82.33,45.76,123.6,68.54-41.2,24-123.7,72-123.76,71.95.24-46.82-.09-93.66.16-140.49Z" fill="#49bdca"/><path d="M371.2,341.76l.2-.09c.12,46.84-.25,93.69.19,140.53l-.31.15c-32.66-19.51-65.71-38.4-98.52-57.68-8.26-4.7-25.18-14.6-25.18-14.6S330,364.21,371.2,341.76Z" fill="#f6a925"/><path d="M371.4,341.67h0c3.65,2.49,80.13,46.62,114.33,66.6-4.86,8.3-12.56,14.39-20.32,19.84-12.52,8.42-25.88,15.47-38.9,23.05-18.31,10.35-36.5,20.91-54.92,31-.44-46.84-.07-93.69-.19-140.53Z" fill="#ef7414"/><path d="M247.58,410.07V543c-10.25-1.51-21.42-3.87-30.5-9.08C186,516.66,154.81,499.5,123.82,482,165,458,206.38,434.12,247.58,410.07Z" fill="#7db425"/><path d="M247.58,410.07s16.92,9.9,25.18,14.6c32.81,19.28,65.86,38.17,98.52,57.68q-47.79,26.44-95.57,53A62.47,62.47,0,0,1,249.84,543h-2.26Z" fill="#b8ce01"/><path d="M602.83,233.66" fill="#f1f1f1"/></svg>',
        );

        return isset($icons[$messenger]) ? $icons[$messenger] : '';
    }
}

if (!function_exists('icodito_ps_get_messenger_color')) {
    function icodito_ps_get_messenger_color($messenger)
    {
        $colors = array(
            'whatsapp' => '#25D366',
            'telegram' => '#0088cc',
            'bale' => '#00bcd4',
            'eitaa' => '#f39c12',
            'rubika' => '#8e44ad',
        );

        return isset($colors[$messenger]) ? $colors[$messenger] : '#00bcd4';
    }
}

if (!function_exists('icodito_ps_validate_identifier')) {
    function icodito_ps_validate_identifier($messenger, $value)
    {
        $value = trim($value);

        if (empty($value)) {
            return false;
        }

        switch ($messenger) {
            case 'whatsapp':
                $value = preg_replace('/[^0-9]/', '', $value);
                return preg_match('/^[0-9]{10,15}$/', $value) ? $value : false;

            case 'telegram':
            case 'eitaa':
            case 'rubika':
                $value = ltrim($value, '@');
                return preg_match('/^[a-zA-Z0-9_]{3,32}$/', $value) ? $value : false;

            case 'bale':
                $clean = ltrim($value, '@');
                if (preg_match('/^[a-zA-Z0-9_]{3,32}$/', $clean)) {
                    return $clean;
                }
                $phone = preg_replace('/[^0-9]/', '', $value);
                if (preg_match('/^[0-9]{10,15}$/', $phone)) {
                    return $phone;
                }
                return false;

            default:
                return false;
        }
    }
}


if (!function_exists('icodito_ps_build_link')) {
    function icodito_ps_build_link($messenger, $identifier)
    {
        $identifier = trim($identifier);

        switch ($messenger) {
            case 'whatsapp':
                $number = preg_replace('/[^0-9]/', '', $identifier);
                return 'https://wa.me/' . $number;

            case 'telegram':
                $username = ltrim($identifier, '@');
                return 'https://t.me/' . $username;

            case 'bale':
                $username = ltrim($identifier, '@');
                return 'https://ble.ir/' . $username;

            case 'eitaa':
                $username = ltrim($identifier, '@');
                return 'https://eitaa.com/s/' . $username;

            case 'rubika':
                $username = ltrim($identifier, '@');
                return 'https://rubika.ir/' . $username;

            default:
                return '';
        }
    }
}

if (!function_exists('icodito_ps_get_main_categories')) {
    function icodito_ps_get_main_categories()
    {
        $terms = get_terms(array(
            'taxonomy' => 'product_cat',
            'hide_empty' => false,
            'parent' => 0,
            'orderby' => 'name',
            'order' => 'ASC',
        ));

        if (is_wp_error($terms) || empty($terms)) {
            return array();
        }

        return $terms;
    }
}

if (!function_exists('icodito_ps_get_global_settings')) {
    function icodito_ps_get_global_settings()
    {
        $defaults = array(
            'auto_display' => true,
            'show_on_out_of_stock' => false,
        );

        $settings = get_option(ICODITO_PS_GLOBAL_OPTION_KEY, array());
        if (!is_array($settings)) {
            $settings = array();
        }

        return wp_parse_args($settings, $defaults);
    }
}

if (!function_exists('icodito_ps_get_style_settings')) {
    function icodito_ps_get_style_settings()
    {
        $presets = icodito_ps_get_button_presets();
        $default_preset = $presets['default']['style'];

        $defaults = array_merge(
            array('preset' => 'default'),
            $default_preset
        );

        $settings = get_option(ICODITO_PS_STYLE_OPTION_KEY, array());

        if (empty($settings)) {
            $old_global = get_option(ICODITO_PS_GLOBAL_OPTION_KEY, array());
            if (is_array($old_global) && !empty($old_global['button_color'])) {
                $settings = array(
                    'preset' => 'custom',
                    'text_color' => !empty($old_global['button_text_color']) ? $old_global['button_text_color'] : '#ffffff',
                    'bg_color' => $old_global['button_color'],
                    'bg_color_2' => $old_global['button_color'],
                    'bg_type' => 'solid',
                    'border_color' => $old_global['button_color'],
                    'border_width' => 0,
                    'border_radius' => !empty($old_global['button_border_radius']) ? absint($old_global['button_border_radius']) : 12,
                    'padding_y' => !empty($old_global['button_padding_y']) ? absint($old_global['button_padding_y']) : 14,
                    'padding_x' => !empty($old_global['button_padding_x']) ? absint($old_global['button_padding_x']) : 24,
                    'font_size' => !empty($old_global['button_font_size']) ? absint($old_global['button_font_size']) : 15,
                    'font_weight' => !empty($old_global['button_font_weight']) ? $old_global['button_font_weight'] : '600',
                    'shadow' => '0 4px 14px rgba(99,102,241,.35)',
                    'hover_bg_color' => '#4f46e5',
                    'hover_bg_color_2' => '#4f46e5',
                    'hover_text_color' => '#ffffff',
                    'hover_shadow' => '0 8px 22px rgba(99,102,241,.45)',
                );
            }
        }

        if (!is_array($settings)) {
            $settings = array();
        }

        return wp_parse_args($settings, $defaults);
    }
}

if (!function_exists('icodito_ps_get_settings')) {
    function icodito_ps_get_settings()
    {
        $settings = get_option(ICODITO_PS_OPTION_KEY, array());
        return is_array($settings) ? $settings : array();
    }
}

if (!function_exists('icodito_ps_get_category_settings')) {
    function icodito_ps_get_category_settings($cat_id)
    {
        $settings = icodito_ps_get_settings();
        $key = 'cat_' . absint($cat_id);

        if (!isset($settings[$key]) || !is_array($settings[$key])) {
            return array(
                'enabled' => false,
                'messenger' => 'whatsapp',
                'identifier' => '',
                'button_text' => 'ارتباط با پشتیبانی محصول',
                'position' => 'after_cart',
            );
        }

        $cat_settings = $settings[$key];

        return array(
            'enabled' => !empty($cat_settings['enabled']),
            'messenger' => isset($cat_settings['messenger']) ? sanitize_key($cat_settings['messenger']) : 'whatsapp',
            'identifier' => isset($cat_settings['identifier']) ? sanitize_text_field($cat_settings['identifier']) : '',
            'button_text' => isset($cat_settings['button_text']) && !empty($cat_settings['button_text'])
                ? sanitize_text_field($cat_settings['button_text'])
                : 'ارتباط با پشتیبانی محصول',
            'position' => isset($cat_settings['position']) ? sanitize_key($cat_settings['position']) : 'after_cart',
        );
    }
}

if (!function_exists('icodito_ps_is_category_support_valid')) {
    function icodito_ps_is_category_support_valid($cat_id)
    {
        $settings = icodito_ps_get_category_settings($cat_id);

        if (empty($settings['enabled'])) {
            return false;
        }

        if (empty($settings['identifier'])) {
            return false;
        }

        $validated = icodito_ps_validate_identifier($settings['messenger'], $settings['identifier']);
        return !empty($validated);
    }
}

if (!function_exists('icodito_ps_get_product_main_categories')) {
    function icodito_ps_get_product_main_categories($product_id)
    {
        $terms = wp_get_post_terms($product_id, 'product_cat', array('fields' => 'ids'));

        if (is_wp_error($terms) || empty($terms)) {
            return array();
        }

        $main_categories = array();

        foreach ($terms as $term_id) {
            $ancestors = get_ancestors($term_id, 'product_cat', 'taxonomy');

            if (!empty($ancestors)) {
                $main_id = end($ancestors);
            } else {
                $main_id = $term_id;
            }

            $main_id = absint($main_id);

            if (!in_array($main_id, $main_categories, true)) {
                $main_categories[] = $main_id;
            }
        }

        return array_unique($main_categories);
    }
}

if (!function_exists('icodito_ps_resolve_product_support')) {
    function icodito_ps_resolve_product_support($product_id)
    {
        $product_id = absint($product_id);
        $product = wc_get_product($product_id);

        if (!$product) {
            return false;
        }

        $product_enabled = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'enabled', true);

        if ($product_enabled === 'yes') {
            $p_messenger = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'messenger', true);
            $p_identifier = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'identifier', true);
            $p_button_text = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'button_text', true);

            $p_messenger = !empty($p_messenger) ? sanitize_key($p_messenger) : 'whatsapp';
            $p_identifier = !empty($p_identifier) ? sanitize_text_field($p_identifier) : '';
            $p_button_text = !empty($p_button_text) ? sanitize_text_field($p_button_text) : 'ارتباط با پشتیبانی محصول';

            $validated = icodito_ps_validate_identifier($p_messenger, $p_identifier);

            if (!empty($validated)) {
                return array(
                    'messenger' => $p_messenger,
                    'identifier' => $validated,
                    'button_text' => $p_button_text,
                    'source' => 'product',
                );
            }

            return false;
        }

        $reference_cat = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'reference_category', true);
        $reference_cat = absint($reference_cat);

        if ($reference_cat > 0 && icodito_ps_is_category_support_valid($reference_cat)) {
            $cat_settings = icodito_ps_get_category_settings($reference_cat);
            return array(
                'messenger' => $cat_settings['messenger'],
                'identifier' => $cat_settings['identifier'],
                'button_text' => $cat_settings['button_text'],
                'source' => 'category_reference',
            );
        }

        $main_categories = icodito_ps_get_product_main_categories($product_id);

        if (!empty($main_categories)) {
            sort($main_categories, SORT_NUMERIC);

            foreach ($main_categories as $cat_id) {
                if (icodito_ps_is_category_support_valid($cat_id)) {
                    $cat_settings = icodito_ps_get_category_settings($cat_id);
                    return array(
                        'messenger' => $cat_settings['messenger'],
                        'identifier' => $cat_settings['identifier'],
                        'button_text' => $cat_settings['button_text'],
                        'source' => 'category_auto',
                    );
                }
            }
        }

        return false;
    }
}

if (!function_exists('icodito_ps_add_submenu')) {
    function icodito_ps_add_submenu()
    {
        add_submenu_page(
            'edit.php?post_type=product',
            'پشتیبانی محصول',
            'پشتیبانی محصول',
            'manage_woocommerce',
            'icodito-product-support',
            'icodito_ps_render_settings_page'
        );
    }
}
add_action('admin_menu', 'icodito_ps_add_submenu', 20);

if (!function_exists('icodito_ps_render_settings_page')) {
    function icodito_ps_render_settings_page()
    {
        if (!current_user_can('manage_woocommerce')) {
            wp_die('شما دسترسی لازم برای مشاهده این صفحه را ندارید.');
        }

        if (isset($_POST['icodito_ps_global_save']) && check_admin_referer('icodito_ps_global_settings', 'icodito_ps_global_nonce')) {
            $global = array(
                'auto_display' => isset($_POST['icodito_ps_global']['auto_display']) ? true : false,
                'show_on_out_of_stock' => isset($_POST['icodito_ps_global']['show_on_out_of_stock']) ? true : false,
            );
            update_option(ICODITO_PS_GLOBAL_OPTION_KEY, $global);

            echo '<div class="ips-toast ips-toast-success">
                    <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>
                    <span>تنظیمات عمومی با موفقیت ذخیره شد</span>
                  </div>';
        }

        if (isset($_POST['icodito_ps_style_save']) && check_admin_referer('icodito_ps_style_settings', 'icodito_ps_style_nonce')) {
            $s = isset($_POST['icodito_ps_style']) ? wp_unslash($_POST['icodito_ps_style']) : array();

            $style = array(
                'preset' => isset($s['preset']) ? sanitize_key($s['preset']) : 'default',
                'text_color' => isset($s['text_color']) ? sanitize_hex_color($s['text_color']) : '#ffffff',
                'bg_color' => isset($s['bg_color']) ? sanitize_hex_color($s['bg_color']) : '#6366f1',
                'bg_color_2' => isset($s['bg_color_2']) ? sanitize_hex_color($s['bg_color_2']) : '#6366f1',
                'bg_type' => isset($s['bg_type']) && in_array($s['bg_type'], array('solid', 'gradient'), true) ? $s['bg_type'] : 'solid',
                'border_color' => isset($s['border_color']) ? sanitize_hex_color($s['border_color']) : 'transparent',
                'border_width' => isset($s['border_width']) ? absint($s['border_width']) : 0,
                'border_radius' => isset($s['border_radius']) ? absint($s['border_radius']) : 12,
                'padding_y' => isset($s['padding_y']) ? absint($s['padding_y']) : 14,
                'padding_x' => isset($s['padding_x']) ? absint($s['padding_x']) : 24,
                'font_size' => isset($s['font_size']) ? absint($s['font_size']) : 15,
                'font_weight' => isset($s['font_weight']) ? sanitize_key($s['font_weight']) : '600',
                'shadow' => isset($s['shadow']) ? sanitize_text_field($s['shadow']) : 'none',
                'hover_bg_color' => isset($s['hover_bg_color']) ? sanitize_hex_color($s['hover_bg_color']) : '#4f46e5',
                'hover_bg_color_2' => isset($s['hover_bg_color_2']) ? sanitize_hex_color($s['hover_bg_color_2']) : '#4f46e5',
                'hover_text_color' => isset($s['hover_text_color']) ? sanitize_hex_color($s['hover_text_color']) : '#ffffff',
                'hover_shadow' => isset($s['hover_shadow']) ? sanitize_text_field($s['hover_shadow']) : 'none',
            );

            update_option(ICODITO_PS_STYLE_OPTION_KEY, $style);

            echo '<div class="ips-toast ips-toast-success">
                    <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>
                    <span>استایل دکمه با موفقیت ذخیره شد</span>
                  </div>';
        }

        if (isset($_POST['icodito_ps_save']) && check_admin_referer('icodito_ps_save_settings', 'icodito_ps_nonce')) {
            $new_settings = array();
            $categories = icodito_ps_get_main_categories();

            foreach ($categories as $cat) {
                $key = 'cat_' . $cat->term_id;
                $new_settings[$key] = array(
                    'enabled' => isset($_POST['icodito_ps'][$key]['enabled']) ? true : false,
                    'messenger' => isset($_POST['icodito_ps'][$key]['messenger'])
                        ? sanitize_key(wp_unslash($_POST['icodito_ps'][$key]['messenger'])) : 'whatsapp',
                    'identifier' => isset($_POST['icodito_ps'][$key]['identifier'])
                        ? sanitize_text_field(wp_unslash($_POST['icodito_ps'][$key]['identifier'])) : '',
                    'button_text' => isset($_POST['icodito_ps'][$key]['button_text'])
                        ? sanitize_text_field(wp_unslash($_POST['icodito_ps'][$key]['button_text'])) : 'ارتباط با پشتیبانی محصول',
                    'position' => isset($_POST['icodito_ps'][$key]['position'])
                        ? sanitize_key(wp_unslash($_POST['icodito_ps'][$key]['position'])) : 'after_cart',
                );
            }

            update_option(ICODITO_PS_OPTION_KEY, $new_settings);

            echo '<div class="ips-toast ips-toast-success">
                    <svg viewBox="0 0 24 24" width="20" height="20" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>
                    <span>تنظیمات دسته‌بندی‌ها ذخیره شد</span>
                  </div>';
        }

        $categories = icodito_ps_get_main_categories();
        $messengers = icodito_ps_get_messengers();
        $global = icodito_ps_get_global_settings();
        $style = icodito_ps_get_style_settings();
        $presets = icodito_ps_get_button_presets();

        $total_cats = count($categories);
        $active_cats = 0;
        $valid_cats = 0;
        foreach ($categories as $cat) {
            if (icodito_ps_is_category_support_valid($cat->term_id)) {
                $active_cats++;
                $valid_cats++;
            } elseif (icodito_ps_get_category_settings($cat->term_id)['enabled']) {
                $active_cats++;
            }
        }
        ?>

        <!-- ================= استایل صفحه ================= -->
        <style>
            .ips-wrap {
                --ips-primary: #6366f1;
                --ips-primary-dark: #4f46e5;
                --ips-primary-light: #818cf8;
                --ips-primary-soft: #eef2ff;
                --ips-success: #10b981;
                --ips-success-soft: #ecfdf5;
                --ips-warning: #f59e0b;
                --ips-warning-soft: #fffbeb;
                --ips-danger: #ef4444;
                --ips-danger-soft: #fef2f2;
                --ips-ink-900: #0f172a;
                --ips-ink-700: #334155;
                --ips-ink-500: #64748b;
                --ips-ink-400: #94a3b8;
                --ips-ink-300: #cbd5e1;
                --ips-bg: #f8fafc;
                --ips-white: #ffffff;
                --ips-border: #e2e8f0;
                --ips-radius-sm: 8px;
                --ips-radius: 12px;
                --ips-radius-lg: 16px;
                --ips-shadow-sm: 0 1px 2px rgba(15, 23, 42, .04);
                --ips-shadow: 0 4px 12px rgba(15, 23, 42, .06);
                --ips-shadow-lg: 0 12px 32px rgba(15, 23, 42, .10);
                --ips-transition: all .22s cubic-bezier(.4, 0, .2, 1);

                max-width: 1240px;
                margin: 24px 20px 40px 0;
                direction: rtl;
                text-align: right;
                font-family: 'Vazirmatn', 'Segoe UI', Tahoma, Arial, sans-serif;
                color: var(--ips-ink-900);
                font-size: 14px;
                line-height: 1.7;
            }

            .ips-wrap * {
                box-sizing: border-box;
            }

            /* ============ هدر ============ */
            .ips-header {
                position: relative;
                overflow: hidden;
                padding: 32px 36px;
                margin-bottom: 24px;
                background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 50%, #a855f7 100%);
                border-radius: var(--ips-radius-lg);
                box-shadow: var(--ips-shadow-lg);
                color: #fff;
            }

            .ips-header::before,
            .ips-header::after {
                content: '';
                position: absolute;
                border-radius: 50%;
                background: rgba(255, 255, 255, .08);
            }

            .ips-header::before {
                top: -60px;
                left: -60px;
                width: 220px;
                height: 220px;
            }

            .ips-header::after {
                bottom: -80px;
                right: 30%;
                width: 180px;
                height: 180px;
                background: rgba(255, 255, 255, .06);
            }

            .ips-header-inner {
                position: relative;
                z-index: 1;
                display: flex;
                align-items: center;
                gap: 20px;
            }

            .ips-header-icon {
                flex: 0 0 64px;
                width: 64px;
                height: 64px;
                display: flex;
                align-items: center;
                justify-content: center;
                background: rgba(255, 255, 255, .15);
                border: 1px solid rgba(255, 255, 255, .25);
                border-radius: 18px;
                backdrop-filter: blur(8px);
            }

            .ips-header-icon svg {
                width: 32px;
                height: 32px;
                stroke: #fff;
            }

            .ips-header-text h1 {
                margin: 0 0 6px;
                font-size: 24px;
                font-weight: 800;
                color: #fff;
                letter-spacing: -.3px;
            }

            .ips-header-text p {
                margin: 0;
                font-size: 14px;
                line-height: 1.9;
                color: rgba(255, 255, 255, .85);
                max-width: 720px;
            }

            /* ============ تب‌ها ============ */
            .ips-tabs {
                display: flex;
                gap: 4px;
                padding: 6px;
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: 14px;
                margin-bottom: 20px;
                box-shadow: var(--ips-shadow-sm);
            }

            .ips-tab {
                flex: 1;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                padding: 12px 18px;
                background: transparent;
                border: none;
                border-radius: 10px;
                font-size: 14px;
                font-weight: 600;
                color: var(--ips-ink-500);
                cursor: pointer;
                transition: var(--ips-transition);
                font-family: inherit;
            }

            .ips-tab:hover {
                color: var(--ips-ink-900);
                background: var(--ips-bg);
            }

            .ips-tab.is-active {
                background: linear-gradient(135deg, var(--ips-primary), var(--ips-primary-dark));
                color: #fff;
                box-shadow: 0 4px 12px rgba(99, 102, 241, .35);
            }

            .ips-tab svg {
                width: 16px;
                height: 16px;
            }

            .ips-tab-panel {
                display: none;
            }

            .ips-tab-panel.is-active {
                display: block;
            }

            /* ============ کارت بخش ============ */
            .ips-section {
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: var(--ips-radius-lg);
                padding: 26px 28px;
                margin-bottom: 20px;
            }

            .ips-section-title {
                display: flex;
                align-items: center;
                gap: 10px;
                margin: 0 0 6px;
                font-size: 16px;
                font-weight: 800;
                color: var(--ips-ink-900);
            }

            .ips-section-title svg {
                width: 20px;
                height: 20px;
                color: var(--ips-primary);
            }

            .ips-section-desc {
                margin: 0 0 20px;
                font-size: 13px;
                color: var(--ips-ink-500);
                line-height: 1.9;
            }

            /* ============ سوییچ ============ */
            .ips-switch-row {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 16px;
                padding: 14px 18px;
                background: var(--ips-bg);
                border: 1px solid var(--ips-border);
                border-radius: 12px;
                transition: var(--ips-transition);
                margin-bottom: 10px;
            }

            .ips-switch-row:last-child {
                margin-bottom: 0;
            }

            .ips-switch-row:hover {
                border-color: #c7d2fe;
                background: #fbfcff;
            }

            .ips-switch-text {
                display: flex;
                flex-direction: column;
                gap: 2px;
            }

            .ips-switch-title {
                font-size: 14px;
                font-weight: 700;
                color: var(--ips-ink-900);
            }

            .ips-switch-sub {
                font-size: 12px;
                color: var(--ips-ink-500);
            }

            .ips-switch {
                position: relative;
                display: inline-block;
                flex-shrink: 0;
                width: 44px;
                height: 26px;
                cursor: pointer;
            }

            .ips-switch input {
                opacity: 0;
                width: 0;
                height: 0;
                position: absolute;
            }

            .ips-switch-track {
                position: absolute;
                inset: 0;
                background: #cbd5e1;
                border-radius: 26px;
                transition: var(--ips-transition);
            }

            .ips-switch-track::after {
                content: '';
                position: absolute;
                top: 3px;
                right: 3px;
                width: 20px;
                height: 20px;
                background: #fff;
                border-radius: 50%;
                transition: var(--ips-transition);
                box-shadow: 0 2px 4px rgba(0, 0, 0, .15);
            }

            .ips-switch input:checked+.ips-switch-track {
                background: linear-gradient(135deg, var(--ips-primary), #8b5cf6);
            }

            .ips-switch input:checked+.ips-switch-track::after {
                transform: translateX(-18px);
            }

            .ips-switch input:focus-visible+.ips-switch-track {
                box-shadow: 0 0 0 4px rgba(99, 102, 241, .2);
            }

            /* ============ پریست‌های دکمه ============ */
            .ips-presets-grid {
                display: grid;
                grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
                gap: 12px;
                margin-bottom: 24px;
            }

            .ips-preset {
                position: relative;
                display: flex;
                flex-direction: column;
                align-items: stretch;
                gap: 10px;
                padding: 12px;
                background: var(--ips-white);
                border: 2px solid var(--ips-border);
                border-radius: 12px;
                cursor: pointer;
                transition: var(--ips-transition);
            }

            .ips-preset:hover {
                border-color: var(--ips-primary-light);
                transform: translateY(-2px);
                box-shadow: var(--ips-shadow);
            }

            .ips-preset input {
                position: absolute;
                opacity: 0;
                width: 0;
                height: 0;
            }

            .ips-preset.is-selected {
                border-color: var(--ips-primary);
                box-shadow: 0 0 0 4px rgba(99, 102, 241, .10);
            }

            .ips-preset-preview {
                display: flex;
                align-items: center;
                justify-content: center;
                height: 60px;
                border-radius: 8px;
                background: #f8fafc;
                position: relative;
                overflow: hidden;
            }

            .ips-preset-preview-btn {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 4px;
                padding: 8px 16px;
                border-radius: 8px;
                font-size: 11px;
                font-weight: 700;
                line-height: 1;
                pointer-events: none;
            }

            .ips-preset-info {
                display: flex;
                flex-direction: column;
                gap: 2px;
            }

            .ips-preset-label {
                font-size: 13px;
                font-weight: 700;
                color: var(--ips-ink-900);
            }

            .ips-preset-desc {
                font-size: 11px;
                color: var(--ips-ink-500);
            }

            .ips-preset-check {
                position: absolute;
                top: 8px;
                left: 8px;
                width: 20px;
                height: 20px;
                display: none;
                align-items: center;
                justify-content: center;
                background: var(--ips-primary);
                color: #fff;
                border-radius: 50%;
                box-shadow: 0 2px 6px rgba(99, 102, 241, .4);
            }

            .ips-preset.is-selected .ips-preset-check {
                display: flex;
            }

            .ips-preset-check svg {
                width: 12px;
                height: 12px;
            }

            /* ============ لی‌اوت استایل ============ */
            .ips-style-layout {
                display: grid;
                grid-template-columns: 1fr 340px;
                gap: 22px;
                align-items: start;
            }

            /* ============ گروه‌های فیلد ============ */
            .ips-field-group {
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: 12px;
                margin-bottom: 14px;
                overflow: hidden;
            }

            .ips-field-group-head {
                display: flex;
                align-items: center;
                gap: 8px;
                padding: 12px 16px;
                background: #fafbff;
                border-bottom: 1px solid var(--ips-border);
                font-size: 13px;
                font-weight: 700;
                color: var(--ips-ink-900);
                cursor: pointer;
                user-select: none;
            }

            .ips-field-group-head svg {
                width: 15px;
                height: 15px;
                color: var(--ips-primary);
            }

            .ips-field-group-head .ips-group-arrow {
                margin-right: auto;
                transition: transform .25s ease;
                color: var(--ips-ink-400);
            }

            .ips-field-group.is-open .ips-group-arrow {
                transform: rotate(180deg);
            }

            .ips-field-group-body {
                display: none;
                padding: 16px;
            }

            .ips-field-group.is-open .ips-field-group-body {
                display: block;
            }

            /* ============ گرید فیلد ============ */
            .ips-field-grid {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 12px;
            }

            .ips-field-grid .ips-field {
                gap: 6px;
            }

            .ips-field-grid .ips-field-full {
                grid-column: 1 / -1;
            }

            .ips-field {
                display: flex;
                flex-direction: column;
                gap: 6px;
            }

            .ips-field-label {
                font-size: 12px;
                font-weight: 600;
                color: var(--ips-ink-700);
                display: flex;
                align-items: center;
                gap: 5px;
            }

            .ips-field-label small {
                font-weight: 400;
                color: var(--ips-ink-400);
                font-size: 11px;
            }

            /* ============ رنگ‌پیکر مینیمال ============ */
            .ips-color-input {
                display: flex;
                align-items: center;
                gap: 8px;
                padding: 5px 10px 5px 5px;
                background: var(--ips-white);
                border: 1.5px solid var(--ips-border);
                border-radius: 9px;
                transition: var(--ips-transition);
                height: 38px;
            }

            .ips-color-input:focus-within {
                border-color: var(--ips-primary);
                box-shadow: 0 0 0 3px rgba(99, 102, 241, .12);
            }

            .ips-color-input input[type="color"] {
                width: 28px;
                height: 28px;
                padding: 0;
                border: 1px solid var(--ips-border);
                border-radius: 7px;
                cursor: pointer;
                background: transparent;
                flex-shrink: 0;
            }

            .ips-color-input input[type="color"]::-webkit-color-swatch-wrapper {
                padding: 2px;
            }

            .ips-color-input input[type="color"]::-webkit-color-swatch {
                border: none;
                border-radius: 5px;
            }

            .ips-color-input input[type="text"] {
                flex: 1;
                border: none;
                outline: none;
                background: transparent;
                font-family: 'Menlo', 'Consolas', monospace;
                font-size: 12px;
                color: var(--ips-ink-700);
                direction: ltr;
                text-align: left;
                padding: 0;
                min-width: 0;
            }

            /* ============ ورودی فشرده عددی ============ */
            .ips-size-input {
                display: inline-flex;
                align-items: center;
                background: var(--ips-white);
                border: 1.5px solid var(--ips-border);
                border-radius: 9px;
                overflow: hidden;
                transition: var(--ips-transition);
                height: 38px;
            }

            .ips-size-input:focus-within {
                border-color: var(--ips-primary);
                box-shadow: 0 0 0 3px rgba(99, 102, 241, .12);
            }

            .ips-size-input input {
                border: none;
                outline: none;
                background: transparent;
                padding: 0 10px;
                font-size: 13px;
                font-family: inherit;
                color: var(--ips-ink-900);
                width: 100%;
                min-width: 0;
                text-align: center;
                font-weight: 600;
            }

            .ips-size-input input::-webkit-outer-spin-button,
            .ips-size-input input::-webkit-inner-spin-button {
                -webkit-appearance: none;
                margin: 0;
            }

            .ips-size-input input[type=number] {
                -moz-appearance: textfield;
            }

            .ips-size-unit {
                padding: 0 10px;
                font-size: 11px;
                color: var(--ips-ink-400);
                background: #f8fafc;
                border-right: 1px solid var(--ips-border);
                align-self: stretch;
                display: flex;
                align-items: center;
                font-weight: 600;
                flex-shrink: 0;
            }

            .ips-select-mini {
                width: 100%;
                padding: 9px 32px 9px 12px;
                background: var(--ips-white);
                border: 1.5px solid var(--ips-border);
                border-radius: 9px;
                font-size: 13px;
                color: var(--ips-ink-900);
                font-family: inherit;
                appearance: none;
                -webkit-appearance: none;
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
                background-repeat: no-repeat;
                background-position: left 10px center;
                background-size: 14px;
                transition: var(--ips-transition);
                height: 38px;
                cursor: pointer;
            }

            .ips-select-mini:hover {
                border-color: var(--ips-ink-300);
            }

            .ips-select-mini:focus {
                outline: none;
                border-color: var(--ips-primary);
                box-shadow: 0 0 0 3px rgba(99, 102, 241, .12);
            }

            .ips-radio-pills {
                display: flex;
                gap: 6px;
                padding: 4px;
                background: var(--ips-bg);
                border-radius: 10px;
                border: 1px solid var(--ips-border);
                height: 38px;
            }

            .ips-radio-pill {
                flex: 1;
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 5px;
                padding: 0 12px;
                background: transparent;
                border: none;
                border-radius: 7px;
                font-size: 12px;
                font-weight: 600;
                color: var(--ips-ink-500);
                cursor: pointer;
                transition: var(--ips-transition);
                font-family: inherit;
            }

            .ips-radio-pill input {
                position: absolute;
                opacity: 0;
            }

            .ips-radio-pill.is-active {
                background: var(--ips-white);
                color: var(--ips-primary);
                box-shadow: 0 2px 6px rgba(15, 23, 42, .08);
            }

            .ips-radio-pill svg {
                width: 13px;
                height: 13px;
            }

            /* ============ پیش‌نمایش زنده ============ */
            .ips-preview-sticky {
                position: sticky;
                top: 40px;
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: var(--ips-radius-lg);
                overflow: hidden;
                box-shadow: var(--ips-shadow);
            }

            .ips-preview-head {
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding: 14px 18px;
                background: linear-gradient(135deg, #fafbff, #f5f3ff);
                border-bottom: 1px solid var(--ips-border);
            }

            .ips-preview-head-title {
                display: flex;
                align-items: center;
                gap: 8px;
                font-size: 13px;
                font-weight: 800;
                color: var(--ips-ink-900);
            }

            .ips-preview-head-title svg {
                width: 15px;
                height: 15px;
                color: var(--ips-primary);
            }

            .ips-preview-badge {
                display: inline-flex;
                align-items: center;
                gap: 4px;
                padding: 3px 8px;
                background: var(--ips-success-soft);
                color: #047857;
                border-radius: 20px;
                font-size: 10px;
                font-weight: 700;
            }

            .ips-preview-badge::before {
                content: '';
                width: 5px;
                height: 5px;
                border-radius: 50%;
                background: currentColor;
                animation: ips-pulse 1.8s ease-in-out infinite;
            }

            @keyframes ips-pulse {

                0%,
                100% {
                    opacity: 1;
                }

                50% {
                    opacity: .3;
                }
            }

            .ips-preview-canvas {
                padding: 40px 24px;
                display: flex;
                align-items: center;
                justify-content: center;
                min-height: 180px;
                background:
                    linear-gradient(45deg, #f8fafc 25%, transparent 25%),
                    linear-gradient(-45deg, #f8fafc 25%, transparent 25%),
                    linear-gradient(45deg, transparent 75%, #f8fafc 75%),
                    linear-gradient(-45deg, transparent 75%, #f8fafc 75%);
                background-size: 20px 20px;
                background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
                background-color: #fff;
            }

            .ips-preview-btn {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                text-decoration: none;
                cursor: pointer;
                transition: all .25s cubic-bezier(.4, 0, .2, 1);
                font-family: 'Vazirmatn', Tahoma, sans-serif;
                white-space: nowrap;
                max-width: 100%;
            }

            .ips-preview-btn:hover {
                transform: translateY(-2px);
            }

            .ips-preview-btn svg {
                width: 1.1em;
                height: 1.1em;
                flex-shrink: 0;
            }

            .ips-preview-info {
                padding: 12px 18px;
                border-top: 1px solid var(--ips-border);
                background: #fafbff;
                font-size: 11px;
                color: var(--ips-ink-500);
                text-align: center;
                line-height: 1.8;
            }

            /* ============ Empty/Toast ============ */
            .ips-empty {
                text-align: center;
                padding: 60px 20px;
                background: var(--ips-white);
                border: 2px dashed var(--ips-border);
                border-radius: var(--ips-radius);
            }

            .ips-empty-icon {
                width: 72px;
                height: 72px;
                margin: 0 auto 16px;
                display: flex;
                align-items: center;
                justify-content: center;
                background: var(--ips-primary-soft);
                border-radius: 50%;
                color: var(--ips-primary);
            }

            .ips-empty-icon svg {
                width: 32px;
                height: 32px;
            }

            .ips-empty h3 {
                margin: 0 0 8px;
                font-size: 17px;
                color: var(--ips-ink-900);
            }

            .ips-empty p {
                margin: 0;
                color: var(--ips-ink-500);
                font-size: 14px;
            }

            .ips-toast {
                position: fixed;
                top: 40px;
                left: 50%;
                transform: translateX(-50%) translateY(-20px);
                display: inline-flex;
                align-items: center;
                gap: 10px;
                padding: 14px 24px;
                background: #fff;
                border-radius: 12px;
                box-shadow: 0 20px 40px rgba(15, 23, 42, .15);
                font-size: 14px;
                font-weight: 600;
                z-index: 99999;
                opacity: 0;
                animation: ips-toast-in .5s ease forwards, ips-toast-out .4s ease 3.5s forwards;
                border: 1px solid var(--ips-border);
                color: #047857;
            }

            .ips-toast svg {
                color: var(--ips-success);
            }

            @keyframes ips-toast-in {
                to {
                    opacity: 1;
                    transform: translateX(-50%) translateY(0);
                }
            }

            @keyframes ips-toast-out {
                to {
                    opacity: 0;
                    transform: translateX(-50%) translateY(-20px);
                }
            }

            /* ============ دکمه ذخیره ============ */
            .ips-btn-save {
                display: inline-flex;
                align-items: center;
                gap: 8px;
                padding: 11px 26px;
                background: linear-gradient(135deg, var(--ips-primary), var(--ips-primary-dark));
                color: #fff;
                border: none;
                border-radius: 10px;
                font-size: 14px;
                font-weight: 700;
                cursor: pointer;
                transition: var(--ips-transition);
                box-shadow: 0 4px 14px rgba(99, 102, 241, .4);
                font-family: inherit;
            }

            .ips-btn-save:hover {
                transform: translateY(-1px);
                box-shadow: 0 8px 22px rgba(99, 102, 241, .5);
            }

            .ips-btn-save:active {
                transform: translateY(0);
            }

            .ips-btn-save svg {
                width: 16px;
                height: 16px;
            }

            .ips-form-actions {
                display: flex;
                justify-content: flex-end;
                gap: 10px;
                margin-top: 20px;
                padding-top: 20px;
                border-top: 1px solid var(--ips-border);
            }

            /* ============ راهنمای شورت‌کد ============ */
            .ips-shortcode-guide {
                background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
                border: 1px solid #bae6fd;
                border-radius: var(--ips-radius);
                padding: 24px;
                margin-bottom: 24px;
            }

            .ips-shortcode-guide h2 {
                margin: 0 0 6px;
                font-size: 16px;
                font-weight: 800;
                color: #0c4a6e;
                display: flex;
                align-items: center;
                gap: 8px;
            }

            .ips-shortcode-guide h2 svg {
                width: 18px;
                height: 18px;
                color: #0284c7;
            }

            .ips-shortcode-guide>p {
                margin: 0 0 16px;
                font-size: 13px;
                color: #075985;
                line-height: 1.9;
            }

            .ips-shortcode-main {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 12px 16px;
                background: #fff;
                border: 1.5px dashed #7dd3fc;
                border-radius: 10px;
                margin-bottom: 16px;
                flex-wrap: wrap;
            }

            .ips-shortcode-main code {
                flex: 1;
                min-width: 200px;
                padding: 8px 12px;
                background: #f0f9ff;
                border: 1px solid #bae6fd;
                border-radius: 8px;
                font-family: 'Menlo', 'Consolas', monospace;
                font-size: 13px;
                color: #0c4a6e;
                direction: ltr;
                text-align: left;
                user-select: all;
                cursor: text;
            }

            .ips-copy-btn {
                display: inline-flex;
                align-items: center;
                gap: 6px;
                padding: 8px 14px;
                background: linear-gradient(135deg, #0ea5e9, #0284c7);
                color: #fff;
                border: none;
                border-radius: 8px;
                font-size: 12px;
                font-weight: 700;
                cursor: pointer;
                transition: var(--ips-transition);
                font-family: inherit;
            }

            .ips-copy-btn:hover {
                transform: translateY(-1px);
            }

            .ips-copy-btn.is-copied {
                background: linear-gradient(135deg, #10b981, #059669);
            }

            .ips-copy-btn svg {
                width: 14px;
                height: 14px;
            }

            /* ============ آمار ============ */
            .ips-stats {
                display: grid;
                grid-template-columns: repeat(3, 1fr);
                gap: 16px;
                margin-bottom: 24px;
            }

            .ips-stat {
                display: flex;
                align-items: center;
                gap: 16px;
                padding: 18px 20px;
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: var(--ips-radius);
                transition: var(--ips-transition);
            }

            .ips-stat:hover {
                transform: translateY(-2px);
                box-shadow: var(--ips-shadow);
                border-color: transparent;
            }

            .ips-stat-icon {
                flex: 0 0 44px;
                width: 44px;
                height: 44px;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 12px;
            }

            .ips-stat-icon svg {
                width: 20px;
                height: 20px;
            }

            .ips-stat-icon.primary {
                background: var(--ips-primary-soft);
                color: var(--ips-primary);
            }

            .ips-stat-icon.success {
                background: var(--ips-success-soft);
                color: var(--ips-success);
            }

            .ips-stat-icon.warning {
                background: var(--ips-warning-soft);
                color: var(--ips-warning);
            }

            .ips-stat-content {
                display: flex;
                flex-direction: column;
                gap: 2px;
            }

            .ips-stat-value {
                font-size: 24px;
                font-weight: 800;
                line-height: 1.2;
                color: var(--ips-ink-900);
                letter-spacing: -.5px;
            }

            .ips-stat-label {
                font-size: 12px;
                color: var(--ips-ink-500);
                font-weight: 500;
            }

            /* ============ کارت‌های دسته‌بندی ============ */
            .ips-cards {
                display: flex;
                flex-direction: column;
                gap: 12px;
            }

            .ips-card {
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: var(--ips-radius);
                overflow: hidden;
                transition: var(--ips-transition);
            }

            .ips-card:hover {
                border-color: #c7d2fe;
            }

            .ips-card.is-open {
                border-color: var(--ips-primary-light);
                box-shadow: 0 0 0 4px rgba(99, 102, 241, .06), var(--ips-shadow);
            }

            .ips-card.is-enabled {
                border-right: 4px solid var(--ips-primary);
            }

            .ips-card-head {
                display: flex;
                align-items: center;
                gap: 14px;
                padding: 16px 20px;
                cursor: pointer;
                user-select: none;
                transition: var(--ips-transition);
                background: var(--ips-white);
            }

            .ips-card-head:hover {
                background: #fbfcff;
            }

            .ips-card-avatar {
                flex: 0 0 44px;
                width: 44px;
                height: 44px;
                display: flex;
                align-items: center;
                justify-content: center;
                background: linear-gradient(135deg, #eef2ff, #f5f3ff);
                border-radius: 12px;
                color: var(--ips-primary);
                transition: var(--ips-transition);
            }

            .ips-card.is-enabled .ips-card-avatar {
                background: linear-gradient(135deg, var(--ips-primary), #a855f7);
                color: #fff;
                box-shadow: 0 4px 12px rgba(99, 102, 241, .35);
            }

            .ips-card-avatar svg {
                width: 20px;
                height: 20px;
            }

            .ips-card-info {
                flex: 1;
                min-width: 0;
            }

            .ips-card-name {
                font-size: 15px;
                font-weight: 700;
                color: var(--ips-ink-900);
                display: flex;
                align-items: center;
                gap: 8px;
                margin-bottom: 4px;
            }

            .ips-card-meta {
                display: flex;
                align-items: center;
                gap: 10px;
                font-size: 12px;
                color: var(--ips-ink-500);
                flex-wrap: wrap;
            }

            .ips-meta-item {
                display: inline-flex;
                align-items: center;
                gap: 4px;
            }

            .ips-meta-item svg {
                width: 12px;
                height: 12px;
            }

            .ips-badge {
                display: inline-flex;
                align-items: center;
                gap: 5px;
                padding: 4px 10px;
                border-radius: 20px;
                font-size: 11px;
                font-weight: 700;
                line-height: 1;
                white-space: nowrap;
            }

            .ips-badge::before {
                content: '';
                width: 6px;
                height: 6px;
                border-radius: 50%;
                background: currentColor;
            }

            .ips-badge.on {
                background: var(--ips-success-soft);
                color: #047857;
            }

            .ips-badge.off {
                background: #f1f5f9;
                color: var(--ips-ink-500);
            }

            .ips-badge.warn {
                background: var(--ips-warning-soft);
                color: #b45309;
            }

            .ips-messenger-pill {
                display: inline-flex;
                align-items: center;
                gap: 5px;
                padding: 3px 10px;
                border-radius: 20px;
                font-size: 11px;
                font-weight: 700;
                background: var(--ips-primary-soft);
                color: var(--ips-primary);
            }

            .ips-caret {
                flex: 0 0 28px;
                width: 28px;
                height: 28px;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 8px;
                color: var(--ips-ink-400);
                transition: var(--ips-transition);
            }

            .ips-card.is-open .ips-caret {
                background: var(--ips-primary-soft);
                color: var(--ips-primary);
            }

            .ips-card.is-open .ips-caret svg {
                transform: rotate(180deg);
            }

            .ips-caret svg {
                width: 16px;
                height: 16px;
                transition: transform .3s ease;
            }

            .ips-card-body {
                display: grid;
                grid-template-rows: 0fr;
                transition: grid-template-rows .3s ease;
            }

            .ips-card.is-open .ips-card-body {
                grid-template-rows: 1fr;
            }

            .ips-card-body-inner {
                overflow: hidden;
            }

            .ips-card-body-pad {
                padding: 22px;
                border-top: 1px solid var(--ips-border);
                background: linear-gradient(180deg, #fbfcff 0%, #fff 100%);
            }

            .ips-form-grid-2 {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 16px;
            }

            .ips-field-full {
                grid-column: 1 / -1;
            }

            .ips-input,
            .ips-select {
                width: 100%;
                padding: 11px 14px;
                border: 1.5px solid var(--ips-border);
                border-radius: 10px;
                font-size: 14px;
                background: var(--ips-white);
                color: var(--ips-ink-900);
                transition: var(--ips-transition);
                font-family: inherit;
                box-shadow: var(--ips-shadow-sm);
            }

            .ips-input:hover,
            .ips-select:hover {
                border-color: var(--ips-ink-300);
            }

            .ips-input:focus,
            .ips-select:focus {
                outline: none;
                border-color: var(--ips-primary);
                box-shadow: 0 0 0 4px rgba(99, 102, 241, .12);
            }

            .ips-select {
                appearance: none;
                -webkit-appearance: none;
                background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
                background-repeat: no-repeat;
                background-position: left 12px center;
                background-size: 16px;
                padding-left: 38px;
            }

            .ips-identifier-wrap {
                position: relative;
            }

            .ips-identifier-status {
                position: absolute;
                left: 12px;
                top: 50%;
                transform: translateY(-50%);
                width: 20px;
                height: 20px;
                display: flex;
                align-items: center;
                justify-content: center;
                border-radius: 50%;
                pointer-events: none;
            }

            .ips-identifier-status svg {
                width: 14px;
                height: 14px;
            }

            .ips-identifier-status.valid {
                background: var(--ips-success-soft);
                color: var(--ips-success);
            }

            .ips-identifier-status.invalid {
                background: var(--ips-danger-soft);
                color: var(--ips-danger);
            }

            .ips-identifier-wrap .ips-input {
                padding-left: 40px;
            }

            .ips-hint {
                font-size: 12px;
                color: var(--ips-ink-500);
                line-height: 1.7;
                display: flex;
                align-items: flex-start;
                gap: 5px;
            }

            .ips-hint svg {
                width: 13px;
                height: 13px;
                margin-top: 3px;
                flex-shrink: 0;
                color: var(--ips-ink-400);
            }

            .ips-toolbar {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 16px;
                margin-bottom: 16px;
                padding: 12px 16px;
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: var(--ips-radius);
            }

            .ips-search {
                position: relative;
                flex: 1;
                max-width: 380px;
            }

            .ips-search svg {
                position: absolute;
                right: 12px;
                top: 50%;
                transform: translateY(-50%);
                width: 16px;
                height: 16px;
                color: var(--ips-ink-400);
                pointer-events: none;
            }

            .ips-search input {
                width: 100%;
                padding: 9px 40px 9px 14px;
                border: 1px solid var(--ips-border);
                border-radius: 10px;
                font-size: 13px;
                background: var(--ips-bg);
                color: var(--ips-ink-900);
                transition: var(--ips-transition);
                font-family: inherit;
            }

            .ips-search input:focus {
                outline: none;
                border-color: var(--ips-primary);
                background: #fff;
                box-shadow: 0 0 0 3px rgba(99, 102, 241, .10);
            }

            .ips-toolbar-actions {
                display: flex;
                gap: 6px;
            }

            .ips-btn-ghost {
                display: inline-flex;
                align-items: center;
                gap: 5px;
                padding: 8px 12px;
                background: var(--ips-white);
                border: 1px solid var(--ips-border);
                border-radius: 9px;
                color: var(--ips-ink-700);
                font-size: 12px;
                font-weight: 600;
                cursor: pointer;
                transition: var(--ips-transition);
                font-family: inherit;
            }

            .ips-btn-ghost:hover {
                border-color: var(--ips-primary);
                color: var(--ips-primary);
                background: var(--ips-primary-soft);
            }

            .ips-btn-ghost svg {
                width: 13px;
                height: 13px;
            }

            .ips-save-bar {
                position: sticky;
                bottom: 20px;
                margin-top: 24px;
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 16px;
                padding: 14px 20px;
                background: rgba(255, 255, 255, .85);
                backdrop-filter: blur(12px);
                -webkit-backdrop-filter: blur(12px);
                border: 1px solid var(--ips-border);
                border-radius: 16px;
                box-shadow: var(--ips-shadow-lg);
                z-index: 100;
            }

            .ips-save-info {
                display: flex;
                align-items: center;
                gap: 10px;
                font-size: 13px;
                color: var(--ips-ink-500);
            }

            .ips-save-info svg {
                width: 16px;
                height: 16px;
                color: var(--ips-warning);
            }

            @media (max-width: 1100px) {
                .ips-style-layout {
                    grid-template-columns: 1fr;
                }

                .ips-preview-sticky {
                    position: relative;
                    top: 0;
                }
            }

            @media (max-width: 900px) {
                .ips-stats {
                    grid-template-columns: 1fr;
                }

                .ips-form-grid-2 {
                    grid-template-columns: 1fr;
                }

                .ips-field-grid {
                    grid-template-columns: 1fr;
                }
            }

            @media (max-width: 782px) {
                .ips-wrap {
                    margin: 16px 10px 24px;
                }

                .ips-header {
                    padding: 24px 22px;
                }

                .ips-header-inner {
                    flex-direction: column;
                    align-items: flex-start;
                }

                .ips-header-text h1 {
                    font-size: 19px;
                }

                .ips-tabs {
                    flex-direction: column;
                }

                .ips-section {
                    padding: 18px;
                }

                .ips-presets-grid {
                    grid-template-columns: repeat(2, 1fr);
                }

                .ips-toolbar {
                    flex-direction: column;
                    align-items: stretch;
                }

                .ips-search {
                    max-width: 100%;
                }

                .ips-save-bar {
                    padding: 12px 14px;
                    flex-direction: column;
                    align-items: stretch;
                }

                .ips-btn-save {
                    width: 100%;
                    justify-content: center;
                }
            }

            .ips-card.ips-hidden {
                display: none;
            }
        </style>

        <div class="wrap ips-wrap">

            <!-- ================= هدر ================= -->
            <div class="ips-header">
                <div class="ips-header-inner">
                    <div class="ips-header-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                            stroke-linejoin="round">
                            <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
                        </svg>
                    </div>
                    <div class="ips-header-text">
                        <h1>سیستم پشتیبانی محصولات</h1>
                        <p>مدیریت کامل پشتیبانی محصولات ووکامرس با پشتیبانی از ۵ پیام‌رسان، استایل‌های حرفه‌ای و شورت‌کد
                            اختصاصی.</p>
                    </div>
                </div>
            </div>

            <!-- ================= باکس حمایت ================= -->
            <?php icodito_ps_author_support_box(); ?>

            <!-- ================= تب‌ها ================= -->
            <div class="ips-tabs">
                <button type="button" class="ips-tab is-active" data-tab="general">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                        stroke-linejoin="round">
                        <circle cx="12" cy="12" r="3" />
                        <path
                            d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" />
                    </svg>
                    تنظیمات عمومی
                </button>
                <button type="button" class="ips-tab" data-tab="style">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                        stroke-linejoin="round">
                        <path d="M12 20h9" />
                        <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4 12.5-12.5z" />
                    </svg>
                    استایل دکمه
                </button>
            </div>

            <!-- ================= تب: تنظیمات عمومی ================= -->
            <div class="ips-tab-panel is-active" data-panel="general">
                <form method="post" action="">
                    <?php wp_nonce_field('icodito_ps_global_settings', 'icodito_ps_global_nonce'); ?>

                    <div class="ips-section">
                        <h2 class="ips-section-title">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                stroke-linejoin="round">
                                <circle cx="12" cy="12" r="10" />
                                <line x1="12" y1="8" x2="12" y2="12" />
                                <line x1="12" y1="16" x2="12.01" y2="16" />
                            </svg>
                            تنظیمات کلی سیستم
                        </h2>
                        <p class="ips-section-desc">پیکربندی رفتار کلی دکمه پشتیبانی در فروشگاه.</p>

                        <div class="ips-switch-row">
                            <div class="ips-switch-text">
                                <span class="ips-switch-title">نمایش خودکار در صفحه محصول</span>
                                <span class="ips-switch-sub">اگر غیرفعال شود، دکمه فقط با شورت‌کد یا ویجت المنتور نمایش داده
                                    می‌شود.</span>
                            </div>
                            <label class="ips-switch">
                                <input type="checkbox" name="icodito_ps_global[auto_display]" value="1" <?php checked($global['auto_display']); ?>>
                                <span class="ips-switch-track"></span>
                            </label>
                        </div>

                        <div class="ips-switch-row">
                            <div class="ips-switch-text">
                                <span class="ips-switch-title">نمایش در محصولات ناموجود</span>
                                <span class="ips-switch-sub">در صورت فعال بودن، دکمه در محصولات ناموجود نیز نمایش داده
                                    می‌شود.</span>
                            </div>
                            <label class="ips-switch">
                                <input type="checkbox" name="icodito_ps_global[show_on_out_of_stock]" value="1" <?php checked($global['show_on_out_of_stock']); ?>>
                                <span class="ips-switch-track"></span>
                            </label>
                        </div>

                        <div class="ips-form-actions">
                            <button type="submit" name="icodito_ps_global_save" class="ips-btn-save">
                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"
                                    stroke-linecap="round" stroke-linejoin="round">
                                    <path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z" />
                                    <polyline points="17 21 17 13 7 13 7 21" />
                                    <polyline points="7 3 7 8 15 8" />
                                </svg>
                                ذخیره تنظیمات
                            </button>
                        </div>
                    </div>
                </form>

                <!-- ================= راهنمای شورت‌کد ================= -->
                <div class="ips-shortcode-guide">
                    <h2>
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                            stroke-linejoin="round">
                            <polyline points="16 18 22 12 16 6" />
                            <polyline points="8 6 2 12 8 18" />
                        </svg>
                        راهنمای شورت‌کد
                    </h2>
                    <p>برای نمایش دستی دکمه در برگه، نوشته یا ابزارک، از شورت‌کد زیر استفاده کنید.</p>
                    <div class="ips-shortcode-main">
                        <code id="ips-main-shortcode">[icodito_product_support]</code>
                        <button type="button" class="ips-copy-btn" data-copy-target="ips-main-shortcode">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
                                stroke-linejoin="round">
                                <rect x="9" y="9" width="13" height="13" rx="2" ry="2" />
                                <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
                            </svg>
                            کپی
                        </button>
                    </div>
                </div>
            </div>

            <!-- ================= تب: استایل دکمه ================= -->
            <div class="ips-tab-panel" data-panel="style">
                <form method="post" action="" id="ips-style-form">
                    <?php wp_nonce_field('icodito_ps_style_settings', 'icodito_ps_style_nonce'); ?>

                    <!-- پریست‌ها -->
                    <div class="ips-section">
                        <h2 class="ips-section-title">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                stroke-linejoin="round">
                                <polygon
                                    points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2" />
                            </svg>
                            انتخاب استایل پیش‌فرض
                        </h2>
                        <p class="ips-section-desc">یک استایل آماده انتخاب کنید یا مقادیر را به صورت دستی شخصی‌سازی کنید.
                            تغییرات به صورت لحظه‌ای در پیش‌نمایش نمایش داده می‌شود.</p>

                        <div class="ips-presets-grid">
                            <?php foreach ($presets as $p_key => $p_data): ?>
                                <label class="ips-preset <?php echo $style['preset'] === $p_key ? 'is-selected' : ''; ?>"
                                    data-preset="<?php echo esc_attr($p_key); ?>"
                                    data-style="<?php echo esc_attr(wp_json_encode($p_data['style'])); ?>">
                                    <input type="radio" name="icodito_ps_style[preset]" value="<?php echo esc_attr($p_key); ?>"
                                        <?php checked($style['preset'], $p_key); ?>>
                                    <div class="ips-preset-preview">
                                        <span class="ips-preset-preview-btn"
                                            style="background:<?php echo esc_attr($p_data['preview_bg']); ?>; color:<?php echo esc_attr($p_data['preview_color']); ?>; border:1px solid <?php echo esc_attr($p_data['preview_border']); ?>;">
                                            دکمه نمونه
                                        </span>
                                    </div>
                                    <div class="ips-preset-info">
                                        <span class="ips-preset-label"><?php echo esc_html($p_data['label']); ?></span>
                                        <span class="ips-preset-desc"><?php echo esc_html($p_data['description']); ?></span>
                                    </div>
                                    <span class="ips-preset-check">
                                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3"
                                            stroke-linecap="round" stroke-linejoin="round">
                                            <polyline points="20 6 9 17 4 12" />
                                        </svg>
                                    </span>
                                </label>
                            <?php endforeach; ?>
                        </div>
                    </div>

                    <!-- لی‌اوت شخصی‌سازی + پیش‌نمایش -->
                    <div class="ips-style-layout">

                        <!-- ============ فرم شخصی‌سازی ============ -->
                        <div class="ips-style-form">

                            <!-- رنگ‌ها -->
                            <div class="ips-field-group is-open">
                                <div class="ips-field-group-head">
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                        stroke-linecap="round" stroke-linejoin="round">
                                        <circle cx="13.5" cy="6.5" r="2.5" />
                                        <circle cx="17.5" cy="14.5" r="2.5" />
                                        <circle cx="8.5" cy="7.5" r="2.5" />
                                        <circle cx="6.5" cy="14.5" r="2.5" />
                                    </svg>
                                    رنگ‌بندی
                                    <span class="ips-group-arrow">
                                        <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor"
                                            stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                                            <polyline points="6 9 12 15 18 9" />
                                        </svg>
                                    </span>
                                </div>
                                <div class="ips-field-group-body">
                                    <div class="ips-field-grid">
                                        <div class="ips-field">
                                            <label class="ips-field-label">رنگ متن</label>
                                            <div class="ips-color-input">
                                                <input type="color" value="<?php echo esc_attr($style['text_color']); ?>"
                                                    data-target="ips-field-text-color">
                                                <input type="text" id="ips-field-text-color" name="icodito_ps_style[text_color]"
                                                    value="<?php echo esc_attr($style['text_color']); ?>" maxlength="7"
                                                    data-color-picker="true">
                                            </div>
                                        </div>

                                        <div class="ips-field">
                                            <label class="ips-field-label">رنگ پس‌زمینه</label>
                                            <div class="ips-color-input">
                                                <input type="color" value="<?php echo esc_attr($style['bg_color']); ?>"
                                                    data-target="ips-field-bg-color">
                                                <input type="text" id="ips-field-bg-color" name="icodito_ps_style[bg_color]"
                                                    value="<?php echo esc_attr($style['bg_color']); ?>" maxlength="7"
                                                    data-color-picker="true">
                                            </div>
                                        </div>

                                        <div class="ips-field ips-field-full" id="ips-bg-color-2-wrap"
                                            style="<?php echo $style['bg_type'] === 'gradient' ? '' : 'display:none;'; ?>">
                                            <label class="ips-field-label">رنگ دوم گرادیانت</label>
                                            <div class="ips-color-input">
                                                <input type="color" value="<?php echo esc_attr($style['bg_color_2']); ?>"
                                                    data-target="ips-field-bg-color-2">
                                                <input type="text" id="ips-field-bg-color-2" name="icodito_ps_style[bg_color_2]"
                                                    value="<?php echo esc_attr($style['bg_color_2']); ?>" maxlength="7"
                                                    data-color-picker="true">
                                            </div>
                                        </div>

                                        <div class="ips-field ips-field-full">
                                            <label class="ips-field-label">نوع پس‌زمینه</label>
                                            <div class="ips-radio-pills">
                                                <label
                                                    class="ips-radio-pill <?php echo $style['bg_type'] === 'solid' ? 'is-active' : ''; ?>">
                                                    <input type="radio" name="icodito_ps_style[bg_type]" value="solid" <?php checked($style['bg_type'], 'solid'); ?>>
                                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                                        stroke-linecap="round" stroke-linejoin="round">
                                                        <rect x="3" y="3" width="18" height="18" rx="2" />
                                                    </svg>
                                                    تخت
                                                </label>
                                                <label
                                                    class="ips-radio-pill <?php echo $style['bg_type'] === 'gradient' ? 'is-active' : ''; ?>">
                                                    <input type="radio" name="icodito_ps_style[bg_type]" value="gradient" <?php checked($style['bg_type'], 'gradient'); ?>>
                                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                                        stroke-linecap="round" stroke-linejoin="round">
                                                        <defs>
                                                            <linearGradient id="ips-grad-icon" x1="0" x2="1" y1="0" y2="1">
                                                                <stop offset="0" stop-color="currentColor" stop-opacity="1" />
                                                                <stop offset="1" stop-color="currentColor" stop-opacity=".3" />
                                                            </linearGradient>
                                                        </defs>
                                                        <rect x="3" y="3" width="18" height="18" rx="2"
                                                            fill="url(#ips-grad-icon)" />
                                                    </svg>
                                                    گرادیانت
                                                </label>
                                            </div>
                                        </div>

                                        <div class="ips-field ips-field-full">
                                            <label class="ips-field-label">حاشیه</label>
                                            <div class="ips-field-grid" style="gap:8px;">
                                                <div class="ips-color-input">
                                                    <input type="color"
                                                        value="<?php echo esc_attr($style['border_color'] === 'transparent' ? '#e2e8f0' : $style['border_color']); ?>"
                                                        data-target="ips-field-border-color">
                                                    <input type="text" id="ips-field-border-color"
                                                        name="icodito_ps_style[border_color]"
                                                        value="<?php echo esc_attr($style['border_color']); ?>" maxlength="20"
                                                        data-color-picker="true">
                                                </div>
                                                <div class="ips-size-input">
                                                    <span class="ips-size-unit">ضخامت</span>
                                                    <input type="number" id="ips-field-border-width"
                                                        name="icodito_ps_style[border_width]"
                                                        value="<?php echo esc_attr($style['border_width']); ?>" min="0" max="10"
                                                        step="1">
                                                    <span class="ips-size-unit">px</span>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- اندازه و ابعاد -->
                            <div class="ips-field-group is-open">
                                <div class="ips-field-group-head">
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                        stroke-linecap="round" stroke-linejoin="round">
                                        <rect x="3" y="3" width="18" height="18" rx="2" />
                                        <line x1="3" y1="9" x2="21" y2="9" />
                                    </svg>
                                    اندازه و ابعاد
                                    <span class="ips-group-arrow">
                                        <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor"
                                            stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                                            <polyline points="6 9 12 15 18 9" />
                                        </svg>
                                    </span>
                                </div>
                                <div class="ips-field-group-body">
                                    <div class="ips-field-grid">
                                        <div class="ips-field">
                                            <label class="ips-field-label">گردی گوشه</label>
                                            <div class="ips-size-input">
                                                <input type="number" id="ips-field-border-radius"
                                                    name="icodito_ps_style[border_radius]"
                                                    value="<?php echo esc_attr($style['border_radius']); ?>" min="0" max="100"
                                                    step="1">
                                                <span class="ips-size-unit">px</span>
                                            </div>
                                        </div>

                                        <div class="ips-field">
                                            <label class="ips-field-label">اندازه فونت</label>
                                            <div class="ips-size-input">
                                                <input type="number" id="ips-field-font-size" name="icodito_ps_style[font_size]"
                                                    value="<?php echo esc_attr($style['font_size']); ?>" min="10" max="30"
                                                    step="1">
                                                <span class="ips-size-unit">px</span>
                                            </div>
                                        </div>

                                        <div class="ips-field">
                                            <label class="ips-field-label">پدینگ عمودی</label>
                                            <div class="ips-size-input">
                                                <input type="number" id="ips-field-padding-y" name="icodito_ps_style[padding_y]"
                                                    value="<?php echo esc_attr($style['padding_y']); ?>" min="0" max="50"
                                                    step="1">
                                                <span class="ips-size-unit">px</span>
                                            </div>
                                        </div>

                                        <div class="ips-field">
                                            <label class="ips-field-label">پدینگ افقی</label>
                                            <div class="ips-size-input">
                                                <input type="number" id="ips-field-padding-x" name="icodito_ps_style[padding_x]"
                                                    value="<?php echo esc_attr($style['padding_x']); ?>" min="0" max="80"
                                                    step="1">
                                                <span class="ips-size-unit">px</span>
                                            </div>
                                        </div>

                                        <div class="ips-field ips-field-full">
                                            <label class="ips-field-label">وزن فونت</label>
                                            <select class="ips-select-mini" id="ips-field-font-weight"
                                                name="icodito_ps_style[font_weight]">
                                                <option value="400" <?php selected($style['font_weight'], '400'); ?>>معمولی
                                                    (400)</option>
                                                <option value="500" <?php selected($style['font_weight'], '500'); ?>>متوسط (500)
                                                </option>
                                                <option value="600" <?php selected($style['font_weight'], '600'); ?>>نیمه‌ضخیم
                                                    (600)</option>
                                                <option value="700" <?php selected($style['font_weight'], '700'); ?>>ضخیم (700)
                                                </option>
                                                <option value="800" <?php selected($style['font_weight'], '800'); ?>>خیلی ضخیم
                                                    (800)</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- سایه -->
                            <div class="ips-field-group is-open">
                                <div class="ips-field-group-head">
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                        stroke-linecap="round" stroke-linejoin="round">
                                        <path d="M12 3v18" />
                                        <path d="M3 12h18" />
                                        <circle cx="12" cy="12" r="9" stroke-dasharray="2 2" />
                                    </svg>
                                    سایه‌ها
                                    <span class="ips-group-arrow">
                                        <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor"
                                            stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                                            <polyline points="6 9 12 15 18 9" />
                                        </svg>
                                    </span>
                                </div>
                                <div class="ips-field-group-body">
                                    <div class="ips-field-grid">
                                        <div class="ips-field ips-field-full">
                                            <label class="ips-field-label">سایه عادی</label>
                                            <select class="ips-select-mini" id="ips-field-shadow-preset">
                                                <option value="none">بدون سایه</option>
                                                <option value="soft">ملایم</option>
                                                <option value="medium">متوسط</option>
                                                <option value="strong">قوی</option>
                                                <option value="custom">سفارشی</option>
                                            </select>
                                            <input type="text" id="ips-field-shadow" name="icodito_ps_style[shadow]"
                                                value="<?php echo esc_attr($style['shadow']); ?>" class="ips-input"
                                                style="margin-top:6px; direction:ltr; text-align:left; font-family:'Menlo',monospace; font-size:12px; padding:8px 10px;"
                                                placeholder="0 4px 14px rgba(99,102,241,.35)">
                                        </div>

                                        <div class="ips-field ips-field-full">
                                            <label class="ips-field-label">سایه Hover</label>
                                            <select class="ips-select-mini" id="ips-field-hover-shadow-preset">
                                                <option value="none">بدون سایه</option>
                                                <option value="soft">ملایم</option>
                                                <option value="medium">متوسط</option>
                                                <option value="strong">قوی</option>
                                                <option value="custom">سفارشی</option>
                                            </select>
                                            <input type="text" id="ips-field-hover-shadow" name="icodito_ps_style[hover_shadow]"
                                                value="<?php echo esc_attr($style['hover_shadow']); ?>" class="ips-input"
                                                style="margin-top:6px; direction:ltr; text-align:left; font-family:'Menlo',monospace; font-size:12px; padding:8px 10px;"
                                                placeholder="0 8px 22px rgba(99,102,241,.45)">
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- حالت Hover -->
                            <div class="ips-field-group">
                                <div class="ips-field-group-head">
                                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                        stroke-linecap="round" stroke-linejoin="round">
                                        <path d="M15 3h6v6" />
                                        <path d="M9 21H3v-6" />
                                        <path d="M21 3l-7 7" />
                                        <path d="M3 21l7-7" />
                                    </svg>
                                    حالت Hover (نگه‌داشتن ماوس)
                                    <span class="ips-group-arrow">
                                        <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor"
                                            stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                                            <polyline points="6 9 12 15 18 9" />
                                        </svg>
                                    </span>
                                </div>
                                <div class="ips-field-group-body">
                                    <div class="ips-field-grid">
                                        <div class="ips-field">
                                            <label class="ips-field-label">رنگ متن Hover</label>
                                            <div class="ips-color-input">
                                                <input type="color" value="<?php echo esc_attr($style['hover_text_color']); ?>"
                                                    data-target="ips-field-hover-text">
                                                <input type="text" id="ips-field-hover-text"
                                                    name="icodito_ps_style[hover_text_color]"
                                                    value="<?php echo esc_attr($style['hover_text_color']); ?>" maxlength="7"
                                                    data-color-picker="true">
                                            </div>
                                        </div>

                                        <div class="ips-field">
                                            <label class="ips-field-label">پس‌زمینه Hover</label>
                                            <div class="ips-color-input">
                                                <input type="color" value="<?php echo esc_attr($style['hover_bg_color']); ?>"
                                                    data-target="ips-field-hover-bg">
                                                <input type="text" id="ips-field-hover-bg"
                                                    name="icodito_ps_style[hover_bg_color]"
                                                    value="<?php echo esc_attr($style['hover_bg_color']); ?>" maxlength="7"
                                                    data-color-picker="true">
                                            </div>
                                        </div>

                                        <div class="ips-field ips-field-full" id="ips-hover-bg-2-wrap"
                                            style="<?php echo $style['bg_type'] === 'gradient' ? '' : 'display:none;'; ?>">
                                            <label class="ips-field-label">پس‌زمینه دوم Hover (گرادیانت)</label>
                                            <div class="ips-color-input">
                                                <input type="color" value="<?php echo esc_attr($style['hover_bg_color_2']); ?>"
                                                    data-target="ips-field-hover-bg-2">
                                                <input type="text" id="ips-field-hover-bg-2"
                                                    name="icodito_ps_style[hover_bg_color_2]"
                                                    value="<?php echo esc_attr($style['hover_bg_color_2']); ?>" maxlength="7"
                                                    data-color-picker="true">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>

                        <!-- ============ پیش‌نمایش ============ -->
                        <div class="ips-style-preview">
                            <div class="ips-preview-sticky">
                                <div class="ips-preview-head">
                                    <div class="ips-preview-head-title">
                                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                            stroke-linecap="round" stroke-linejoin="round">
                                            <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" />
                                            <circle cx="12" cy="12" r="3" />
                                        </svg>
                                        پیش‌نمایش زنده
                                    </div>
                                    <span class="ips-preview-badge">Live</span>
                                </div>
                                <div class="ips-preview-canvas">
                                    <a href="#" class="ips-preview-btn" id="ips-preview-btn" onclick="return false;">
                                        <svg viewBox="0 0 24 24" fill="currentColor" width="18" height="18" aria-hidden="true">
                                            <path
                                                d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z" />
                                        </svg>
                                        <span>ارتباط با پشتیبانی محصول</span>
                                    </a>
                                </div>
                                <div class="ips-preview-info">
                                    این پیش‌نمایش دقیقاً همان استایلی است که در فروشگاه اعمال می‌شود.
                                </div>
                            </div>
                        </div>

                    </div>

                    <!-- دکمه ذخیره -->
                    <div class="ips-form-actions"
                        style="background: var(--ips-white); padding: 18px 22px; border-radius: 12px; border: 1px solid var(--ips-border); margin-top: 20px;">
                        <button type="submit" name="icodito_ps_style_save" class="ips-btn-save">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
                                stroke-linejoin="round">
                                <path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z" />
                                <polyline points="17 21 17 13 7 13 7 21" />
                                <polyline points="7 3 7 8 15 8" />
                            </svg>
                            ذخیره استایل
                        </button>
                    </div>

                </form>
            </div>

            <?php if (empty($categories)): ?>
                <div class="ips-empty">
                    <div class="ips-empty-icon">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                            stroke-linejoin="round">
                            <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" />
                        </svg>
                    </div>
                    <h3>هنوز دسته‌بندی اصلی وجود ندارد</h3>
                    <p>ابتدا از بخش «محصولات → دسته‌ها» یک دسته‌بندی اصلی بسازید.</p>
                </div>
            <?php else: ?>

                <div class="ips-stats">
                    <div class="ips-stat">
                        <div class="ips-stat-icon primary">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                stroke-linejoin="round">
                                <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" />
                            </svg>
                        </div>
                        <div class="ips-stat-content">
                            <span class="ips-stat-value"><?php echo esc_html(number_format_i18n($total_cats)); ?></span>
                            <span class="ips-stat-label">دسته‌بندی اصلی</span>
                        </div>
                    </div>
                    <div class="ips-stat">
                        <div class="ips-stat-icon success">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                stroke-linejoin="round">
                                <path d="M20 6L9 17l-5-5" />
                            </svg>
                        </div>
                        <div class="ips-stat-content">
                            <span class="ips-stat-value"><?php echo esc_html(number_format_i18n($valid_cats)); ?></span>
                            <span class="ips-stat-label">پشتیبانی فعال و معتبر</span>
                        </div>
                    </div>
                    <div class="ips-stat">
                        <div class="ips-stat-icon warning">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                stroke-linejoin="round">
                                <circle cx="12" cy="12" r="10" />
                                <line x1="12" y1="8" x2="12" y2="12" />
                                <line x1="12" y1="16" x2="12.01" y2="16" />
                            </svg>
                        </div>
                        <div class="ips-stat-content">
                            <span
                                class="ips-stat-value"><?php echo esc_html(number_format_i18n($active_cats - $valid_cats)); ?></span>
                            <span class="ips-stat-label">نیازمند بررسی</span>
                        </div>
                    </div>
                </div>

                <form method="post" action="" id="ips-settings-form">
                    <?php wp_nonce_field('icodito_ps_save_settings', 'icodito_ps_nonce'); ?>

                    <div class="ips-toolbar">
                        <div class="ips-search">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
                                stroke-linejoin="round">
                                <circle cx="11" cy="11" r="8" />
                                <line x1="21" y1="21" x2="16.65" y2="16.65" />
                            </svg>
                            <input type="text" id="ips-search-input" placeholder="جستجوی دسته‌بندی..." autocomplete="off">
                        </div>
                        <div class="ips-toolbar-actions">
                            <button type="button" class="ips-btn-ghost" id="ips-expand-all">
                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <polyline points="6 9 12 15 18 9" />
                                </svg>
                                باز کردن همه
                            </button>
                            <button type="button" class="ips-btn-ghost" id="ips-collapse-all">
                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
                                    stroke-linejoin="round">
                                    <polyline points="18 15 12 9 6 15" />
                                </svg>
                                بستن همه
                            </button>
                        </div>
                    </div>

                    <div class="ips-cards" id="ips-cards-container">
                        <?php foreach ($categories as $cat):
                            $cat_id = absint($cat->term_id);
                            $settings = icodito_ps_get_category_settings($cat_id);
                            $is_enabled = !empty($settings['enabled']);
                            $is_valid = icodito_ps_is_category_support_valid($cat_id);
                            $child_ids = get_term_children($cat_id, 'product_cat');
                            $all_ids = array_merge(array($cat_id), is_array($child_ids) ? $child_ids : array());
                            $product_count = 0;
                            foreach ($all_ids as $tid) {
                                $term = get_term($tid, 'product_cat');
                                if ($term && !is_wp_error($term)) {
                                    $product_count += (int) $term->count;
                                }
                            }
                            $messenger_label = isset($messengers[$settings['messenger']]) ? $messengers[$settings['messenger']]['label'] : '';
                            ?>
                            <div class="ips-card <?php echo $is_enabled ? 'is-enabled' : ''; ?>"
                                data-name="<?php echo esc_attr(mb_strtolower($cat->name)); ?>">
                                <div class="ips-card-head">
                                    <div class="ips-card-avatar">
                                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                            stroke-linecap="round" stroke-linejoin="round">
                                            <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" />
                                        </svg>
                                    </div>
                                    <div class="ips-card-info">
                                        <div class="ips-card-name">
                                            <?php echo esc_html($cat->name); ?>
                                            <?php if ($is_enabled && $is_valid): ?>
                                                <span class="ips-badge on">فعال</span>
                                            <?php elseif ($is_enabled && !$is_valid): ?>
                                                <span class="ips-badge warn">نیازمند بررسی</span>
                                            <?php else: ?>
                                                <span class="ips-badge off">غیرفعال</span>
                                            <?php endif; ?>
                                        </div>
                                        <div class="ips-card-meta">
                                            <span class="ips-meta-item">
                                                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                                    stroke-linecap="round" stroke-linejoin="round">
                                                    <path d="M6 2L3 6v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2V6l-3-4z" />
                                                    <line x1="3" y1="6" x2="21" y2="6" />
                                                    <path d="M16 10a4 4 0 0 1-8 0" />
                                                </svg>
                                                <?php echo esc_html(number_format_i18n($product_count)); ?> محصول
                                            </span>
                                            <?php if ($is_enabled && $messenger_label): ?>
                                                <span class="ips-messenger-pill"><?php echo esc_html($messenger_label); ?></span>
                                            <?php endif; ?>
                                        </div>
                                    </div>
                                    <div class="ips-caret">
                                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"
                                            stroke-linecap="round" stroke-linejoin="round">
                                            <polyline points="6 9 12 15 18 9" />
                                        </svg>
                                    </div>
                                </div>
                                <div class="ips-card-body">
                                    <div class="ips-card-body-inner">
                                        <div class="ips-card-body-pad">
                                            <?php $prefix = 'icodito_ps[cat_' . $cat_id . ']'; ?>
                                            <div class="ips-form-grid-2">
                                                <div class="ips-field ips-field-full">
                                                    <div class="ips-switch-row">
                                                        <div class="ips-switch-text">
                                                            <span class="ips-switch-title">فعال‌سازی پشتیبانی برای این دسته</span>
                                                            <span class="ips-switch-sub">در صورت فعال بودن، دکمه پشتیبانی در محصولات این
                                                                دسته نمایش داده می‌شود.</span>
                                                        </div>
                                                        <label class="ips-switch">
                                                            <input type="checkbox" name="<?php echo esc_attr($prefix); ?>[enabled]"
                                                                value="1" <?php checked($is_enabled); ?>>
                                                            <span class="ips-switch-track"></span>
                                                        </label>
                                                    </div>
                                                </div>

                                                <div class="ips-field">
                                                    <label class="ips-field-label"
                                                        for="messenger-<?php echo esc_attr($cat_id); ?>">پیام‌رسان پشتیبانی</label>
                                                    <select id="messenger-<?php echo esc_attr($cat_id); ?>"
                                                        name="<?php echo esc_attr($prefix); ?>[messenger]"
                                                        class="ips-select ips-messenger-select">
                                                        <?php foreach ($messengers as $m_key => $m_data): ?>
                                                            <option value="<?php echo esc_attr($m_key); ?>" <?php selected($settings['messenger'], $m_key); ?>>
                                                                <?php echo esc_html($m_data['label']); ?>
                                                            </option>
                                                        <?php endforeach; ?>
                                                    </select>
                                                </div>

                                                <div class="ips-field">
                                                    <label class="ips-field-label"
                                                        for="identifier-<?php echo esc_attr($cat_id); ?>">شناسه یا شماره
                                                        پشتیبانی</label>
                                                    <div class="ips-identifier-wrap">
                                                        <input type="text" id="identifier-<?php echo esc_attr($cat_id); ?>"
                                                            name="<?php echo esc_attr($prefix); ?>[identifier]"
                                                            value="<?php echo esc_attr($settings['identifier']); ?>"
                                                            class="ips-input ips-identifier-input" placeholder="989121234567"
                                                            autocomplete="off">
                                                        <span class="ips-identifier-status" style="display:none;"></span>
                                                    </div>
                                                    <p class="ips-hint ips-messenger-hint">
                                                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
                                                            stroke-linecap="round" stroke-linejoin="round">
                                                            <circle cx="12" cy="12" r="10" />
                                                            <line x1="12" y1="16" x2="12" y2="12" />
                                                            <line x1="12" y1="8" x2="12.01" y2="8" />
                                                        </svg>
                                                        <span><?php echo esc_html($messengers[$settings['messenger']]['hint'] ?? ''); ?></span>
                                                    </p>
                                                </div>

                                                <div class="ips-field">
                                                    <label class="ips-field-label"
                                                        for="button_text-<?php echo esc_attr($cat_id); ?>">متن دکمه پشتیبانی</label>
                                                    <input type="text" id="button_text-<?php echo esc_attr($cat_id); ?>"
                                                        name="<?php echo esc_attr($prefix); ?>[button_text]"
                                                        value="<?php echo esc_attr($settings['button_text']); ?>" class="ips-input"
                                                        placeholder="ارتباط با پشتیبانی محصول">
                                                </div>

                                                <div class="ips-field">
                                                    <label class="ips-field-label"
                                                        for="position-<?php echo esc_attr($cat_id); ?>">جایگاه نمایش دکمه</label>
                                                    <select id="position-<?php echo esc_attr($cat_id); ?>"
                                                        name="<?php echo esc_attr($prefix); ?>[position]" class="ips-select">
                                                        <option value="after_cart" <?php selected($settings['position'], 'after_cart'); ?>>زیر دکمه افزودن به سبد خرید</option>
                                                        <option value="after_summary" <?php selected($settings['position'], 'after_summary'); ?>>بعد از خلاصه محصول</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        <?php endforeach; ?>
                    </div>

                    <div class="ips-save-bar">
                        <div class="ips-save-info">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
                                stroke-linejoin="round">
                                <path d="M12 9v4" />
                                <path d="M12 17h.01" />
                                <path
                                    d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z" />
                            </svg>
                            <span>تغییرات پس از کلیک روی دکمه ذخیره اعمال می‌شوند</span>
                        </div>
                        <button type="submit" name="icodito_ps_save" class="ips-btn-save">
                            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"
                                stroke-linejoin="round">
                                <path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z" />
                                <polyline points="17 21 17 13 7 13 7 21" />
                                <polyline points="7 3 7 8 15 8" />
                            </svg>
                            ذخیره تغییرات
                        </button>
                    </div>
                </form>

            <?php endif; ?>
        </div>

        <!-- ================= اسکریپت ================= -->
        <script>
            (function () {
                function initIcoditoPS() {
                    /* ============ تب‌ها ============ */
                    document.querySelectorAll(".ips-tab").forEach(function (tab) {
                        tab.addEventListener("click", function () {
                            var target = this.getAttribute("data-tab");
                            document.querySelectorAll(".ips-tab").forEach(function (t) {
                                t.classList.toggle("is-active", t === tab);
                            });
                            document.querySelectorAll(".ips-tab-panel").forEach(function (panel) {
                                panel.classList.toggle("is-active", panel.getAttribute("data-panel") === target);
                            });
                        });
                    });

                    /* ============ کارت‌های دسته‌بندی ============ */
                    document.querySelectorAll(".ips-card-head").forEach(function (head) {
                        head.addEventListener("click", function (e) {
                            if (e.target.closest(".ips-switch")) return;
                            var card = this.closest(".ips-card");
                            if (card) card.classList.toggle("is-open");
                        });
                    });

                    var expandBtn = document.getElementById("ips-expand-all");
                    if (expandBtn) {
                        expandBtn.addEventListener("click", function () {
                            document.querySelectorAll(".ips-card").forEach(function (c) {c.classList.add("is-open");});
                        });
                    }
                    var collapseBtn = document.getElementById("ips-collapse-all");
                    if (collapseBtn) {
                        collapseBtn.addEventListener("click", function () {
                            document.querySelectorAll(".ips-card").forEach(function (c) {c.classList.remove("is-open");});
                        });
                    }

                    var searchInput = document.getElementById("ips-search-input");
                    if (searchInput) {
                        searchInput.addEventListener("input", function () {
                            var q = this.value.trim().toLowerCase();
                            document.querySelectorAll(".ips-card").forEach(function (card) {
                                var name = (card.getAttribute("data-name") || "").toLowerCase();
                                card.classList.toggle("ips-hidden", q !== "" && name.indexOf(q) === -1);
                            });
                        });
                    }

                    /* ============ گروه‌های فیلد ============ */
                    document.querySelectorAll(".ips-field-group-head").forEach(function (head) {
                        head.addEventListener("click", function () {
                            this.closest(".ips-field-group").classList.toggle("is-open");
                        });
                    });

                    /* ============ پیام‌رسان و اعتبارسنجی ============ */
                    var hints = {
                        whatsapp: "شماره موبایل با کد کشور، بدون + و بدون صفر (مثال: 989121234567)",
                        telegram: "شناسه کاربری عمومی بدون @ (مثال: example_support)",
                        bale: "شناسه کاربری یا شماره (مثال: example_support یا 989121234567)",
                        eitaa: "شناسه کاربری (مثال: example_support)",
                        rubika: "شناسه کاربری (مثال: example_support)"
                    };

                    function validateIdentifier(messenger, value) {
                        value = (value || "").trim();
                        if (!value) return false;
                        if (messenger === "whatsapp") {
                            var num = value.replace(/[^0-9]/g, "");
                            return /^[0-9]{10,15}$/.test(num);
                        }
                        if (messenger === "bale") {
                            var clean = value.replace(/^@/, "");
                            if (/^[a-zA-Z0-9_]{3,32}$/.test(clean)) return true;
                            var phone = value.replace(/[^0-9]/g, "");
                            return /^[0-9]{10,15}$/.test(phone);
                        }
                        var clean = value.replace(/^@/, "");
                        return /^[a-zA-Z0-9_]{3,32}$/.test(clean);
                    }

                    function updateIdentifierStatus(wrap, messenger) {
                        var input = wrap.querySelector(".ips-identifier-input");
                        var status = wrap.querySelector(".ips-identifier-status");
                        if (!input || !status) return;
                        var val = input.value.trim();
                        if (!val) {status.style.display = "none"; return;}
                        status.style.display = "flex";
                        if (validateIdentifier(messenger, val)) {
                            status.className = "ips-identifier-status valid";
                            status.innerHTML = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg>';
                        } else {
                            status.className = "ips-identifier-status invalid";
                            status.innerHTML = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>';
                        }
                    }

                    document.querySelectorAll(".ips-messenger-select").forEach(function (select) {
                        var body = select.closest(".ips-card-body-pad") || select.closest(".ips-card");
                        if (!body) return;
                        var hintEl = body.querySelector(".ips-messenger-hint span");
                        var inputWrap = body.querySelector(".ips-identifier-wrap");
                        var input = body.querySelector(".ips-identifier-input");

                        function applyChanges() {
                            var val = select.value;
                            if (hintEl) hintEl.textContent = hints[val] || "";
                            if (input) input.setAttribute("placeholder", (val === "whatsapp" || val === "bale") ? "989121234567" : "example_support");
                            if (inputWrap) updateIdentifierStatus(inputWrap, val);
                        }
                        select.addEventListener("change", applyChanges);
                        if (input) input.addEventListener("input", function () {updateIdentifierStatus(inputWrap, select.value);});
                        applyChanges();
                    });

                    /* ============ کپی شورت‌کد ============ */
                    function copyToClipboard(text, button) {
                        if (navigator.clipboard && window.isSecureContext) {
                            navigator.clipboard.writeText(text).then(function () {showCopied(button);}).catch(function () {fallbackCopy(text, button);});
                        } else {fallbackCopy(text, button);}
                    }
                    function fallbackCopy(text, button) {
                        var ta = document.createElement("textarea");
                        ta.value = text;
                        ta.style.position = "fixed"; ta.style.top = "-9999px";
                        document.body.appendChild(ta); ta.focus(); ta.select();
                        try {document.execCommand("copy"); showCopied(button);} catch (e) { }
                        document.body.removeChild(ta);
                    }
                    function showCopied(button) {
                        if (!button) return;
                        var original = button.innerHTML;
                        button.classList.add("is-copied");
                        button.innerHTML = '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"/></svg> کپی شد!';
                        setTimeout(function () {button.classList.remove("is-copied"); button.innerHTML = original;}, 2000);
                    }
                    document.querySelectorAll("[data-copy-target]").forEach(function (btn) {
                        btn.addEventListener("click", function () {
                            var t = document.getElementById(this.getAttribute("data-copy-target"));
                            if (t) copyToClipboard(t.textContent.trim(), this);
                        });
                    });

                    /* ============ استایل: رنگ‌پیکر و متن ============ */
                    document.querySelectorAll(".ips-color-input").forEach(function (wrap) {
                        var picker = wrap.querySelector('input[type="color"]');
                        var text = wrap.querySelector('input[type="text"]');
                        if (!picker || !text) return;
                        picker.addEventListener("input", function () {
                            text.value = this.value;
                            updatePreview();
                        });
                        text.addEventListener("input", function () {
                            var v = this.value.trim();
                            if (/^#[0-9a-fA-F]{6}$/.test(v) || /^#[0-9a-fA-F]{3}$/.test(v)) {
                                picker.value = v;
                                updatePreview();
                            }
                        });
                    });

                    /* ============ استایل: نوع پس‌زمینه ============ */
                    document.querySelectorAll('input[name="icodito_ps_style[bg_type]"]').forEach(function (radio) {
                        radio.addEventListener("change", function () {
                            document.querySelectorAll('input[name="icodito_ps_style[bg_type]"]').forEach(function (r) {
                                r.closest(".ips-radio-pill").classList.toggle("is-active", r.checked);
                            });
                            var show = this.value === "gradient";
                            var w1 = document.getElementById("ips-bg-color-2-wrap");
                            var w2 = document.getElementById("ips-hover-bg-2-wrap");
                            if (w1) w1.style.display = show ? "" : "none";
                            if (w2) w2.style.display = show ? "" : "none";
                            updatePreview();
                        });
                    });

                    /* ============ استایل: پریست‌ها ============ */
                    document.querySelectorAll(".ips-preset").forEach(function (preset) {
                        preset.addEventListener("click", function (e) {
                            e.preventDefault();
                            var input = this.querySelector('input[type="radio"]');
                            if (input) input.checked = true;

                            document.querySelectorAll(".ips-preset").forEach(function (p) {
                                p.classList.toggle("is-selected", p === preset);
                            });

                            var styleData = this.getAttribute("data-style");
                            if (!styleData) return;
                            try {
                                var data = JSON.parse(styleData);
                                applyPresetToFields(data);
                                updatePreview();
                            } catch (err) { }
                        });
                    });

                    function applyPresetToFields(data) {
                        var fields = {
                            text_color: "ips-field-text-color",
                            bg_color: "ips-field-bg-color",
                            bg_color_2: "ips-field-bg-color-2",
                            border_color: "ips-field-border-color",
                            border_width: "ips-field-border-width",
                            border_radius: "ips-field-border-radius",
                            padding_y: "ips-field-padding-y",
                            padding_x: "ips-field-padding-x",
                            font_size: "ips-field-font-size",
                            font_weight: "ips-field-font-weight",
                            shadow: "ips-field-shadow",
                            hover_bg_color: "ips-field-hover-bg",
                            hover_bg_color_2: "ips-field-hover-bg-2",
                            hover_text_color: "ips-field-hover-text",
                            hover_shadow: "ips-field-hover-shadow"
                        };

                        for (var key in fields) {
                            var el = document.getElementById(fields[key]);
                            if (!el || data[key] === undefined) continue;
                            el.value = data[key];
                            var wrap = el.closest(".ips-color-input");
                            if (wrap) {
                                var picker = wrap.querySelector('input[type="color"]');
                                if (picker && /^#[0-9a-fA-F]{6}$/.test(data[key])) picker.value = data[key];
                            }
                        }

                        var bgType = data.bg_type || "solid";
                        var radio = document.querySelector('input[name="icodito_ps_style[bg_type]"][value="' + bgType + '"]');
                        if (radio) {
                            radio.checked = true;
                            document.querySelectorAll('input[name="icodito_ps_style[bg_type]"]').forEach(function (r) {
                                r.closest(".ips-radio-pill").classList.toggle("is-active", r.checked);
                            });
                            var w1 = document.getElementById("ips-bg-color-2-wrap");
                            var w2 = document.getElementById("ips-hover-bg-2-wrap");
                            var show = bgType === "gradient";
                            if (w1) w1.style.display = show ? "" : "none";
                            if (w2) w2.style.display = show ? "" : "none";
                        }
                    }

                    /* ============ استایل: پیش‌نمایش زنده ============ */
                    function getVal(id) {
                        var el = document.getElementById(id);
                        return el ? el.value : "";
                    }
                    function getRadio(name) {
                        var el = document.querySelector('input[name="' + name + '"]:checked');
                        return el ? el.value : "";
                    }

                    function updatePreview() {
                        var btn = document.getElementById("ips-preview-btn");
                        if (!btn) return;

                        var text_color = getVal("ips-field-text-color");
                        var bg_color = getVal("ips-field-bg-color");
                        var bg_color_2 = getVal("ips-field-bg-color-2");
                        var bg_type = getRadio("icodito_ps_style[bg_type]") || "solid";
                        var border_color = getVal("ips-field-border-color");
                        var border_width = parseInt(getVal("ips-field-border-width")) || 0;
                        var border_radius = parseInt(getVal("ips-field-border-radius")) || 0;
                        var padding_y = parseInt(getVal("ips-field-padding-y")) || 0;
                        var padding_x = parseInt(getVal("ips-field-padding-x")) || 0;
                        var font_size = parseInt(getVal("ips-field-font-size")) || 14;
                        var font_weight = getVal("ips-field-font-weight") || "600";
                        var shadow = getVal("ips-field-shadow") || "none";
                        var hover_bg = getVal("ips-field-hover-bg");
                        var hover_bg_2 = getVal("ips-field-hover-bg-2");
                        var hover_text = getVal("ips-field-hover-text");
                        var hover_shadow = getVal("ips-field-hover-shadow") || "none";

                        var bg_css = bg_type === "gradient"
                            ? "linear-gradient(135deg, " + bg_color + ", " + bg_color_2 + ")"
                            : bg_color;
                        var hover_bg_css = bg_type === "gradient"
                            ? "linear-gradient(135deg, " + hover_bg + ", " + hover_bg_2 + ")"
                            : hover_bg;

                        btn.style.color = text_color;
                        btn.style.background = bg_css;
                        btn.style.border = border_width > 0 ? border_width + "px solid " + border_color : "none";
                        btn.style.borderRadius = border_radius + "px";
                        btn.style.padding = padding_y + "px " + padding_x + "px";
                        btn.style.fontSize = font_size + "px";
                        btn.style.fontWeight = font_weight;
                        btn.style.boxShadow = shadow;

                        btn.style.setProperty("--preview-hover-bg", hover_bg_css);
                        btn.style.setProperty("--preview-hover-text", hover_text);
                        btn.style.setProperty("--preview-hover-shadow", hover_shadow);
                    }

                    if (!document.getElementById("ips-preview-hover-style")) {
                        var st = document.createElement("style");
                        st.id = "ips-preview-hover-style";
                        st.textContent = '.ips-preview-btn:hover { background: var(--preview-hover-bg) !important; color: var(--preview-hover-text) !important; box-shadow: var(--preview-hover-shadow) !important; }';
                        document.head.appendChild(st);
                    }

                    ["ips-field-text-color", "ips-field-bg-color", "ips-field-bg-color-2", "ips-field-border-color", "ips-field-border-width", "ips-field-border-radius", "ips-field-padding-y", "ips-field-padding-x", "ips-field-font-size", "ips-field-font-weight", "ips-field-shadow", "ips-field-hover-bg", "ips-field-hover-bg-2", "ips-field-hover-text", "ips-field-hover-shadow"].forEach(function (id) {
                        var el = document.getElementById(id);
                        if (el) {
                            el.addEventListener("input", updatePreview);
                            el.addEventListener("change", updatePreview);
                        }
                    });

                    var shadowPresets = {
                        none: "none",
                        soft: "0 2px 8px rgba(15,23,42,.08)",
                        medium: "0 4px 14px rgba(15,23,42,.15)",
                        strong: "0 10px 28px rgba(15,23,42,.25)"
                    };
                    var shadowSel = document.getElementById("ips-field-shadow-preset");
                    if (shadowSel) {
                        shadowSel.addEventListener("change", function () {
                            var v = this.value;
                            if (v !== "custom" && shadowPresets[v] !== undefined) {
                                document.getElementById("ips-field-shadow").value = shadowPresets[v];
                                updatePreview();
                            }
                        });
                    }
                    var hoverShadowSel = document.getElementById("ips-field-hover-shadow-preset");
                    if (hoverShadowSel) {
                        hoverShadowSel.addEventListener("change", function () {
                            var v = this.value;
                            if (v !== "custom" && shadowPresets[v] !== undefined) {
                                document.getElementById("ips-field-hover-shadow").value = shadowPresets[v];
                                updatePreview();
                            }
                        });
                    }

                    updatePreview();

                    var dirty = false;
                    var form = document.getElementById("ips-settings-form");
                    if (form) {
                        form.addEventListener("input", function () {dirty = true;});
                        form.addEventListener("change", function () {dirty = true;});
                        form.addEventListener("submit", function () {dirty = false;});
                    }
                    window.addEventListener("beforeunload", function (e) {
                        if (dirty) {e.preventDefault(); e.returnValue = "";}
                    });
                }

                if (document.readyState === "loading") {
                    document.addEventListener("DOMContentLoaded", initIcoditoPS);
                } else {
                    initIcoditoPS();
                }
            })();
        </script>

        <?php
    }
}

if (!function_exists('icodito_ps_author_support_box')) {
    function icodito_ps_author_support_box()
    {
        static $style_printed = false;
        if (!$style_printed) {
            $style_printed = true;
            ?>
            <style>
                .icodito-author-support {
                    display: flex;
                    align-items: flex-start;
                    gap: 16px;
                    margin: 25px 0;
                    padding: 20px 22px;
                    background: #f8fafc;
                    border: 1px solid #e2e8f0;
                    border-right: 4px solid #00bcd4;
                    border-radius: 10px 0 0 10px;
                    direction: rtl;
                    text-align: right;
                    box-sizing: border-box;
                }

                .icodito-author-support-icon {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    flex: 0 0 44px;
                    width: 44px;
                    height: 44px;
                    background: #ffffff;
                    border: 1px solid #e2e8f0;
                    border-radius: 50%;
                    font-size: 20px;
                    line-height: 1;
                }

                .icodito-author-support-content {
                    flex: 1;
                    min-width: 0;
                }

                .icodito-author-support-content h3 {
                    margin: 0 0 8px;
                    color: #1e293b;
                    font-size: 15px;
                    font-weight: 700;
                    line-height: 1.8;
                }

                .icodito-author-support-content p {
                    margin: 0;
                    color: #64748b;
                    font-size: 13px;
                    line-height: 2;
                }

                .icodito-author-support-links {
                    display: flex;
                    flex-wrap: wrap;
                    align-items: center;
                    gap: 8px;
                    margin-top: 14px;
                }

                .icodito-author-support-links a {
                    display: inline-flex;
                    align-items: center;
                    justify-content: center;
                    padding: 7px 13px;
                    background: #ffffff;
                    color: #00a5bb;
                    border: 1px solid #cbd5e1;
                    border-radius: 7px;
                    font-size: 12px;
                    font-weight: 600;
                    text-decoration: none;
                    transition: all 0.2s ease;
                }

                .icodito-author-support-links a:hover {
                    background: #00bcd4;
                    color: #ffffff;
                    border-color: #00bcd4;
                }

                @media (max-width: 600px) {
                    .icodito-author-support {
                        gap: 12px;
                        padding: 16px;
                    }

                    .icodito-author-support-icon {
                        flex-basis: 38px;
                        width: 38px;
                        height: 38px;
                        font-size: 17px;
                    }

                    .icodito-author-support-content h3 {
                        font-size: 14px;
                    }

                    .icodito-author-support-content p {
                        font-size: 12px;
                    }

                    .icodito-author-support-links {
                        flex-direction: column;
                        align-items: stretch;
                    }

                    .icodito-author-support-links a {
                        width: 100%;
                    }
                }
            </style>
            <?php
        }
        ?>
        <div class="icodito-author-support">
            <div class="icodito-author-support-icon">❤️</div>
            <div class="icodito-author-support-content">
                <h3>این کد توسط آی کدیتو نوشته و بهینه شده است</h3>
                <p>
                    این کد با هدف ارائه یک راهکار کاربردی و رایگان توسط
                    <strong>آی کدیتو</strong>
                    تهیه و بهینه شده است.
                    در صورت مفید بودن این کد و استفاده از آن در سایت خود،
                    می‌توانید با حمایت از آی کدیتو به ادامه توسعه و انتشار
                    کدها و منابع رایگان کمک کنید.
                </p>
                <div class="icodito-author-support-links">
                    <a href="https://icodito.ir/" target="_blank" rel="noopener noreferrer">وب‌سایت آی کدیتو</a>
                    <a href="https://donito.me/icodito" target="_blank" rel="noopener noreferrer">حمایت مالی از آی کدیتو</a>
                </div>
            </div>
        </div>
        <?php
    }
}

if (!function_exists('icodito_ps_add_product_metabox')) {
    function icodito_ps_add_product_metabox()
    {
        add_meta_box(
            'icodito_ps_product_support',
            'پشتیبانی این محصول',
            'icodito_ps_render_product_metabox',
            'product',
            'side',
            'default'
        );
    }
}
add_action('add_meta_boxes', 'icodito_ps_add_product_metabox');

if (!function_exists('icodito_ps_render_product_metabox')) {
    function icodito_ps_render_product_metabox($post)
    {
        wp_nonce_field('icodito_ps_product_meta', 'icodito_ps_product_nonce');

        $product_id = absint($post->ID);
        $enabled = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'enabled', true);
        $messenger = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'messenger', true);
        $identifier = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'identifier', true);
        $button_text = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'button_text', true);
        $reference_category = get_post_meta($product_id, ICODITO_PS_META_PREFIX . 'reference_category', true);

        $enabled = ($enabled === 'yes') ? 'yes' : 'no';
        $messenger = !empty($messenger) ? sanitize_key($messenger) : 'whatsapp';
        $identifier = !empty($identifier) ? sanitize_text_field($identifier) : '';
        $button_text = !empty($button_text) ? sanitize_text_field($button_text) : 'ارتباط با پشتیبانی محصول';
        $reference_category = absint($reference_category);

        $messengers = icodito_ps_get_messengers();
        $main_categories = icodito_ps_get_product_main_categories($product_id);

        ?>
        <style>
            .icodito-ps-meta-field {
                margin-bottom: 14px;
            }

            .icodito-ps-meta-field label {
                display: block;
                margin-bottom: 6px;
                font-weight: 600;
                font-size: 13px;
                color: #334155;
            }

            .icodito-ps-meta-field select,
            .icodito-ps-meta-field input[type="text"] {
                width: 100%;
                padding: 8px 10px;
                border: 1px solid #cbd5e1;
                border-radius: 6px;
                font-size: 13px;
            }

            .icodito-ps-meta-field .description {
                margin-top: 4px;
                font-size: 11px;
                color: #94a3b8;
            }

            .icodito-ps-meta-divider {
                border: 0;
                border-top: 1px solid #e2e8f0;
                margin: 16px 0;
            }

            .icodito-ps-meta-mode {
                margin-bottom: 14px;
            }

            .icodito-ps-meta-mode label {
                display: block;
                margin-bottom: 8px;
                font-weight: 600;
                font-size: 13px;
                color: #334155;
            }

            .icodito-ps-meta-mode .radio-option {
                display: flex;
                align-items: center;
                gap: 6px;
                margin-bottom: 6px;
                font-size: 13px;
            }

            .icodito-ps-meta-custom-fields {
                display: none;
            }

            .icodito-ps-meta-custom-fields.active {
                display: block;
            }
        </style>

        <div class="icodito-ps-meta-mode">
            <label>حالت پشتیبانی:</label>
            <label class="radio-option">
                <input type="radio" name="icodito_ps_product_mode" value="category" <?php checked($enabled, 'no'); ?>>
                <span>استفاده از تنظیمات دسته‌بندی اصلی</span>
            </label>
            <label class="radio-option">
                <input type="radio" name="icodito_ps_product_mode" value="custom" <?php checked($enabled, 'yes'); ?>>
                <span>تنظیم پشتیبانی اختصاصی برای این محصول</span>
            </label>
        </div>

        <div class="icodito-ps-meta-custom-fields <?php echo ($enabled === 'yes') ? 'active' : ''; ?>">
            <hr class="icodito-ps-meta-divider">

            <div class="icodito-ps-meta-field">
                <label for="icodito_ps_product_messenger">پیام‌رسان</label>
                <select id="icodito_ps_product_messenger" name="icodito_ps_product_messenger">
                    <?php foreach ($messengers as $m_key => $m_data): ?>
                        <option value="<?php echo esc_attr($m_key); ?>" <?php selected($messenger, $m_key); ?>>
                            <?php echo esc_html($m_data['label']); ?>
                        </option>
                    <?php endforeach; ?>
                </select>
            </div>

            <div class="icodito-ps-meta-field">
                <label for="icodito_ps_product_identifier">شناسه یا شماره</label>
                <input type="text" id="icodito_ps_product_identifier" name="icodito_ps_product_identifier"
                    value="<?php echo esc_attr($identifier); ?>" placeholder="989121234567">
                <p class="description" id="icodito_ps_product_identifier_hint">
                    <?php echo esc_html($messengers[$messenger]['hint'] ?? ''); ?>
                </p>
            </div>

            <div class="icodito-ps-meta-field">
                <label for="icodito_ps_product_button_text">متن دکمه</label>
                <input type="text" id="icodito_ps_product_button_text" name="icodito_ps_product_button_text"
                    value="<?php echo esc_attr($button_text); ?>" placeholder="ارتباط با پشتیبانی محصول">
            </div>
        </div>

        <?php if (!empty($main_categories)): ?>
            <hr class="icodito-ps-meta-divider">
            <div class="icodito-ps-meta-field">
                <label for="icodito_ps_reference_category">دسته‌بندی مرجع پشتیبانی (اختیاری)</label>
                <select id="icodito_ps_reference_category" name="icodito_ps_reference_category">
                    <option value="0">— انتخاب خودکار —</option>
                    <?php foreach ($main_categories as $cat_id):
                        $term = get_term($cat_id, 'product_cat');
                        if ($term && !is_wp_error($term)): ?>
                            <option value="<?php echo esc_attr($cat_id); ?>" <?php selected($reference_category, $cat_id); ?>>
                                <?php echo esc_html($term->name); ?>
                            </option>
                        <?php endif;
                    endforeach; ?>
                </select>
                <p class="description">
                    اگر محصول در چند دسته‌بندی اصلی قرار دارد، می‌توانید دسته مرجع را انتخاب کنید.
                    اگر انتخاب نشود، اولین دسته اصلی واجد شرایط استفاده می‌شود.
                </p>
            </div>
        <?php endif; ?>

        <script>
            document.addEventListener("DOMContentLoaded", function () {
                var modeRadios = document.querySelectorAll("input[name='icodito_ps_product_mode']");
                var customFields = document.querySelector(".icodito-ps-meta-custom-fields");
                var messengerSelect = document.getElementById("icodito_ps_product_messenger");
                var identifierHint = document.getElementById("icodito_ps_product_identifier_hint");

                function toggleCustomFields() {
                    var selected = document.querySelector("input[name='icodito_ps_product_mode']:checked");
                    if (selected && selected.value === "custom") {
                        customFields.classList.add("active");
                    } else {
                        customFields.classList.remove("active");
                    }
                }

                modeRadios.forEach(function (radio) {
                    radio.addEventListener("change", toggleCustomFields);
                });
                toggleCustomFields();

                if (messengerSelect && identifierHint) {
                    var hints = {
                        whatsapp: "شماره موبایل با کد کشور، بدون + و بدون صفر (مثال: 989121234567)",
                        telegram: "شناسه کاربری عمومی بدون @ (مثال: example_support)",
                        bale: "شناسه کاربری یا شماره (مثال: example_support یا 989121234567)",
                        eitaa: "شناسه کاربری (مثال: example_support)",
                        rubika: "شناسه کاربری (مثال: example_support)"
                    };
                    messengerSelect.addEventListener("change", function () {
                        identifierHint.textContent = hints[this.value] || "";
                    });
                }
            });
        </script>
        <?php
    }
}

if (!function_exists('icodito_ps_save_product_meta')) {
    function icodito_ps_save_product_meta($post_id)
    {
        if (
            !isset($_POST['icodito_ps_product_nonce']) ||
            !wp_verify_nonce($_POST['icodito_ps_product_nonce'], 'icodito_ps_product_meta')
        ) {
            return;
        }

        if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {
            return;
        }

        if (!current_user_can('edit_post', $post_id)) {
            return;
        }

        if (get_post_type($post_id) !== 'product') {
            return;
        }

        $mode = isset($_POST['icodito_ps_product_mode'])
            ? sanitize_key(wp_unslash($_POST['icodito_ps_product_mode']))
            : 'category';

        if ($mode === 'custom') {
            update_post_meta($post_id, ICODITO_PS_META_PREFIX . 'enabled', 'yes');

            $messenger = isset($_POST['icodito_ps_product_messenger'])
                ? sanitize_key(wp_unslash($_POST['icodito_ps_product_messenger']))
                : 'whatsapp';

            $identifier = isset($_POST['icodito_ps_product_identifier'])
                ? sanitize_text_field(wp_unslash($_POST['icodito_ps_product_identifier']))
                : '';

            $button_text = isset($_POST['icodito_ps_product_button_text'])
                ? sanitize_text_field(wp_unslash($_POST['icodito_ps_product_button_text']))
                : 'ارتباط با پشتیبانی محصول';

            update_post_meta($post_id, ICODITO_PS_META_PREFIX . 'messenger', $messenger);
            update_post_meta($post_id, ICODITO_PS_META_PREFIX . 'identifier', $identifier);
            update_post_meta($post_id, ICODITO_PS_META_PREFIX . 'button_text', $button_text);
        } else {
            update_post_meta($post_id, ICODITO_PS_META_PREFIX . 'enabled', 'no');
        }

        $reference = isset($_POST['icodito_ps_reference_category'])
            ? absint($_POST['icodito_ps_reference_category'])
            : 0;

        if ($reference > 0) {
            update_post_meta($post_id, ICODITO_PS_META_PREFIX . 'reference_category', $reference);
        } else {
            delete_post_meta($post_id, ICODITO_PS_META_PREFIX . 'reference_category');
        }
    }
}
add_action('save_post_product', 'icodito_ps_save_product_meta');


/**
 * دریافت HTML دکمه پشتیبانی برای یک محصول
 *
 * @param int   $product_id   شناسه محصول
 * @param array $args         آرگومان‌های سفارشی (class, style, text, ...)
 * @param bool  $use_inline_style آیا استایل درون‌خطی اعمال شود؟
 * @return string
 */
if (!function_exists('icodito_ps_get_button_html')) {
    function icodito_ps_get_button_html($product_id, $args = array(), $use_inline_style = true)
    {
        $product_id = absint($product_id);
        if (!$product_id)
            return '';

        $product = wc_get_product($product_id);
        if (!$product)
            return '';

        $global = icodito_ps_get_global_settings();
        if (empty($global['show_on_out_of_stock']) && !$product->is_in_stock())
            return '';

        $support = icodito_ps_resolve_product_support($product_id);
        if (empty($support))
            return '';

        $messenger = $support['messenger'];
        $identifier = $support['identifier'];
        $button_text = $support['button_text'];

        $link = icodito_ps_build_link($messenger, $identifier);
        if (empty($link))
            return '';

        $icon = icodito_ps_get_messenger_icon($messenger);

        $defaults = array(
            'class' => '',
            'style' => '',
            'text' => $button_text,
            'icon' => true,
            'target' => '_blank',
            'rel' => 'noopener noreferrer',
            'product_id' => $product_id,
        );
        $args = wp_parse_args($args, $defaults);

        $classes = array('icodito-product-support-btn');
        if (!empty($args['class']))
            $classes[] = sanitize_html_class($args['class']);
        $class_attr = implode(' ', $classes);

        $style_vars = '';
        if ($use_inline_style) {
            $s = icodito_ps_get_style_settings();

            $bg_css = $s['bg_type'] === 'gradient'
                ? 'linear-gradient(135deg, ' . $s['bg_color'] . ', ' . $s['bg_color_2'] . ')'
                : $s['bg_color'];
            $hover_bg_css = $s['bg_type'] === 'gradient'
                ? 'linear-gradient(135deg, ' . $s['hover_bg_color'] . ', ' . $s['hover_bg_color_2'] . ')'
                : $s['hover_bg_color'];

            $border_css = ($s['border_width'] > 0)
                ? ($s['border_width'] . 'px solid ' . $s['border_color'])
                : 'none';

            $vars = array(
                '--ips-btn-text' => $s['text_color'],
                '--ips-btn-bg' => $bg_css,
                '--ips-btn-border' => $border_css,
                '--ips-btn-radius' => $s['border_radius'] . 'px',
                '--ips-btn-padding' => $s['padding_y'] . 'px ' . $s['padding_x'] . 'px',
                '--ips-btn-font-size' => $s['font_size'] . 'px',
                '--ips-btn-font-weight' => $s['font_weight'],
                '--ips-btn-shadow' => ($s['shadow'] === 'none' || $s['shadow'] === '') ? 'none' : $s['shadow'],
                '--ips-btn-hover-text' => $s['hover_text_color'],
                '--ips-btn-hover-bg' => $hover_bg_css,
                '--ips-btn-hover-shadow' => ($s['hover_shadow'] === 'none' || $s['hover_shadow'] === '') ? 'none' : $s['hover_shadow'],
            );

            $parts = array();
            foreach ($vars as $k => $v) {
                $parts[] = $k . ':' . $v;
            }
            $style_vars = implode(';', $parts);
        }

        if (!empty($args['style'])) {
            $style_vars .= (!empty($style_vars) ? ';' : '') . $args['style'];
        }

        $style_attr = !empty($style_vars) ? ' style="' . esc_attr($style_vars) . '"' : '';

        $html = sprintf(
            '<a href="%s" class="%s" target="%s" rel="%s"%s data-product-id="%d">',
            esc_url($link),
            esc_attr($class_attr),
            esc_attr($args['target']),
            esc_attr($args['rel']),
            $style_attr,
            absint($args['product_id'])
        );

        if (!empty($args['icon']))
            $html .= $icon;
        $html .= '<span class="icodito-ps-btn-text">' . esc_html($args['text']) . '</span>';
        $html .= '</a>';

        return $html;
    }
}

if (!function_exists('icodito_ps_display_support_button')) {
    function icodito_ps_display_support_button()
    {
        global $product;

        if (!$product || !is_a($product, 'WC_Product')) {
            return;
        }

        if (!$product->is_in_stock()) {
            return;
        }

        $global = icodito_ps_get_global_settings();
        if (empty($global['auto_display'])) {
            return;
        }

        $product_id = absint($product->get_id());

        if (!empty($GLOBALS['icodito_ps_displayed_buttons'][$product_id])) {
            return;
        }

        $support = icodito_ps_resolve_product_support($product_id);
        if (empty($support)) {
            return;
        }

        $GLOBALS['icodito_ps_displayed_buttons'][$product_id] = true;
        echo icodito_ps_get_button_html($product_id);
    }
}
add_action('woocommerce_after_add_to_cart_button', 'icodito_ps_display_support_button', 20);

if (!function_exists('icodito_ps_display_support_button_after_summary')) {
    function icodito_ps_display_support_button_after_summary()
    {
        global $product;

        if (!$product || !is_a($product, 'WC_Product')) {
            return;
        }

        $global = icodito_ps_get_global_settings();
        if (empty($global['auto_display'])) {
            return;
        }

        if (!$product->is_in_stock() && empty($global['show_on_out_of_stock'])) {
            return;
        }

        $product_id = absint($product->get_id());

        if (!empty($GLOBALS['icodito_ps_displayed_buttons'][$product_id])) {
            return;
        }

        $support = icodito_ps_resolve_product_support($product_id);
        if (empty($support)) {
            return;
        }

        $position = 'after_cart';
        if (in_array($support['source'], array('category_reference', 'category_auto'), true)) {
            $main_categories = icodito_ps_get_product_main_categories($product_id);
            if (!empty($main_categories)) {
                $cat_settings = icodito_ps_get_category_settings($main_categories[0]);
                $position = $cat_settings['position'];
            }
        }

        if ($position !== 'after_summary') {
            return;
        }

        $GLOBALS['icodito_ps_displayed_buttons'][$product_id] = true;
        echo icodito_ps_get_button_html($product_id);
    }
}
add_action('woocommerce_after_single_product_summary', 'icodito_ps_display_support_button_after_summary', 5);

if (!function_exists('icodito_ps_display_support_button_out_of_stock')) {
    function icodito_ps_display_support_button_out_of_stock()
    {
        global $product;

        if (!$product || !is_a($product, 'WC_Product')) {
            return;
        }

        if ($product->is_in_stock()) {
            return;
        }

        $global = icodito_ps_get_global_settings();

        if (empty($global['auto_display'])) {
            return;
        }

        if (empty($global['show_on_out_of_stock'])) {
            return;
        }

        $product_id = absint($product->get_id());

        if (!empty($GLOBALS['icodito_ps_displayed_buttons'][$product_id])) {
            return;
        }

        $support = icodito_ps_resolve_product_support($product_id);
        if (empty($support)) {
            return;
        }

        $position = 'after_cart';
        if (in_array($support['source'], array('category_reference', 'category_auto'), true)) {
            $main_categories = icodito_ps_get_product_main_categories($product_id);
            if (!empty($main_categories)) {
                $cat_settings = icodito_ps_get_category_settings($main_categories[0]);
                $position = $cat_settings['position'];
            }
        }

        if ($position !== 'after_cart') {
            return;
        }

        $GLOBALS['icodito_ps_displayed_buttons'][$product_id] = true;
        echo icodito_ps_get_button_html($product_id);
    }
}

add_action('woocommerce_single_product_summary', 'icodito_ps_display_support_button_out_of_stock', 31);

add_action('woocommerce_product_meta_start', 'icodito_ps_display_support_button_out_of_stock_alt', 5);

if (!function_exists('icodito_ps_display_support_button_out_of_stock_alt')) {
    function icodito_ps_display_support_button_out_of_stock_alt()
    {
        global $product;

        if (!$product || !is_a($product, 'WC_Product')) {
            return;
        }

        if ($product->is_in_stock()) {
            return;
        }

        $global = icodito_ps_get_global_settings();
        if (empty($global['auto_display']) || empty($global['show_on_out_of_stock'])) {
            return;
        }

        $product_id = absint($product->get_id());

        if (!empty($GLOBALS['icodito_ps_displayed_buttons'][$product_id])) {
            return;
        }

        $support = icodito_ps_resolve_product_support($product_id);
        if (empty($support)) {
            return;
        }

        $GLOBALS['icodito_ps_displayed_buttons'][$product_id] = true;
        echo icodito_ps_get_button_html($product_id);
    }
}

if (!function_exists('icodito_ps_is_button_displayed')) {
    function icodito_ps_is_button_displayed($product_id)
    {
        static $displayed = array();
        return isset($displayed[absint($product_id)]);
    }
}

if (!function_exists('icodito_ps_mark_button_displayed')) {
    function icodito_ps_mark_button_displayed($product_id)
    {
        if (!isset($GLOBALS['icodito_ps_displayed_buttons'])) {
            $GLOBALS['icodito_ps_displayed_buttons'] = array();
        }
        $GLOBALS['icodito_ps_displayed_buttons'][absint($product_id)] = true;
    }
}

if (!function_exists('icodito_ps_has_button_been_displayed')) {
    function icodito_ps_has_button_been_displayed($product_id)
    {
        return !empty($GLOBALS['icodito_ps_displayed_buttons'][absint($product_id)]);
    }
}

add_action('woocommerce_after_single_product_summary', 'icodito_ps_display_support_button_after_summary', 5);

if (!function_exists('icodito_ps_support_shortcode')) {
    function icodito_ps_support_shortcode($atts)
    {
        $atts = shortcode_atts(array(
            'product_id' => 0,
            'text' => '',
            'class' => '',
            'style' => '',
            'icon' => 'yes',
            'target' => '_blank',
        ), $atts, 'icodito_product_support');

        $product_id = absint($atts['product_id']);
        if (!$product_id) {
            global $product;
            if ($product && is_a($product, 'WC_Product')) {
                $product_id = absint($product->get_id());
            } else {
                $product_id = get_the_ID();
            }
        }

        if (!$product_id) {
            return '';
        }

        $args = array(
            'class' => $atts['class'],
            'style' => $atts['style'],
            'icon' => ($atts['icon'] === 'yes' || $atts['icon'] === '1'),
            'target' => $atts['target'],
        );

        if (!empty($atts['text'])) {
            $args['text'] = $atts['text'];
        }

        $html = icodito_ps_get_button_html($product_id, $args);

        return !empty($html) ? $html : '';
    }
}
add_shortcode('icodito_product_support', 'icodito_ps_support_shortcode');

if (!function_exists('icodito_ps_register_elementor_widget')) {
    function icodito_ps_register_elementor_widget($widgets_manager)
    {
        if (!did_action('elementor/loaded')) {
            return;
        }

        require_once __DIR__ . '/icodito-elementor-widget.php';

        $widgets_manager->register(new \Icodito_PS_Elementor_Widget());
    }
}
add_action('elementor/widgets/register', 'icodito_ps_register_elementor_widget');


if (!function_exists('icodito_ps_create_elementor_widget_file')) {
    function icodito_ps_create_elementor_widget_file()
    {
        $file_path = __DIR__ . '/icodito-elementor-widget.php';

        if (file_exists($file_path)) {
            return;
        }

        $widget_code = <<<'WIDGET_CODE'
<?php
if (!defined('ABSPATH')) {
    exit;
}

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Background;

class Icodito_PS_Elementor_Widget extends Widget_Base {

    public function get_name() {
        return 'icodito_product_support';
    }

    public function get_title() {
        return 'پشتیبانی محصول آی کدیتو';
    }

    public function get_icon() {
        return 'eicon-help-o';
    }

    public function get_categories() {
        return array('woocommerce-elements', 'general');
    }

    public function get_keywords() {
        return array('support', 'whatsapp', 'telegram', 'پشتیبانی', 'محصول');
    }

    public function get_script_depends() {
        return array('icodito-ps-elementor');
    }

    public function get_style_depends() {
        return array('icodito-ps-elementor');
    }

    protected function register_controls() {
        
        $this->start_controls_section(
            'content_section',
            array(
                'label' => 'تنظیمات دکمه',
                'tab'   => Controls_Manager::TAB_CONTENT,
            )
        );

        $this->add_control(
            'product_id',
            array(
                'label'       => 'شناسه محصول',
                'type'        => Controls_Manager::NUMBER,
                'description' => 'خالی بگذارید تا از محصول جاری استفاده شود.',
            )
        );

        $this->add_control(
            'button_text',
            array(
                'label'       => 'متن دکمه',
                'type'        => Controls_Manager::TEXT,
                'default'     => 'ارتباط با پشتیبانی محصول',
                'placeholder' => 'متن دکمه',
            )
        );

        $this->add_control(
            'show_icon',
            array(
                'label'        => 'نمایش آیکون',
                'type'         => Controls_Manager::SWITCHER,
                'label_on'     => 'بله',
                'label_off'    => 'خیر',
                'return_value' => 'yes',
                'default'      => 'yes',
            )
        );

        $this->add_control(
            'target',
            array(
                'label'   => 'باز شدن در',
                'type'    => Controls_Manager::SELECT,
                'options' => array(
                    '_blank' => 'تب جدید',
                    '_self'  => 'همین تب',
                ),
                'default' => '_blank',
            )
        );

        $this->end_controls_section();

        $this->start_controls_section(
            'style_section',
            array(
                'label' => 'استایل دکمه',
                'tab'   => Controls_Manager::TAB_STYLE,
            )
        );

        $this->add_control(
            'button_text_color',
            array(
                'label'     => 'رنگ متن',
                'type'      => Controls_Manager::COLOR,
                'selectors' => array(
                    '{{WRAPPER}} .icodito-product-support-btn' => 'color: {{VALUE}};',
                ),
            )
        );

        $this->add_control(
            'button_bg_color',
            array(
                'label'     => 'رنگ پس‌زمینه',
                'type'      => Controls_Manager::COLOR,
                'selectors' => array(
                    '{{WRAPPER}} .icodito-product-support-btn' => 'background-color: {{VALUE}};',
                ),
            )
        );

        $this->add_control(
            'button_border_color',
            array(
                'label'     => 'رنگ حاشیه',
                'type'      => Controls_Manager::COLOR,
                'selectors' => array(
                    '{{WRAPPER}} .icodito-product-support-btn' => 'border-color: {{VALUE}};',
                ),
            )
        );

        $this->add_group_control(
            Group_Control_Typography::get_type(),
            array(
                'name'     => 'button_typography',
                'selector' => '{{WRAPPER}} .icodito-product-support-btn',
            )
        );

        $this->add_group_control(
            Group_Control_Border::get_type(),
            array(
                'name'     => 'button_border',
                'selector' => '{{WRAPPER}} .icodito-product-support-btn',
            )
        );

        $this->add_group_control(
            Group_Control_Box_Shadow::get_type(),
            array(
                'name'     => 'button_box_shadow',
                'selector' => '{{WRAPPER}} .icodito-product-support-btn',
            )
        );

        $this->add_control(
            'button_border_radius',
            array(
                'label'      => 'گردی گوشه (px)',
                'type'       => Controls_Manager::SLIDER,
                'size_units' => array('px', 'em', '%'),
                'range'      => array(
                    'px' => array('min' => 0, 'max' => 100),
                ),
                'selectors'  => array(
                    '{{WRAPPER}} .icodito-product-support-btn' => 'border-radius: {{SIZE}}{{UNIT}};',
                ),
            )
        );

        $this->add_responsive_control(
            'button_padding',
            array(
                'label'      => 'پدینگ',
                'type'       => Controls_Manager::DIMENSIONS,
                'size_units' => array('px', 'em', '%'),
                'selectors'  => array(
                    '{{WRAPPER}} .icodito-product-support-btn' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ),
            )
        );

        $this->add_responsive_control(
            'button_margin',
            array(
                'label'      => 'مارجین',
                'type'       => Controls_Manager::DIMENSIONS,
                'size_units' => array('px', 'em', '%'),
                'selectors'  => array(
                    '{{WRAPPER}} .icodito-product-support-btn' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
                ),
            )
        );

        $this->end_controls_section();
    }

    protected function render() {
        $settings = $this->get_settings_for_display();

        $product_id = absint($settings['product_id']);
        if (!$product_id) {
            global $product;
            if ($product && is_a($product, 'WC_Product')) {
                $product_id = absint($product->get_id());
            } else {
                $product_id = get_the_ID();
            }
        }

        if (!$product_id) {
            return;
        }

        $args = array(
            'class'  => 'icodito-elementor-button',
            'text'   => !empty($settings['button_text']) ? $settings['button_text'] : 'ارتباط با پشتیبانی محصول',
            'icon'   => ($settings['show_icon'] === 'yes'),
            'target' => !empty($settings['target']) ? $settings['target'] : '_blank',
        );

        $html = icodito_ps_get_button_html($product_id, $args, false);

        echo !empty($html) ? $html : '<div class="icodito-ps-elementor-empty">پشتیبانی برای این محصول فعال نیست.</div>';
    }
}
WIDGET_CODE;

        file_put_contents($file_path, $widget_code);
    }
}
add_action('init', 'icodito_ps_create_elementor_widget_file', 5);

if (!function_exists('icodito_ps_enqueue_elementor_assets')) {
    function icodito_ps_enqueue_elementor_assets()
    {
        if (!did_action('elementor/loaded')) {
            return;
        }

        wp_register_style(
            'icodito-ps-elementor',
            false,
            array(),
            ICODITO_PS_VERSION
        );

        $css = '
            .elementor-widget-icodito_product_support .icodito-product-support-btn {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                text-decoration: none;
                transition: all 0.25s ease;
            }
            .elementor-widget-icodito_product_support .icodito-product-support-btn:hover {
                transform: translateY(-2px);
                box-shadow: 0 6px 20px rgba(0,0,0,0.15);
            }
            .elementor-widget-icodito_product_support .icodito-product-support-btn svg {
                width: 1em;
                height: 1em;
                flex-shrink: 0;
            }
            .icodito-ps-elementor-empty {
                padding: 12px 16px;
                background: #fef3c7;
                border: 1px solid #fcd34d;
                border-radius: 8px;
                color: #92400e;
                font-size: 13px;
                text-align: center;
            }
        ';
        wp_add_inline_style('icodito-ps-elementor', $css);

        wp_enqueue_style('icodito-ps-elementor');
    }
}
add_action('elementor/frontend/after_enqueue_styles', 'icodito_ps_enqueue_elementor_assets');
add_action('elementor/editor/after_enqueue_styles', 'icodito_ps_enqueue_elementor_assets');

if (!function_exists('icodito_ps_frontend_styles')) {
    function icodito_ps_frontend_styles()
    {
        if (!is_product() && !is_singular() && !is_page())
            return;
        ?>
        <style>
            .icodito-product-support-btn {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                width: 100%;
                max-width: 100%;
                margin-top: 10px;
                text-decoration: none;
                text-align: center;
                cursor: pointer;
                box-sizing: border-box;
                transition: all .25s cubic-bezier(.4, 0, .2, 1);

                color: var(--ips-btn-text, #ffffff);
                background: var(--ips-btn-bg, #6366f1);
                border: var(--ips-btn-border, none);
                border-radius: var(--ips-btn-radius, 12px);
                padding: var(--ips-btn-padding, 14px 24px);
                font-size: var(--ips-btn-font-size, 15px);
                font-weight: var(--ips-btn-font-weight, 600);
                box-shadow: var(--ips-btn-shadow, 0 4px 14px rgba(99, 102, 241, .35));
            }

            .icodito-product-support-btn svg {
                flex-shrink: 0;
                width: 1.1em;
                height: 1.1em;
                transition: transform .25s ease;
            }

            .icodito-product-support-btn:hover {
                color: var(--ips-btn-hover-text, #ffffff);
                background: var(--ips-btn-hover-bg, #4f46e5);
                box-shadow: var(--ips-btn-hover-shadow, 0 8px 22px rgba(99, 102, 241, .45));
                transform: translateY(-2px);
            }

            .icodito-product-support-btn:hover svg {
                transform: scale(1.1);
            }

            .icodito-product-support-btn:focus {
                outline: 2px solid currentColor;
                outline-offset: 2px;
            }

            .icodito-product-support-btn:active {
                transform: translateY(0);
            }

            .icodito-product-support-btn .icodito-ps-btn-text {
                line-height: 1.6;
            }

            @media (max-width: 768px) {
                .icodito-product-support-btn {
                    font-size: calc(var(--ips-btn-font-size, 15px) - 1px);
                }
            }

            /* حالت المنتور */
            .icodito-elementor-button {
                width: auto;
            }
        </style>
        <?php
    }
}
add_action('wp_head', 'icodito_ps_frontend_styles', 100);

if (!function_exists('icodito_ps_render_out_of_stock_button')) {
    function icodito_ps_render_out_of_stock_button()
    {
        global $product;

        if (!$product || !is_a($product, 'WC_Product')) {
            return;
        }

        if ($product->is_in_stock()) {
            return;
        }

        $global = icodito_ps_get_global_settings();
        if (empty($global['auto_display']) || empty($global['show_on_out_of_stock'])) {
            return;
        }

        $product_id = absint($product->get_id());

        if (!empty($GLOBALS['icodito_ps_displayed_buttons'][$product_id])) {
            return;
        }

        $support = icodito_ps_resolve_product_support($product_id);
        if (empty($support)) {
            return;
        }

        $GLOBALS['icodito_ps_displayed_buttons'][$product_id] = true;
        echo icodito_ps_get_button_html($product_id);
    }
}

foreach (array('simple', 'variable', 'grouped', 'external') as $icodito_ps_type) {
    add_action(
        'woocommerce_' . $icodito_ps_type . '_add_to_cart',
        'icodito_ps_render_out_of_stock_button',
        31
    );
}

if (!function_exists('icodito_ps_get_stats')) {
    function icodito_ps_get_stats()
    {
        $categories = icodito_ps_get_main_categories();
        $total = count($categories);
        $active = 0;
        $valid = 0;

        foreach ($categories as $cat) {
            if (icodito_ps_is_category_support_valid($cat->term_id)) {
                $active++;
                $valid++;
            } elseif (icodito_ps_get_category_settings($cat->term_id)['enabled']) {
                $active++;
            }
        }

        return array(
            'total' => $total,
            'active' => $active,
            'valid' => $valid,
            'needs_review' => max(0, $active - $valid),
        );
    }
}

نکته: کد را کامل وارد کنید و بخش‌های آن را حذف نکنید. پیش از فعال سازی در سایت اصلی، از اطلاعات سایت نسخه پشتیبان تهیه کنید.

  • اضافه شدن 6 طرح استایل دکمه پشتیبانی
  • اضافه شدن شورت کد جهت استفاده در هر جای قالب سایت و المنتور
  • اضافه شدن ویجت المنتور
  • نمایش/عدم نمایش دکمه در محصولات ناموجود
  • امکان شخصی سازی استایل دکمه از تب مخصوص استایل دکمه در تنظیمات همراه با پیشنمایش زنده