
<!DOCTYPE html>
<html lang="th">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="manifest" href="manifest.json">
    <meta name="theme-color" content="#007bff">

    <!-- Global Styles & Libraries (SweetAlert2 & FontAwesome Version 6) -->
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">

    <!-- Facebook SDK -->
    <script>
      window.fbAsyncInit = function() {
        FB.init({
          appId      : '{your-app-id}',
          cookie     : true,
          xfbml      : true,
          version    : '{api-version}'
        });
        FB.AppEvents.logPageView();   
      };
      (function(d, s, id){
         var js, fjs = d.getElementsByTagName(s)[0];
         if (d.getElementById(id)) {return;}
         js = d.createElement(s); js.id = id;
         js.src = "https://connect.facebook.net/en_US/sdk.js";
         fjs.parentNode.insertBefore(js, fjs);
       }(document, 'script', 'facebook-jssdk'));
    </script>

    <!-- Google Tag (gtag.js) & Google Ads / Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id=AW-487103360"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());

      gtag('config', 'AW-487103360');
      gtag('config', 'G-RC626NN3D5');
    </script>

    <!-- Google AdSense -->
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5624860589101428" crossorigin="anonymous"></script>

    <!-- Ahrefs Analytics -->
    <script src="https://analytics.ahrefs.com/analytics.js" data-key="80zQIAup8IdjfBIGPD9tcQ" async></script>

    <script>
    // ===== VAPID Public Key =====
    const VAPID_PUBLIC_KEY = 'BAmZ5Iv7hz7y3kGiFxMO0GG4AKUQL7PnOTqbMsMsu6CLiJzZZqRo1kIM-KcRE1gaq5fLzT0goSzLC_OD5LZ0s2I';

    // ===== Register Service Worker =====
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', async () => {
        try {
          const reg = await navigator.serviceWorker.register('/sw.js');
          console.log('SW registered successfully');
          
          // ตรวจสอบว่ามี subscription หรือยัง
          const subscription = await reg.pushManager.getSubscription();
          
          // ถ้าล็อกอินอยู่ ให้ส่งข้อมูล subscription ไปยัง server
                  } catch (err) {
          console.warn('SW registration failed:', err);
        }
      });
    }

    // ===== Push Notification Functions =====
    async function requestPushPermission() {
      if (!('Notification' in window)) {
        alert('Browser นี้ไม่รองรับ Push Notification');
        return false;
      }
      
      const permission = await Notification.requestPermission();
      if (permission !== 'granted') {
        showSwal('warning', 'การแจ้งเตือนถูกปฏิเสธ', 'คุณสามารถเปิดการแจ้งเตือนได้ที่ Settings ของ Browser');
        return false;
      }
      
      try {
        const reg = await navigator.serviceWorker.ready;
        const subscription = await reg.pushManager.subscribe({
          userVisibleOnly: true,
          applicationServerKey: urlBase64ToUint8Array(VAPID_PUBLIC_KEY),
        });
        
        await sendSubscriptionToServer(subscription);
        showSwal('success', 'เปิดการแจ้งเตือนแล้ว', 'คุณจะได้รับการแจ้งเตือนสำคัญจากรักประมูล');
        return true;
      } catch (err) {
        console.error('Push subscription failed:', err);
        showSwal('error', 'ไม่สามารถสมัครรับแจ้งเตือน', err.message || 'กรุณาลองอีกครั้ง');
        return false;
      }
    }

    async function unsubscribePush() {
      try {
        const reg = await navigator.serviceWorker.ready;
        const subscription = await reg.pushManager.getSubscription();
        
        if (subscription) {
          // แจ้ง server
          await fetch('/push/unsubscribe.php', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ endpoint: subscription.endpoint }),
          });
          
          // ยกเลิก subscription ที่ browser
          await subscription.unsubscribe();
        }
        
        showSwal('success', 'ปิดการแจ้งเตือนแล้ว', 'คุณจะไม่ได้รับการแจ้งเตือนจากรักประมูล');
        return true;
      } catch (err) {
        console.error('Unsubscribe failed:', err);
        return false;
      }
    }

    // ===== Utility: ArrayBuffer to Base64 URL-Safe =====
    function arrayBufferToBase64Url(buffer) {
      const bytes = new Uint8Array(buffer);
      let binary = '';
      for (let i = 0; i < bytes.length; i++) {
        binary += String.fromCharCode(bytes[i]);
      }
      const base64 = btoa(binary);
      return base64.replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
    }

    async function sendSubscriptionToServer(subscription) {
      try {
        const response = await fetch('/push/subscribe.php', {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify({
            endpoint: subscription.endpoint,
            keys: {
              auth: arrayBufferToBase64Url(subscription.getKey('auth')),
              p256dh: arrayBufferToBase64Url(subscription.getKey('p256dh')),
            },
            device_name: navigator.platform || 'Unknown',
          }),
        });
        const result = await response.json();
        if (result.success) {
          console.log('Push subscription synced with server');
        }
      } catch (err) {
        console.warn('Failed to sync subscription with server:', err);
      }
    }

    // ===== Utility Function =====
    function urlBase64ToUint8Array(base64String) {
      const padding = '='.repeat((4 - base64String.length % 4) % 4);
      const base64 = (base64String + padding)
        .replace(/\-/g, '+')
        .replace(/_/g, '/');
      
      const rawData = window.atob(base64);
      const outputArray = new Uint8Array(rawData.length);
      for (let i = 0; i < rawData.length; ++i) {
        outputArray[i] = rawData.charCodeAt(i);
      }
      return outputArray;
    }

    function showSwal(icon, title, text) {
      if (typeof Swal !== 'undefined') {
        Swal.fire({ icon, title, text, timer: 3000, showConfirmButton: false });
      } else {
        alert(title + ': ' + text);
      }
    }

    // ===== Check Push Permission Status on Load =====
    document.addEventListener('DOMContentLoaded', async () => {
      if ('Notification' in window && 'serviceWorker' in navigator) {
        const subscription = await navigator.serviceWorker.ready
          .then(reg => reg.pushManager.getSubscription())
          .catch(() => null);
        
        // เก็บสถานะไว้ใน data attribute
        document.body.dataset.pushEnabled = subscription ? 'true' : 'false';
        document.body.dataset.pushPermission = Notification.permission;
      }
    });
    </script>

    <title>ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร - รักประมูล</title>
    <meta name="description" content="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร ซอยกาญจนาภิเษก 4 ถนนเลียบวงแหวนรอบนอกฝั่งตะวันออก ตำบลออเงิน อำเภอสายไหม กรุงเทพมหานคร ราคา 7,15...">
    <meta name="keywords" content="เว็บประมูล, ประมูลสินค้า, ประมูลออนไลน์, ประมูลราคาถูก, เว็บประมูลไทย, rakpramool, รักประมูล, ประมูลสินค้าออนไลน์, ลงประมูลสินค้า">
    <link rel="canonical" href="https://rakpramool.com/index.php?id=13393&amp;page=view_market_product">
    <link rel="icon" type="image/x-icon" href="assets/img/favicon.ico" />

    <meta property="og:title" content="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร - รักประมูล">
    <meta property="og:description" content="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร ซอยกาญจนาภิเษก 4 ถนนเลียบวงแหวนรอบนอกฝั่งตะวันออก ตำบลออเงิน อำเภอสายไหม กรุงเทพมหานคร ราคา 7,15...">
    <meta property="og:image" content="https://rakpramool.com/admin/assets/uploads/1783924174_4526_u270_1.jpg">
    <meta property="og:url" content="https://rakpramool.com/index.php?id=13393&amp;page=view_market_product">
    <meta property="og:type" content="website">

    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร - รักประมูล">
    <meta name="twitter:description" content="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร ซอยกาญจนาภิเษก 4 ถนนเลียบวงแหวนรอบนอกฝั่งตะวันออก ตำบลออเงิน อำเภอสายไหม กรุงเทพมหานคร ราคา 7,15...">
    <meta name="twitter:image" content="https://rakpramool.com/admin/assets/uploads/1783924174_4526_u270_1.jpg">

    <link href="https://fonts.googleapis.com/css?family=Sarabun:300,400,700&display=swap" rel="stylesheet">
    <script src="https://use.fontawesome.com/releases/v5.13.0/js/all.js" crossorigin="anonymous"></script>
    <link href="admin/assets/css/jquery.datetimepicker.min.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/magnific-popup.min.css" rel="stylesheet" />
    <link href="admin/assets/vendor/bootstrap-datepicker/css/bootstrap-datepicker.css" rel="stylesheet" />
    <link href="css/styles.css" rel="stylesheet" />
    <link type="text/css" rel="stylesheet" href="admin/assets/css/jquery-te-1.4.0.css">
    <link href="admin/assets/css/select2.min.css" rel="stylesheet">

    <script src="admin/assets/vendor/jquery/jquery.min.js"></script>
    <script src="admin/assets/vendor/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
    <script src="admin/assets/js/select2.min.js"></script>
    <script src="admin/assets/js/jquery.datetimepicker.full.min.js"></script>
    <script src="admin/assets/js/jquery-te-1.4.0.min.js" charset="utf-8"></script>

    <script type="application/ld+json">
    {
      "@context": "https://schema.org",
      "@graph": [
        {
          "@type": "Organization",
          "@id": "https://rakpramool.com/#organization",
          "name": "รักประมูล (Rakpramool)",
          "url": "https://rakpramool.com/",
          "logo": "https://rakpramool.com/assets/img/logo.png",
          "founder": {
            "@type": "Person",
            "name": "ธาราศักดิ์ กาญจนดี",
            "jobTitle": "Founder & Webmaster",
            "url": "https://rakpramool.com/index.php?page=about"
          },
          "sameAs": [
            "https://www.facebook.com/Rakpramool",
            "https://www.youtube.com/@Rakpramool"
          ]
        },
        {
          "@type": "WebSite",
          "@id": "https://rakpramool.com/#website",
          "url": "https://rakpramool.com/",
          "name": "รักประมูล",
          "publisher": { "@id": "https://rakpramool.com/#organization" },
          "potentialAction": {
            "@type": "SearchAction",
            "target": "https://rakpramool.com/index.php?page=allbid&search={search_term_string}",
            "query-input": "required name=search_term_string"
          }
        }
      ]
    }
    </script>

    
    
            <script type="application/ld+json">
        {
          "@context": "https://schema.org/",
          "@type": "Product",
          "name": "ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร",
          "image": ["https:\/\/rakpramool.com\/admin\/assets\/uploads\/1783924174_4526_u270_1.jpg"],
          "description": "ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร ซอยกาญจนาภิเษก 4 ถนนเลียบวงแหวนรอบนอกฝั่งตะวันออก ตำบลออเงิน อำเภอสายไหม กรุงเทพมหานคร ราคา 7,15...",
          "sku": "RP-MARKET-13393",
          "brand": {
            "@type": "Brand",
            "name": "รักประมูล"
          },
          "offers": {
            "@type": "Offer",
            "url": "https:\/\/rakpramool.com\/index.php?id=13393&page=view_market_product",
            "priceCurrency": "THB",
            "price": "7150000",
            "itemCondition": "https://schema.org/UsedCondition",
            "availability": "https://schema.org/InStock",
            "seller": {
              "@type": "Organization",
              "name": "รักประมูล (Rakpramool)",
              "url": "https://rakpramool.com/",
              "logo": "https://rakpramool.com/assets/img/logo.png"
            }
          }
        }
        </script>
    
    
</head>
<body id="page-top">






<!-- 
            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.rakpramool.com/index.php?page=signup" target="_blank">
                    <img src="uploads/banner/1781671453_5e6919da6893.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;max-height:220px; object-fit:cover; margin:15px 0;" alt="Banner under_menu">
                </a>
            </div>
         -->

<!--<div class="sidebar">
    
            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://rakpramool.com/" target="_blank">
                    <img src="uploads/banner/1782976366_ac96ff25f6af.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;max-width:280px; margin:10px auto;" alt="Banner sidebar">
                </a>
            </div>
        </div>  -->

<!-- 
            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.rakpramool.com/index.php?page=signup" target="_blank">
                    <img src="uploads/banner/1778558200_b5238ffed3cc.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;max-height:200px; object-fit:cover; margin-top:15px;" alt="Banner footer">
                </a>
            </div>
        -->




    <style>
      #main-field{
        margin-top: 5rem!important;


      }
	     </style>

<style>
    .social-container {
        display: flex;
        gap: 20px; /* ระยะห่างระหว่างไอคอน */
        padding: 20px;
    }

    .social-icon {
        font-size: 40px; /* ขนาดไอคอน */
        transition: transform 0.3s ease; /* เอฟเฟกต์เวลาเอาเมาส์ไปชี้ */
        text-decoration: none;
    }

    .social-icon:hover {
        transform: scale(1.2); /* ขยายใหญ่ขึ้นนิดหน่อยเมื่อเมาส์ชี้ */
    }

    /* สีประจำแบรนด์ */
    .facebook { color: #1877F2; }
    .line { color: #06C755; }
    .youtube { color: #FF0000; }



/* จัดการสไตล์ผู้สนับสนุน */
.sponsor-section {
    padding: 60px 0;
    background-color: #ffffff;
}
.sponsor-item {
    display: block;
    filter: grayscale(100%); /* เปลี่ยนเป็นขาวดำ */
    opacity: 0.5; /* จางลง */
    transition: all 0.4s ease; /* เอฟเฟกต์ตอนเปลี่ยน */
    padding: 10px;
}
.sponsor-item:hover {
    filter: grayscale(0%); /* กลับมาเป็นภาพสี */
    opacity: 1; /* ชัดเจน 100% */
    transform: translateY(-5px); /* ขยับขึ้นเล็กน้อย */
}
.sponsor-logo {
    max-height: 80px; /* จำกัดความสูงของโลโก้ให้เท่าๆ กัน */
    width: auto;
    object-fit: contain;
}
.section-title {
    text-align: center;
    margin-bottom: 40px;
    font-weight: 700;
    color: #333;
}
	.sponsor-item {
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all 0.3s ease;
    padding: 15px;
}
.sponsor-item:hover {
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.1);
}
.sponsor-title {
    position: relative;
    text-align: center;
    margin-bottom: 40px;
}
.sponsor-title::after {
    content: "";
    width: 60px;
    height: 3px;
    background: #007bff;
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);


}

.sidebar-ads img, .my-4 img {
    max-width: 100%;
    height: auto;
    border-radius: 8px; /* เพิ่มความมนให้รูปดูทันสมัย */
    margin-bottom: 10px;
}

/* เพิ่มเติมเพื่อรองรับมือถือ */
@media (max-width: 768px) {
    #main-field {
        margin-top: 4rem !important; /* ลดระยะห่างด้านบนในมือถือ */
    }
    .container-fluid {
        padding: 0 10px !important; /* ลด Padding ข้างจอในมือถือ */
    }
    .promo-header h1 {
        font-size: 1.25rem !important; /* ปรับขนาดหัวข้อสินค้าโปรโมทให้เล็กลงในมือถือ */
    }
    .card-img-top {
        height: 140px !important; /* ปรับความสูงรูปสินค้าในมือถือให้พอดี */
    }
    .navbar-brand img {
        height: 30px !important; /* ลดขนาดโลโก้ในเมนูเมื่อดูผ่านมือถือ */
    }
}

/* ปรับให้การ์ดสินค้าโปรโมทดูสมดุล */
.promo-card {
    margin-bottom: 15px;
}
.card-body {
    padding: 10px !important;
}


/* ปรับความกว้าง Modal ด้านขวาสำหรับหน้าจอ PC */
@media (min-width: 992px) {
    #uni_modal_right .modal-dialog {
        /* ปรับจากเดิมที่อาจจะเป็น modal-md ให้กว้างขึ้น */
        width: 60% !important; 
        max-width: 900px !important;
        margin: 0 0 0 auto; /* ให้ชิดขวาเสมอ */
        height: 100%;
    }
    
    #uni_modal_right .modal-content {
        height: 100vh; /* ให้สูงเต็มจอ */
        border-radius: 0; /* ตัดมุมมนออกเพื่อให้ดูเหมือนแถบ sidebar */
    }
}

/* ปรับแต่งปุ่มลูกศรปิดให้ดูเด่นขึ้น */
#uni_modal_right .close {
    outline: none;
    transition: transform 0.3s;
}
#uni_modal_right .close:hover {
    transform: translateX(5px);
    color: #dc3545;
}



/* Shopee Style Category Icons */
.shopee-categories {
    background: #fff;
    padding: 20px 0;
    margin-bottom: 20px;
}
.cat-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}
.cat-item-link {
    width: 100px;
    text-align: center;
    text-decoration: none !important;
    transition: all 0.3s ease;
}
.cat-item-link:hover {
    transform: translateY(-5px);
}
.cat-icon-box {
    width: 60px;
    height: 60px;
    background: #fdfdfd;
    border-radius: 20px; /* ทรงเหลี่ยมมนเหมือน Shopee */
    margin: 0 auto 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f0f0f0;
    box-shadow: 0 4px 6px rgba(0,0,0,0.02);
}
.cat-icon-box i {
    font-size: 26px;
    color: #ee4d2d; /* สีส้มเอกลักษณ์ */
}
.cat-text {
    font-size: 13px;
    color: #333;
    font-weight: 500;
    display: block;
    line-height: 1.2;
}

/* ปรับปรุง Product Card ให้ดูแพงขึ้น */
.promo-card {
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,.05) !important;
}
.promo-badge {
    background: linear-gradient(45deg, #ee4d2d, #ff7337);
    border-radius: 0 0 8px 0 !important;
}

/* ========== [เพิ่มสไตล์สำหรับ Avatar ผู้ขาย - แบบไอคอนดีฟอลต์] ========== */
.seller-avatar-mini {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #eee;
    background: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* สไตล์สำหรับไอคอนดีฟอลต์ (เมื่อไม่มีรูปอวตาร) */
.avatar-placeholder {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 12px;
}

.avatar-placeholder i {
    line-height: 1;
}

.seller-name-masked {
    font-size: 0.75rem;
    color: #666;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Responsive: ปรับขนาดในมือถือ */
@media (max-width: 768px) {
    .seller-avatar-mini,
    .avatar-placeholder {
        width: 20px;
        height: 20px;
        font-size: 10px;
    }
    .seller-name-masked {
        font-size: 0.7rem;
        max-width: 80px;
    }
}
/* ========== [จบ CSS Avatar] ========== */

/* ==========================================================================
   ✨ PREMIUM MODERN REDESIGN OVERRIDES (HTML/CSS) ✨
   ========================================================================== */

/* 1. Global Reset & Body styling */
body {
    background-color: #f8fafc !important;
    font-family: 'Sarabun', 'Kanit', -apple-system, sans-serif !important;
    color: #1e293b;
    -webkit-font-smoothing: antialiased;
}

/* 2. Glassmorphism Navigation Bar */
#mainNav {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(15px) !important;
    -webkit-backdrop-filter: blur(15px) !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

#mainNav .navbar-brand {
    font-weight: 700;
    transition: transform 0.2s ease;
}

#mainNav .navbar-brand:hover {
    transform: scale(1.03);
}

#mainNav .nav-link {
    color: #475569 !important;
    font-weight: 600 !important;
    padding: 0.5rem 1rem !important;
    transition: all 0.2s ease;
    border-radius: 8px;
}

#mainNav .nav-link:hover, 
#mainNav .nav-item.active .nav-link {
    color: #2563eb !important;
    background: rgba(37, 99, 235, 0.06);
}

#mainNav .dropdown-menu {
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06) !important;
    overflow: hidden;
    padding: 0.5rem 0;
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(10px);
}

#mainNav .dropdown-item {
    font-weight: 500;
    color: #475569;
    padding: 0.7rem 1.2rem;
    transition: all 0.2s ease;
}

#mainNav .dropdown-item:hover {
    background-color: #f1f5f9;
    color: #2563eb;
    padding-left: 1.5rem; /* Micro-interaction slide right */
}

/* 3. Modernized Categories Section */
.shopee-categories {
    background: #ffffff !important;
    border-radius: 20px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02) !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    padding: 20px !important;
    margin-bottom: 30px !important;
}

.cat-icon-box-mini {
    width: 52px !important;
    height: 52px !important;
    background: #f8fafc !important;
    border-radius: 16px !important;
    border: 1px solid #e2e8f0 !important;
    color: #475569 !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.01) !important;
    transition: all 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
}

