<?php
ini_set('display_errors', 1);
error_reporting(E_ALL);

// blog.php - صفحة المدونة مع دعم اللغات المتقدم
try {
    require_once 'config.php';
    require_once 'functions.php';

    if (defined('DEBUG_MODE') && DEBUG_MODE) {
        error_log("blog.php: Starting to load");
    }

    // إنشاء اتصال قاعدة البيانات
    $db = new Database();

    if (!$db->isConnected()) {
        throw new Exception("فشل في الاتصال بقاعدة البيانات");
    }

    // تحديد اللغة الحالية
    $current_language = getCurrentLanguage();

    // معالجة البحث
    $search = null;
    if (isset($_GET['search'])) {
        $search_input = trim($_GET['search']);

        // إذا كان البحث فارغ، إعادة توجيه لإزالة معامل البحث
        if (empty($search_input)) {
            $redirect_url = "blog.php?lang=" . $current_language;
            if (isset($_GET['page']) && $_GET['page'] > 1) {
                $redirect_url .= "&page=" . (int)$_GET['page'];
            }
            header("Location: $redirect_url");
            exit;
        }

        // التحقق من الحد الأدنى لطول البحث
        if (strlen($search_input) >= 2) {
            $search = sanitize($search_input);
        }
    }

    // الصفحة الحالية
    $page = isset($_GET['page']) && is_numeric($_GET['page']) ? max(1, (int)$_GET['page']) : 1;

    // عدد المقالات في كل صفحة (9 مقالات)
    $articles_per_page = 9;
    $offset = ($page - 1) * $articles_per_page;

    // جلب المقالات المنشورة حسب اللغة
    $articles = $db->getPublishedArticles($articles_per_page, $offset, $search, $current_language);
    $total_articles = $db->countPublishedArticles($search, $current_language);
    $total_pages = ceil($total_articles / $articles_per_page);

    // معلومات الصفحة للـ SEO
    if ($current_language === 'ar') {
        $page_title = $search ? "البحث: $search - مدونة NiceChat" : "مدونة NiceChat - حلول خدمة العملاء الذكية";
        $page_description = $search ?
            "نتائج البحث عن: $search في مدونة NiceChat" :
            "اكتشف أحدث المقالات والأخبار حول الذكاء الاصطناعي وحلول خدمة العملاء الذكية مع NiceChat";
    } else {
        $page_title = $search ? "Search: $search - NiceChat Blog" : "NiceChat Blog - Smart Customer Service Solutions";
        $page_description = $search ?
            "Search results for: $search in NiceChat Blog" :
            "Discover the latest articles and news about artificial intelligence and smart customer service solutions with NiceChat";
    }

    if (defined('DEBUG_MODE') && DEBUG_MODE) {
        error_log("blog.php: Found $total_articles articles in $current_language, showing " . count($articles) . " articles");
    }
} catch (Exception $e) {
    error_log("blog.php error: " . $e->getMessage());

    if (defined('DEBUG_MODE') && DEBUG_MODE) {
        die("خطأ في تحميل المدونة: " . $e->getMessage());
    } else {
        $articles = [];
        $total_articles = 0;
        $total_pages = 0;
        $current_language = 'en';
        $page_title = "NiceChat Blog";
        $page_description = "Discover the latest developments in artificial intelligence";
    }
}
?>

<!DOCTYPE html>
<html lang="<?php echo $current_language; ?>" dir="<?php echo $current_language === 'ar' ? 'rtl' : 'ltr'; ?>">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo htmlspecialchars($page_title); ?></title>
    <meta name="description" content="<?php echo htmlspecialchars($page_description); ?>">
    <meta name="keywords" content="artificial intelligence, customer service, tech blog, NiceChat">

    <!-- Open Graph Meta Tags -->
    <meta property="og:title" content="<?php echo htmlspecialchars($page_title); ?>">
    <meta property="og:description" content="<?php echo htmlspecialchars($page_description); ?>">
    <meta property="og:type" content="website">
    <meta property="og:site_name" content="NiceChat">

    <!-- Twitter Meta Tags -->
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="<?php echo htmlspecialchars($page_title); ?>">
    <meta name="twitter:description" content="<?php echo htmlspecialchars($page_description); ?>">

    <!-- Fonts and Icons -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <link rel="stylesheet" href="css/style-blog.css">
