<?php
// Prevent Browser Caching
header("Cache-Control: no-cache, no-store, must-revalidate");
header("Pragma: no-cache");
header("Expires: 0");

if (session_status() === PHP_SESSION_NONE) {
    session_start();
}
require_once 'db_connect.php';
require_once 'lang.php';

if (!function_exists('getYoutubeEmbedUrl')) {
    function getYoutubeEmbedUrl($url) {
        if (empty($url)) return '';
        $pattern = '/(?:youtube\.com\/(?:[^\/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\.be\/)([^"&?\/\s]{11})/i';
        if (preg_match($pattern, $url, $matches)) {
            return 'https://www.youtube.com/embed/' . $matches[1];
        }
        return $url;
    }
}

$current_lang_code = $_GET['lang'] ?? ($current_lang ?? 'en');
$lang_url_param = !empty($current_lang_code) ? '&lang=' . urlencode($current_lang_code) : '';
$bestsellers = $conn->query("SELECT * FROM products WHERE is_bestseller = 1 ORDER BY id DESC");
?>
<!DOCTYPE html>
<html lang="<?= htmlspecialchars($current_lang_code) ?>" dir="<?= htmlspecialchars($lang_dir ?? 'ltr') ?>">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MicronUP | <?= __t('home') ?></title>
    <link rel="stylesheet" href="assets/css/style.css?v=<?= time(); ?>">

    <style>
        body { margin: 0; font-family: sans-serif; background: #fafafa; color: #1a1a1a; }
        .section-container { max-width: 1200px; margin: 70px auto; padding: 0 20px; }
        
        /* تحديثات معرض الصور */
        .news-ticker-container { width: 100%; overflow: hidden; background: #fff; padding: 30px 0; }
        
        .news-ticker-track { 
            display: flex !important; 
            gap: 25px; 
            width: max-content; 
            animation: scroll 30s linear infinite; 
        }
        
        .news-ticker-container:hover .news-ticker-track { animation-play-state: paused; }
        
        .news-ticker-track img {
            width: 450px; 
            height: 300px; 
            object-fit: cover; 
            border-radius: 15px; 
            display: block;
            cursor: pointer; 
            transition: transform 0.4s ease;
            box-shadow: 0 5px 15px rgba(0,0,0,0.2);
        }
        
        .news-ticker-track img:hover { transform: scale(1.05); }

        @keyframes scroll {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }

        /* تحسينات للهواتف */
        @media (max-width: 600px) {
            .news-ticker-track img {
                width: 260px !important; 
                height: 180px !important; 
            }
            .news-ticker-track { gap: 15px; }
            h2 { font-size: 1.5rem !important; }
        }
    </style>
</head>
<body>

    <?php include 'header.php'; ?>
    <?php include 'slider.php'; ?>

    <div style="text-align: center; margin: 40px 0 20px 0; padding: 0 20px;">
        <h2 style="font-size: 2.2rem; color: var(--primary-color); font-weight: 800; margin-bottom: 10px; text-transform: uppercase; letter-spacing: 1px;">
            Our Machinery Gallery
        </h2>
    </div>

    <!-- News Ticker / Gallery Slider -->
    <div class="news-ticker-container">
        <div class="news-ticker-track">
            <img src="images/gallery1.jpg" alt="Work 1">
            <img src="images/gallery2.jpg" alt="Work 2">
            <img src="images/gallery3.jpg" alt="Work 3">
            <img src="images/gallery4.jpg" alt="Work 4">
            <img src="images/gallery5.jpg" alt="Work 5">
            <!-- تكرار الصور -->
            <img src="images/gallery1.jpg" alt="Work 6">
            <img src="images/gallery2.jpg" alt="Work 7">
            <img src="images/gallery3.jpg" alt="Work 8">
            <img src="images/gallery4.jpg" alt="Work 9">
            <img src="images/gallery5.jpg" alt="Work 10">
        </div>
    </div>

    <?php include 'footer.php'; ?>
</body>
</html>