.cat-item-mini:hover .cat-icon-box-mini {
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%) !important;
    color: #ffffff !important;
    border-color: #3b82f6 !important;
    transform: translateY(-6px) scale(1.08);
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.25) !important;
}

.cat-text-mini {
    font-weight: 600 !important;
    color: #64748b !important;
    margin-top: 8px;
    font-size: 11.5px !important;
    transition: color 0.2s ease;
}

.cat-item-mini:hover .cat-text-mini {
    color: #2563eb !important;
}

/* 4. Content Area Layout & Cards styling */
#main-field {
    margin-top: 7rem !important;
}

#main-field .bg-white {
    background: #ffffff !important;
    border-radius: 24px !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.02) !important;
    padding: 25px !important;
}

/* Sidebar sponsored banner container */
.col-lg-2 .card {
    border-radius: 20px !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden;
    background: #ffffff;
}

.col-lg-2 .card .bg-light {
    background-color: #f8fafc !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 12px !important;
}

/* 5. Modernized UI Components & Buttons */
.btn-primary {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    border: none !important;
    box-shadow: 0 4px 14px rgba(37, 99, 235, 0.2) !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    padding: 0.6rem 1.3rem !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(37, 99, 235, 0.3) !important;
}

.btn-secondary {
    background-color: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    color: #475569 !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    padding: 0.6rem 1.3rem !important;
    transition: all 0.2s ease !important;
}

.btn-secondary:hover {
    background-color: #e2e8f0 !important;
    color: #1e293b !important;
}

/* Alerts box beautification */
.alert-warning {
    background: #fffbeb !important;
    border: 1px solid #fef3c7 !important;
    color: #b45309 !important;
    border-radius: 16px !important;
    padding: 18px !important;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(217, 119, 6, 0.03) !important;
}

/* Modals design enhancement */
.modal-content {
    border-radius: 24px !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: 0 20px 50px rgba(0,0,0,0.08) !important;
    overflow: hidden;
}

.modal-header {
    border-bottom: 1px solid #f1f5f9 !important;
    background: #f8fafc;
    padding: 18px 24px !important;
}

.modal-footer {
    border-top: 1px solid #f1f5f9 !important;
    padding: 18px 24px !important;
}

/* Premium Scrollbar */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}
::-webkit-scrollbar-track {
    background: #f8fafc;
}
::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 5px;
    border: 2px solid #f8fafc;
}
::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Premium design elements */
.badge-danger {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3) !important;
}

</style>






<style>
/* กำหนดสีพื้นหลังให้เมนูตอนเปิดในมือถือ */
@media (max-width: 991.98px) {
    /* ใช้ id #mainNav เพื่อเพิ่มความจำเพาะ (Specificity) ป้องกันการโดนไฟล์อื่นเขียนทับ */
    #mainNav .navbar-collapse {
        background: #ffffff !important; /* เปลี่ยนเป็นสีขาว */
        padding: 15px !important;       /* เพิ่มช่องว่างให้น่ารักขึ้น */
        border-radius: 5px !important;  /* ทำมุมโค้งมน */
        box-shadow: 0px 4px 10px rgba(0,0,0,0.1) !important; /* เพิ่มเงาให้เมนูดูมีมิติ */
        margin-top: 10px !important;    /* เว้นระยะห่างจากแถบบนเล็กน้อย */
        max-height: calc(100vh - 100px) !important; /* จำกัดความสูงไม่เกินหน้าจอ */
        overflow-y: auto !important;    /* บังคับให้มี scrollbar และเลื่อนได้หากเมนูยาวเกินหน้าจอ */
    }

    /* สไตล์ลิ้งค์บนมือถือ */
    #mainNav .navbar-collapse .nav-link {
        color: #000000 !important; /* บังคับให้เป็นสีดำเข้ม */
        border-bottom: 1px solid #eee !important; /* เพิ่มเส้นคั่นระหว่างเมนู */
    }
    
    #mainNav .navbar-collapse .nav-link:last-child {
        border-bottom: none !important; /* เมนูสุดท้ายไม่ต้องมีเส้นคั่น */
    }

    /* คลาสที่ใช้ซ่อนเมนูอื่นบนมือถือ เมื่อกดเมนูผู้ใช้งาน */
    .d-none-mobile-menu {
        display: none !important;
    }

    /* ใช้ CSS :has() ในการซ่อนเมนูอื่นทันทีเมื่อเมนูผู้ใช้เปิด (ช่วยทำงานคู่กับ JS เพื่อความมั่นใจ 100%) */
    #mainNav .navbar-nav:has(.dropdown.show #userDropdown) .nav-item:not(:has(#userDropdown)) {
        display: none !important;
    }
}
</style>
<style>
/* 1. ปรับสีปุ่ม Toggle (กรอบและเส้น) */
.navbar-toggler {
    border-color: #ff8c00 !important; /* เปลี่ยนสีขอบปุ่ม (ทอง ดำ) */
    background-color: rgba(255, 255, 255, 0.2); /* เพิ่มพื้นหลังจางๆ ให้ตัวปุ่ม */
    padding: 0.5rem; /* ปรับขนาดให้กดง่ายขึ้น */
}

/* 2. เปลี่ยนสีของเส้นสามขีด (Hamburger Icon) ทอง */ 
/* กรณีใช้ Bootstrap 4/5 ไอคอนจะเป็น SVG เราจะใช้ filter เพื่อเปลี่ยนสี */
.navbar-toggler-icon {
    filter: invert(80%) sepia(50%) saturate(1000%) hue-rotate(10deg) brightness(100%) contrast(105%);
}

/* ปรับขอบปุ่มให้เป็นสีทองเข้าชุดกัน */
.navbar-toggler {
    border-color: #d4af37 !important; /* สี Metallic Gold */
    background-color: rgba(0, 0, 0, 0.1); /* ใส่พื้นหลังจางๆ ให้ปุ่มดูมีมิติ */
}


.cat-icon-box {
    background: #ffffff;
    border: 1px solid #f0f0f0;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.cat-item-link:hover .cat-icon-box {
    background: #ee4d2d; /* เปลี่ยนเป็นสีส้มเมื่อชี้ */
    border-color: #ee4d2d;
}

.cat-item-link:hover .cat-icon-box i {
    color: #ffffff; /* ไอคอนเปลี่ยนเป็นสีขาว */
    transform: scale(1.2);
}



</style>
<div id="install-app-banner" style="display:none; position: fixed; bottom: 85px; left: 15px; right: 15px; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(10px); padding: 12px 18px; border-radius: 20px; box-shadow: 0 10px 25px rgba(0,0,0,0.2); z-index: 9999; border: 1px solid rgba(0,0,0,0.05);">
    <div class="d-flex align-items-center justify-content-between">
        <div class="d-flex align-items-center">
            <div style="width: 45px; height: 45px; background: #007bff; border-radius: 12px; display: flex; align-items: center; justify-content: center; margin-right: 12px;">
                <i class="fas fa-mobile-alt text-white" style="font-size: 24px;"></i>
            </div>
            <div>
                <strong style="color:#222; font-size: 15px; display: block;">ติดตั้งแอปของเรา</strong>
                <p class="mb-0 small text-muted" style="font-size: 12px;">ใช้งานลื่นไหลและรวดเร็วยิ่งขึ้น</p>
            </div>
        </div>
        <div class="d-flex align-items-center">
            <button id="btn-install-app" class="btn btn-primary btn-sm px-3 shadow-sm" style="border-radius: 10px; font-weight: bold;">ติดตั้ง</button>
            <button id="btn-close-install" class="btn btn-link btn-sm text-muted ml-2" style="text-decoration: none;">ไว้ทีหลัง</button>
        </div>
    </div>
</div>

<script>
    let deferredPrompt;
    const installBanner = document.getElementById('install-app-banner');
    const btnInstall = document.getElementById('btn-install-app');

    window.addEventListener('beforeinstallprompt', (e) => {
        // ป้องกัน Chrome รุ่นเก่าเด้งเอง
        e.preventDefault();
        // เก็บ Event ไว้
        deferredPrompt = e;
        // แสดง Banner ของเรา
        installBanner.style.display = 'block';
    });

    btnInstall.addEventListener('click', async () => {
        if (deferredPrompt) {
            // เรียกหน้าต่างติดตั้งของเบราว์เซอร์
            deferredPrompt.prompt();
            const { outcome } = await deferredPrompt.userChoice;
            console.log(`User Choice: ${outcome}`);
            // เคลียร์ค่า
            deferredPrompt = null;
            // ซ่อนแบนเนอร์
            installBanner.style.display = 'none';
        }
    });

    document.getElementById('btn-close-install').addEventListener('click', () => {
        installBanner.style.display = 'none';
        // (ตัวเลือก) เก็บค่าไว้ใน SessionStorage เพื่อไม่ให้เด้งอีกในการเข้าหน้านี้ครั้งถัดไปในรอบนั้น
        sessionStorage.setItem('installBannerClosed', 'true');
    });

    // ตรวจสอบว่าเคยปิดไปหรือยังในรอบการเข้าชมนี้
    if(sessionStorage.getItem('installBannerClosed') === 'true') {
        installBanner.style.display = 'none';
    }
</script>
        <!-- Navigation-->
        <div class="toast" id="alert_toast" role="alert" aria-live="assertive" aria-atomic="true">
        <div class="toast-body text-white">
        </div>
      </div>
       <nav class="navbar navbar-expand-lg navbar-light fixed-top py-3" id="mainNav">
    <div class="container-fluid px-lg-5">
        <a class="navbar-brand js-scroll-trigger" href="./">
  <!--    RAKPRAMOOL -->
			<img src="admin/assets/uploads/1764732840_b06ea455-23a6-4f6e-8d6f-0b32d2e57919.png" 
     alt="Logo"
     style="height:40px; width:auto;">

        </a>

        <button class="navbar-toggler navbar-toggler-right" type="button" 
                data-toggle="collapse" data-target="#navbarResponsive" 
                aria-controls="navbarResponsive" aria-expanded="false" 
                aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
<div class="collapse navbar-collapse" id="navbarResponsive">
    <ul class="navbar-nav ml-auto my-2 my-lg-0 small">
                <li class="nav-item">
                    <a class="nav-link js-scroll-trigger" href="index.php?page=home">หน้าหลัก</a>
                </li>

               <li class="nav-item dropdown">
    <a class="nav-link dropdown-toggle" href="#" id="promoteDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        บริการรักประมูล
    </a>
    <div class="dropdown-menu" aria-labelledby="promoteDropdown">
        <a class="dropdown-item" href="index.php?page=product_promote">สินค้าแนะนำทั้งหมด</a>
        
        <div class="dropdown-divider"></div>
        
        <a class="dropdown-item" href="index.php?page=property">รักอสังหาริมทรัพย์</a>
        <!-- เปลี่ยนค่า page= ให้ตรงกับหน้าบริการของคุณ เช่น seo และ ads -->
        <a class="dropdown-item" href="index.php?page=services">รักประมูลรับทำ SEO</a>
        <a class="dropdown-item" href="index.php?page=advertise">รักประมูลบริการโฆษณา</a>
        <a class="dropdown-item" href="index.php?page=shop_list">รักประมูลร้านค้า</a>
        <a class="dropdown-item" href="index.php?page=hosting"> รักประมูลเว็บโฮสติ้ง</a>
        <a class="dropdown-item" href="https://rakpramool.com/index.php?page=rakpramool_ai">รักประมูล Ai ฟรี</a>
    </div>
</li>
   <li class="nav-item">
                   <li class="nav-item">
                    <a class="nav-link js-scroll-trigger" href="https://rakpramool.com/reels_feed.php" target="_blank" >สำรวจ Reels</a>
                </li>
   <li class="nav-item">
      <li class="nav-item">
                   <li class="nav-item">
                    <a class="nav-link js-scroll-trigger" href="index.php?page=market">ตลาดซื้อขาย</a>
                </li>
   <li class="nav-item">
 
                    <a class="nav-link js-scroll-trigger" href="index.php?page=allbid">สินค้าประมูล</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link js-scroll-trigger" href="index.php?page=about">เกี่ยวกับเรา</a>
                </li>
				   <li class="nav-item">
                    <a class="nav-link js-scroll-trigger" href="index.php?page=blog_list">บทความ</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link js-scroll-trigger" href="index.php?page=community">คอมมูนิตี้</a>
                </li>
                	                <!--			<li class="nav-item">
    <a class="nav-link js-scroll-trigger" href="https://www.youtube.com/@Rakpramool" target="_blank">การใช้งาน</a> 
</li>->

                <!-- ====================== USER DROPDOWN ====================== -->
                                <li class="nav-item d-flex align-items-center my-2 my-lg-0 ml-lg-2">
                    <a class="btn btn-outline-primary btn-sm rounded-pill px-3 py-2 font-weight-bold text-center text-nowrap" href="javascript:void(0)" id="login_now" style="font-size: 0.85rem; line-height: 1.2; border-width: 2px; white-space: nowrap;">
                        <i class="fas fa-sign-in-alt mr-1"></i> เข้าสู่ระบบ
                    </a>
                </li>
                <li class="nav-item d-flex align-items-center my-2 my-lg-0 ml-lg-2">
                    <a href="javascript:void(0)" class="btn btn-primary btn-sm rounded-pill px-3 py-2 font-weight-bold text-white shadow-sm text-center text-nowrap" id="signup_now" style="font-size: 0.85rem; line-height: 1.2; background: linear-gradient(135deg, #007bff 0%, #0056b3 100%); border: none; white-space: nowrap;">
                        <i class="fas fa-user-plus mr-1"></i> สมัครสมาชิก
                    </a>
                </li>



                                <!-- ====================== END USER DROPDOWN ====================== -->

            </ul>
        </div>
    </div>
</nav>
<br>
<br>
<br>
<br>

            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.rakpramool.com/index.php?page=signup" target="_blank">
                    <img src="uploads/banner/1779355744_5547016cc706.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;max-height:250px; object-fit:cover; margin-bottom:15px;" alt="Banner top">
                </a>
            </div>
          


            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.rakpramool.com/index.php?page=signup" target="_blank">
                    <img src="uploads/banner/1781671453_5e6919da6893.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;max-height:220px; object-fit:cover; margin:15px 0;" alt="Banner under_menu">
                </a>
            </div>
        

<div class="promo-marquee">
    <div class="marquee-content">
   	 <span>	🚀ยอดเงินโบนัสสมัครใหม่ สามารถใช้ได้เฉพาะค่าบริการโปรโมทประกาศเท่านั้น ไม่สามารถใช้ชำระค่าสินค้าได้</span> 
        <span>🤝 แนะนำเพื่อนสมัคร <b>รับเพิ่ม 10 บาทต่อคน</b></span>
        <span>🚀 <b>Rakpramool.com</b> ยิ่งชวนมาก ยิ่งได้มาก!</span>
        <span>📝 โปรดกรอกข้อมูลให้ครบถ้วน <b>เพื่อสิทธิ์ในการประมูล</b></span>
        <span>👑 สมาชิก VIP <b>รับสิทธิพิเศษมากมาย</b> จากทางเรา</span>
		   <span>🤝 เหงาๆ มีระบบสัตว์เลี้ยงให้เล่น พร้อมสร้างรายได้ </span>
	    <span>🤝ดันรายการโพสต์สินค้าในราคาประหยัด </span>
		<span>🤝ขุมพลัง SEO จากเว็บไม่ปิดกั้นรายการสินค้า </span>
    </div>
</div>

<style>
@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;600&display=swap');