</head>

<body>
    <!-- Header -->
    <header>
        <div class="header-container">
            <div class="logo" onclick="window.location.href='index.html'" role="button" tabindex="0">
                <img src="image/logo-header.png" alt="NiceChat" onerror="this.style.display='none'; this.nextElementSibling.style.display='block';" />
                <div class="logo-text" style="display: none">NiceChat</div>
            </div>

            <nav class="nav-menu" role="navigation" aria-label="Main Navigation">
                <a href="index.html" class="nav-link" data-key="home"><?php echo getTextTranslation('الرئيسية', 'Home'); ?></a>
                <a href="about.html" class="nav-link" data-key="howItWorks"><?php echo getTextTranslation('كيف يعمل؟', 'How It Works?'); ?></a>
                <a href="features.html" class="nav-link" data-key="features"><?php echo getTextTranslation('المميزات', 'Features'); ?></a>
                <a href="benefits.html" class="nav-link" data-key="benefits"><?php echo getTextTranslation('الفوائد', 'Benefits'); ?></a>
                <a href="pricing.html" class="nav-link" data-key="pricing"><?php echo getTextTranslation('الأسعار', 'Pricing'); ?></a>
                <a href="blog.php?lang=<?php echo $current_language; ?>" class="nav-link active" data-key="nicechatSpace"><?php echo getTextTranslation('مساحة NiceChat', 'NiceChat Space'); ?></a>
                <a href="contact.html" class="nav-link" data-key="contactUs"><?php echo getTextTranslation('اتصل بنا', 'Contact Us'); ?></a>
                <button class="cta-button" onclick="openModal()" data-key="tryFreeNow">
                    <?php echo getTextTranslation('جرّب مجاناً الآن', 'Try Free Now'); ?>
                </button>
            </nav>

            <div class="header-actions">
                <button class="language-toggle" id="languageToggle" aria-label="Switch Language" onclick="toggleLanguage()">
                    <svg class="globe-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <circle cx="12" cy="12" r="10"></circle>
                        <path d="M2 12h20M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path>
                    </svg>
                    <span class="lang-text"><?php echo $current_language === 'ar' ? 'English' : 'العربية'; ?></span>
                </button>
                <button class="mobile-menu-btn" onclick="toggleMobileMenu()" aria-label="Open Menu">
                    ☰
                </button>
            </div>
        </div>
    </header>

    <!-- Mobile Menu -->
    <div class="mobile-menu" id="mobileMenu">
        <nav class="mobile-nav-links" role="navigation" aria-label="Mobile Menu">
            <a href="index.html" class="nav-link" data-key="home"><?php echo getTextTranslation('الرئيسية', 'Home'); ?></a>
            <a href="about.html" class="nav-link" data-key="howItWorks"><?php echo getTextTranslation('كيف يعمل؟', 'How It Works?'); ?></a>
            <a href="features.html" class="nav-link" data-key="features"><?php echo getTextTranslation('المميزات', 'Features'); ?></a>
            <a href="benefits.html" class="nav-link" data-key="benefits"><?php echo getTextTranslation('الفوائد', 'Benefits'); ?></a>
            <a href="pricing.html" class="nav-link" data-key="pricing"><?php echo getTextTranslation('الأسعار', 'Pricing'); ?></a>
            <a href="blog.php?lang=<?php echo $current_language; ?>" class="nav-link active" data-key="nicechatSpace"><?php echo getTextTranslation('مساحة NiceChat', 'NiceChat Space'); ?></a>
            <a href="contact.html" class="nav-link" data-key="contactUs"><?php echo getTextTranslation('اتصل بنا', 'Contact Us'); ?></a>
            <button class="cta-button" onclick="openModal(); toggleMobileMenu();" style="margin-top: 1rem;" data-key="tryFreeNow">
                <?php echo getTextTranslation('جرّب مجاناً الآن', 'Try Free Now'); ?>
            </button>
        </nav>
    </div>

    <!-- Blog Hero Section -->
    <section class="blog-hero">
        <div class="hero-content">
            <h1 class="hero-title" data-key="blogTitle"><?php echo getTextTranslation('مساحة NiceChat', 'NiceChat Space'); ?></h1>
            <p class="hero-subtitle" data-key="blogSubtitle"><?php echo getTextTranslation('اكتشف أحدث المقالات والأخبار حول الذكاء الاصطناعي وتقنيات خدمة العملاء الذكية', 'Discover the latest articles and news about artificial intelligence and smart customer service technologies'); ?></p>

            <!-- Search Container -->
            <div class="search-container">
                <form class="search-form" method="GET" action="" id="searchForm">
                    <input type="hidden" name="lang" value="<?php echo $current_language; ?>">
                    <input
                        type="text"
                        class="search-input"
                        name="search"
                        data-key="searchPlaceholder"
                        placeholder="<?php echo getTextTranslation('ابحث في المقالات...', 'Search articles...'); ?>"
                        value="<?php echo htmlspecialchars($search ?? ''); ?>"
                        id="searchInput"
                        autocomplete="off">
                    <button type="submit" class="search-btn" id="searchBtn">
                        <i class="fas fa-search"></i> <span data-key="searchBtn"><?php echo getTextTranslation('بحث', 'Search'); ?></span>
                    </button>
                </form>
            </div>
        </div>
    </section>

    <!-- Main Content -->
    <main class="main-content">
        <!-- Search Results Info -->
        <?php if ($search): ?>
            <div class="search-info">
                <h3 data-key="searchResultsFor">
                    <i class="fas fa-search"></i>
                    <?php echo getTextTranslation('نتائج البحث عن:', 'Search results for:'); ?> "<?php echo htmlspecialchars($search); ?>"
                </h3>
                <p>
                    <span data-key="foundArticles"><?php echo getTextTranslation('تم العثور على', 'Found'); ?></span>
                    <?php echo $total_articles; ?>
                    <span data-key="articles"><?php echo $current_language === 'ar' ? ($total_articles == 1 ? 'مقال' : 'مقالة') : ($total_articles == 1 ? 'article' : 'articles'); ?></span>
                </p>
                <a href="blog.php?lang=<?php echo $current_language; ?>" class="clear-search">
                    <i class="fas fa-times"></i> <span data-key="clearSearch"><?php echo getTextTranslation('مسح البحث', 'Clear search'); ?></span>
                </a>
            </div>
        <?php endif; ?>

        <?php if (empty($articles)): ?>
            <div class="empty-state">
                <i class="fas fa-search"></i>
                <h3 data-key="noArticlesFound"><?php echo getTextTranslation('لم يتم العثور على مقالات', 'No articles found'); ?></h3>
                <p>
                    <?php if ($search): ?>
                        <span data-key="noMatchingArticles"><?php echo getTextTranslation('لا توجد مقالات تطابق بحثك:', 'No articles match your search:'); ?> "<?php echo htmlspecialchars($search); ?>"</span>
                        <br><a href="blog.php?lang=<?php echo $current_language; ?>" data-key="viewAllArticles"><?php echo getTextTranslation('عرض جميع المقالات', 'View all articles'); ?></a>
                    <?php else: ?>
                        <span data-key="noPublishedArticles"><?php echo getTextTranslation('لا توجد مقالات منشورة حالياً', 'No published articles currently'); ?></span>
                    <?php endif; ?>
                </p>
            </div>
        <?php else: ?>
            <!-- Blog Grid -->
            <div class="blog-grid">
                <?php foreach ($articles as $article): ?>
                    <article class="blog-card" onclick="location.href='article.php?id=<?php echo $article['id']; ?>&lang=<?php echo $current_language; ?>'" tabindex="0" role="button">
                        <div class="blog-image">
                            <?php if ($article['imagefeatured']): ?>
                                <img
                                    src="<?php echo htmlspecialchars($article['imagefeatured']); ?>"
                                    alt="<?php echo htmlspecialchars($article['title']); ?>"
                                    loading="lazy"
                                    onerror="this.src='https://via.placeholder.com/400x220/77bd20/ffffff?text=NiceChat'">
                            <?php else: ?>
                                <img src="https://via.placeholder.com/400x220/77bd20/ffffff?text=NiceChat" alt="NiceChat" loading="lazy">
                            <?php endif; ?>
                        </div>
                        <div class="blog-content">
                            <h3 class="blog-title"><?php echo htmlspecialchars($article['title']); ?></h3>
                            <p class="blog-excerpt">
                                <?php echo createExcerpt($article['content'], 120); ?>
                            </p>
                            <div class="blog-meta">
                                <div class="blog-date">
                                    <i class="far fa-calendar"></i>
                                    <span><?php echo formatDateByLang($article['created_at'], $current_language); ?></span>
                                </div>
                                <a href="article.php?id=<?php echo $article['id']; ?>&lang=<?php echo $current_language; ?>" class="read-more" onclick="event.stopPropagation()" data-key="readMore">
                                    <?php echo getTextTranslation('اقرأ المزيد', 'Read more'); ?>
                                </a>
                            </div>
                        </div>
                    </article>
                <?php endforeach; ?>
            </div>

            <!-- Pagination -->
            <?php if ($total_pages > 1): ?>
                <div class="pagination-container">
                    <nav class="pagination">
                        <!-- Previous Page -->
                        <?php if ($page > 1): ?>
                            <a href="?page=<?php echo ($page - 1); ?>&lang=<?php echo $current_language; ?><?php echo $search ? '&search=' . urlencode($search) : ''; ?>" title="<?php echo getTextTranslation('الصفحة السابقة', 'Previous page'); ?>">
                                <i class="fas fa-chevron-<?php echo $current_language === 'ar' ? 'right' : 'left'; ?>"></i>
                            </a>
                        <?php else: ?>
                            <span class="disabled">
                                <i class="fas fa-chevron-<?php echo $current_language === 'ar' ? 'right' : 'left'; ?>"></i>
                            </span>
                        <?php endif; ?>

                        <!-- Page Numbers -->
                        <?php
                        $start_page = max(1, $page - 2);
                        $end_page = min($total_pages, $page + 2);

                        // First page
                        if ($start_page > 1): ?>
                            <a href="?page=1&lang=<?php echo $current_language; ?><?php echo $search ? '&search=' . urlencode($search) : ''; ?>">1</a>
                            <?php if ($start_page > 2): ?>
                                <span class="dots">...</span>
                            <?php endif;
                        endif;

                        // Middle pages
                        for ($i = $start_page; $i <= $end_page; $i++):
                            if ($i == $page): ?>
                                <span class="current"><?php echo $i; ?></span>
                            <?php else: ?>
                                <a href="?page=<?php echo $i; ?>&lang=<?php echo $current_language; ?><?php echo $search ? '&search=' . urlencode($search) : ''; ?>"><?php echo $i; ?></a>
                            <?php endif;
                        endfor;

                        // Last page
                        if ($end_page < $total_pages):
                            if ($end_page < $total_pages - 1): ?>
                                <span class="dots">...</span>
                            <?php endif; ?>
                            <a href="?page=<?php echo $total_pages; ?>&lang=<?php echo $current_language; ?><?php echo $search ? '&search=' . urlencode($search) : ''; ?>"><?php echo $total_pages; ?></a>
                        <?php endif; ?>

                        <!-- Next Page -->
                        <?php if ($page < $total_pages): ?>
                            <a href="?page=<?php echo ($page + 1); ?>&lang=<?php echo $current_language; ?><?php echo $search ? '&search=' . urlencode($search) : ''; ?>" title="<?php echo getTextTranslation('الصفحة التالية', 'Next page'); ?>">
                                <i class="fas fa-chevron-<?php echo $current_language === 'ar' ? 'left' : 'right'; ?>"></i>
                            </a>
                        <?php else: ?>
                            <span class="disabled">
                                <i class="fas fa-chevron-<?php echo $current_language === 'ar' ? 'left' : 'right'; ?>"></i>
                            </span>
                        <?php endif; ?>
                    </nav>
                </div>
            <?php endif; ?>
        <?php endif; ?>
    </main>

    <!-- Footer -->
    <footer>
        <div class="footer-container">
            <div class="footer-section">
                <div class="logo" style="margin-bottom: 2rem">
                    <img src="image/logo-footer.PNG" alt="NiceChat" style="height: 100px; filter: brightness(0) invert(1)" onerror="this.style.display='none'; this.nextElementSibling.style.display='block';" />
                    <div class="logo-text" style="display: none">NiceChat</div>
                </div>
                <p data-key="nicechatDescription">
                    <?php echo getTextTranslation('منصة محادثة ذكية تحول تفاعل عملائك إلى تجربة استثنائية بالذكاء الاصطناعي المتطور.', 'A smart chat platform that transforms your customer interactions into an exceptional experience with advanced artificial intelligence.'); ?>
                </p>

                <div class="social-links">
                    <a href="https://wa.me/966590086017" title="WhatsApp" aria-label="Contact us via WhatsApp">
                        <svg viewBox="0 0 24 24" fill="currentColor">
                            <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 0020.51 3.49" />
                        </svg>
                    </a>
                    <a href="https://www.facebook.com/profile.php?id=61579354556119" title="Facebook" aria-label="Follow us on Facebook">
                        <svg viewBox="0 0 24 24" fill="currentColor">
                            <path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z" />
                        </svg>
                    </a>
                    <a href="https://www.tiktok.com/@nice.chat4" title="TikTok" aria-label="Follow us on TikTok">
                        <svg viewBox="0 0 24 24" fill="currentColor">
                            <path d="M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.15 1.07-.14 1.61.24 1.64 1.82 3.02 3.5 2.87 1.12-.01 2.19-.66 2.77-1.61.19-.33.4-.67.41-1.06.1-1.79.06-3.57.07-5.36.01-4.03-.01-8.05.02-12.07z" />
                        </svg>
                    </a>
                    <a href="https://www.instagram.com/nicechatai/" title="Instagram" aria-label="Follow us on Instagram">
                        <svg viewBox="0 0 24 24" fill="currentColor">
                            <path d="M11.999 7.377a4.623 4.623 0 100 9.248 4.623 4.623 0 000-9.248zm0 7.627a3.004 3.004 0 110-6.008 3.004 3.004 0 010 6.008z" />
                            <circle cx="16.806" cy="7.207" r="1.078" />
                            <path d="M20.533 6.111A4.605 4.605 0 0017.9 3.479a6.606 6.606 0 00-2.186-.42c-.963-.042-1.268-.054-3.71-.054s-2.755 0-3.71.054a6.554 6.554 0 00-2.184.42 4.6 4.6 0 00-2.633 2.632 6.585 6.585 0 00-.419 2.186c-.043.962-.056 1.267-.056 3.71 0 2.442 0 2.753.056 3.71.015.748.156 1.486.419 2.187a4.61 4.61 0 002.634 2.632 6.584 6.584 0 002.185.45c.963.042 1.268.055 3.71.055s2.755 0 3.71-.055a6.615 6.615 0 002.186-.419 4.613 4.613 0 002.633-2.633c.263-.7.404-1.438.419-2.186.043-.962.056-1.267.056-3.71s0-2.753-.056-3.71a6.581 6.581 0 00-.421-2.217zm-1.218 9.532a5.043 5.043 0 01-.311 1.688 2.987 2.987 0 01-1.712 1.711 4.985 4.985 0 01-1.67.311c-.95.044-1.218.055-3.654.055-2.438 0-2.687 0-3.655-.055a4.96 4.96 0 01-1.669-.311 2.985 2.985 0 01-1.719-1.711 5.08 5.08 0 01-.311-1.669c-.043-.95-.053-1.218-.053-3.654 0-2.437 0-2.686.053-3.655a5.038 5.038 0 01.311-1.687c.305-.789.93-1.41 1.719-1.712a5.01 5.01 0 011.669-.311c.951-.043 1.218-.055 3.655-.055s2.687 0 3.654.055a4.960 01.67.311 2.991 2.991 0 011.712 1.712 5.08 5.08 0 01.311 1.669c.043.951.054 1.218.054 3.655 0 2.436 0 2.698-.043 3.654h-.011z" />
                        </svg>
                    </a>
                </div>
            </div>

            <div class="footer-section">
                <h3 data-key="quickLinks"><?php echo getTextTranslation('روابط سريعة', 'Quick Links'); ?></h3>
                <ul class="footer-links">
                    <li><a href="index.html" data-key="home"><?php echo getTextTranslation('الرئيسية', 'Home'); ?></a></li>
                    <li><a href="about.html" data-key="howItWorks"><?php echo getTextTranslation('كيف يعمل؟', 'How It Works?'); ?></a></li>
                    <li><a href="features.html" data-key="features"><?php echo getTextTranslation('المميزات', 'Features'); ?></a></li>
                    <li><a href="benefits.html" data-key="benefits"><?php echo getTextTranslation('الفوائد', 'Benefits'); ?></a></li>
                    <li><a href="pricing.html" data-key="pricing"><?php echo getTextTranslation('الأسعار', 'Pricing'); ?></a></li>
                </ul>
            </div>

            <div class="footer-section">
                <h3 data-key="ourServices"><?php echo getTextTranslation('خدماتنا', 'Our Services'); ?></h3>
                <ul class="footer-links">
                    <li><a href="#" data-key="whatsappIntegration"><?php echo getTextTranslation('التكامل مع واتساب', 'WhatsApp Integration'); ?></a></li>
                    <li><a href="#" data-key="facebookMessenger"><?php echo getTextTranslation('فيسبوك ماسنجر', 'Facebook Messenger'); ?></a></li>
                    <li><a href="#" data-key="instagramSupport"><?php echo getTextTranslation('دعم إنستجرام', 'Instagram Support'); ?></a></li>
                    <li><a href="#" data-key="integrationWithAllSystems"><?php echo getTextTranslation('الربط مع جميع الأنظمة', 'Integration with All Systems'); ?></a></li>
                    <li><a href="#" data-key="trainingAndConsulting"><?php echo getTextTranslation('التدريب والاستشارة', 'Training and Consulting'); ?></a></li>
                </ul>
            </div>

            <div class="footer-section">
                <h3 data-key="supportAndHelp"><?php echo getTextTranslation('الدعم والمساعدة', 'Support and Help'); ?></h3>
                <ul class="footer-links">
                    <li><a href="contact.html" data-key="contactUs"><?php echo getTextTranslation('اتصل بنا', 'Contact Us'); ?></a></li>
                    <li><a href="#" data-key="helpCenter"><?php echo getTextTranslation('مركز المساعدة', 'Help Center'); ?></a></li>
                    <li><a href="#" data-key="userGuide"><?php echo getTextTranslation('دليل الاستخدام', 'User Guide'); ?></a></li>
                    <li><a href="#" data-key="technicalDocumentation"><?php echo getTextTranslation('التوثيق التقني', 'Technical Documentation'); ?></a></li>
                    <li><a href="#" data-key="faq"><?php echo getTextTranslation('الأسئلة الشائعة', 'FAQ'); ?></a></li>
                    <li><a href="privacy.html" data-key="privacyPolicy"><?php echo getTextTranslation('سياسة الخصوصية', 'Privacy Policy'); ?></a></li>
                </ul>
            </div>
        </div>

        <div class="footer-bottom">
            <p data-key="footerCopyright">
                <?php echo getTextTranslation('&copy; 2025 NiceChat. جميع الحقوق محفوظة - مدعوم من', '&copy; 2025 NiceChat. All rights reserved - Powered by'); ?>
                <a href="https://novayai.com/" target="_blank">NOVAYAI</a>
            </p>
        </div>
    </footer>

    <script>
        // ==========================================
        // تزامن اللغة من PHP إلى JavaScript و localStorage
        // ==========================================
        (function() {
            const phpLang = "<?php echo $current_language; ?>";
            const storedLang = localStorage.getItem("nicechat_language");

            // تحديث localStorage ليطابق PHP
            if (storedLang !== phpLang) {
                localStorage.setItem("nicechat_language", phpLang);
            }

            // إذا لم يكن هناك معامل lang في URL وكان localStorage مختلف
            const urlParams = new URLSearchParams(window.location.search);
            if (!urlParams.has('lang') && storedLang && storedLang !== phpLang) {
                const newUrl = 'blog.php?lang=' + storedLang +
                    (urlParams.has('search') ? '&search=' + encodeURIComponent(urlParams.get('search')) : '') +
                    (urlParams.has('page') ? '&page=' + urlParams.get('page') : '');
                window.location.href = newUrl;
            }
        })();

        let currentLang = "<?php echo $current_language; ?>";

        function toggleLanguage() {
            const newLang = currentLang === "ar" ? "en" : "ar";
            localStorage.setItem("nicechat_language", newLang);
            const currentUrl = new URL(window.location.href);
            currentUrl.searchParams.set('lang', newLang);
            window.location.href = currentUrl.toString();
        }

        function toggleMobileMenu() {
            const mobileMenu = document.getElementById("mobileMenu");
            const toggle = document.querySelector(".mobile-menu-btn");

            if (mobileMenu && toggle) {
                mobileMenu.classList.toggle("active");
                toggle.classList.toggle("active");
                document.body.style.overflow = mobileMenu.classList.contains("active") ? "hidden" : "auto";
            }
        }

        function openModal() {
            window.location.href = "index.html#services";
        }

        document.addEventListener('DOMContentLoaded', function() {
            // Setup search functionality
            const searchForm = document.getElementById('searchForm');
            const searchInput = document.getElementById('searchInput');
            const searchBtn = document.getElementById('searchBtn');

            if (searchForm && searchInput && searchBtn) {
                searchForm.addEventListener('submit', function(e) {
                    const searchTerm = searchInput.value.trim();

                    if (searchTerm.length === 0) {
                        e.preventDefault();
                        window.location.href = 'blog.php?lang=' + currentLang;
                        return false;
                    }

                    if (searchTerm.length < 2) {
                        e.preventDefault();
                        alert(currentLang === 'ar' ?
                            'يرجى إدخال حرفين على الأقل للبحث' :
                            'Please enter at least 2 characters to search'
                        );
                        searchInput.focus();
                        return false;
                    }

                    searchBtn.classList.add('loading');
                    searchBtn.disabled = true;
                    return true;
                });

                if (searchInput.value.trim()) {
                    searchInput.focus();
                    searchInput.select();
                }
            }

            // Setup card interactions
            document.querySelectorAll('.blog-card').forEach(card => {
                card.addEventListener('keydown', function(e) {
                    if (e.key === 'Enter' || e.key === ' ') {
                        e.preventDefault();
                        this.click();
                    }
                });
            });

            // Setup image error handling
            document.querySelectorAll('.blog-image img').forEach(img => {
                img.addEventListener('error', function() {
                    this.src = 'https://via.placeholder.com/400x220/77bd20/ffffff?text=NiceChat';
                    this.alt = 'NiceChat - Default image';
                });
            });

            // Setup click outside mobile menu
            window.onclick = function(event) {
                const mobileMenu = document.getElementById('mobileMenu');
                const mobileMenuBtn = document.querySelector('.mobile-menu-btn');

                if (mobileMenu && mobileMenuBtn &&
                    !mobileMenu.contains(event.target) &&
                    !mobileMenuBtn.contains(event.target) &&
                    mobileMenu.classList.contains('active')) {
                    toggleMobileMenu();
                }
            };

            // Setup escape key
            document.addEventListener('keydown', function(e) {
                if (e.key === 'Escape') {
                    const mobileMenu = document.getElementById('mobileMenu');
                    if (mobileMenu && mobileMenu.classList.contains('active')) {
                        toggleMobileMenu();
                    }
                }
            });

            console.log('NiceChat Blog loaded - Language: ' + currentLang);
            console.log('Total articles: <?php echo $total_articles; ?>');
            console.log('Current page: <?php echo $page; ?>');
        });
    </script>
    <script defer src="https://app.fastbots.ai/embed.js" data-bot-id="cmfsltloz07vxqi1koft8ebhk"></script>
    <script src="js/script-blog.js"></script>
</body>

</html>