.promo-marquee {
    width: 100%;
    /* ปรับเป็นโทนน้ำเงินเข้ม-ฟ้า ดูน่าเชื่อถือและสบายตากว่าสีแดง */
    background: #1e3a8a; 
    background: linear-gradient(90deg, #1e3a8a 0%, #3b82f6 100%);
    color: rgba(255, 255, 255, 0.95);
    padding: 12px 0; /* เพิ่มพื้นที่แนวตั้ง */
    overflow: hidden;
    white-space: nowrap;
    font-family: 'Kanit', sans-serif;
    border-bottom: 2px solid rgba(0,0,0,0.1);
}

.marquee-content {
    display: inline-block;
    padding-left: 100%;
    animation: marquee 35s linear infinite; /* ปรับให้ช้าลงนิดหน่อย (35s) จะได้ไม่อ่านยาก */
}

.marquee-content span {
    display: inline-block;
    padding-right: 80px; /* เพิ่มระยะห่างระหว่างข้อความ */
    font-size: 1rem;     /* ปรับขนาดให้พอดี */
    letter-spacing: 0.5px;
}

.marquee-content b {
    color: #fde047; /* สีเหลืองนวล (Soft Yellow) ไม่แสบตา */
    font-weight: 600;
}

@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

/* หยุดวิ่งเมื่อเอาเมาส์ชี้ */
.promo-marquee:hover .marquee-content {
    animation-play-state: paused;
}
</style>


    <div class="about-section" style="padding: 20px; background: #fff;">
        <h3>ทำไมต้องประมูลที่ รักประมูล (Rakpramool)?</h3>
        <p>รักประมูล (Rakpramool) เป็นแพลตฟอร์มประมูลสินค้าออนไลน์ที่เน้นความปลอดภัย มีระบบยืนยันตัวตน Verified ID และรองรับการประมูลแบบ Real-time พร้อมระบบ Auto Bid อัจฉริยะ ช่วยให้ผู้ซื้อเสนอราคาได้โดยไม่ต้องเฝ้าหน้าจอ</p>
    </div>


<style>
    .shopee-categories {
        background: #fff;
        border-bottom: 1px solid #f1f1f1;
        padding-bottom: 10px;
    }

    /* ตัวควบคุมการสไลด์: สำคัญมากที่ตรงนี้ */
    .cat-scroll-wrapper {
        display: flex;
        overflow-x: auto; /* เปิดการสไลด์แนวนอน */
        white-space: nowrap;
        padding: 10px 5px;
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch; /* ให้สไลด์ลื่นๆ ใน iPhone */
        gap: 15px; /* ระยะห่างระหว่างไอคอน */
    }

    /* ซ่อน Scrollbar ของ Browser เพื่อความสวยงาม */
    .cat-scroll-wrapper::-webkit-scrollbar {
        display: none;
    }

    .cat-item-mini {
        flex: 0 0 auto; /* ป้องกันไม่ให้ไอคอนโดนบีบขนาด */
        display: flex;
        flex-direction: column;
        align-items: center;
        text-decoration: none !important;
        width: 70px; /* กำหนดความกว้างคงที่ต่ออัน */
    }

    /* วงกลมไอคอนจิ๋ว */
    .cat-icon-box-mini {
        width: 48px;
        height: 48px;
        background: #f8f9fa;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 6px;
        border: 1px solid #eee;
        color: #444;
        transition: 0.2s;
    }

    .cat-item-mini:hover .cat-icon-box-mini, 
    .cat-item-mini:active .cat-icon-box-mini {
        background: #007bff;
        color: #fff;
        border-color: #007bff;
    }

    .cat-icon-box-mini i {
        font-size: 1.2rem;
    }

    /* ตัวหนังสือชื่อหมวดหมู่ */
    .cat-text-mini {
        font-size: 11px;
        color: #333;
        font-weight: 500;
        text-align: center;
        width: 100%;
        display: block;
        /* ถ้าชื่อยาวเกินจะตัดบรรทัดหรือซ่อน */
        white-space: normal; 
        line-height: 1.2;
        height: 2.4em; /* ล็อคความสูงไว้ 2 บรรทัด */
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    /* ปรับแต่งสำหรับ Desktop ให้ดูเต็มหน้าจอ */
    @media (min-width: 992px) {
        .cat-scroll-wrapper {
            justify-content: center; /* ในคอมให้เรียงกลาง */
            overflow-x: hidden; /* ปิดสไลด์ในคอมถ้ามีไม่เยอะ */
            flex-wrap: wrap; /* ในคอมให้ตกบรรทัดได้ถ้าเยอะเกินหน้าจอ */
        }
    }
</style>

<div class="shopee-categories mt-2">
    <div class="container-fluid">
        <div class="px-2 pt-2 d-flex justify-content-between align-items-center">
            <h6 class="font-weight-bold text-dark mb-0" style="font-size: 14px;">หมวดหมู่ยอดนิยมสำหรับประมูล</h6>
            <small class="text-muted d-md-none">เลื่อนซ้าย-ขวา <i class="fa fa-angle-right"></i></small>
        </div>
        
        <div class="cat-scroll-wrapper">
            <a href="index.php?page=home&category_id=all" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm" style="background: #eef6ff; color: #007bff;">
                    <i class="fa-solid fa-grid-2"></i>
                </div>
                <span class="cat-text-mini">ทั้งหมด</span>
            </a>

                        <a href="index.php?page=home&category_id=28" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-tag"></i> 
                </div>
                <span class="cat-text-mini">กระเป๋า</span>
            </a>
                        <a href="index.php?page=home&category_id=17" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-camera-retro"></i> 
                </div>
                <span class="cat-text-mini">กล้อง</span>
            </a>
                        <a href="index.php?page=home&category_id=37" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-box-archive"></i> 
                </div>
                <span class="cat-text-mini">กางเต็นท์ แคมป์ปิ้ง</span>
            </a>
                        <a href="index.php?page=home&category_id=19" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">เกมส์</span>
            </a>
                        <a href="index.php?page=home&category_id=16" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-tag"></i> 
                </div>
                <span class="cat-text-mini">ของสะสม</span>
            </a>
                        <a href="index.php?page=home&category_id=41" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-box-archive"></i> 
                </div>
                <span class="cat-text-mini">คลินิค</span>
            </a>
                        <a href="index.php?page=home&category_id=7" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-laptop"></i> 
                </div>
                <span class="cat-text-mini">คอมพิวเตอร์ อุปกรณ์คอมพิวเตอร์</span>
            </a>
                        <a href="index.php?page=home&category_id=49" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-box-archive"></i> 
                </div>
                <span class="cat-text-mini">เครื่องเขียน / อุปกรณ์สำนักงาน</span>
            </a>
                        <a href="index.php?page=home&category_id=18" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-plug-circle-bolt"></i> 
                </div>
                <span class="cat-text-mini">เครื่องใช้ไฟฟ้า</span>
            </a>
                        <a href="index.php?page=home&category_id=11" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">เครื่องดนตรี</span>
            </a>
                        <a href="index.php?page=home&category_id=42" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">เครื่องมือแพทย์</span>
            </a>
                        <a href="index.php?page=home&category_id=52" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-house-chimney"></i> 
                </div>
                <span class="cat-text-mini">งานศิลปะ / ของตกแต่งบ้าน</span>
            </a>
                        <a href="index.php?page=home&category_id=23" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-bicycle"></i> 
                </div>
                <span class="cat-text-mini">จักรยาน</span>
            </a>
                        <a href="index.php?page=home&category_id=35" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">ท่องเที่ยว</span>
            </a>
                        <a href="index.php?page=home&category_id=34" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">ธุรกิจ</span>
            </a>
                        <a href="index.php?page=home&category_id=9" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-stopwatch-20"></i> 
                </div>
                <span class="cat-text-mini">นาฬิกา</span>
            </a>
                        <a href="index.php?page=home&category_id=22" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">บริการ</span>
            </a>
                        <a href="index.php?page=home&category_id=54" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">บัตรคอนเสิร์ต / บัตรกิจกรรม</span>
            </a>
                        <a href="index.php?page=home&category_id=14" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-house-chimney"></i> 
                </div>
                <span class="cat-text-mini">บ้านและสวน</span>
            </a>
                        <a href="index.php?page=home&category_id=15" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-dharmachakra"></i> 
                </div>
                <span class="cat-text-mini">พระเครื่อง</span>
            </a>
                        <a href="index.php?page=home&category_id=33" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-motorcycle"></i> 
                </div>
                <span class="cat-text-mini">มอเตอร์ไซค์</span>
            </a>
                        <a href="index.php?page=home&category_id=10" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-mobile-screen"></i> 
                </div>
                <span class="cat-text-mini">มือถือ แท็บเล็ต</span>
            </a>
                        <a href="index.php?page=home&category_id=27" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">แม่และเด็ก</span>
            </a>
                        <a href="index.php?page=home&category_id=31" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">ยานพาหนะอื่นๆ</span>
            </a>
                        <a href="index.php?page=home&category_id=30" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-car-side"></i> 
                </div>
                <span class="cat-text-mini">รถบรรทุกและรถจักรกล</span>
            </a>
                        <a href="index.php?page=home&category_id=12" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-car-side"></i> 
                </div>
                <span class="cat-text-mini">รถมือสอง</span>
            </a>
                        <a href="index.php?page=home&category_id=29" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-shoe-prints"></i> 
                </div>
                <span class="cat-text-mini">รองเท้า</span>
            </a>
                        <a href="index.php?page=home&category_id=46" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">เวาเชอร์ (Voucher)</span>
            </a>
                        <a href="index.php?page=home&category_id=20" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-paw"></i> 
                </div>
                <span class="cat-text-mini">สัตว์เลี้ยง</span>
            </a>
                        <a href="index.php?page=home&category_id=43" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">สินค้าญี่ปุ่นมือสอง</span>
            </a>
                        <a href="index.php?page=home&category_id=51" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-house-chimney"></i> 
                </div>
                <span class="cat-text-mini">สินค้าเบ็ดเตล็ด / ของใช้ในบ้าน</span>
            </a>
                        <a href="index.php?page=home&category_id=53" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-box-archive"></i> 
                </div>
                <span class="cat-text-mini">สินค้าหลุดจำนำ / สินค้าเคลียร์สต็อก</span>
            </a>
                        <a href="index.php?page=home&category_id=45" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-box-archive"></i> 
                </div>
                <span class="cat-text-mini">สินค้าโอทอป</span>
            </a>
                        <a href="index.php?page=home&category_id=44" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-tag"></i> 
                </div>
                <span class="cat-text-mini">สินค้าแฮนด์เมด</span>
            </a>
                        <a href="index.php?page=home&category_id=13" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-pump-medical"></i> 
                </div>
                <span class="cat-text-mini">สุขภาพและความงาม</span>
            </a>
                        <a href="index.php?page=home&category_id=8" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-tag"></i> 
                </div>
                <span class="cat-text-mini">เสื้อผ้า เครื่องแต่งกาย</span>
            </a>
                        <a href="index.php?page=home&category_id=21" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-box-archive"></i> 
                </div>
                <span class="cat-text-mini">อสังหาริมทรัพย์</span>
            </a>
                        <a href="index.php?page=home&category_id=32" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-car-side"></i> 
                </div>
                <span class="cat-text-mini">อะไหล่รถประดับยนต์</span>
            </a>
                        <a href="index.php?page=home&category_id=47" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">อาหารและเครื่องดื่ม</span>
            </a>
                        <a href="index.php?page=home&category_id=40" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-tag"></i> 
                </div>
                <span class="cat-text-mini">อื่นๆ</span>
            </a>
                        <a href="index.php?page=home&category_id=39" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-star"></i> 
                </div>
                <span class="cat-text-mini">อุปกรณ์ก่อสร้าง</span>
            </a>
                        <a href="index.php?page=home&category_id=36" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-tag"></i> 
                </div>
                <span class="cat-text-mini">อุปกรณ์กีฬา</span>
            </a>
                        <a href="index.php?page=home&category_id=6" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">อุปกรณ์ตกปลา</span>
            </a>
                        <a href="index.php?page=home&category_id=48" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-tag"></i> 
                </div>
                <span class="cat-text-mini">อุปกรณ์ทำสวน / ต้นไม้</span>
            </a>
                        <a href="index.php?page=home&category_id=38" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">อุปกรณ์ไฟฟ้า</span>
            </a>
                        <a href="index.php?page=home&category_id=50" class="cat-item-mini">
                <div class="cat-icon-box-mini shadow-sm">
                    <i class="fa-solid fa-cart-shopping"></i> 
                </div>
                <span class="cat-text-mini">อุปกรณ์ออกกำลังกาย</span>
            </a>
                    </div>
    </div>
</div>


<main id="main-field">
    <div class="container-fluid" style="padding: 0 3%;"> 
        <div class="row">
            
            <div class="col-12 col-md-9 col-lg-10">
                <div class="bg-white p-2 p-md-4 rounded shadow-sm border mb-4" style="min-height: 80vh;">
                    
<style>
    .view-card { border-radius: 20px; overflow: hidden; border: none; }
    .price-stock-box { background: #f8f9fa; border-radius: 12px; padding: 20px; border: 1px solid #eee; }
    .seller-card { border-radius: 15px; border-left: 5px solid #007bff; }
    .seller-card.rent { border-left-color: #28a745; }
    .seller-card.buy { border-left-color: #dc3545; }
    .description-content { line-height: 1.8; color: #444; }
    .badge-market { font-size: 0.75rem; padding: 6px 12px; border-radius: 50px; text-transform: uppercase; font-weight: bold; }
    .shipping-badge { font-size: 0.85rem; padding: 5px 12px; border-radius: 50px; }

    /* สไตล์ปุ่มตัวเลือกสินค้า */
    .variation-wrapper { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 5px; }
    .variation-item {
        cursor: pointer; border: 1px solid #dee2e6; padding: 6px 15px; border-radius: 10px;
        transition: all 0.2s ease; background: #fff; font-size: 0.85rem; color: #444;
    }
    .variation-item:hover:not(.disabled) { border-color: #007bff; color: #007bff; background: #f0f7ff; }
    .variation-item.active { border-color: #007bff; background-color: #007bff; color: #fff; font-weight: bold; box-shadow: 0 3px 8px rgba(0,123,255,0.3); }
    .variation-item.disabled { background-color: #f8f9fa; color: #ccc; cursor: not-allowed; text-decoration: line-through; border-style: dashed; }

    .main-img-container { background: #f8f9fa; border-radius: 15px; position: relative; overflow: hidden; aspect-ratio: 1 / 1; }
    .carousel-item img { width: 100%; height: 100%; object-fit: contain; background: #1a1a1a; }
    .carousel-indicators li { width: 8px; height: 8px; border-radius: 50%; background-color: rgba(255,255,255,0.5); }
    .carousel-indicators li.active { background-color: #fff; width: 20px; border-radius: 10px; }

    .btn-shopee { background-color: #ee4d2d; color: white !important; border: none; transition: 0.3s; }
    .btn-lazada { background-color: #10156a; color: white !important; border: none; transition: 0.3s; }
    .btn-tiktok { background-color: #000000; color: white !important; border: none; transition: 0.3s; }
    .btn-thaimart { background-color: #00a859; color: white !important; border: none; transition: 0.3s; }
    .external-shopping-box { border: 2px dashed #e9ecef; padding: 15px; border-radius: 15px; background: #ffffff; }

    @keyframes pulse {
        0% { transform: scale(1); opacity: 1; }
        50% { transform: scale(1.1); opacity: 0.7; }
        100% { transform: scale(1); opacity: 1; }
    }
    .animate-pulse { animation: pulse 2s infinite ease-in-out; }
    @media (max-width: 768px) { .main-img-container { aspect-ratio: 1 / 1; } h2 { font-size: 1.5rem; } }
</style>

<div class="container mt-4 mb-5">
    <nav aria-label="breadcrumb">
      <ol class="breadcrumb bg-transparent p-0 mb-4">
        <li class="breadcrumb-item"><a href="index.php?page=home">หน้าหลัก</a></li>
        <li class="breadcrumb-item"><a href="index.php?page=market">ตลาดซื้อขาย</a></li>
        <li class="breadcrumb-item active">ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร</li>
      </ol>
    </nav>

    <div class="row">
        <div class="col-lg-7 mb-4">
            <div class="card view-card shadow-sm border-0">
                <div class="card-body p-2">
                    <div id="productGallery" class="carousel slide main-img-container shadow-inner" data-ride="carousel" data-touch="true">
                                                                                <ol class="carousel-indicators">
                                                                    <li data-target="#productGallery" data-slide-to="0" class="active"></li>
                                                                    <li data-target="#productGallery" data-slide-to="1" class=""></li>
                                                                    <li data-target="#productGallery" data-slide-to="2" class=""></li>
                                                                    <li data-target="#productGallery" data-slide-to="3" class=""></li>
                                                                    <li data-target="#productGallery" data-slide-to="4" class=""></li>
                                                            </ol>
                            
                            <div class="carousel-inner h-100">
                                                                    <div class="carousel-item h-100 active">
                                        <a href="admin/assets/uploads/1783924174_4526_u270_1.jpg" class="image-popup" title="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร">
                                            <img src="admin/assets/uploads/1783924174_4526_u270_1.jpg" class="d-block w-100 h-100">
                                        </a>
                                    </div>
                                                                    <div class="carousel-item h-100 ">
                                        <a href="admin/assets/uploads/1783924174_3773_u270_2.jpg" class="image-popup" title="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร">
                                            <img src="admin/assets/uploads/1783924174_3773_u270_2.jpg" class="d-block w-100 h-100">
                                        </a>
                                    </div>
                                                                    <div class="carousel-item h-100 ">
                                        <a href="admin/assets/uploads/1783924174_4094_u270_3.jpg" class="image-popup" title="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร">
                                            <img src="admin/assets/uploads/1783924174_4094_u270_3.jpg" class="d-block w-100 h-100">
                                        </a>
                                    </div>
                                                                    <div class="carousel-item h-100 ">
                                        <a href="admin/assets/uploads/1783924174_5133_u270_4.jpg" class="image-popup" title="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร">
                                            <img src="admin/assets/uploads/1783924174_5133_u270_4.jpg" class="d-block w-100 h-100">
                                        </a>
                                    </div>
                                                                    <div class="carousel-item h-100 ">
                                        <a href="admin/assets/uploads/1783924174_9314_u270_5.jpg" class="image-popup" title="ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร">
                                            <img src="admin/assets/uploads/1783924174_9314_u270_5.jpg" class="d-block w-100 h-100">
                                        </a>
                                    </div>
                                                            </div>

                                                        <a class="carousel-control-prev" href="#productGallery" role="button" data-slide="prev">
                                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                <span class="sr-only">Previous</span>
                            </a>
                            <a class="carousel-control-next" href="#productGallery" role="button" data-slide="next">
                                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                <span class="sr-only">Next</span>
                            </a>
                                                                        </div>
                </div>
            </div>
        </div>

        <div class="col-lg-5">
            <div class="card view-card shadow-sm h-100">
                <div class="card-body p-4">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                                                    <span class="badge badge-primary badge-market shadow-sm"><i class="fa fa-tag mr-1"></i> ลงประกาศขาย</span>
                                                <span class="text-muted small">ID: #MK-13393</span>
                    </div>

                    <h2 class="font-weight-bold text-dark mb-2">ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร</h2>
                    
                    
                    
                    <!-- ====================== FLASH SALE BAR ====================== -->
                                        <!-- ====================== END FLASH SALE BAR ====================== -->

                    <div class="price-stock-box mb-4 shadow-sm">
                        <div class="row align-items-center">
                            <div class="col-6 border-right text-center">
                                <small class="text-muted d-block mb-1">
                                    ราคาขาย                                </small>
                                                                    <h2 class="text-primary font-weight-bold mb-0">฿<span id="display-price">7,150,000</span></h2>
                                
                                                                                                <div class="mt-2 text-muted small font-weight-bold" id="total-payment-box" style="border-top: 1px dashed #ddd; padding-top: 8px;">
                                    ยอดชำระสุทธิ: <span class="text-danger" style="font-size: 1.15rem;">฿<span id="total-price">7,150,000</span></span>
                                                                            <small class="text-success d-block mt-1">(จัดส่งฟรี)</small>
                                                                    </div>
                                                                
                                <div class="mt-2">
                                                                                                                        <span class="badge badge-success-light border border-success text-success shipping-badge" style="background-color: #f0fff4;"><i class="fa fa-shipping-fast mr-1"></i> จัดส่งฟรี</span>
                                                                                                            </div>
                            </div>

                            <div class="col-6 pl-4 text-center">
                                <small class="text-muted d-block mb-1">
                                    สต็อกคงเหลือ                                </small>
                                <h4 class="mb-0 text-dark font-weight-bold" id="stock-container">
                                    <i class="fa fa-boxes text-info mr-1"></i> 
                                    <span id="display-stock">1</span> <small class="text-muted">ชิ้น</small>
                                </h4>
                                <div class="small mt-2" id="stock-status-text">
                                                                            <span class="text-warning">เหลือเพียง 1 ชิ้น</span>
                                                                    </div>
                            </div>
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="small text-muted font-weight-bold d-block mb-2">จำนวนที่ต้องการสั่งซื้อ</label>
                        <div class="input-group" style="max-width: 160px;">
                            <input type="number" id="order-quantity" name="quantity" class="form-control" value="1" min="1" max="5" step="1" style="border-radius: 12px;">
                            <div class="input-group-append">
                                <span class="input-group-text" style="border-radius: 12px;">ชิ้น</span>
                            </div>
                        </div>
                        <small class="form-text text-muted">สั่งซื้อได้สูงสุด 5 ชิ้นต่อรายการ</small>
                    </div>

                    
                    
                    <div class="purchase-action-box mb-3">
                                                    <button type="button" class="btn btn-primary btn-lg btn-block shadow-sm mb-2" onclick="uni_modal('เข้าสู่ระบบ','login.php')">
                                <i class="fa fa-shopping-cart mr-2"></i> สั่งซื้อสินค้า (ต้องเข้าสู่ระบบก่อน)
                            </button>
                                            </div>

                    <div class="mb-4">
                        <h6 class="font-weight-bold text-dark mb-3"><i class="fa fa-align-left text-primary mr-2"></i>รายละเอียดเพิ่มเติม</h6>
                        <div class="description-content p-3 bg-light rounded shadow-sm border">
                            ขาย บ้านเดี่ยว โครงการเซนโทร รามอินทรา จตุโชติ กรุงเทพมหานคร

   ซอยกาญจนาภิเษก 4 ถนนเลียบวงแหวนรอบนอกฝั่งตะวันออก ตำบลออเงิน อำเภอสายไหม กรุงเทพมหานคร

  ราคา  7,150,000  บาท  

  รายละเอียดทรัพย์

 -  เนื้อที่ 54.60 ตร.ว พื้นที่ใช้สอย 196 ตารางเมตร
 -  4 ห้องนอน 4 ห้องน้ำ 
 -  2 ที่จอดรถ 
 -  บ้านหันไปทางทิศ

  พิกัดทรัพย์  :   https://maps.app.goo.gl/cPeKGhi9Yhys9sX67

  สถานที่ใกล้เคียง
  
 - วัดแป้นทองโสภาราม
 - สายไหม อเวนิว
 - เพลินนารี่มอลล์
 - บิ๊กซี ซูเปอร์เซ็นเตอร์ สะพานใหม่

  รหัสทรัพย์ (Code ID)  : PSC-26-00809

   สอบถามเพิ่มเติม / นัดชม
 โทร. 096-932-4624 (ออมสิน)
 โทร. 097-419-5982 (พลอย)
 Line : @panaya (มี@ด้านหน้า)

  ปรึกษาสอบถามฟรี นัดชมบ้านฟรี One Stop Service ดูแลตั้งแต่ต้น จนถึงวันโอนกรรมสิทธิ์ มีทรัพย์ธนาคารทั่วประเทศ ทุกจังหวัด ต้องที่บริษัท ปณยา คิดดี จำกัด                        </div>
                    </div>

                    <div class="share-box mb-4 p-3 bg-white border rounded shadow-sm">
                        <div class="d-flex align-items-center justify-content-between flex-wrap">
                            <span class="small text-muted font-weight-bold"><i class="fa fa-share-alt mr-1"></i> ส่งต่อประกาศ:</span>
                            <div class="btn-group">
                                <a href="javascript:void(0)" onclick="fb_share()" class="btn btn-sm btn-outline-primary border-0"><i class="fab fa-facebook-f fa-lg"></i></a>
                                <a href="https://social-plugins.line.me/lineit/share?url=https%3A%2F%2Frakpramool.com%2Findex.php%3Fid%3D13393%26page%3Dview_market_product" target="_blank" class="btn btn-sm btn-outline-success border-0"><i class="fab fa-line fa-lg"></i></a>
                                <button class="btn btn-sm btn-outline-secondary border-0 copy-link" data-url="https://rakpramool.com/index.php?id=13393&page=view_market_product"><i class="fa fa-link fa-lg"></i></button>
                            </div>
                        </div>
                    </div>

                    <div class="card seller-card shadow-sm bg-white mb-4 ">
                        <div class="card-body p-3">
                            <h6 class="font-weight-bold mb-3">ข้อมูลการติดต่อ</h6>
                            <div class="d-flex align-items-center mb-3">
                                <div class="mr-3">
                                                                            <div class="bg-primary text-white rounded-circle d-flex align-items-center justify-content-center" style="width: 45px; height: 45px;"><i class="fa fa-user"></i></div>
                                                                    </div>
                                <div>
                                    <div class="font-weight-bold d-flex align-items-center">
                                        panaya kiddee                                                                                                                    </div>
                                    <small class="text-muted">ผู้ลงประกาศ</small>
                                </div>
                            </div>

                            <div class="text-center mb-3">
                                <a href="index.php?page=view_shop&id=270" class="btn btn-outline-primary btn-sm btn-block rounded-pill">
                                        <i class="fa fa-store mr-1"></i> ไปที่ร้านค้าของผู้ประกาศ
                                </a>
                            </div>

                                                            <button type="button" class="btn btn-primary btn-block py-2 shadow-sm mb-2" onclick="uni_modal('เข้าสู่ระบบ','login.php')">
                                    <i class="fa fa-phone-alt mr-2"></i> โทรติดต่อ (ต้องเข้าสู่ระบบ)
                                </button>
                                <button type="button" class="btn btn-outline-info btn-block py-2 shadow-sm mb-2" onclick="uni_modal('เข้าสู่ระบบ','login.php')">
                                    <i class="fas fa-comments mr-2"></i> ทักแชทสอบถาม (ต้องเข้าสู่ระบบ)
                                </button>
                                                    </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
const productVariations = [];
let selected_val1 = "";
let selected_val2 = "";
let selected_val3 = "";

function updateTotalPrice(itemPrice) {
    let qty = parseInt($('#order-quantity').val() || 1);
    let currentStock = parseInt($('#display-stock').text().replace(/,/g, '')) || 0;
    let maxQty = Math.max(1, Math.min(5, currentStock > 0 ? currentStock : 1));
    qty = isNaN(qty) ? 1 : Math.max(1, Math.min(maxQty, qty));
    $('#order-quantity').val(qty);
    let shipping = parseFloat("0") || 0;
    let total = (parseFloat(itemPrice) * qty) + shipping;
    $('#total-price').text(total.toLocaleString(undefined, {minimumFractionDigits: 0, maximumFractionDigits: 2}));
    $('#subtotal-price').text(parseFloat(itemPrice).toLocaleString(undefined, {minimumFractionDigits: 0, maximumFractionDigits: 2}));
}

function updateQuantityControl(stock) {
    const maxQty = Math.max(0, Math.min(5, parseInt(stock || 0)));
    const $qtyInput = $('#order-quantity');
    const $buyBtn = $('.btn-buy-now');
    const $stockLabel = $('#stock-status-text');

    $qtyInput.attr('max', maxQty);
    if (maxQty <= 0) {
        $qtyInput.val(0).prop('disabled', true);
        $buyBtn.addClass('disabled').prop('disabled', true);
        $buyBtn.html('<i class="fa fa-times-circle mr-2"></i> สินค้าหมดสต็อก');
        $stockLabel.text('สินค้าหมดสต็อก').removeClass('text-muted text-info text-warning').addClass('text-danger');
        return;
    }

    $qtyInput.prop('disabled', false);
    let qty = parseInt($qtyInput.val() || 1);
    qty = isNaN(qty) ? 1 : Math.max(1, Math.min(maxQty, qty));
    $qtyInput.val(qty);
    $buyBtn.removeClass('disabled').prop('disabled', false);
    $buyBtn.html('<i class="fa fa-shopping-cart mr-2"></i> สั่งซื้อผ่าน Wallet');
    if (maxQty <= 3) {
        $stockLabel.text('เหลือเพียง ' + maxQty + ' ชิ้น').removeClass('text-muted text-danger').addClass('text-warning');
    } else {
        $stockLabel.text('มีสินค้าในสต็อก').removeClass('text-muted text-warning text-danger').addClass('text-info');
    }
}

function selectAttribute(el, attrType, value) {
    if($(el).hasClass('disabled')) return;

    if($(el).hasClass('active')) {
        $(el).removeClass('active');
        if(attrType === 'val1') selected_val1 = "";
        if(attrType === 'val2') selected_val2 = "";
        if(attrType === 'val3') selected_val3 = "";
    } else {
        $(el).siblings('.variation-item').removeClass('active');
        $(el).addClass('active');
        if(attrType === 'val1') selected_val1 = value;
        if(attrType === 'val2') selected_val2 = value;
        if(attrType === 'val3') selected_val3 = value;
    }

    matchVariation();
}

function matchVariation() {
    let has_val1 = $('.attr-val1').length > 0;
    let has_val2 = $('.attr-val2').length > 0;
    let has_val3 = $('.attr-val3').length > 0;

    if ((has_val1 && selected_val1 === "") || 
        (has_val2 && selected_val2 === "") || 
        (has_val3 && selected_val3 === "")) {
        $('#variation_id').val('');
        let defaultPrice = "7150000";
        let defaultStock = "1";
        
                    $('#display-price').text(Number(defaultPrice).toLocaleString());
            $('#regular-price-area').hide();
            $('#flash-sale-stock-info').hide();
            $('#flash-sale-bar').hide();
            updateTotalPrice(defaultPrice);
                
        $('#display-stock').text(Number(defaultStock).toLocaleString());
        updateQuantityControl(defaultStock);
        return;
    }

    let matched = productVariations.find(function(v) {
        let m1 = !has_val1 || v.val1 == selected_val1;
        let m2 = !has_val2 || v.val2 == selected_val2;
        let m3 = !has_val3 || v.val3 == selected_val3;
        return m1 && m2 && m3;
    });

    if (matched) {
        $('#variation_id').val(matched.id);
        
        // ตรวจสอบว่าตัวเลือกนี้มีโปรโมชั่น Flash Sale อยู่หรือไม่
        if (matched.is_flash_sale) {
            let discText = matched.discount_type === 'percentage' ? '-' + matched.discount_value + '%' : 'ลด ฿' + matched.discount_value;
            let remaining = matched.flash_sale_qty - matched.flash_sale_sold;
            
            $('#display-price').fadeOut(100, function() { 
                $(this).text(Number(matched.flash_sale_price).toLocaleString()).fadeIn(100); 
            });
            $('#orig-price-display').text(Number(matched.price).toLocaleString());
            $('#discount-badge').text(discText).show();
            $('#regular-price-area').show();
            $('#fs-remaining-qty').text(remaining);
            $('#flash-sale-stock-info').show();
            $('#flash-sale-bar').show();
            updateTotalPrice(matched.flash_sale_price);
        } else {
            $('#display-price').fadeOut(100, function() { 
                $(this).text(Number(matched.price).toLocaleString()).fadeIn(100); 
            });
            $('#regular-price-area').hide();
            $('#flash-sale-stock-info').hide();
            $('#flash-sale-bar').hide();
            updateTotalPrice(matched.price);
        }
        
        $('#display-stock').fadeOut(100, function() { $(this).text(Number(matched.stock).toLocaleString()).fadeIn(100); });
        updateQuantityControl(matched.stock);
    } else {
        $('#variation_id').val('');
        updateQuantityControl(0);
    }
}

$(document).ready(function() {
    $('.btn-buy-now').click(function(){
        var pid = $(this).attr('data-id');
        var vid = $('#variation_id').val(); 
        var has_address = $(this).attr('data-address');
        var cat_id = $(this).attr('data-cat');

        // 🚀 ดึงค่ารายละเอียดสินค้า (เช่น สี, ขนาด, โมเดล) ที่ผู้ใช้เลือกจริงไว้ ณ ขณะนั้น
        var v_val1 = selected_val1;
        var v_val2 = selected_val2;
        var v_val3 = selected_val3;

        if(parseInt(cat_id) === 21) {
            alert("❌ ไม่สามารถสั่งซื้อผ่านระบบ Wallet กลางได้เนื่องจากสินค้าในหมวดหมู่อสังหาริมทรัพย์มีมูลค่าสูงครับ\n\n👉 กรุณาใช้ช่องทางการโทรติดต่อ หรือทักแชทคุยกับผู้ขายโดยตรงได้เลยครับ");
            return false;
        }

        if(parseInt(has_address) !== 1){
            alert_toast("กรุณากรอกที่อยู่จัดส่งในข้อมูลส่วนตัวก่อนสั่งซื้อครับ", "warning");
            setTimeout(function(){ location.href = "index.php?page=profile"; }, 2000);
            return false;
        }
        
        var qty = parseInt($('#order-quantity').val() || 1);
        qty = isNaN(qty) ? 1 : Math.max(1, Math.min(5, qty));
        $('#order-quantity').val(qty);

        if(qty < 1 || qty > 5){
            alert_toast("กรุณาระบุจำนวนสินค้าตั้งแต่ 1 ถึง 5 ชิ้น", "warning");
            return false;
        }

        var currentStock = parseInt($('#display-stock').text().replace(/,/g, '')) || 0;
        if(currentStock <= 0){
            alert_toast("สินค้าหมดสต็อกในขณะนี้", "warning");
            return false;
        }
        if(qty > currentStock){
            qty = currentStock;
            $('#order-quantity').val(qty);
            alert_toast("จำนวนสินค้าที่ต้องการสั่งซื้อมากกว่าสต็อกที่มีอยู่ จึงปรับให้สั่งได้สูงสุดตามสต็อกที่มี", "warning");
            return false;
        }

        if(($('.attr-val1').length > 0 || $('.attr-val2').length > 0 || $('.attr-val3').length > 0) && vid == ""){
            alert_toast("กรุณาเลือกตัวเลือกสินค้าให้ครบถ้วนก่อนครับ", "warning");
            return false;
        }

        if(confirm("ยืนยันการชำระเงินผ่าน Wallet?")){
            start_load();
            $.ajax({
                url: 'admin/ajax.php?action=buy_market_item',
                method: 'POST',
                data: { 
                    product_id: pid, 
                    variation_id: vid,
                    quantity: qty,
                    val1: v_val1,
                    val2: v_val2,
                    val3: v_val3
                },
                success: function(resp){
                    if(resp == 1){
                        alert_toast("สั่งซื้อสำเร็จ! กำลังไปหน้าออเดอร์...", "success");
                        setTimeout(function(){ location.href = "index.php?page=my_orders"; }, 2000);
                    } 
                    else if(resp == 'insufficient_balance'){
                        alert_toast("ยอดเงินใน Wallet ของคุณไม่พอ กรุณาเติมเงินก่อนสั่งซื้อครับ", "danger");
                        if(confirm("ยอดเงินไม่พอ! คุณต้องการไปหน้าเติมเงินตอนนี้เลยไหม?")){
                            location.href = "index.php?page=topup"; 
                        }
                    }
                    else if(resp == 'max_quantity_exceeded'){
                        alert_toast("จำนวนสั่งซื้อสูงสุดคือ 5 ชิ้นต่อรายการ", "warning");
                    }
                    else if(resp == 'out_of_stock'){
                        alert_toast("ขออภัยครับ สินค้าคงเหลือไม่พอสำหรับจำนวนที่เลือก", "warning");
                    }
                    else if(resp == 'product_not_found'){
                        alert_toast("ไม่พบสินค้าที่ต้องการสั่งซื้อ กรุณาลองอีกครั้ง", "warning");
                    }
                    else {
                        alert_toast("เกิดข้อผิดพลาด: " + resp, "danger");
                    }
                    end_load();
                }
            });
        }
    });

    $('#order-quantity').on('input change', function(){
        var itemPrice = parseFloat($('#display-price').text().replace(/,/g, '')) || 7150000;
        var currentStock = parseInt($('#display-stock').text().replace(/,/g, '')) || 0;
        var maxQty = Math.max(1, Math.min(5, currentStock > 0 ? currentStock : 1));
        var qty = parseInt($(this).val() || 1);
        if(isNaN(qty) || qty < 1) qty = 1;
        if(qty > maxQty) qty = maxQty;
        $(this).val(qty);
        updateTotalPrice(itemPrice);
    });

    $('.copy-link').click(function(){
        var url = $(this).attr('data-url');
        var $temp = $("<input>").val(url).appendTo("body").select();
        document.execCommand("copy"); 
        $temp.remove();
        alert_toast("คัดลอกลิงก์เรียบร้อยแล้ว!",'success');
    });
});

// Countdown Timer สำหรับหน้าสินค้าดีลด่วน (Flash Sale)
if ($('.fs-detail-timer').length > 0) {
    const serverStartTime = new Date("2026-07-14 16:19:36").getTime();
    const clientStartTime = new Date().getTime();
    const timeOffset = serverStartTime - clientStartTime;

    function runDetailTimer() {
        const nowServer = new Date().getTime() + timeOffset;
        $('.fs-detail-timer').each(function() {
            const el = $(this);
            const endTime = new Date(el.data('end').replace(' ', 'T')).getTime();
            const distance = endTime - nowServer;
            if (distance <= 0) {
                el.text("สิ้นสุดโปรโมชั่น");
                setTimeout(function() { location.reload(); }, 1000);
                return;
            }
            const h = Math.floor(distance / (1000 * 60 * 60));
            const m = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
            const s = Math.floor((distance % (1000 * 60)) / 1000);
            
            const displayText = (h < 10 ? "0"+h : h) + ":" + (m < 10 ? "0"+m : m) + ":" + (s < 10 ? "0"+s : s);
            el.text(displayText);
        });
    }
    setInterval(runDetailTimer, 500);
    runDetailTimer();
}

function fb_share() {
    var shareUrl = "https://www.facebook.com/sharer/sharer.php?u=" + encodeURIComponent(window.location.href);
    window.open(shareUrl, 'facebook-share', 'width=626,height=436');
}
</script>                </div>
            </div>

            <div class="col-12 col-md-3 col-lg-2">
                <div class="sticky-top" style="top: 90px; z-index: 10;">
                    <div class="card border-0 shadow-sm rounded-lg overflow-hidden mb-4">
                        <div class="bg-light p-2 text-center border-bottom">
                            <small class="font-weight-bold text-secondary">
                                <i class="fas fa-bullhorn mr-1"></i> SPONSORED
                            </small>
                        </div>
                        <div class="card-body p-2 text-center">
                            <div class="sidebar-ads-wrapper">
                                
            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://rakpramool.com/" target="_blank">
                    <img src="uploads/banner/1782976366_ac96ff25f6af.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;max-width:280px; margin:10px auto;" alt="Banner sidebar">
                </a>
            </div>
                                    </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
</main>

     <div class="my-4 text-center">
                    
            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.rakpramool.com/index.php?page=signup" target="_blank">
                    <img src="uploads/banner/1779092613_91ef589dcffa.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;margin:20px auto; border: 1px solid #eee;" alt="Banner middle">
                </a>
            </div>
                        </div>

<div class="modal fade" id="confirm_modal" role='dialog'>
    <div class="modal-dialog modal-md" role="document">
      <div class="modal-content">
        <div class="modal-header">
        <h5 class="modal-title">Confirmation</h5>
      </div>
      <div class="modal-body">
        <div id="delete_content"></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" id='confirm' onclick="">Continue</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
      </div>
      </div>
    </div>
  </div>
  <div class="modal fade" id="uni_modal" role='dialog'>
    <div class="modal-dialog modal-md" role="document">
      <div class="modal-content">
        <div class="modal-header">
        <h5 class="modal-title"></h5>
      </div>
      <div class="modal-body">
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-primary" id='submit' onclick="$('#uni_modal form').submit()">Save</button>
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
      </div>
      </div>
    </div>
  </div>
  <div class="modal fade" id="uni_modal_right" role='dialog'>
    <div class="modal-dialog modal-full-height  modal-md" role="document">
      <div class="modal-content">
        <div class="modal-header">
        <h5 class="modal-title"></h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span class="fa fa-arrow-right"></span>
        </button>
      </div>
      <div class="modal-body">
      </div>
      </div>
    </div>
  </div>
  <div class="modal fade" id="viewer_modal" role='dialog'>
    <div class="modal-dialog modal-md" role="document">
      <div class="modal-content">
              <button type="button" class="btn-close" data-dismiss="modal"><span class="fa fa-times"></span></button>
              <img src="" alt="">
      </div>
    </div>
  </div>




<script>
function startCountdown(id, endTimeStr) {
    const countdownEl = document.getElementById('cd-' + id);
    if (!countdownEl) return;

    if (!endTimeStr) return;
    const countDownDate = new Date(endTimeStr.replace(' ', 'T')).getTime();
    const x = setInterval(function () {
      const now = new Date().getTime();
      const distance = countDownDate - now;

      if (distance < 0) {
        clearInterval(x);
        countdownEl.innerHTML = "หมดเวลา";
        return;
      }

      const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
      const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
      const seconds = Math.floor((distance % (1000 * 60)) / 1000);

      countdownEl.innerHTML = hours + " ชม. " + minutes + " นาที " + seconds + " วินาที";
    }, 1000);
}

$(document).ready(function() {
    document.querySelectorAll('.promo-countdown-timer').forEach(el => {
        if (el.id && el.dataset.end) {
            startCountdown(el.id.replace('cd-', ''), el.dataset.end);
        }
    });
});


</script>



<style>
    /* จัดการ Container ให้ยืดหยุ่นและอยู่ตรงกลาง */
    .promo-section {
        max-width: 1200px; /* จำกัดความกว้างสูงสุดเพื่อให้ดูไม่กระจายเกินไปในจอใหญ่ */
        margin: 0 auto;    /* จัดกึ่งกลาง Container */
        padding: 20px;
    }
    
    /* สไตล์ Card ให้กะทัดรัดและสวยงาม */
    .promoted-card { 
        transition: all .3s ease; 
        border: 1px solid #eee; 
        border-radius: 12px;
        overflow: hidden;
        background: #fff;
    }
    .promoted-card:hover { 
        transform: translateY(-5px); 
        box-shadow: 0 10px 20px rgba(0,0,0,0.08) !important; 
    }
    
    .img-container { 
        height: 160px; 
        overflow: hidden; 
        background: #fdfdfd; 
        position: relative; 
    }
    .img-container img { 
        object-fit: cover; 
        width: 100%; 
        height: 100%; 
    }
    
    .hot-badge { 
        position: absolute; 
        top: 8px; 
        right: 8px; 
        font-size: 0.65rem; 
        font-weight: bold;
        padding: 4px 8px; 
        border-radius: 50px;
        background: linear-gradient(45deg, #ff416c, #ff4b2b);
        color: white;
        box-shadow: 0 3px 6px rgba(255,0,0,0.2);
    }
    
    .product-title { 
        font-size: 0.85rem; 
        font-weight: 600;
        color: #333;
        margin-bottom: 5px;
    }
    
    .price-text {
        color: #007bff;
        font-size: 1rem;
        font-weight: bold;
    }

    /* จัดหัวข้อให้อยู่ตรงกลาง */
    .section-title {
        text-align: center;
        margin-bottom: 30px;
    }
    .section-title h4 {
        display: inline-block;
        position: relative;
        padding-bottom: 10px;
        color: #d9534f; /* สีแดงเข้มตามภาพ */
    }
</style>

<div class="promo-section">
    <div class="section-title">
        <h4><i class="fa fa-fire mr-2"></i> สินค้าแนะนำวันนี้ในตลาดซื้อขาย</h4>
    </div>
    
    <div class="row justify-content-center">
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1783996984_6682_u12_1.png" alt="เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง ">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง ">
                            เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง                         </div>
                        <div class="price-text">
                            ฿60                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 200                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=13499" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1779509700_1.jpg" alt="เหยื่อตกปลา เหม๋ย เหยื่อตกปลา เหยื่อตกปลาเกล็ด เขียว น้ำหนัก 300 กรัม">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="เหยื่อตกปลา เหม๋ย เหยื่อตกปลา เหยื่อตกปลาเกล็ด เขียว น้ำหนัก 300 กรัม">
                            เหยื่อตกปลา เหม๋ย เหยื่อตกปลา เหยื่อตกปลาเกล็ด เขียว น้ำหนัก 300 กรัม                        </div>
                        <div class="price-text">
                            ฿30                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 1                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=2218" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1780717604_3670_u12_1.jpg" alt="สายเอ็นตกปลา สายเอ็นโหลดจระเข้ CROCODILE EXTRA STRONG (ม้วนใหญ่)">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="สายเอ็นตกปลา สายเอ็นโหลดจระเข้ CROCODILE EXTRA STRONG (ม้วนใหญ่)">
                            สายเอ็นตกปลา สายเอ็นโหลดจระเข้ CROCODILE EXTRA STRONG (ม้วนใหญ่)                        </div>
                        <div class="price-text">
                            ฿80                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 40                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=4672" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1783479516_5893_u12_1.jpg" alt="หัวเชื้อผง TONLEW FLAVOR ต้นหลิว เป็นหัวเชื้อสูตรเข้มข้น มีหลากหลายกลิ่นให้เลือก">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="หัวเชื้อผง TONLEW FLAVOR ต้นหลิว เป็นหัวเชื้อสูตรเข้มข้น มีหลากหลายกลิ่นให้เลือก">
                            หัวเชื้อผง TONLEW FLAVOR ต้นหลิว เป็นหัวเชื้อสูตรเข้มข้น มีหลากหลายกลิ่นให้เลือก                        </div>
                        <div class="price-text">
                            ฿40                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 285                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=10503" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1780197300_1.jpg" alt="สาย PE Zero X8 สายพีอีถัก 8 ยาว 100 m. สายนุ่ม เส้นเล็ก ตีไม่สะดุด รับแรงกระชากได้สูง เส้นสลับสี สังเกตระยะได้ง่าย วัสดุจากญี่ปุ่น">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="สาย PE Zero X8 สายพีอีถัก 8 ยาว 100 m. สายนุ่ม เส้นเล็ก ตีไม่สะดุด รับแรงกระชากได้สูง เส้นสลับสี สังเกตระยะได้ง่าย วัสดุจากญี่ปุ่น">
                            สาย PE Zero X8 สายพีอีถัก 8 ยาว 100 m. สายนุ่ม เส้นเล็ก ตีไม่สะดุด รับแรงกระชากได้สูง เส้นสลับสี สังเกตระยะได้ง่าย วัสดุจากญี่ปุ่น                        </div>
                        <div class="price-text">
                            ฿95                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 59                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=3707" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1778988720_1.jpg" alt="King Cobra Line Stopper For Shrimp ไส้ไก่ มีลูกหมุน ตกกุ้ง Size-M*ไลน์สต็ปเปอร์ตกกุ้ง ตกปลา งานหลิว">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="King Cobra Line Stopper For Shrimp ไส้ไก่ มีลูกหมุน ตกกุ้ง Size-M*ไลน์สต็ปเปอร์ตกกุ้ง ตกปลา งานหลิว">
                            King Cobra Line Stopper For Shrimp ไส้ไก่ มีลูกหมุน ตกกุ้ง Size-M*ไลน์สต็ปเปอร์ตกกุ้ง ตกปลา งานหลิว                        </div>
                        <div class="price-text">
                            ฿15                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 1                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=1134" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1783934556_2976_u12_1.png" alt="เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง 7 กรัม ชุด 5 ตัว 5 สี">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง 7 กรัม ชุด 5 ตัว 5 สี">
                            เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง 7 กรัม ชุด 5 ตัว 5 สี                        </div>
                        <div class="price-text">
                            ฿245                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 100                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=13419" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 shadow-sm promoted-card">
                    <div class="img-container">
                        <div class="hot-badge animated pulse infinite">
                            <i class="fa fa-bolt"></i> HOT
                        </div>
                                                    <img src="admin/assets/uploads/1779509580_1.jpg" alt="ขนมปังแห้งอบกะทิ super jack เหยื่อตกปลา">
                                            </div>
                    
                    <div class="card-body p-3">
                        <!-- ========== [เพิ่มส่วนแสดง Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-2">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <div class="product-title text-truncate" title="ขนมปังแห้งอบกะทิ super jack เหยื่อตกปลา">
                            ขนมปังแห้งอบกะทิ super jack เหยื่อตกปลา                        </div>
                        <div class="price-text">
                            ฿30                        </div>
                        <div class="text-muted mt-1" style="font-size: 0.75rem;">
                            <i class="fa fa-box-open mr-1"></i> คงเหลือ 1                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=2216" 
                           class="text-primary font-weight-bold" 
                           style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                </div>
            </div>
            </div>
</div>
<div class="container mt-5">
    <div class="promo-header text-center mb-4">
        <h1 class="text-primary font-weight-bold" style="font-size: 1.5rem;">
            🔥 สินค้าโปรโมท: เว็บประมูลสินค้าออนไลน์
        </h1>
        <p class="text-muted small">สินค้าคัดสรรพิเศษเพื่อคุณ</p>
    </div>

    <div class="row px-2"> 
        <div class="col-6 col-md-3 mb-4 px-2">
            <a href="view_prod.php?id=166" class="text-decoration-none h-100">
                <div class="card promo-card shadow-sm h-100 border-0">
                    <div class="img-wrapper position-relative">
                        <img src="admin/assets/uploads/1783934251_6a54ad2bec95c.png" 
                             class="card-img-top" 
                             alt="เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง  7 กรัม  ชุด 5ตัว ">
                        <span class="badge badge-danger promo-badge">แนะนำ</span>
                    </div>

                    <div class="card-body p-2 d-flex flex-column">
                        <!-- ========== [เพิ่ม Avatar และชื่อผู้ขาย] ========== -->
                        <div class="d-flex align-items-center mb-1">
                            <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                            <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                ธาร***                            </small>
                        </div>
                        <!-- ========== [จบส่วน Avatar] ========== -->
                        
                        <h6 class="product-title mb-1">
                            เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง  7 กรัม  ชุด 5ตัว                         </h6>

                        <div class="price-box mb-2">
                            <span class="small text-muted">เริ่มที่</span>
                            <span class="text-primary font-weight-bold">฿100</span>
                        </div>

                        <div class="timer-box mt-auto text-center rounded py-1">
                             <i class="fa fa-clock-o small"></i> ประมูลเลยตอนนี้ คลิก
                             <span class="promo-countdown-timer text-danger font-weight-bold" 
                                   style="font-size: 0.75rem;" 
                                   id="cd-166" 
                                   data-end="2026-07-20 16:16:00"></span>
                        </div>
                    </div>
                </div>
            </a>
        </div>

            </div>
</div>

<style>
    /* บังคับรูปสี่เหลี่ยมจัตุรัส 1:1 และแสดงผลเต็มตา */
    .img-wrapper {
        width: 100%;
        aspect-ratio: 1 / 1; /* มาตรฐานเว็บขายของ */
        overflow: hidden;
        background: #f8f9fa;
        border-radius: 10px 10px 0 0;
    }
    .img-wrapper img {
        width: 100%;
        height: 100%;
        object-fit: cover; /* รูปไม่เบี้ยวแน่นอน */
        transition: transform .3s ease;
    }
    
    .promo-card {
        border-radius: 12px;
        transition: all 0.3s ease;
        background: #fff;
    }
    .promo-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 20px rgba(0,0,0,0.12) !important;
    }
    .promo-card:hover img {
        transform: scale(1.08);
    }

    .promo-badge {
        position: absolute;
        top: 8px;
        left: 8px;
        font-size: 0.65rem;
        padding: 4px 8px;
        border-radius: 5px;
        background: linear-gradient(45deg, #ff416c, #ff4b2b);
        border: none;
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    }

    .product-title {
        font-size: 0.85rem;
        font-weight: 600;
        color: #333;
        line-height: 1.3;
        height: 2.6em; /* ล็อกความสูงไว้ 2 บรรทัดพอดี */
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .price-box {
        line-height: 1;
    }

    .timer-box {
        background: #fff5f5;
        border: 1px solid #ffe3e3;
    }

    .text-decoration-none {
        display: block;
    }
</style>

<style>
.promo-card {
    border-radius: 12px;
    transition: transform .2s, box-shadow .2s;
}
.promo-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}
.promo-badge {
    position:absolute;
    top:10px;
    left:10px;
    padding:5px 10px;
    font-size: 12px;
    border-radius: 8px;
}
</style>
<style>
    .social-container {
        display: flex;
        justify-content: center; /* จัดให้อยู่กึ่งกลางแนวนอน */
        align-items: center;     /* จัดให้อยู่กึ่งกลางแนวตั้ง */
        gap: 30px;               /* ระยะห่างระหว่างไอคอน */
        padding: 30px;
        width: 100%;             /* ให้ขยายเต็มพื้นที่เพื่อหาจุดกึ่งกลาง */
    }

    .social-icon {
        font-size: 45px;         /* ปรับขนาดให้ชัดเจนขึ้น */
        transition: all 0.3s ease;
        text-decoration: none !important; /* ลบเส้นใต้ลิงก์ */
    }

    .social-icon:hover {
        transform: translateY(-5px); /* ให้ลอยขึ้นเล็กน้อยเวลาชี้ */
        filter: brightness(1.2);     /* ให้สีสว่างขึ้นเล็กน้อย */
    }
</style>



  <div id="preloader"></div>


<style>
    /* สไตล์ Container ครอบกล่องสินค้าดันประกาศ */
    .bump-section {
        max-width: 1200px;
        margin: 30px auto;
        padding: 20px;
        background: #fffcf5; /* ใส่พื้นหลังสีครีมทองจางๆ ให้แยกโซนพรีเมียมออกจากสินค้าทั่วไป */
        border-radius: 16px;
        border: 1px solid #ffeeba;
    }
    
    /* สไตล์การ์ดคงโครงสร้างเดิมของพี่ แต่เพิ่มดีไซน์พรีเมียมขอบทอง */
    .bumped-card {
        transition: all .3s ease;
        border: 2px solid #ffc107 !important; /* ขอบทองเด่นสะดุดตา */
        border-radius: 12px;
        overflow: hidden;
        background: #fff;
        position: relative;
    }
    .bumped-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px rgba(255, 193, 7, 0.25) !important; /* เวลาเมาส์ชี้การ์ดจะขยับและเรืองแสงสีทอง */
    }
    
    /* บังคับรูปสี่เหลี่ยมจัตุรัส 1:1 ตามมาตรฐานเว็บเดิม */
    .bump-img-container {
        width: 100%;
        aspect-ratio: 1 / 1;
        overflow: hidden;
        background: #fdfdfd;
        position: relative;
    }
    .bump-img-container img {
        object-fit: cover;
        width: 100%;
        height: 100%;
        transition: transform .3s ease;
    }
    .bumped-card:hover .bump-img-container img {
        transform: scale(1.06);
    }
    
    /* ป้ายแท็กสัญลักษณ์ดันประกาศสีส้ม-ทอง */
    .bump-premium-badge {
        position: absolute;
        top: 8px;
        left: 8px;
        font-size: 0.7rem;
        font-weight: bold;
        padding: 4px 10px;
        border-radius: 50px;
        background: linear-gradient(45deg, #ff9800, #ffc107);
        color: #000;
        box-shadow: 0 3px 6px rgba(0,0,0,0.15);
        z-index: 5;
    }
    
    .bump-product-title {
        font-size: 0.85rem;
        font-weight: 600;
        color: #333;
        margin-bottom: 5px;
        line-height: 1.3;
        height: 2.6em; /* ล็อกไว้ 2 บรรทัดพอดี */
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    .bump-price-text {
        color: #dc3545; /* สีแดงเน้นราคาขายชัดเจน */
        font-size: 1.05rem;
        font-weight: bold;
    }
    .bump-time-text {
        font-size: 0.7rem;
        color: #888;
        background: #f8f9fa;
        padding: 4px;
        border-radius: 4px;
    }
</style>

<div class="bump-section shadow-sm">
    <div class="d-flex align-items-center mb-3">
        <h4 class="font-weight-bold m-0" style="color: #ff9800;">
            <i class="fa fa-bolt mr-2"></i> ประกาศเด่นแนะนำพิเศษ (ดันล่าสุด)
        </h4>
        <span class="badge badge-danger ml-3" style="animation: pulse 1.5s infinite;">พรีเมียม</span>
    </div>
    
    <div class="row justify-content-center">
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2 mb-4 px-2">
                <div class="card h-100 bumped-card shadow-sm">
                    
                    <div class="bump-premium-badge">
                        ⚡ ดันประกาศ
                    </div>
                    
                    <div class="bump-img-container">
                                                    <img src="admin/assets/uploads/1783996984_6682_u12_1.png" alt="เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง ">
                                            </div>
                    
                    <div class="card-body p-2 d-flex flex-column justify-content-between">
                        <div>
                            <!-- ========== [เพิ่ม Avatar และชื่อผู้ขาย] ========== -->
                            <div class="d-flex align-items-center mb-1">
                                <img src="admin/assets/uploads/1774952460_27.03.2026_10.38.14_REC.png" alt="avatar" class="rounded-circle border seller-avatar-mini" style="object-fit: cover;">                                <small class="text-muted ml-2 seller-name-masked" title="ธาราศักดิ์ กาญจนดี">
                                    ธาร***                                </small>
                            </div>
                            <!-- ========== [จบส่วน Avatar] ========== -->
                            
                            <div class="bump-product-title" title="เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง ">
                                เหยื่อไมโครจิ๊ก 2 ตะขอ ตะขอเดี่ยว และตะขอ 3 ทาง                             </div>
                            <div class="bump-price-text mb-2">
                                ฿60                            </div>
                        </div>
                        
                        <div class="bump-time-text text-center mt-1">
                            <i class="fa-regular fa-clock mr-1"></i> ดันเมื่อ: 14/07 09:43 น.
                        </div>
                    </div>
                    
                    <div class="card-footer p-2 bg-white border-0 text-center">
                        <a href="index.php?page=view_market_product&id=13499" class="text-primary font-weight-bold" style="font-size: 0.8rem; text-decoration: none;">
                            ดูรายละเอียด
                        </a>
                    </div>
                    
                </div>
            </div>
            </div>
</div>

<!--// -->

<div class="container-fluid mt-4">
    <div class="d-flex justify-content-between align-items-center mb-3">
        <h3 class="text-dark"><i class="fa fa-shopping-bag text-primary"></i> สินค้ามาใหม่ในตลาด</h3>
        <a href="index.php?page=market" class="btn btn-outline-primary btn-sm rounded-pill">ดูทั้งหมด</a>
    </div>

    <div class="row">
                                <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784019805_2332_u397_1.jpg" 
                             class="card-img-top" alt="ขายที่ดินติดนิคมโรจนะบ่อวิน 2 อำเภอศรีราชา จังหวัดชลบุรี เนื้อที่ 4 ไร่ 1 งาน 33 ตารางวา" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายที่ดินติดนิคมโรจนะบ่อวิน 2 อำเภอศรีราชา จังหวัดชลบุรี เนื้อที่ 4 ไร่ 1 งาน 33 ตารางวา">
                            ขายที่ดินติดนิคมโรจนะบ่อวิน 2 อำเภอศรีราชา จังหวัดชลบุรี เนื้อที่ 4 ไร่ 1 งาน 33 ตารางวา                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿4,000,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="sopa">
                                    sop***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13582">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784019573_8933_u406_1.jpg" 
                             class="card-img-top" alt="บ้านเดี่ยวร่มทิพย์วิลเลจ หทัยราษฎร์ หน้าสวน แต่งบิ้วอิน ใหญ่สุดในโครงการ ถูกสุด" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="บ้านเดี่ยวร่มทิพย์วิลเลจ หทัยราษฎร์ หน้าสวน แต่งบิ้วอิน ใหญ่สุดในโครงการ ถูกสุด">
                            บ้านเดี่ยวร่มทิพย์วิลเลจ หทัยราษฎร์ หน้าสวน แต่งบิ้วอิน ใหญ่สุดในโครงการ ถูกสุด                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿3,990,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="สุชาติ">
                                    สุช***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13581">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784018181_8734_u415_1.jpg" 
                             class="card-img-top" alt="ให้เช่าที่ดินเปล่าถมแล้ว สภาพพร้อมใช้งาน ทำเลดีตั้งอยู่ใจกลางตัวเมืองอำเภอป่าแดด เชียงราย ติดทางหลวงหมายเลข 1126" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ให้เช่าที่ดินเปล่าถมแล้ว สภาพพร้อมใช้งาน ทำเลดีตั้งอยู่ใจกลางตัวเมืองอำเภอป่าแดด เชียงราย ติดทางหลวงหมายเลข 1126">
                            ให้เช่าที่ดินเปล่าถมแล้ว สภาพพร้อมใช้งาน ทำเลดีตั้งอยู่ใจกลางตัวเมืองอำเภอป่าแดด เชียงราย ติดทางหลวงหมายเลข 1126                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿30,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="Tanapat Yamsai">
                                    Tan***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13577">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784018096_2191_u293_1.jpg" 
                             class="card-img-top" alt="ขายบ้านพร้อมที่ดิน 151 ตรว. ในซอยพระราม 9 ซอย 43 ทำเลดีเยี่ยม เข้าซอยเพียง 100 ม. จากถนนพระราม 9" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายบ้านพร้อมที่ดิน 151 ตรว. ในซอยพระราม 9 ซอย 43 ทำเลดีเยี่ยม เข้าซอยเพียง 100 ม. จากถนนพระราม 9">
                            ขายบ้านพร้อมที่ดิน 151 ตรว. ในซอยพระราม 9 ซอย 43 ทำเลดีเยี่ยม เข้าซอยเพียง 100 ม. จากถนนพระราม 9                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿28,680,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="arkangelpro">
                                    ark***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13576">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-info position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ให้เช่า                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784016382_3453_u342_1.jpg" 
                             class="card-img-top" alt="ให้เช่าบ้าน 10,000 บาท/ เดือน หมู่บ้านอมรพันธ์สวนสยาม" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ให้เช่าบ้าน 10,000 บาท/ เดือน หมู่บ้านอมรพันธ์สวนสยาม">
                            ให้เช่าบ้าน 10,000 บาท/ เดือน หมู่บ้านอมรพันธ์สวนสยาม                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿10,000                                                                            <small class="text-muted" style="font-size: 0.7rem;">/ เริ่มต้น</small>
                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="Post Real Estate Real Estate">
                                    Pos***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13575">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784016068_5735_u306_1.jpg" 
                             class="card-img-top" alt="ขาย ที่ดิน - 750000 บาท ใกล้กับ ตลาดโชกุน 10 ไร่ 4000 ตารางวา ชั้นที่ 1" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขาย ที่ดิน - 750000 บาท ใกล้กับ ตลาดโชกุน 10 ไร่ 4000 ตารางวา ชั้นที่ 1">
                            ขาย ที่ดิน - 750000 บาท ใกล้กับ ตลาดโชกุน 10 ไร่ 4000 ตารางวา ชั้นที่ 1                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿750,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="Boonsong Lumthong">
                                    Boo***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13573">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784015840_9756_u275_1.jpg" 
                             class="card-img-top" alt="ขายที่ดิน ติดถนนปู่เจ้าสมิงพราย เหมาะสำหรับทำอาคารพาณิชย์เพื่อการค้า หรือปลูกสร้างเพื่ออยู่อาศัยในทำเลใกล้เมือง เดินทางสะดวก | 93392" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายที่ดิน ติดถนนปู่เจ้าสมิงพราย เหมาะสำหรับทำอาคารพาณิชย์เพื่อการค้า หรือปลูกสร้างเพื่ออยู่อาศัยในทำเลใกล้เมือง เดินทางสะดวก | 93392">
                            ขายที่ดิน ติดถนนปู่เจ้าสมิงพราย เหมาะสำหรับทำอาคารพาณิชย์เพื่อการค้า หรือปลูกสร้างเพื่ออยู่อาศัยในทำเลใกล้เมือง เดินทางสะดวก | 93392                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿8,900,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="EstateCornerAgency Ratchada32">
                                    Est***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13571">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784015417_9558_u429_1.jpg" 
                             class="card-img-top" alt="ขายที่ดินเปล่าบ้านดุงอุดรธานี อยู่ในชุมชนหมู่บ้านดอนขี้เหล็ก" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายที่ดินเปล่าบ้านดุงอุดรธานี อยู่ในชุมชนหมู่บ้านดอนขี้เหล็ก">
                            ขายที่ดินเปล่าบ้านดุงอุดรธานี อยู่ในชุมชนหมู่บ้านดอนขี้เหล็ก                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿390,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title=" อัมราภัสร์ โภคีธัญวรัตม์">
                                     อั***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13567">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-info position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ให้เช่า                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784014991_4215_u317_1.jpg" 
                             class="card-img-top" alt="รร. ประชาคมนานาชาติอุดรธานี 50ม.  ให้เช่าที่ดินถมแล้ว 6 ไร่ 2 งาน  ให้เช่า2 แปลง ริมถนนมิตรภาพ เมืองอุดรธานี ม.เทคโนโลยีอีสานเหนือ" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="รร. ประชาคมนานาชาติอุดรธานี 50ม.  ให้เช่าที่ดินถมแล้ว 6 ไร่ 2 งาน  ให้เช่า2 แปลง ริมถนนมิตรภาพ เมืองอุดรธานี ม.เทคโนโลยีอีสานเหนือ">
                            รร. ประชาคมนานาชาติอุดรธานี 50ม.  ให้เช่าที่ดินถมแล้ว 6 ไร่ 2 งาน  ให้เช่า2 แปลง ริมถนนมิตรภาพ เมืองอุดรธานี ม.เทคโนโลยีอีสานเหนือ                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿29,999                                                                            <small class="text-muted" style="font-size: 0.7rem;">/ เริ่มต้น</small>
                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="ณัฐพงศ์ สุนทรอรุณ">
                                    ณัฐ***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13564">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784014167_6179_u297_1.jpg" 
                             class="card-img-top" alt="T26-501 ขาย บ้าน บ้านกลางเมือง The Edition บางนา 1 ตารางวา สมุทรปราการ    ชั้นทั้งหมด 3 ชั้น ชั้นที่ 1" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="T26-501 ขาย บ้าน บ้านกลางเมือง The Edition บางนา 1 ตารางวา สมุทรปราการ    ชั้นทั้งหมด 3 ชั้น ชั้นที่ 1">
                            T26-501 ขาย บ้าน บ้านกลางเมือง The Edition บางนา 1 ตารางวา สมุทรปราการ    ชั้นทั้งหมด 3 ชั้น ชั้นที่ 1                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿12,900,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="asanghapl99">
                                    asa***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13562">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-info position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ให้เช่า                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784014123_9350_u335_1.jpg" 
                             class="card-img-top" alt="XT Ekkamai Clean Safe Comfortable 32nd Floor BTS Ekkamai" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="XT Ekkamai Clean Safe Comfortable 32nd Floor BTS Ekkamai">
                            XT Ekkamai Clean Safe Comfortable 32nd Floor BTS Ekkamai                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿32,000                                                                            <small class="text-muted" style="font-size: 0.7rem;">/ เริ่มต้น</small>
                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="เอกชัย เพิ่มพูนพิพัฒน์">
                                    เอก***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13561">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784013626_6837_u286_1.jpg" 
                             class="card-img-top" alt="ที่ดินพัทยา ทำเลดี 3 ไร่กว่า ติดลำธาร ราคาพิเศษ 15 ล้าน เหมาะลงทุน TP-L2391" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ที่ดินพัทยา ทำเลดี 3 ไร่กว่า ติดลำธาร ราคาพิเศษ 15 ล้าน เหมาะลงทุน TP-L2391">
                            ที่ดินพัทยา ทำเลดี 3 ไร่กว่า ติดลำธาร ราคาพิเศษ 15 ล้าน เหมาะลงทุน TP-L2391                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿15,350,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="A.T.A. property">
                                    A.T***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13556">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784013521_4146_u280_1.jpg" 
                             class="card-img-top" alt="ขายทาวน์โฮมบางแสนชลบุรี ขายทาวน์โฮม 2 ชั้น ถ.เนตรดี บางแสน รีโนเวทใหม่ทั้งหลัง 19.4 ตารางวา 2 ห้องนอน 2 ห้องน้ำ" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายทาวน์โฮมบางแสนชลบุรี ขายทาวน์โฮม 2 ชั้น ถ.เนตรดี บางแสน รีโนเวทใหม่ทั้งหลัง 19.4 ตารางวา 2 ห้องนอน 2 ห้องน้ำ">
                            ขายทาวน์โฮมบางแสนชลบุรี ขายทาวน์โฮม 2 ชั้น ถ.เนตรดี บางแสน รีโนเวทใหม่ทั้งหลัง 19.4 ตารางวา 2 ห้องนอน 2 ห้องน้ำ                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿1                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="Ladapa Tanasaeugplu">
                                    Lad***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13555">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784012777_6805_u339_1.jpg" 
                             class="card-img-top" alt="ให้เช่าคอนโด ศุภาลัย พาร์ค เกษตร อาคาร A ชั้น 21 ขนาด 35 ตร.ม. วิวเมือง ทิศเหนือ ทำเลดีที่สุดย่านเกษตร ใกล้ BTS เสนานิคม พร้อมเข้าอยู่" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ให้เช่าคอนโด ศุภาลัย พาร์ค เกษตร อาคาร A ชั้น 21 ขนาด 35 ตร.ม. วิวเมือง ทิศเหนือ ทำเลดีที่สุดย่านเกษตร ใกล้ BTS เสนานิคม พร้อมเข้าอยู่">
                            ให้เช่าคอนโด ศุภาลัย พาร์ค เกษตร อาคาร A ชั้น 21 ขนาด 35 ตร.ม. วิวเมือง ทิศเหนือ ทำเลดีที่สุดย่านเกษตร ใกล้ BTS เสนานิคม พร้อมเข้าอยู่                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿9,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="TPI Thaipropertyinvestor">
                                    TPI***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13547">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784012706_3628_u285_1.jpg" 
                             class="card-img-top" alt="ขายด่วน อาคารพาณิชย์ 4.5 ชั้น วังทองหลาง ซอยลาดพร้าว 72 ขายพร้อมผู้เช่าระยะยาว" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายด่วน อาคารพาณิชย์ 4.5 ชั้น วังทองหลาง ซอยลาดพร้าว 72 ขายพร้อมผู้เช่าระยะยาว">
                            ขายด่วน อาคารพาณิชย์ 4.5 ชั้น วังทองหลาง ซอยลาดพร้าว 72 ขายพร้อมผู้เช่าระยะยาว                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿13,400,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="บริษัท เซ็นทรัล โฮม พร็อพเพอร์ตี้ จำกัด Central Home Property Co.,Ltd.">
                                    บริ***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13545">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-info position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ให้เช่า                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784011325_1149_u304_1.jpg" 
                             class="card-img-top" alt="ให้เช่า ทาวน์โฮม 3 ชั้น วิสต้า ปาร์ค พระราม 2 หลังเซ็นทรัลพระราม 2 ขนาด 22 ตรว พร้อมเฟอร์ครบ" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ให้เช่า ทาวน์โฮม 3 ชั้น วิสต้า ปาร์ค พระราม 2 หลังเซ็นทรัลพระราม 2 ขนาด 22 ตรว พร้อมเฟอร์ครบ">
                            ให้เช่า ทาวน์โฮม 3 ชั้น วิสต้า ปาร์ค พระราม 2 หลังเซ็นทรัลพระราม 2 ขนาด 22 ตรว พร้อมเฟอร์ครบ                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿25,000                                                                            <small class="text-muted" style="font-size: 0.7rem;">/ เริ่มต้น</small>
                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="Blue Connect Property Blue Connect Property">
                                    Blu***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13534">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784010778_9901_u278_1.jpg" 
                             class="card-img-top" alt="ขายบ้านเดี่ยวพร้อมเฟอร์นิเจอร์บิวท์อิน วรารมย์ พรีเมียม เชียงใหม่" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายบ้านเดี่ยวพร้อมเฟอร์นิเจอร์บิวท์อิน วรารมย์ พรีเมียม เชียงใหม่">
                            ขายบ้านเดี่ยวพร้อมเฟอร์นิเจอร์บิวท์อิน วรารมย์ พรีเมียม เชียงใหม่                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿10,000,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="ปราณี ฤทธิโคตร">
                                    ปรา***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13532">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784008968_1936_u348_1.jpg" 
                             class="card-img-top" alt="BHL1305 บ้านเดี่ยว 2 ชั้น หมู่บ้าน มัณฑนา ฉิมพลี ตลิ่งชัน" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="BHL1305 บ้านเดี่ยว 2 ชั้น หมู่บ้าน มัณฑนา ฉิมพลี ตลิ่งชัน">
                            BHL1305 บ้านเดี่ยว 2 ชั้น หมู่บ้าน มัณฑนา ฉิมพลี ตลิ่งชัน                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿17,000,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="HL Asset">
                                    HL ***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13530">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784006192_3685_u272_1.jpg" 
                             class="card-img-top" alt="ขายทาวน์เฮ้าส์ชั้นเดียวโครงการ สกายปาร์ค ลพบุรีราเมศวร์ ต.ท่าช้าง อ.บางกล่ำ จ.สงขลา" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายทาวน์เฮ้าส์ชั้นเดียวโครงการ สกายปาร์ค ลพบุรีราเมศวร์ ต.ท่าช้าง อ.บางกล่ำ จ.สงขลา">
                            ขายทาวน์เฮ้าส์ชั้นเดียวโครงการ สกายปาร์ค ลพบุรีราเมศวร์ ต.ท่าช้าง อ.บางกล่ำ จ.สงขลา                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿1,300,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="Panaya Kiddee">
                                    Pan***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13529">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        <div class="col-lg-3 col-md-4 col-6 mb-4">
                                <div class="card h-100 shadow-sm product-card ">
                                        
                    <div class="badge badge-success position-absolute" style="top:0.5rem; right:0.5rem; z-index: 10;">
                        ขาย                    </div>

                                        
                    <div class="img-container" style="height: 200px; overflow: hidden;">
                        <img src="admin/assets/uploads/1784005489_1107_u414_1.jpg" 
                             class="card-img-top" alt="ขายด่วนราคาถูกอาคารพาณิชย์ 3.5 ชั้น 1  คูหา ใกล้ ทางด่วนถนนพระราม2  โครงการมั่งมีศรีสุข ซอยพันท้ายนรสิงห์ อ.เมือง จ.สมุทรสาคร" style="width: 100%; height: 100%; object-fit: cover;">
                    </div>
                    
                    <div class="card-body d-flex flex-column">
                        <small class="text-muted">อสังหาริมทรัพย์</small>
                        <h6 class="card-title font-weight-bold text-truncate" title="ขายด่วนราคาถูกอาคารพาณิชย์ 3.5 ชั้น 1  คูหา ใกล้ ทางด่วนถนนพระราม2  โครงการมั่งมีศรีสุข ซอยพันท้ายนรสิงห์ อ.เมือง จ.สมุทรสาคร">
                            ขายด่วนราคาถูกอาคารพาณิชย์ 3.5 ชั้น 1  คูหา ใกล้ ทางด่วนถนนพระราม2  โครงการมั่งมีศรีสุข ซอยพันท้ายนรสิงห์ อ.เมือง จ.สมุทรสาคร                        </h6>
                        
                        <div class="mt-auto">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="text-primary font-weight-bold" style="font-size: 1.2rem;">
                                    ฿2,450,000                                                                    </span>
                            </div>
                            <hr class="my-2">
                            <div class="d-flex align-items-center mb-2">
                                <!-- ========== [เพิ่ม Avatar ผู้ขาย - แทนที่ไอคอนคนเดิม] ========== -->
                                <div class="avatar-placeholder seller-avatar-mini" title="ไม่มีรูปโปรไฟล์">
                    <i class="fa-solid fa-user"></i>
                </div>                                <small class="text-muted ml-2 text-truncate seller-name-masked" title="Bestestate Bestestate Agency">
                                    Bes***                                </small>
                                <!-- ========== [จบ Avatar - ลบ <i class="fa fa-user-circle"> ออกแล้ว] ========== -->
                            </div>
                            <button class="btn btn-primary btn-block btn-sm mt-2 view_product" data-id="13526">
                                ดูรายละเอียด
                            </button>
                        </div>
                    </div>
                </div>
            </div>
                        </div>
</div>

<style>
    .product-card {
        transition: transform 0.2s ease-in-out, box-shadow 0.2s;
        border: none;
        border-radius: 12px;
        overflow: hidden;
    }
    .product-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important;
    }
    .badge-info {
        background-color: #17a2b8;
    }
    .card-title {
        color: #333;
        margin-bottom: 0.5rem;
    }
</style>

            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.rakpramool.com/index.php?page=signup" target="_blank">
                    <img src="uploads/banner/1778558200_b5238ffed3cc.png" style="width:100%; height:auto; max-width:100%; border-radius:10px; display:block; margin:auto;max-height:200px; object-fit:cover; margin-top:15px;" alt="Banner footer">
                </a>
            </div>
        


<section class="sponsor-section border-top">
    <div class="container">
        <h4 class="section-title">พันธมิตรและผู้สนับสนุน</h4>


<div class="container text-center my-4">
    
    <div style="display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;">
        
            <div class="banner-wrapper" style="width:auto; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="http://hostshopads.runhosting.com/" target="_blank">
                    <img src="uploads/banner/1783867347_a8738141f84f.jpg" style="width:150px; height:150px; object-fit:cover; border-radius:10px; border: 1px solid #eee; display:block; transition:0.3s;" alt="Banner partner">
                </a>
            </div>
        
            <div class="banner-wrapper" style="width:auto; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.facebook.com/RealfishingThailand" target="_blank">
                    <img src="uploads/banner/1776049525_644d237e93a3.jpg" style="width:150px; height:150px; object-fit:cover; border-radius:10px; border: 1px solid #eee; display:block; transition:0.3s;" alt="Banner partner">
                </a>
            </div>
        
            <div class="banner-wrapper" style="width:auto; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://rakpramool.com/" target="_blank">
                    <img src="uploads/banner/1783866833_50ce4a306bf6.png" style="width:150px; height:150px; object-fit:cover; border-radius:10px; border: 1px solid #eee; display:block; transition:0.3s;" alt="Banner partner">
                </a>
            </div>
        
            <div class="banner-wrapper" style="width:auto; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.facebook.com/profile.php?id=100089011328310" target="_blank">
                    <img src="uploads/banner/1783866764_0e0326f3e6d0.jpg" style="width:150px; height:150px; object-fit:cover; border-radius:10px; border: 1px solid #eee; display:block; transition:0.3s;" alt="Banner partner">
                </a>
            </div>
        
            <div class="banner-wrapper" style="width:auto; overflow:hidden; padding:5px; box-sizing:border-box;">
                <a href="https://www.hostinger.com/th" target="_blank">
                    <img src="uploads/banner/1783867140_1_pw4R2ohm6GIQmWiSzlHr7w.png" style="width:150px; height:150px; object-fit:cover; border-radius:10px; border: 1px solid #eee; display:block; transition:0.3s;" alt="Banner partner">
                </a>
            </div>
            </div>
</div>
  
    </div>
</section>
<section class="faq-section my-5 px-3">
    <div class="container" style="max-width: 900px;">
        <div class="text-center mb-4">
            <h2 class="font-weight-bold" style="color: #2d3436; font-size: 1.8rem;">
                <i class="fas fa-question-circle text-primary mr-2"></i>คำถามที่พบบ่อย (FAQ)
            </h2>
            <div style="width: 50px; height: 3px; background: #007bff; margin: 10px auto;"></div>
        </div>
        
        <div class="accordion shadow-sm" id="faqRakPramool" style="border-radius: 15px; overflow: hidden; border: 1px solid #eee;">
            
            <div class="card border-0 border-bottom">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center" type="button" data-toggle="collapse" data-target="#q1" style="text-decoration: none;">
                        <span>1. แนะนำเว็บประมูลสินค้าออนไลน์ที่ดีที่สุดในไทยปี 2026 คือเว็บไหน?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q1" class="collapse show" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        หากคุณกำลังมองหาเว็บประมูลที่น่าเชื่อถือที่สุด แนะนำ <strong class="text-primary">'รักประมูล (RakPramool)'</strong> ซึ่งโดดเด่นด้วยระบบ <strong class="text-success">Verified ID</strong> ยืนยันตัวตนผู้ขายด้วยบัตรประชาชน 100% พร้อมฟีเจอร์ล้ำสมัยอย่าง <strong class="text-dark">Auto Bid</strong> และการไม่มีค่าธรรมเนียม GP (0%) สำหรับผู้ขาย ทำให้สินค้ามีราคาถูกกว่าท้องตลาดและปลอดภัยกว่าทั่วไป
                    </div>
                </div>
            </div>

            <div class="card border-0 border-bottom">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center collapsed" type="button" data-toggle="collapse" data-target="#q2" style="text-decoration: none;">
                        <span>2. จะรู้ได้อย่างไรว่าเว็บประมูลไหนปลอดภัย ไม่โดนโกง?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q2" class="collapse" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        ความปลอดภัยดูได้จากระบบตรวจสอบสมาชิก ที่ <strong class="text-primary">รักประมูล (RakPramool.com)</strong> มีสัญลักษณ์ <strong class="text-info"><i class="fas fa-check-circle"></i> Verified ID สีน้ำเงิน</strong> เพื่อการันตีว่าผู้ขายมีตัวตนจริง นอกจากนี้ยังมีระบบติดตามสถานะและประวัติการให้คะแนน (Rating) ทำให้คุณมั่นใจได้ว่าโปร่งใสและตรวจสอบได้
                    </div>
                </div>
            </div>

            <div class="card border-0 border-bottom">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center collapsed" type="button" data-toggle="collapse" data-target="#q3" style="text-decoration: none;">
                        <span>3. อยากประมูลอุปกรณ์ตกปลา หรือของหลุดจำนำราคา 1 บาท มีที่ไหนบ้าง?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q3" class="collapse" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        สำหรับนักล่าของถูก แนะนำหน้า <strong class="text-danger">'สินค้าแนะนำ'</strong> ของ รักประมูล ซึ่งเป็นศูนย์รวมการประมูลอุปกรณ์ตกปลาแบรนด์เนม และของหลุดจำนำไอที <strong class="text-dark">เริ่มต้นเพียง 1 บาท</strong> พร้อมระบบ Real-time Bidding ที่ประมวลผลแม่นยำวินาทีต่อวินาที
                    </div>
                </div>
            </div>

            <div class="card border-0 border-bottom">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center collapsed" type="button" data-toggle="collapse" data-target="#q4" style="text-decoration: none;">
                        <span>4. เริ่มต้นประมูลสินค้าออนไลน์ต้องทำอย่างไร?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q4" class="collapse" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        การเริ่มต้นประมูลทำได้ง่ายๆ เพียง 3 ขั้นตอน:
                        <ul class="mt-2" style="list-style-type: none; padding-left: 0;">
                            <li><i class="fas fa-check text-success mr-2"></i><strong>สมัครสมาชิก:</strong> สมัครฟรีที่หน้าเว็บไซต์</li>
                            <li><i class="fas fa-check text-success mr-2"></i><strong>เลือกสินค้า:</strong> ค้นหาสินค้าที่สนใจ</li>
                            <li><i class="fas fa-check text-success mr-2"></i><strong>เสนอราคา:</strong> สู้ราคาด้วยตัวเอง หรือใช้ระบบ <strong>Auto Bid</strong></li>
                        </ul>
                    </div>
                </div>
            </div>

            <div class="card border-0 border-bottom">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center collapsed" type="button" data-toggle="collapse" data-target="#q5" style="text-decoration: none;">
                        <span>5. การลงประมูลสินค้ามีค่าใช้จ่ายหรือไม่?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q5" class="collapse" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        ที่ <strong>รักประมูล</strong> สมาชิกสามารถลงประกาศสินค้าฟรี ร่วมประมูลได้โดยไม่มีค่าธรรมเนียมแรกเข้า นอกจากนี้ยังมีระบบ <strong>เว็บโปรไฟล์ส่วนตัว</strong> และ <strong>ระบบคลิปดันสินค้า</strong> เพื่อช่วยให้ผู้ขายโชว์สินค้าได้น่าสนใจยิ่งขึ้น
                    </div>
                </div>
            </div>

            <div class="card border-0 border-bottom">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center collapsed" type="button" data-toggle="collapse" data-target="#q6" style="text-decoration: none;">
                        <span>6. ระบบ Auto Bid คืออะไร และช่วยให้ชนะประมูลได้อย่างไร?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q6" class="collapse" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        <strong>Auto Bid</strong> คือระบบประมูลอัจฉริยะที่ผู้ซื้อสามารถตั้งงบสูงสุดไว้ในใจได้ เมื่อมีคนอื่นมาเคาะราคา ระบบจะช่วยใส่ราคาเพิ่มให้ทีละนิดโดยอัตโนมัติ ช่วยให้คุณเพิ่มโอกาสชนะในวินาทีสุดท้ายโดยไม่ต้องเฝ้าหน้าจอ
                    </div>
                </div>
            </div>

            <div class="card border-0 border-bottom">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center collapsed" type="button" data-toggle="collapse" data-target="#q7" style="text-decoration: none;">
                        <span>7. หากชนะประมูลแล้วต้องทำอย่างไรต่อ?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q7" class="collapse" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        เมื่อปิดการประมูลและคุณชนะ ระบบจะแจ้งยอดโอนให้ทราบ คุณสามารถติดต่อผู้ขายผ่านระบบโปรไฟล์เพื่อชำระเงิน โดยควรสังเกตเครื่องหมาย <strong class="text-info"><i class="fas fa-id-card"></i> Verified ID สีน้ำเงิน</strong> ของผู้ขายเพื่อความมั่นใจก่อนโอนเงินทุกครั้ง
                    </div>
                </div>
            </div>

            <div class="card border-0">
                <div class="card-header bg-white p-0">
                    <button class="btn btn-link btn-block text-left p-4 font-weight-bold text-dark d-flex justify-content-between align-items-center collapsed" type="button" data-toggle="collapse" data-target="#q8" style="text-decoration: none;">
                        <span>8. หากเป็นผู้ขายผู้ลงประมูลแล้วต้องทำอย่างไรต่อ?</span>
                        <i class="fas fa-chevron-down small text-muted"></i>
                    </button>
                </div>
                <div id="q8" class="collapse" data-parent="#faqRakPramool">
                    <div class="card-body p-4 text-muted bg-light" style="line-height: 1.8;">
                        เมื่อสินค้าของคุณมีคนประมูลชนะ สามารถเข้าไปดูรายการและติดต่อผู้ชนะผ่านระบบโปรไฟล์เพื่อแจ้งชำระเงินและจัดส่งสินค้า เมื่อเสร็จสิ้นแล้วอย่าลืม <strong class="text-success">ให้คะแนนรีวิวผู้ชนะประมูล</strong> เพื่อสร้างสังคมการประมูลที่ดีร่วมกันครับ
                    </div>
                </div>
            </div>

        </div>
    </div>
</section>


<style>
    .btn-link i { transition: transform 0.3s; }
    .btn-link:not(.collapsed) i { transform: rotate(180deg); }
    .card-header:hover { background-color: #f8f9fa !important; }
</style>


<style>
    .faq-section .btn-link { transition: 0.3s; color: #333 !important; }
    .faq-section .btn-link:not(.collapsed) { background-color: #f8f9fa; color: #007bff !important; }
    .faq-section .btn-link:not(.collapsed) i { transform: rotate(180deg); }
    .faq-section .card { border-radius: 0 !important; }
    .faq-section .card-body { font-size: 0.95rem; }
</style>


<footer class="footer-custom py-5">
    <div class="container">
        <div class="row justify-content-center mb-4">
            <div class="col-lg-8 text-center">
                <h2 class="footer-title">ช่องทางติดต่อ/แจ้งปัญหาใช้งาน</h2>
                <div class="footer-divider mx-auto"></div>
            </div>
        </div>

        <div class="row text-center text-dark">
            <!-- Phone -->
            <div class="col-lg-4 mb-4">
                <div class="footer-box">
                    <div class="footer-icon">
                        <i class="fas fa-phone"></i>
                    </div>
                    <div class="footer-text">
                        +66836338752                    </div>
                </div>
            </div>

            <!-- Email -->
            <div class="col-lg-4 mb-4">
                <div class="footer-box">
                    <div class="footer-icon">
                        <i class="fas fa-envelope"></i>
                    </div>
                    <div class="footer-text">
                        <a href="mailto:webmaster@rakpramool.com">
                            webmaster@rakpramool.com                        </a>
                    </div>
                </div>
            </div>

            <!-- Website Name -->
            <div class="col-lg-4 mb-4">
                <div class="footer-box">
                    <div class="footer-icon">
                        <i class="fas fa-globe"></i>
                    </div>
                    <div class="footer-text">
                        รักประมูล (RakPramool)
                    </div>
                </div>
            </div>
        </div>
    </div>

<br>
    </footer>

<section class="seo-keywords-section py-4 bg-light">
    <div class="container">
        <h2 class="h5 mb-3 text-secondary border-bottom pb-2">คำค้นหายอดนิยม (Popular Searches)</h2>
        <div class="seo-tags d-flex flex-wrap" style="gap: 10px;">
            <a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บประมูลสินค้า</a><a href="index.php?page=allbid&search=%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ประมูลสินค้าออนไลน์</a><a href="index.php?page=allbid&search=%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B8%AA%E0%B8%B0%E0%B8%AA%E0%B8%A1" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ประมูลของสะสม</a><a href="index.php?page=allbid&search=%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B9%82%E0%B8%A1%E0%B9%80%E0%B8%94%E0%B8%A5+%E0%B8%9F%E0%B8%B4%E0%B8%81%E0%B9%80%E0%B8%81%E0%B8%AD%E0%B8%A3%E0%B9%8C" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ประมูลโมเดล ฟิกเกอร์</a><a href="index.php?page=allbid&search=%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B9%80%E0%B8%A5%E0%B9%88%E0%B8%99%E0%B8%8D%E0%B8%B5%E0%B9%88%E0%B8%9B%E0%B8%B8%E0%B9%88%E0%B8%99" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ประมูลของเล่นญี่ปุ่น</a><a href="index.php?page=allbid&search=%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%A1%E0%B8%B7%E0%B8%AD%E0%B8%AA%E0%B8%AD%E0%B8%87" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ประมูลสินค้ามือสอง</a><a href="index.php?page=allbid&search=%E0%B8%A3%E0%B8%B0%E0%B8%9A%E0%B8%9A%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%AD%E0%B8%B1%E0%B8%95%E0%B9%82%E0%B8%99%E0%B8%A1%E0%B8%B1%E0%B8%95%E0%B8%B4+%28Auto+Bid%29" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ระบบประมูลอัตโนมัติ (Auto Bid)</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%97%E0%B8%B5%E0%B9%88%E0%B8%99%E0%B9%88%E0%B8%B2%E0%B9%80%E0%B8%8A%E0%B8%B7%E0%B9%88%E0%B8%AD%E0%B8%96%E0%B8%B7%E0%B8%AD" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บประมูลที่น่าเชื่อถือ</a><a href="index.php?page=allbid&search=%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B8%AB%E0%B8%A5%E0%B8%B8%E0%B8%94%E0%B8%88%E0%B8%B3%E0%B8%99%E0%B8%B3" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ประมูลของหลุดจำนำ</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B8%A3%E0%B8%B2%E0%B8%84%E0%B8%B2%E0%B8%96%E0%B8%B9%E0%B8%81" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บประมูลของราคาถูก</a><a href="index.php?page=allbid&search=%E0%B8%A5%E0%B8%87%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%81%E0%B8%B2%E0%B8%A8%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%9F%E0%B8%A3%E0%B8%B5" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ลงประกาศขายสินค้าฟรี</a><a href="index.php?page=allbid&search=%E0%B8%A5%E0%B8%87%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ลงประมูลสินค้า</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%9B%E0%B8%B4%E0%B8%94%E0%B8%AB%E0%B8%99%E0%B9%89%E0%B8%B2%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%99%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C%E0%B8%9F%E0%B8%A3%E0%B8%B5" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เปิดหน้าร้านออนไลน์ฟรี</a><a href="index.php?page=allbid&search=%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C+%E0%B9%84%E0%B8%A1%E0%B9%88%E0%B8%AB%E0%B8%B1%E0%B8%81+GP" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ขายสินค้าออนไลน์ ไม่หัก GP</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%9A%E0%B8%AD%E0%B8%A3%E0%B9%8C%E0%B8%94%E0%B8%8B%E0%B8%B7%E0%B9%89%E0%B8%AD%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บบอร์ดซื้อขายสินค้า</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%A5%E0%B8%87%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B8%A1%E0%B8%B7%E0%B8%AD%E0%B8%AA%E0%B8%AD%E0%B8%87" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บลงขายของมือสอง</a><a href="index.php?page=allbid&search=%E0%B8%9E%E0%B8%B7%E0%B9%89%E0%B8%99%E0%B8%97%E0%B8%B5%E0%B9%88%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">พื้นที่ขายของออนไลน์</a><a href="index.php?page=allbid&search=%E0%B9%81%E0%B8%AB%E0%B8%A5%E0%B9%88%E0%B8%87%E0%B8%A3%E0%B8%A7%E0%B8%A1%E0%B8%9E%E0%B9%88%E0%B8%AD%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B9%81%E0%B8%A1%E0%B9%88%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">แหล่งรวมพ่อค้าแม่ค้าออนไลน์</a><a href="index.php?page=allbid&search=%E0%B8%A7%E0%B8%B4%E0%B8%98%E0%B8%B5%E0%B8%A5%E0%B8%87%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">วิธีลงขายสินค้าออนไลน์</a><a href="index.php?page=allbid&search=%E0%B8%A3%E0%B8%B0%E0%B8%9A%E0%B8%9A%E0%B8%88%E0%B8%B1%E0%B8%94%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ระบบจัดการร้านค้าออนไลน์</a><a href="index.php?page=allbid&search=Verified+ID+%E0%B8%9C%E0%B8%B9%E0%B9%89%E0%B8%82%E0%B8%B2%E0%B8%A2" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">Verified ID ผู้ขาย</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%9B%E0%B8%A5%E0%B8%AD%E0%B8%94%E0%B8%A0%E0%B8%B1%E0%B8%A2+%E0%B9%84%E0%B8%A1%E0%B9%88%E0%B9%82%E0%B8%94%E0%B8%99%E0%B9%82%E0%B8%81%E0%B8%87" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บประมูลปลอดภัย ไม่โดนโกง</a><a href="index.php?page=allbid&search=%E0%B8%A3%E0%B8%B1%E0%B8%81%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5+%28Rakpramool%29" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">รักประมูล (Rakpramool)</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%AD%E0%B8%B1%E0%B8%99%E0%B8%94%E0%B8%B1%E0%B8%9A+1" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บประมูลอันดับ 1</a><a href="index.php?page=allbid&search=%E0%B8%8B%E0%B8%B7%E0%B9%89%E0%B8%AD%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B8%8D%E0%B8%B5%E0%B9%88%E0%B8%9B%E0%B8%B8%E0%B9%88%E0%B8%99+%E0%B8%A1%E0%B8%B7%E0%B8%AD%E0%B8%AA%E0%B8%AD%E0%B8%87" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ซื้อขายสินค้าญี่ปุ่น มือสอง</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%8A%E0%B9%87%E0%B8%84%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A7%E0%B8%B1%E0%B8%95%E0%B8%B4%E0%B8%9C%E0%B8%B9%E0%B9%89%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%AD%E0%B8%AD%E0%B8%99%E0%B9%84%E0%B8%A5%E0%B8%99%E0%B9%8C" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เช็คประวัติผู้ขายออนไลน์</a><a href="index.php?page=allbid&search=%E0%B8%AA%E0%B8%B1%E0%B8%87%E0%B8%84%E0%B8%A1%E0%B8%99%E0%B8%B1%E0%B8%81%E0%B8%AA%E0%B8%B0%E0%B8%AA%E0%B8%A1%E0%B8%82%E0%B8%AD%E0%B8%87%E0%B9%81%E0%B8%97%E0%B9%89" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">สังคมนักสะสมของแท้</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%97%E0%B8%84%E0%B8%99%E0%B8%B4%E0%B8%84%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เทคนิคการประมูลสินค้า</a><a href="index.php?page=allbid&search=%E0%B8%95%E0%B8%A5%E0%B8%B2%E0%B8%94%E0%B8%8B%E0%B8%B7%E0%B9%89%E0%B8%AD%E0%B8%82%E0%B8%B2%E0%B8%A2%E0%B8%AA%E0%B8%B4%E0%B8%99%E0%B8%84%E0%B9%89%E0%B8%B2%E0%B9%81%E0%B8%A3%E0%B8%A3%E0%B9%8C%E0%B9%84%E0%B8%AD%E0%B9%80%E0%B8%97%E0%B8%A1" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">ตลาดซื้อขายสินค้าแรร์ไอเทม</a><a href="index.php?page=allbid&search=%E0%B9%80%E0%B8%A7%E0%B9%87%E0%B8%9A%E0%B8%9B%E0%B8%A3%E0%B8%B0%E0%B8%A1%E0%B8%B9%E0%B8%A5%E0%B9%80%E0%B8%A3%E0%B8%B5%E0%B8%A2%E0%B8%A5%E0%B9%84%E0%B8%97%E0%B8%A1%E0%B9%8C+%28Real-time+Bidding%29" 
                         class="badge badge-pill badge-outline-primary p-2 border text-dark" 
                         style="text-decoration: none; font-size: 0.85rem; background: #fff;">เว็บประมูลเรียลไทม์ (Real-time Bidding)</a>        </div>
    </div>
</section>


    
 
 <style>



/* Footer Premium Style */
.footer-custom {
    background: #f8f9fa;
    border-top: 3px solid #ff8f3d;
    padding-top: 60px;
    padding-bottom: 40px;
}

.footer-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: #222;
}

.footer-divider {
    width: 70px;
    height: 4px;
    background: linear-gradient(90deg, #ff8f3d, #ff4e4e);
    border-radius: 6px;
    margin-top: 10px;
    margin-bottom: 20px;
}

.footer-box {
    padding: 20px 15px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: transform .2s, box-shadow .2s;
}

.footer-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}

.footer-icon {
    font-size: 36px;
    color: #ff6a2e;
    margin-bottom: 10px;
}

.footer-text {
    font-size: 1.05rem;
    color: #333;
    font-weight: 500;
}

.footer-text a {
    color: #ff4e4e;
    font-weight: 600;
    text-decoration: none;
}

.footer-text a:hover {
    text-decoration: underline;
}




   .modal-dialog.large {
    width: 80% !important;
    max-width: unset;
  }
  .modal-dialog.mid-large {
    width: 50% !important;
    max-width: unset;
  }
 </style>
 
 <script>
 	$('.datepicker').datepicker({
 		format:"yyyy-mm-dd"
 	})
 	 window.start_load = function(){
    $('body').prepend('<di id="preloader2"></di>')
  }
  window.end_load = function(){
    $('#preloader2').fadeOut('fast', function() {
        $(this).remove();
      })
  }

 	window.uni_modal = function($title = '' , $url='',$size=''){
    start_load()
    $.ajax({
        url:$url,
        error:err=>{
            console.log()
            alert("An error occured")
        },
        success:function(resp){
            if(resp){
                $('#uni_modal .modal-title').html($title)
                $('#uni_modal .modal-body').html(resp)
                if($size != ''){
                    $('#uni_modal .modal-dialog').addClass($size)
                }else{
                    $('#uni_modal .modal-dialog').removeAttr("class").addClass("modal-dialog modal-md")
                }
                $('#uni_modal').modal({
                  show:true,
                  backdrop:'static',
                  keyboard:false,
                  focus:true
                })
                end_load()
            }
        }
    })
}
  window.uni_modal_right = function($title = '' , $url=''){
    start_load()
    $.ajax({
        url:$url,
        error:err=>{
            console.log()
            alert("An error occured")
        },
        success:function(resp){
            if(resp){
                $('#uni_modal_right .modal-title').html($title)
                $('#uni_modal_right .modal-body').html(resp)
                
                $('#uni_modal_right').modal('show')
                end_load()
            }
        }
    })
}
window.viewer_modal = function($src = ''){
    start_load()
    var t = $src.split('.')
    t = t[1]
    if(t =='mp4'){
      var view = $("<video src='"+$src+"' controls autoplay></video>")
    }else{
      var view = $("<img src='"+$src+"' />")
    }
    $('#viewer_modal .modal-content video,#viewer_modal .modal-content img').remove()
    $('#viewer_modal .modal-content').append(view)
    $('#viewer_modal').modal({
                  show:true,
                  focus:true
                })
                end_load()  

}
window.alert_toast= function($msg = 'TEST',$bg = 'success'){
      $('#alert_toast').removeClass('bg-success')
      $('#alert_toast').removeClass('bg-danger')
      $('#alert_toast').removeClass('bg-info')
      $('#alert_toast').removeClass('bg-warning')

    if($bg == 'success')
      $('#alert_toast').addClass('bg-success')
    if($bg == 'danger')
      $('#alert_toast').addClass('bg-danger')
    if($bg == 'info')
      $('#alert_toast').addClass('bg-info')
    if($bg == 'warning')
      $('#alert_toast').addClass('bg-warning')
    $('#alert_toast .toast-body').html($msg)
    $('#alert_toast').toast({delay:3000}).toast('show');
  }
  window._conf = function($msg='',$func='',$params = []){
     $('#confirm_modal #confirm').attr('onclick',$func+"("+$params.join(',')+")")
     $('#confirm_modal .modal-body').html($msg)
     $('#confirm_modal').modal('show')
  }
  window.load_cart = function(){
    $.ajax({
      url:'admin/ajax.php?action=get_cart_count',
      success:function(resp){
        if(resp > -1){
          resp = resp > 0 ? resp : 0;
          $('.item_count').html(resp)
        }
      }
    })
  }
  $('#login_now').click(function(){
    uni_modal("LOGIN",'login.php')
  })
  $(document).ready(function(){
    load_cart()
     $('#preloader').fadeOut('fast', function() {
        $(this).remove();
      })
  })
 </script>
        <!-- Bootstrap core JS-->
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.bundle.min.js"></script>
        <!-- Third party plugin JS-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
        <!-- Core theme JS-->

        <script src="js/scripts.js"></script></footer>

<div class="d-flex justify-content-center">
    <div class="social-container">
        <a href="https://www.facebook.com/profile.php?id=61584695155872" target="_blank" class="social-icon facebook">
            <i class="fa-brands fa-facebook"></i>
        </a>

        <a href="https://lin.ee/ScjQnRi" target="_blank" class="social-icon line">
            <i class="fa-brands fa-line"></i>
        </a>

        <a href="https://www.youtube.com/@Rakpramool" target="_blank" class="social-icon youtube">
            <i class="fa-brands fa-youtube"></i>
        </a>
    </div>
</div>

<div id="cookie-banner" class="fixed-bottom bg-white border-top shadow-lg p-3" style="display: none; z-index: 1050;">
    <div class="container">
        <div class="d-flex align-items-center justify-content-between flex-wrap">
            
            <div class="col-md-9 col-12 text-center text-md-left mb-2 mb-md-0">
                <p class="mb-0 text-muted">
                    <i class="fas fa-cookie-bite text-primary mr-2"></i>
                    เว็บไซต์นี้ใช้คุกกี้ (Cookies) เพื่อเพิ่มประสิทธิภาพการใช้งาน และการเข้าถึงข้อมูลที่เหมาะสมสำหรับคุณ 
                    <a href="privacy_policy.php" target="_blank" class="text-info font-weight-bold">อ่านนโยบายความเป็นส่วนตัว</a>
                </p>
            </div>
            
            <div class="col-md-3 col-12 text-center">
                <button id="accept-cookie" class="btn btn-primary btn-sm btn-block">
                    <i class="fas fa-check-circle"></i> ยอมรับทั้งหมด
                </button>
            </div>

        </div>
    </div>
</div>
<script>
$(document).ready(function() {
    // 1. ตรวจสอบสถานะคุกกี้เมื่อโหลดหน้า
    if (localStorage.getItem('cookieAccepted') !== 'true') {
        // ถ้าผู้ใช้ยังไม่เคยยอมรับคุกกี้ ให้แสดง Banner
        $('#cookie-banner').delay(1000).fadeIn(500); // ดีเลย์ 1 วินาทีแล้วค่อยแสดง
    }

    // 2. เมื่อผู้ใช้คลิกปุ่ม 'ยอมรับทั้งหมด'
    $('#accept-cookie').click(function() {
        // บันทึกสถานะความยินยอมลงใน Local Storage
        localStorage.setItem('cookieAccepted', 'true');
        
        // ซ่อน Banner ด้วย Animation
        $('#cookie-banner').fadeOut(300, function() {
            // (คุณอาจเพิ่มโค้ดสำหรับโหลด script/analytic ที่เกี่ยวข้องกับคุกกี้ที่นี่)
            console.log("Cookie consent recorded.");
        });
    });
    
    // หมายเหตุ: หากคุณต้องการให้ Cookie หมดอายุแทนการเก็บถาวร
    // คุณจะต้องใช้ document.cookie แทน localStorage.setItem
});
</script>



<div class="container border-top pt-4">
    <div class="small text-center text-muted">
        
  <section class="seo-content mt-4 p-3 border rounded bg-light">
    <h1 class="h5 font-weight-bold mb-3 text-dark">
        <i class="fas fa-gavel text-primary mr-2"></i> รักประมูล (RakPramool) เว็บประมูลสินค้าออนไลน์ที่คุณไว้วางใจ
    </h1>
    
    <p class="mb-3 text-secondary">
        ศูนย์รวมสินค้าหลากหลายรายการ ทั้งมือหนึ่งและมือสอง ให้คุณเปิดร้านขายของออนไลน์และประกาศขายสินค้าฟรีได้ง่ายๆ 
        แหล่งรวมรายการประมูลที่น่าเชื่อถือและดีที่สุดสำหรับคุณ
    </p>

    <hr class="my-2">
    <div class="small text-muted">
        <p class="mb-1">
            <strong>รักประมูล</strong> คือแพลตฟอร์มประมูลสินค้าออนไลน์ ภายใต้การบริหารงานของ <strong>เรียวฟิชชิ่งไทยแลนด์</strong>
        </p>
        <p class="mb-1">
            <i class="fas fa-id-card mr-1"></i> เลขทะเบียนพาณิชย์: 1004265000280
        </p>
        <p class="mb-0">
            <i class="fas fa-map-marker-alt mr-1"></i> ที่ตั้ง: 2/323 มบ.แมกไม้วัชรพลสุขาภิบาล 5 ซอย 92 แขวงสายไหม เขตสายไหม กทม. 10220
        </p>
    </div>
</section>

        <div class="footer-links mb-3">
            <a href="https://rakpramool.com/privacy_policy.php" target="_blank" class="text-secondary">นโยบายส่วนบุคคล</a>
            <span class="mx-2">|</span>
            <a href="https://rakpramool.com/index.php?page=about" target="_blank" class="text-secondary">ข้อกำหนดและเงื่อนไข</a>
            <span class="mx-2">|</span>
            <a href="https://rakpramool.com/index.php?page=how_to" target="_blank" class="text-secondary">แนะนำการใช้งานเบื้องต้น</a>
        </div>

        <div class="copyright mb-2 text-muted">
            Copyright © 2025 - 2026 - RAKPRAMOOL 
        </div>

    </div>
</div>


        </footer>


       
 
 <style>



/* Footer Premium Style */
.footer-custom {
    background: #f8f9fa;
    border-top: 3px solid #ff8f3d;
    padding-top: 60px;
    padding-bottom: 40px;
}

.footer-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: #222;
}

.footer-divider {
    width: 70px;
    height: 4px;
    background: linear-gradient(90deg, #ff8f3d, #ff4e4e);
    border-radius: 6px;
    margin-top: 10px;
    margin-bottom: 20px;
}

.footer-box {
    padding: 20px 15px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: transform .2s, box-shadow .2s;
}

.footer-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}

.footer-icon {
    font-size: 36px;
    color: #ff6a2e;
    margin-bottom: 10px;
}

.footer-text {
    font-size: 1.05rem;
    color: #333;
    font-weight: 500;
}

.footer-text a {
    color: #ff4e4e;
    font-weight: 600;
    text-decoration: none;
}

.footer-text a:hover {
    text-decoration: underline;
}




   .modal-dialog.large {
    width: 80% !important;
    max-width: unset;
  }
  .modal-dialog.mid-large {
    width: 50% !important;
    max-width: unset;
  }
 </style>
 
 <script>
 	$('.datepicker').datepicker({
 		format:"yyyy-mm-dd"
 	})
 	 window.start_load = function(){
    $('body').prepend('<di id="preloader2"></di>')
  }
  window.end_load = function(){
    $('#preloader2').fadeOut('fast', function() {
        $(this).remove();
      })
  }

 	window.uni_modal = function($title = '' , $url='',$size=''){
    start_load()
    $.ajax({
        url:$url,
        error:err=>{
            console.log()
            alert("An error occured")
        },
        success:function(resp){
            if(resp){
                $('#uni_modal .modal-title').html($title)
                $('#uni_modal .modal-body').html(resp)
                if($size != ''){
                    $('#uni_modal .modal-dialog').addClass($size)
                }else{
                    $('#uni_modal .modal-dialog').removeAttr("class").addClass("modal-dialog modal-md")
                }
                $('#uni_modal').modal({
                  show:true,
                  backdrop:'static',
                  keyboard:false,
                  focus:true
                })
                end_load()
            }
        }
    })
}
  window.uni_modal_right = function($title = '' , $url=''){
    start_load()
    $.ajax({
        url:$url,
        error:err=>{
            console.log()
            alert("An error occured")
        },
        success:function(resp){
            if(resp){
                $('#uni_modal_right .modal-title').html($title)
                $('#uni_modal_right .modal-body').html(resp)
                
                $('#uni_modal_right').modal('show')
                end_load()
            }
        }
    })
}
window.viewer_modal = function($src = ''){
    start_load()
    var t = $src.split('.')
    t = t[1]
    if(t =='mp4'){
      var view = $("<video src='"+$src+"' controls autoplay></video>")
    }else{
      var view = $("<img src='"+$src+"' />")
    }
    $('#viewer_modal .modal-content video,#viewer_modal .modal-content img').remove()
    $('#viewer_modal .modal-content').append(view)
    $('#viewer_modal').modal({
                  show:true,
                  focus:true
                })
                end_load()  

}
window.alert_toast= function($msg = 'TEST',$bg = 'success'){
      $('#alert_toast').removeClass('bg-success')
      $('#alert_toast').removeClass('bg-danger')
      $('#alert_toast').removeClass('bg-info')
      $('#alert_toast').removeClass('bg-warning')

    if($bg == 'success')
      $('#alert_toast').addClass('bg-success')
    if($bg == 'danger')
      $('#alert_toast').addClass('bg-danger')
    if($bg == 'info')
      $('#alert_toast').addClass('bg-info')
    if($bg == 'warning')
      $('#alert_toast').addClass('bg-warning')
    $('#alert_toast .toast-body').html($msg)
    $('#alert_toast').toast({delay:3000}).toast('show');
  }
  window._conf = function($msg='',$func='',$params = []){
     $('#confirm_modal #confirm').attr('onclick',$func+"("+$params.join(',')+")")
     $('#confirm_modal .modal-body').html($msg)
     $('#confirm_modal').modal('show')
  }
  window.load_cart = function(){
    $.ajax({
      url:'admin/ajax.php?action=get_cart_count',
      success:function(resp){
        if(resp > -1){
          resp = resp > 0 ? resp : 0;
          $('.item_count').html(resp)
        }
      }
    })
  }
  $('#login_now').click(function(){
    uni_modal("LOGIN",'login.php')
  })
  $(document).ready(function(){
    load_cart()
     $('#preloader').fadeOut('fast', function() {
        $(this).remove();
      })
  })
 </script>
        <!-- Bootstrap core JS-->
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.bundle.min.js"></script>
        <!-- Third party plugin JS-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.4.1/jquery.easing.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
        <!-- Core theme JS-->

        <script src="js/scripts.js"></script>

    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script>
        $(document).ready(function(){
            // เช็ค Session กันมันเด้งทุกครั้งที่รีเฟรช (เลือกใช้ตามความเหมาะสม)
            if (!sessionStorage.getItem('shown_ad_popup')) {
                Swal.fire({
                    html: `            <div class="banner-wrapper" style="width:100%; overflow:hidden; padding:5px; box-sizing:border-box;">                <a href="https://www.rakpramool.com/index.php?page=signup" target="_blank">                    <img src="uploads/banner/1779684974_d797b0df622d.jpg" style="width:100%; max-width:600px; height:auto; border-radius:15px; display:block; margin:auto; cursor:pointer; box-shadow: 0 5px 15px rgba(0,0,0,0.3);" alt="Banner popup">                </a>            </div>        `,
                    showCloseButton: true,
                    showConfirmButton: false,
                    background: 'transparent', // ทำให้พื้นหลัง Swal ใส เพื่อโชว์สไตล์ที่เราเขียนใน PHP
                    width: 'auto',
                    padding: '0'
                });
                sessionStorage.setItem('shown_ad_popup', 'true');
            }
        });
    </script>

<script>
  $(window).on('load', function () {
    if ($('#preloader').length) {
      $('#preloader').delay(100).fadeOut('slow', function () {
        $(this).remove();
      });
    }
  });
</script>





    <script type="text/javascript">
      $('#login').click(function(){
        uni_modal("Login",'login.php')
      })
      $('.datetimepicker').datetimepicker({
          format:'Y-m-d H:i',
      })
      $('#find-car').submit(function(e){
        e.preventDefault()
        location.href = 'index.php?page=search&'+$(this).serialize()
      })
    </script>
    


<script>
$('#signup_now').click(function(){
    uni_modal("สมัครสมาชิก","signup.php");
});
</script>


<script>
    $('.view_product').click(function(){
        var id = $(this).attr('data-id');
        // คุณสามารถส่งไปหน้ารายละเอียดสินค้า
        location.href = "index.php?page=view_market_product&id=" + id;
        
        // หรือถ้าอยากให้แสดงเป็น Modal (Pop-up) ก็ใช้แบบนี้:
        // uni_modal("รายละเอียดสินค้า", "view_product_modal.php?id=" + id, "large");
    })
</script>

<script>
$(document).ready(function(){
    // แก้ไขให้รองรับทั้ง id="login" และ id="login_now"
    $('#login, #login_now').off('click').on('click', function(e){
        e.preventDefault();
        console.log("Login button clicked"); // ตรวจสอบใน Console (F12)
        uni_modal("เข้าสู่ระบบ","login.php");
    });

    // ดักจับจังหวะที่กดปุ่ม 'Login' ภายในตัว Modal login.php
    $(document).on('submit', '#uni_modal form', function(e){
        var loading_icon = '<i class="fa fa-spinner fa-spin"></i>';
        var btn = $(this).find('button[type="submit"]');
        
        // ถ้ามันหมุนค้างนานเกิน 10 วินาที ให้คืนค่าปุ่ม (ป้องกันค้างถาวร)
        setTimeout(function(){
            if(btn.is(':disabled')){
                btn.removeAttr('disabled').html('Login');
                console.log("Request timeout - ปุ่มถูกปลดล็อกอัตโนมัติ");
            }
        }, 10000);
    });
});
</script>

<script>
$(document).ready(function(){
    // ใช้ $(document).on() เพื่อให้รองรับปุ่มที่โหลดมาใหม่ตลอดเวลา
    $(document).on('click', '.view_prod', function(e){
        e.preventDefault();
        var id = $(this).attr('data-id');
        
        if(id) {
            // พาไปหน้ารายละเอียดสินค้าประมูล
            location.href = "index.php?page=view_prod&id=" + id;
        } else {
            console.error("ไม่พบ data-id ที่ปุ่มครับพี่");
        }
    });
});
</script>










<script>
    function check_chat_notification(){
        $.ajax({
            url:'admin/ajax.php?action=get_unread_count',
            success:function(resp){
                if(resp > 0){
                    $('#chat-badge').text(resp).show(); // แสดงจำนวนข้อความใหม่
                } else {
                    $('#chat-badge').hide(); // ถ้าไม่มีก็ซ่อนไว้
                }
            }
        })
    }

    $(document).ready(function(){
        check_chat_notification(); // เช็คทันทีที่โหลดหน้า
        
        // เช็คทุกๆ 10 วินาที (ไม่ให้หนัก Server เกินไป)
        setInterval(function(){
            check_chat_notification();
        }, 10000);

        // ดักจับเหตุการณ์การเปิด/ปิด Dropdown เมนูชื่อผู้ใช้ แบบ Event Delegation เพื่อความมั่นใจและแก้ปัญหา Cache หรือลำดับการโหลดสคริปต์
        $(document).on('show.bs.dropdown', '#navbarResponsive .dropdown', function () {
            if ($(this).find('#userDropdown').length > 0) {
                // เมื่อกดเปิดเมนูผู้ใช้ ให้ซ่อนรายการเมนูอื่นๆ บนมือถือ
                $('#navbarResponsive .nav-item').not($(this)).addClass('d-none-mobile-menu');
            }
        });
        
        $(document).on('hide.bs.dropdown', '#navbarResponsive .dropdown', function () {
            if ($(this).find('#userDropdown').length > 0) {
                // เมื่อเมนูผู้ใช้ถูกปิด ให้แสดงเมนูอื่นๆ ตามปกติ
                $('#navbarResponsive .nav-item').removeClass('d-none-mobile-menu');
            }
        });

        // ดักจับเมื่อปิดการยุบ/ขยายเมนูหลัก (ในกรณีผู้ใช้กดซ่อนแถบเมนูหลัก ให้รีเซ็ตคลาสด้วย)
        $(document).on('hide.bs.collapse', '#navbarResponsive', function () {
            $('#navbarResponsive .nav-item').removeClass('d-none-mobile-menu');
        });
    });
</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">




<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<link href="https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500&display=swap" rel="stylesheet">

<style>
    /* 1. ปุ่มวงกลมไอคอนกระต่ายส้มทอง */
    #ai-chat-circle {
        position: fixed !important; bottom: 30px !important; right: 30px !important;
        width: 75px; height: 75px; border-radius: 50%; cursor: pointer;
        z-index: 999999 !important; transition: all 0.3s ease;
        display: flex; align-items: center; justify-content: center;
        background: linear-gradient(135deg, #ffcc33 0%, #ff9900 100%);
        box-shadow: 0px 8px 25px rgba(255, 153, 0, 0.5);
        border: 3px solid #fff; overflow: hidden;
    }
    #ai-chat-circle::before {
        content: ""; width: 85%; height: 85%;
        background-image: url('https://img.freepik.com/free-vector/cute-rabbit-robot-cartoon-vector-icon-illustration-animal-technology-icon-concept-isolated-premium-vector-flat-cartoon-style_138676-3507.jpg');
        background-size: contain; background-repeat: no-repeat; background-position: center;
        filter: sepia(100%) saturate(300%) hue-rotate(-15deg);
    }
    #ai-chat-circle:hover { transform: scale(1.1) rotate(10deg); box-shadow: 0px 12px 30px rgba(255, 153, 0, 0.7); }

    /* 2. หน้าต่างแชท */
    #ai-chat-window {
        display: none; position: fixed !important; bottom: 115px !important; right: 30px !important;
        width: 380px; max-width: 90vw; height: 550px;
        background: #fff; border-radius: 25px;
        box-shadow: 0px 15px 40px rgba(0,0,0,0.2);
        z-index: 999999 !important; flex-direction: column; overflow: hidden;
        border: 1px solid #eee; font-family: 'Kanit', sans-serif;
    }

    .ai-chat-header { 
        background: linear-gradient(90deg, #ff9900, #ffcc33); 
        color: #fff; padding: 18px; font-weight: 500; 
        display: flex; justify-content: space-between; align-items: center; 
    }

    #ai-chat-logs { 
        padding: 15px; height: 350px; overflow-y: auto; 
        background: #fdfdfd; display: flex; flex-direction: column; gap: 12px; 
    }
    .ai-msg { padding: 12px 16px; border-radius: 20px; font-size: 14px; max-width: 85%; line-height: 1.5; word-wrap: break-word; }
    .ai-msg.user { align-self: flex-end; background: #ff9900; color: #fff; border-bottom-right-radius: 5px; }
    .ai-msg.bot { align-self: flex-start; background: #f1f0f0; color: #333; border-bottom-left-radius: 5px; }

    /* สไตล์สำหรับลิงก์ในแชท */
    .ai-msg a {
        color: #ff6600;
        text-decoration: underline;
        font-weight: 500;
        word-break: break-all;
    }
    .ai-msg a:hover { color: #cc5200; }

    /* 3. ปุ่มคำถามด่วน */
    .ai-chat-quick-tags {
        padding: 12px 15px; display: flex; gap: 8px;
        overflow-x: auto; overflow-y: hidden; white-space: nowrap;
        background: #fff; border-top: 1px solid #eee;
        -webkit-overflow-scrolling: touch; scrollbar-width: none; 
    }
    .ai-chat-quick-tags::-webkit-scrollbar { display: none; }
    
    .quick-tag {
        display: inline-block; flex-shrink: 0;
        background: #fff; color: #555; padding: 7px 15px;
        border-radius: 20px; font-size: 13px; cursor: pointer;
        border: 1px solid #ddd; transition: all 0.2s;
    }
    .quick-tag:hover { background: #fff4e5; color: #ff9900; border-color: #ff9900; }

    /* 4. ช่องพิมพ์ข้อความ */
    .ai-chat-input-area { border-top: 1px solid #eee; padding: 12px 15px; display: flex; align-items: center; background: #fff; }
    #ai-chat-input { flex: 1; border: none; outline: none; padding: 8px; font-size: 14px; background: #f8f8f8; border-radius: 10px; }
    #ai-chat-send { border: none; background: none; color: #ff9900; font-size: 20px; cursor: pointer; margin-left: 10px; transition: 0.2s; }
    #ai-chat-send:hover { transform: scale(1.1); }
</style>

<div id="ai-chat-circle"></div>

<div id="ai-chat-window">
    <div class="ai-chat-header">
        <span>🐰 น้องกระต่าย AI Rakpramool</span>
        <span id="ai-chat-close" style="cursor:pointer;"><i class="fas fa-times"></i></span>
    </div>
    
    <div id="ai-chat-logs">
        <div class="ai-msg bot">สวัสดีค่ะพี่ๆ ยินดีต้อนรับสู่รักประมูลนะคะ มีอะไรให้น้องกระต่ายช่วยแนะนำไหมคะ? 🥕✨</div>
    </div>

    <div class="ai-chat-quick-tags">
        <div class="quick-tag" data-msg="สมัครสมาชิกยังไง">📝 สมัครสมาชิก</div>
        <div class="quick-tag" data-msg="วิธีโอนเงินและแจ้งชำระเงิน">💰 วิธีโอนเงิน</div>
        <div class="quick-tag" data-msg="กฎการประมูลและบิดเล่น">⚖️ กฎการประมูล</div>
        <div class="quick-tag" data-msg="ระบบชำระเงินผ่านกลางคืออะไร">🛡️ ระบบผ่านกลาง</div>
        <div class="quick-tag" data-msg="ติดต่อแอดมิน">📞 ติดต่อเจ้าหน้าที่</div>
    </div>

    <div class="ai-chat-input-area">
        <input type="text" id="ai-chat-input" placeholder="พิมพ์ข้อความคุยกับน้องกระต่าย..." autocomplete="off">
        <button id="ai-chat-send"><i class="fas fa-paper-plane"></i></button>
    </div>
</div>

<script>
if (typeof jQuery == 'undefined') {
    document.write('<script src="https://code.jquery.com/jquery-3.6.0.min.js"><\/script>');
}
</script>

<script>
// ฟังก์ชันสำหรับเปลี่ยน URL เป็นลิงก์ที่กดได้
function linkify(text) {
    var urlPattern = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
    return text.replace(urlPattern, function(url) {
        return '<a href="' + url + '" target="_blank">' + url + '</a>';
    });
}

$(document).ready(function() {
    $("#ai-chat-circle").on("click", function() {
        $("#ai-chat-window").fadeToggle(250);
    });

    $("#ai-chat-close").on("click", function() {
        $("#ai-chat-window").fadeOut(250);
    });

    function sendToAI() {
        var msg = $("#ai-chat-input").val().trim();
        if (msg == "") return;

        $("#ai-chat-logs").append('<div class="ai-msg user">' + msg + '</div>');
        $("#ai-chat-input").val("");
        $("#ai-chat-logs").scrollTop($("#ai-chat-logs")[0].scrollHeight);

        var loaderId = "loader-" + Date.now();
        $("#ai-chat-logs").append('<div class="ai-msg bot" id="'+loaderId+'">น้องกระต่ายกำลังอ่านข้อมูลแป๊บนึงนะค๊า... 🥕</div>');
        $("#ai-chat-logs").scrollTop($("#ai-chat-logs")[0].scrollHeight);

        $.post('chat_process.php', { q: msg, ajax: 1 }, function(data) {
            $("#" + loaderId).remove();
            
            // --- ส่วนที่เพิ่ม: แปลงคำตอบให้เป็นลิงก์ก่อนแสดงผล ---
            var formattedData = linkify(data);
            
            $("#ai-chat-logs").append('<div class="ai-msg bot">' + formattedData + '</div>');
            $("#ai-chat-logs").scrollTop($("#ai-chat-logs")[0].scrollHeight);
        }).fail(function() {
            $("#" + loaderId).text("ขออภัยค่ะพี่ ระบบขัดข้องนิดหน่อย ลองใหม่อีกครั้งนะคะ 😢");
        });
    }

    $(document).on("click", ".quick-tag", function() {
        var quickMsg = $(this).data("msg");
        $("#ai-chat-input").val(quickMsg);
        sendToAI();
    });

    $("#ai-chat-send").on("click", sendToAI);
    $("#ai-chat-input").on("keypress", function(e) {
        if(e.which == 13) sendToAI();
    });
});
</script></body>
</html>