{"id":37097,"date":"2026-05-15T15:10:20","date_gmt":"2026-05-15T08:10:20","guid":{"rendered":"https:\/\/ubongeopark.org\/geopark\/?page_id=37097"},"modified":"2026-05-18T17:22:11","modified_gmt":"2026-05-18T10:22:11","slug":"restaurants","status":"publish","type":"page","link":"https:\/\/ubongeopark.org\/geopark\/restaurants\/","title":{"rendered":"Restaurants"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n \u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23 - \u0e2d\u0e38\u0e17\u0e22\u0e32\u0e19\u0e18\u0e23\u0e13\u0e35\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35<\/title>\r\n <!-- IMPORT FONTS FOR CONSISTENCY WITH MAIN PAGE -->\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Kanit:wght@300;400;500;600;700&family=Playfair+Display:wght@700;900&display=swap\" rel=\"stylesheet\">\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n :root {\r\n --primary: #e8845c;\r\n --primary-dark: #1a472a;\r\n --secondary: #2c3e50;\r\n --accent: #f5a876;\r\n --light-bg: #faf8f6;\r\n --dark-text: #1a1a1a;\r\n --border-color: #e0d5cc;\r\n --secondary-accent: #d4865e;\r\n }\r\n\r\n body {\r\n font-family: 'Kanit', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n background: linear-gradient(135deg, #faf8f6 0%, #f5f1ed 100%);\r\n color: var(--dark-text);\r\n line-height: 1.6;\r\n }\r\n\r\n \/* ===== NAVBAR STYLE MATCHING MAIN PAGE ===== *\/\r\n nav {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n background: rgba(255, 255, 255, 0.95);\r\n backdrop-filter: blur(10px);\r\n z-index: 1000;\r\n box-shadow: 0 2px 20px rgba(0,0,0,0.08);\r\n }\r\n\r\n .nav-container {\r\n max-width: 1400px;\r\n margin: 0 auto;\r\n padding: 0 2rem;\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n height: 80px;\r\n }\r\n\r\n .logo {\r\n font-family: 'Playfair Display', serif;\r\n font-size: 1.5rem;\r\n font-weight: 700;\r\n color: var(--primary-dark);\r\n text-decoration: none;\r\n letter-spacing: -0.5px;\r\n display: flex;\r\n align-items: center;\r\n gap: 0.75rem;\r\n }\r\n\r\n .logo-icon {\r\n font-size: 2rem;\r\n filter: drop-shadow(0 2px 4px rgba(0,0,0,0.1));\r\n }\r\n\r\n .nav-right-container {\r\n display: flex;\r\n align-items: center;\r\n gap: 2rem;\r\n }\r\n\r\n .nav-links {\r\n display: flex;\r\n gap: 2.5rem;\r\n list-style: none;\r\n }\r\n\r\n .nav-links a {\r\n text-decoration: none;\r\n color: var(--dark-text);\r\n font-weight: 500;\r\n font-size: 0.95rem;\r\n position: relative;\r\n transition: color 0.3s ease;\r\n }\r\n\r\n .nav-links a::after {\r\n content: '';\r\n position: absolute;\r\n bottom: -4px;\r\n left: 0;\r\n width: 0;\r\n height: 2px;\r\n background: var(--secondary-accent);\r\n transition: width 0.3s ease;\r\n }\r\n\r\n .nav-links a:hover::after {\r\n width: 100%;\r\n }\r\n\r\n \/* ===== LANGUAGE SWITCHER BUTTON ===== *\/\r\n .lang-switch-btn {\r\n background: white;\r\n border: 2px solid var(--primary-dark);\r\n color: var(--primary-dark);\r\n padding: 0.4rem 0.8rem;\r\n border-radius: 20px;\r\n font-weight: 600;\r\n cursor: pointer;\r\n display: flex;\r\n align-items: center;\r\n gap: 0.4rem;\r\n font-size: 0.85rem;\r\n transition: all 0.3s ease;\r\n box-shadow: 0 2px 10px rgba(0,0,0,0.05);\r\n }\r\n\r\n .lang-switch-btn:hover {\r\n background: var(--primary-dark);\r\n color: white;\r\n transform: scale(1.05);\r\n }\r\n\r\n \/* Header (Offset with margin-top for fixed Navbar) *\/\r\n header {\r\n margin-top: 80px;\r\n background: linear-gradient(135deg, var(--secondary) 0%, #34495e 100%);\r\n color: white;\r\n padding: 3rem 2rem;\r\n text-align: center;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n header::before {\r\n content: '';\r\n position: absolute;\r\n top: -50%;\r\n right: -50%;\r\n width: 200%;\r\n height: 200%;\r\n background: radial-gradient(circle, rgba(255,255,255,0.1) 1px, transparent 1px);\r\n background-size: 50px 50px;\r\n animation: movePattern 20s linear infinite;\r\n }\r\n\r\n @keyframes movePattern {\r\n 0% { transform: translate(0, 0); }\r\n 100% { transform: translate(50px, 50px); }\r\n }\r\n\r\n header > * {\r\n position: relative;\r\n z-index: 1;\r\n }\r\n\r\n h1 {\r\n font-size: 3rem;\r\n font-weight: 700;\r\n margin-bottom: 0.5rem;\r\n letter-spacing: -1px;\r\n }\r\n\r\n .subtitle {\r\n font-size: 1.1rem;\r\n opacity: 0.9;\r\n font-weight: 300;\r\n }\r\n\r\n \/* Container *\/\r\n .container {\r\n max-width: 1200px;\r\n margin: 0 auto;\r\n padding: 3rem 2rem;\r\n }\r\n\r\n \/* Filter Bar *\/\r\n .filter-bar {\r\n display: flex;\r\n gap: 1rem;\r\n margin-bottom: 2rem;\r\n flex-wrap: wrap;\r\n align-items: center;\r\n }\r\n\r\n .search-box {\r\n flex: 1;\r\n min-width: 200px;\r\n }\r\n\r\n .search-box input {\r\n width: 100%;\r\n padding: 0.75rem 1rem;\r\n border: 2px solid var(--border-color);\r\n border-radius: 8px;\r\n font-size: 1rem;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .search-box input:focus {\r\n outline: none;\r\n border-color: var(--primary);\r\n box-shadow: 0 0 0 3px rgba(232, 132, 92, 0.1);\r\n }\r\n\r\n .filter-btn {\r\n padding: 0.75rem 1.5rem;\r\n background: var(--primary);\r\n color: white;\r\n border: none;\r\n border-radius: 8px;\r\n cursor: pointer;\r\n font-weight: 600;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .filter-btn:hover,\r\n .filter-btn.active {\r\n background: var(--secondary);\r\n transform: translateY(-2px);\r\n box-shadow: 0 4px 12px rgba(44, 62, 80, 0.3);\r\n }\r\n\r\n \/* Grid Layout *\/\r\n .restaurants-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\r\n gap: 2rem;\r\n animation: fadeIn 0.6s ease-out;\r\n }\r\n\r\n @keyframes fadeIn {\r\n from {\r\n opacity: 0;\r\n transform: translateY(20px);\r\n }\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n }\r\n\r\n \/* Card *\/\r\n .restaurant-card {\r\n background: white;\r\n border-radius: 12px;\r\n overflow: hidden;\r\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);\r\n transition: all 0.3s ease;\r\n border: 1px solid var(--border-color);\r\n display: flex;\r\n flex-direction: column;\r\n height: 100%;\r\n }\r\n\r\n .restaurant-card:hover {\r\n transform: translateY(-8px);\r\n box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);\r\n }\r\n\r\n .card-image {\r\n width: 100%;\r\n height: 180px;\r\n background: linear-gradient(135deg, var(--accent) 0%, var(--primary) 100%);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 4rem;\r\n color: white;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n\r\n .card-image::before {\r\n content: '';\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.2), transparent);\r\n pointer-events: none;\r\n }\r\n\r\n .card-content {\r\n padding: 1.5rem;\r\n flex-grow: 1;\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n\r\n .card-title {\r\n font-size: 1.3rem;\r\n font-weight: 700;\r\n color: var(--secondary);\r\n margin-bottom: 0.75rem;\r\n line-height: 1.3;\r\n }\r\n\r\n .card-district {\r\n display: inline-block;\r\n background: var(--light-bg);\r\n color: var(--primary);\r\n padding: 0.4rem 0.8rem;\r\n border-radius: 20px;\r\n font-size: 0.85rem;\r\n font-weight: 600;\r\n margin-bottom: 1rem;\r\n width: fit-content;\r\n }\r\n\r\n .card-info {\r\n font-size: 0.95rem;\r\n color: #666;\r\n line-height: 1.6;\r\n flex-grow: 1;\r\n margin-bottom: 1.5rem;\r\n }\r\n\r\n .card-info .label {\r\n font-weight: 600;\r\n color: var(--primary);\r\n }\r\n\r\n .card-footer {\r\n display: flex;\r\n gap: 0.5rem;\r\n margin-top: auto;\r\n padding: 0 1.5rem 1.5rem;\r\n }\r\n\r\n .btn-call {\r\n flex: 1;\r\n padding: 0.75rem;\r\n background: var(--primary);\r\n color: white;\r\n border: none;\r\n border-radius: 6px;\r\n font-weight: 600;\r\n cursor: pointer;\r\n font-size: 0.9rem;\r\n transition: all 0.3s ease;\r\n text-align: center;\r\n text-decoration: none;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0.5rem;\r\n }\r\n\r\n .btn-call:hover {\r\n background: #c67251;\r\n transform: translateY(-2px);\r\n }\r\n\r\n .btn-location {\r\n flex: 1;\r\n padding: 0.75rem;\r\n background: var(--light-bg);\r\n color: var(--secondary);\r\n border: 2px solid var(--border-color);\r\n border-radius: 6px;\r\n font-weight: 600;\r\n cursor: pointer;\r\n font-size: 0.9rem;\r\n transition: all 0.3s ease;\r\n text-align: center;\r\n text-decoration: none;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0.5rem;\r\n }\r\n\r\n .btn-location:hover {\r\n background: var(--border-color);\r\n color: var(--dark-text);\r\n }\r\n\r\n \/* Stats *\/\r\n .stats {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\r\n gap: 1.5rem;\r\n margin-bottom: 3rem;\r\n background: white;\r\n padding: 2rem;\r\n border-radius: 12px;\r\n box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);\r\n }\r\n\r\n .stat {\r\n text-align: center;\r\n }\r\n\r\n .stat-number {\r\n font-size: 2.5rem;\r\n font-weight: 700;\r\n color: var(--primary);\r\n }\r\n\r\n .stat-label {\r\n color: #888;\r\n font-size: 0.95rem;\r\n margin-top: 0.5rem;\r\n }\r\n\r\n \/* Footer *\/\r\n footer {\r\n background: var(--secondary);\r\n color: white;\r\n text-align: center;\r\n padding: 2rem;\r\n margin-top: 3rem;\r\n font-size: 0.9rem;\r\n }\r\n\r\n .back-link {\r\n display: inline-block;\r\n margin-top: 1rem;\r\n padding: 0.75rem 1.5rem;\r\n background: var(--primary);\r\n color: white;\r\n text-decoration: none;\r\n border-radius: 6px;\r\n font-weight: 600;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .back-link:hover {\r\n background: #c67251;\r\n transform: translateY(-2px);\r\n }\r\n\r\n \/* Responsive Navbar matching main index.html *\/\r\n @media (max-width: 1024px) {\r\n .nav-links {\r\n gap: 1.2rem;\r\n }\r\n .nav-right-container {\r\n gap: 1rem;\r\n }\r\n }\r\n\r\n @media (max-width: 890px) {\r\n .nav-links {\r\n gap: 0.8rem;\r\n }\r\n .nav-links a {\r\n font-size: 0.85rem;\r\n }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n .nav-links {\r\n display: none;\r\n }\r\n\r\n h1 {\r\n font-size: 2rem;\r\n }\r\n\r\n .restaurants-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .filter-bar {\r\n flex-direction: column;\r\n }\r\n\r\n .search-box {\r\n min-width: auto;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <!-- NAVBAR (Same structure & translation integration as index.html) -->\r\n <nav>\r\n <div class=\"nav-container\">\r\n <a href=\"index.html\" class=\"logo\">\r\n <span class=\"logo-icon\">\ud83c\udf0d<\/span>\r\n <span data-translate=\"nav-title\">\u0e2d\u0e38\u0e17\u0e22\u0e32\u0e19\u0e18\u0e23\u0e13\u0e35<\/span>\r\n <\/a>\r\n <div class=\"nav-right-container\">\r\n <ul class=\"nav-links\">\r\n <li><a href=\"https:\/\/ubongeopark.org\/geopark\/\" data-translate=\"nav-home\">\u0e2b\u0e19\u0e49\u0e32\u0e2b\u0e25\u0e31\u0e01<\/a><\/li>\r\n <li><a href=\"index.html#features\" data-translate=\"nav-features\">\u0e2b\u0e21\u0e27\u0e14\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25<\/a><\/li>\r\n <li><a href=\"index.html#accommodation\" data-translate=\"nav-accommodation\">\u0e17\u0e35\u0e48\u0e1e\u0e31\u0e01<\/a><\/li>\r\n <li><a href=\"#\" data-translate=\"nav-restaurants\">\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23<\/a><\/li>\r\n <li><a href=\"communities.html\" data-translate=\"nav-communities\">\u0e27\u0e34\u0e2a\u0e32\u0e2b\u0e01\u0e34\u0e08<\/a><\/li>\r\n <li><a href=\"#contact\" data-translate=\"nav-contact\">\u0e15\u0e34\u0e14\u0e15\u0e48\u0e2d<\/a><\/li>\r\n <\/ul>\r\n <!-- BUTTON FOR CHANGING LANGUAGE -->\r\n <button onclick=\"toggleLanguage()\" class=\"lang-switch-btn\" id=\"langBtn\">\r\n \ud83c\udf10 <span>EN<\/span>\r\n <\/button>\r\n <\/div>\r\n <\/div>\r\n <\/nav>\r\n\r\n <!-- HEADER -->\r\n <header>\r\n <h1 data-translate=\"header-title\">\ud83c\udf7d\ufe0f \u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23<\/h1>\r\n <p class=\"subtitle\" data-translate=\"header-subtitle\">Restaurants - Ubon Ratchathani Geopark<\/p>\r\n <\/header>\r\n\r\n <div class=\"container\">\r\n <!-- STATS SECTION -->\r\n <div class=\"stats\">\r\n <div class=\"stat\">\r\n <div class=\"stat-number\">17<\/div>\r\n <div class=\"stat-label\" data-translate=\"stat-label-1\">\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23<\/div>\r\n <\/div>\r\n <div class=\"stat\">\r\n <div class=\"stat-number\">5<\/div>\r\n <div class=\"stat-label\" data-translate=\"stat-label-2\">\u0e2d\u0e33\u0e40\u0e20\u0e2d<\/div>\r\n <\/div>\r\n <div class=\"stat\">\r\n <div class=\"stat-number\" data-translate=\"stat-label-3-num\">24\/7<\/div>\r\n <div class=\"stat-label\" data-translate=\"stat-label-3-text\">\u0e15\u0e34\u0e14\u0e15\u0e48\u0e2d\u0e44\u0e14\u0e49\u0e17\u0e38\u0e01\u0e40\u0e27\u0e25\u0e32<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- FILTER BAR -->\r\n <div class=\"filter-bar\">\r\n <div style=\"width: 100%; display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1.5rem;\" id=\"districtFilters\">\r\n <button class=\"filter-btn active\" onclick=\"filterByDistrict('all')\" data-translate=\"filter-all\">\ud83c\udf10 \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14 (17)<\/button>\r\n <button class=\"filter-btn\" onclick=\"filterByDistrict('\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35')\" data-translate=\"filter-muang\">\ud83c\udfd9\ufe0f \u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25 (3)<\/button>\r\n <button class=\"filter-btn\" onclick=\"filterByDistrict('\u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23')\" data-translate=\"filter-phosai\">\ud83c\udfde\ufe0f \u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23 (2)<\/button>\r\n <button class=\"filter-btn\" onclick=\"filterByDistrict('\u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48')\" data-translate=\"filter-sri\">\ud83c\udf33 \u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48 (2)<\/button>\r\n <button class=\"filter-btn\" onclick=\"filterByDistrict('\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21')\" data-translate=\"filter-khongchiam\">\ud83c\udfd5\ufe0f \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 (7)<\/button>\r\n <button class=\"filter-btn\" onclick=\"filterByDistrict('\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23')\" data-translate=\"filter-sirindhorn\">\ud83c\udf0a \u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23 (3)<\/button>\r\n <\/div>\r\n <div class=\"search-box\" style=\"width: 100%;\">\r\n <input type=\"text\" id=\"searchInput\" placeholder=\"\ud83d\udd0d \u0e04\u0e49\u0e19\u0e2b\u0e32\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23...\" onkeyup=\"searchRestaurants()\" data-translate-placeholder=\"search-placeholder\">\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- GRID LAYOUT FOR CARDS -->\r\n <div class=\"restaurants-grid\" id=\"restaurantsGrid\">\r\n <!-- Cards will be inserted here by JavaScript -->\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- FOOTER WITH CONTACT ID -->\r\n <footer id=\"contact\">\r\n <p data-translate=\"footer-text-1\">\ud83d\udccd \u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23\u0e2d\u0e38\u0e17\u0e22\u0e32\u0e19\u0e18\u0e23\u0e13\u0e35\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35 | \u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e1b\u0e23\u0e31\u0e1a\u0e1b\u0e23\u0e38\u0e07\u0e25\u0e48\u0e32\u0e2a\u0e38\u0e14 2026<\/p>\r\n <a href=\"index.html\" class=\"back-link\" data-translate=\"footer-back-link\">\u2190 \u0e01\u0e25\u0e31\u0e1a\u0e44\u0e1b\u0e22\u0e31\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e2b\u0e25\u0e31\u0e01<\/a>\r\n <p style=\"margin-top: 1rem; opacity: 0.8;\" data-translate=\"footer-text-2\">\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21 \u0e42\u0e1b\u0e23\u0e14\u0e15\u0e34\u0e14\u0e15\u0e48\u0e2d\u0e42\u0e14\u0e22\u0e15\u0e23\u0e07\u0e17\u0e35\u0e48\u0e40\u0e1a\u0e2d\u0e23\u0e4c\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c\u0e17\u0e35\u0e48\u0e23\u0e30\u0e1a\u0e38\u0e44\u0e27\u0e49<\/p>\r\n <\/footer>\r\n\r\n <script>\r\n const restaurants = [\r\n {\r\n id: 1,\r\n name: '\u0e23\u0e49\u0e32\u0e19\u0e2a\u0e32\u0e21\u0e0a\u0e31\u0e22\u0e01\u0e32\u0e41\u0e1f',\r\n district: '\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n address: '168\/4 \u0e16\u0e19\u0e19 \u0e40\u0e17\u0e1e\u0e42\u0e22\u0e18\u0e35 \u0e15\u0e33\u0e1a\u0e25 \u0e43\u0e19\u0e40\u0e21\u0e37\u0e2d\u0e07 \u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '045 254 448',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/Enods1WKPDJnprdw5',\r\n icon: '\u2615'\r\n },\r\n {\r\n id: 2,\r\n name: '\u0e23\u0e49\u0e32\u0e19\u0e1a\u0e49\u0e32\u0e19\u0e2d\u0e34\u0e48\u0e21\u0e2d\u0e23\u0e48\u0e2d\u0e22',\r\n district: '\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n address: '74 \u0e16. \u0e0a\u0e27\u0e32\u0e25\u0e32\u0e19\u0e2d\u0e01 \u0e15\u0e33\u0e1a\u0e25 \u0e43\u0e19\u0e40\u0e21\u0e37\u0e2d\u0e07 \u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '045 261 481',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/ZxPJzDozFujz3QHeA',\r\n icon: '\ud83c\udf5c'\r\n },\r\n {\r\n id: 3,\r\n name: '\u0e01\u0e2d\u0e25\u0e4c\u0e1f\u0e40\u0e1f\u0e2d\u0e23\u0e4c\u0e40\u0e2e\u0e49\u0e32\u0e2a\u0e4c \u0e2d\u0e32\u0e2b\u0e32\u0e23\u0e40\u0e27\u0e35\u0e22\u0e14\u0e19\u0e32\u0e21',\r\n district: '\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n address: '457-459 \u0e16\u0e19\u0e19\u0e1e\u0e34\u0e0a\u0e34\u0e15\u0e23\u0e31\u0e07\u0e2a\u0e23\u0e23\u0e04\u0e4c \u0e15\u0e33\u0e1a\u0e25\u0e43\u0e19\u0e40\u0e21\u0e37\u0e2d\u0e07',\r\n phone: '045 261 196',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/Qm7sHhW7mA5cxatg9',\r\n icon: '\ud83e\udd62'\r\n },\r\n {\r\n id: 4,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e23\u0e30\u0e40\u0e1a\u0e35\u0e22\u0e07\u0e42\u0e02\u0e07',\r\n district: '\u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23',\r\n address: '\u0e15\u0e33\u0e1a\u0e25 \u0e40\u0e2b\u0e25\u0e48\u0e32\u0e07\u0e32\u0e21 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35 34340',\r\n phone: '098 153 0711',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/qVuXGCJSuUzvea7D9',\r\n icon: '\ud83c\udf72'\r\n },\r\n {\r\n id: 5,\r\n name: '\u0e1b\u0e25\u0e32\u0e22\u0e1f\u0e49\u0e32',\r\n district: '\u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23',\r\n address: '114 Moo 9 Songkhon, Phosai, Ubon Ratchathani',\r\n phone: '085 495 2373',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/uhPVGBhqmtUAqCso7',\r\n icon: '\ud83c\udf7d\ufe0f'\r\n },\r\n {\r\n id: 6,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e04\u0e38\u0e13\u0e04\u0e23\u0e39',\r\n district: '\u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48',\r\n address: '\u0e16\u0e19\u0e19 \u0e28\u0e23\u0e35\u0e21\u0e31\u0e19\u0e1b\u0e25\u0e32 \u0e15\u0e33\u0e1a\u0e25 \u0e19\u0e32\u0e04\u0e33 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48',\r\n phone: '085 497 0181',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/X8ehZ8bz9Q445tzx5',\r\n icon: '\ud83c\udf5c'\r\n },\r\n {\r\n id: 7,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e20\u0e31\u0e2a\u0e14\u0e32',\r\n district: '\u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48',\r\n address: '\u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '085 316 4395',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/F4dAJeuhHaBhrPQH9',\r\n icon: '\ud83c\udf7d\ufe0f'\r\n },\r\n {\r\n id: 8,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e19\u0e49\u0e2d\u0e07\u0e08\u0e2d\u0e22',\r\n district: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21',\r\n address: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '087 957 3623',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/vomqCLVdHJCR9UK79',\r\n icon: '\ud83c\udf72'\r\n },\r\n {\r\n id: 9,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e1e\u0e35\u0e23\u0e30\u0e14\u0e32',\r\n district: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21',\r\n address: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '093 358 4006',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/pBnwVSeCXr3q1FjGA',\r\n icon: '\ud83c\udf5c'\r\n },\r\n {\r\n id: 10,\r\n name: '\u0e2b\u0e2d\u0e21\u0e14\u0e34\u0e19 (\u0e41\u0e01\u0e48\u0e07\u0e1e\u0e34\u0e28\u0e21\u0e31\u0e22)',\r\n district: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21',\r\n address: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '065 119 8413',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/uay3SsDWJgWm7vbC9',\r\n icon: '\ud83c\udf3f'\r\n },\r\n {\r\n id: 11,\r\n name: '\u0e01\u0e34\u0e19\u0e01\u0e4b\u0e2d\u0e21',\r\n district: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21',\r\n address: '\u0e16\u0e19\u0e19\u0e41\u0e01\u0e25\u0e49\u0e27\u0e1b\u0e23\u0e30\u0e14\u0e34\u0e29\u0e10\u0e4c \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '098 090 7986',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/Nuwu1V8dJXCrSSmz5',\r\n icon: '\ud83c\udf7d\ufe0f'\r\n },\r\n {\r\n id: 12,\r\n name: '\u0e41\u0e1e\u0e2d\u0e32\u0e23\u0e22\u0e32',\r\n district: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21',\r\n address: '\u0e15\u0e33\u0e1a\u0e25 \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35 34220',\r\n phone: '089 624 4004',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/YD3MvuxjP882FJZc6',\r\n icon: '\ud83c\udfde\ufe0f'\r\n },\r\n {\r\n id: 13,\r\n name: '\u0e41\u0e1e\u0e08\u0e31\u0e19\u0e17\u0e23\u0e4c\u0e14\u0e32\u0e23\u0e32',\r\n district: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21',\r\n address: '\u0e41\u0e21\u0e48\u0e19\u0e49\u0e33\u0e21\u0e39\u0e25 \u0e15\u0e33\u0e1a\u0e25 \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '098 242 4464',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/eAxZonvazcZJYmwv6',\r\n icon: '\ud83c\udfde\ufe0f'\r\n },\r\n {\r\n id: 14,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e42\u0e1a\u0e0a\u0e32',\r\n district: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21',\r\n address: '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '081 454 9094',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/WB3mS913w5CbZGk57',\r\n icon: '\ud83c\udf72'\r\n },\r\n {\r\n id: 15,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e23\u0e34\u0e21\u0e40\u0e02\u0e37\u0e48\u0e2d\u0e19',\r\n district: '\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23',\r\n address: '\u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '-',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/aabcs96UjyfoCeKt5',\r\n icon: '\ud83c\udf5c'\r\n },\r\n {\r\n id: 16,\r\n name: '\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e23\u0e22\u0e32 2 \u0e2a\u0e32\u0e02\u0e32\u0e40\u0e02\u0e37\u0e48\u0e2d\u0e19\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23',\r\n district: '\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23',\r\n address: 'Ban Chong Mek, Thailand, Ubon Ratchathani',\r\n phone: '086 877 4204',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/aabcs96UjyfoCeKt5',\r\n icon: '\ud83c\udf7d\ufe0f'\r\n },\r\n {\r\n id: 17,\r\n name: '\u0e04\u0e23\u0e31\u0e27\u0e20\u0e39\u0e41\u0e2a\u0e07\u0e08\u0e31\u0e19\u0e17\u0e23\u0e4c',\r\n district: '\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23',\r\n address: '59 \u0e16.\u0e2a\u0e16\u0e34\u0e15\u0e22\u0e4c\u0e19\u0e34\u0e21\u0e32\u0e19\u0e01\u0e32\u0e25 \u0e15.\u0e04\u0e33\u0e40\u0e02\u0e37\u0e48\u0e2d\u0e19\u0e41\u0e01\u0e49\u0e27 \u0e2d.\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35',\r\n phone: '089 998 8789',\r\n mapUrl: 'https:\/\/maps.app.goo.gl\/tYbJRaMNkSwVZeuU9',\r\n icon: '\ud83c\udf19'\r\n }\r\n ];\r\n\r\n \/\/ ===== TRANSLATIONS DICTIONARY FOR NAVBAR AND STATIC ITEMS =====\r\n const translations = {\r\n th: {\r\n \"nav-home\": \"\u0e2b\u0e19\u0e49\u0e32\u0e2b\u0e25\u0e31\u0e01\",\r\n \"nav-title\": \"\u0e2d\u0e38\u0e17\u0e22\u0e32\u0e19\u0e18\u0e23\u0e13\u0e35\",\r\n \"nav-features\": \"\u0e2b\u0e21\u0e27\u0e14\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\",\r\n \"nav-accommodation\": \"\u0e17\u0e35\u0e48\u0e1e\u0e31\u0e01\",\r\n \"nav-restaurants\": \"\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23\",\r\n \"nav-communities\": \"\u0e27\u0e34\u0e2a\u0e32\u0e2b\u0e01\u0e34\u0e08\",\r\n \"nav-contact\": \"\u0e15\u0e34\u0e14\u0e15\u0e48\u0e2d\",\r\n \"header-title\": \"\ud83c\udf7d\ufe0f \u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23\",\r\n \"header-subtitle\": \"Restaurants - Ubon Ratchathani Geopark\",\r\n \"stat-label-1\": \"\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23\",\r\n \"stat-label-2\": \"\u0e2d\u0e33\u0e40\u0e20\u0e2d\",\r\n \"stat-label-3-num\": \"24\/7\",\r\n \"stat-label-3-text\": \"\u0e15\u0e34\u0e14\u0e15\u0e48\u0e2d\u0e44\u0e14\u0e49\u0e17\u0e38\u0e01\u0e40\u0e27\u0e25\u0e32\",\r\n \"filter-all\": \"\ud83c\udf10 \u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14 (17)\",\r\n \"filter-muang\": \"\ud83c\udfd9\ufe0f \u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25 (3)\",\r\n \"filter-phosai\": \"\ud83c\udfde\ufe0f \u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23 (2)\",\r\n \"filter-sri\": \"\ud83c\udf33 \u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48 (2)\",\r\n \"filter-khongchiam\": \"\ud83c\udfd5\ufe0f \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 (7)\",\r\n \"filter-sirindhorn\": \"\ud83c\udf0a \u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23 (3)\",\r\n \"search-placeholder\": \"\ud83d\udd0d \u0e04\u0e49\u0e19\u0e2b\u0e32\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23...\",\r\n \"footer-text-1\": \"\ud83d\udccd \u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23\u0e2d\u0e38\u0e17\u0e22\u0e32\u0e19\u0e18\u0e23\u0e13\u0e35\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35 | \u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e1b\u0e23\u0e31\u0e1a\u0e1b\u0e23\u0e38\u0e07\u0e25\u0e48\u0e32\u0e2a\u0e38\u0e14 2026\",\r\n \"footer-back-link\": \"\u2190 \u0e01\u0e25\u0e31\u0e1a\u0e44\u0e1b\u0e22\u0e31\u0e07\u0e2b\u0e19\u0e49\u0e32\u0e2b\u0e25\u0e31\u0e01\",\r\n \"footer-text-2\": \"\u0e2a\u0e33\u0e2b\u0e23\u0e31\u0e1a\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21 \u0e42\u0e1b\u0e23\u0e14\u0e15\u0e34\u0e14\u0e15\u0e48\u0e2d\u0e42\u0e14\u0e22\u0e15\u0e23\u0e07\u0e17\u0e35\u0e48\u0e40\u0e1a\u0e2d\u0e23\u0e4c\u0e42\u0e17\u0e23\u0e28\u0e31\u0e1e\u0e17\u0e4c\u0e17\u0e35\u0e48\u0e23\u0e30\u0e1a\u0e38\u0e44\u0e27\u0e49\"\r\n },\r\n en: {\r\n \"nav-home\": \"Home\",\r\n \"nav-title\": \"Geopark\",\r\n \"nav-features\": \"Categories\",\r\n \"nav-accommodation\": \"Accommodations\",\r\n \"nav-restaurants\": \"Restaurants\",\r\n \"nav-communities\": \"Enterprises\",\r\n \"nav-contact\": \"Contact\",\r\n \"header-title\": \"\ud83c\udf7d\ufe0f Restaurants\",\r\n \"header-subtitle\": \"Savor local flavors, riverfront dining and cafes in Ubon Geopark\",\r\n \"stat-label-1\": \"Restaurants\",\r\n \"stat-label-2\": \"Districts\",\r\n \"stat-label-3-num\": \"24\/7\",\r\n \"stat-label-3-text\": \"Always Responsive\",\r\n \"filter-all\": \"\ud83c\udf10 All (17)\",\r\n \"filter-muang\": \"\ud83c\udfd9\ufe0f Mueang Ubon (3)\",\r\n \"filter-phosai\": \"\ud83c\udfde\ufe0f Pho Sai (2)\",\r\n \"filter-sri\": \"\ud83c\udf33 Sri Mueang Mai (2)\",\r\n \"filter-khongchiam\": \"\ud83c\udfd5\ufe0f Khong Chiam (7)\",\r\n \"filter-sirindhorn\": \"\ud83c\udf0a Sirindhorn (3)\",\r\n \"search-placeholder\": \"\ud83d\udd0d Search restaurants...\",\r\n \"footer-text-1\": \"\ud83d\udccd Ubon Ratchathani Geopark Restaurants | Last updated 2026\",\r\n \"footer-back-link\": \"\u2190 Back to Homepage\",\r\n \"footer-text-2\": \"For further inquiries, please contact the businesses directly via the numbers provided.\"\r\n }\r\n };\r\n\r\n let currentLang = 'th';\r\n let selectedDistrict = 'all';\r\n\r\n \/\/ ===== TRANSLATED TEXT RENDERING FOR CARDS =====\r\n function renderRestaurants(data) {\r\n const grid = document.getElementById('restaurantsGrid');\r\n grid.innerHTML = '';\r\n\r\n if (data.length === 0) {\r\n const noFoundText = currentLang === 'th' ? '\u0e44\u0e21\u0e48\u0e1e\u0e1a\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23\u0e17\u0e35\u0e48\u0e04\u0e49\u0e19\u0e2b\u0e32' : 'No restaurants found';\r\n grid.innerHTML = `<div style=\"grid-column: 1\/-1; text-align: center; padding: 3rem; color: #999;\">${noFoundText}<\/div>`;\r\n return;\r\n }\r\n\r\n data.forEach(rest => {\r\n const card = document.createElement('div');\r\n card.className = 'restaurant-card';\r\n\r\n \/\/ Real-time EN Translation for names\r\n let displayName = rest.name;\r\n if (currentLang === 'en') {\r\n if (rest.name === '\u0e23\u0e49\u0e32\u0e19\u0e2a\u0e32\u0e21\u0e0a\u0e31\u0e22\u0e01\u0e32\u0e41\u0e1f') displayName = 'Samchai Coffee Restaurant';\r\n else if (rest.name === '\u0e23\u0e49\u0e32\u0e19\u0e1a\u0e49\u0e32\u0e19\u0e2d\u0e34\u0e48\u0e21\u0e2d\u0e23\u0e48\u0e2d\u0e22') displayName = 'Baan Im Aroi Restaurant';\r\n else if (rest.name === '\u0e01\u0e2d\u0e25\u0e4c\u0e1f\u0e40\u0e1f\u0e2d\u0e23\u0e4c\u0e40\u0e2e\u0e49\u0e32\u0e2a\u0e4c \u0e2d\u0e32\u0e2b\u0e32\u0e23\u0e40\u0e27\u0e35\u0e22\u0e14\u0e19\u0e32\u0e21') displayName = 'Golfer\\'s House Vietnamese Food';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e23\u0e30\u0e40\u0e1a\u0e35\u0e22\u0e07\u0e42\u0e02\u0e07') displayName = 'Khrua Rabiang Khong (Mekong Terrace Kitchen)';\r\n else if (rest.name === '\u0e1b\u0e25\u0e32\u0e22\u0e1f\u0e49\u0e32') displayName = 'Plai Fah Restaurant';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e04\u0e38\u0e13\u0e04\u0e23\u0e39') displayName = 'Khrua Khun Kru (Teacher\\'s Kitchen)';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e20\u0e31\u0e2a\u0e14\u0e32') displayName = 'Khrua Phassada';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e19\u0e49\u0e2d\u0e07\u0e08\u0e2d\u0e22') displayName = 'Khrua Nong Joy';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e1e\u0e35\u0e23\u0e30\u0e14\u0e32') displayName = 'Khrua Peerada';\r\n else if (rest.name === '\u0e2b\u0e2d\u0e21\u0e14\u0e34\u0e19 (\u0e41\u0e01\u0e48\u0e07\u0e1e\u0e34\u0e28\u0e21\u0e31\u0e22)') displayName = 'Hom Din (Kaeng Phitsamai)';\r\n else if (rest.name === '\u0e01\u0e34\u0e19\u0e01\u0e4b\u0e2d\u0e21') displayName = 'Kin Kom Restaurant';\r\n else if (rest.name === '\u0e41\u0e1e\u0e2d\u0e32\u0e23\u0e22\u0e32') displayName = 'Phae Araya Floating Restaurant';\r\n else if (rest.name === '\u0e41\u0e1e\u0e08\u0e31\u0e19\u0e17\u0e23\u0e4c\u0e14\u0e32\u0e23\u0e32') displayName = 'Phae Chan Dara Floating Restaurant';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e42\u0e1a\u0e0a\u0e32') displayName = 'Khrua Bocha';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e23\u0e34\u0e21\u0e40\u0e02\u0e37\u0e48\u0e2d\u0e19') displayName = 'Khrua Rim Khuean (Dam-side Kitchen)';\r\n else if (rest.name === '\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e23\u0e22\u0e32 2 \u0e2a\u0e32\u0e02\u0e32\u0e40\u0e02\u0e37\u0e48\u0e2d\u0e19\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23') displayName = 'Araya 2 (Sirindhorn Dam Branch)';\r\n else if (rest.name === '\u0e04\u0e23\u0e31\u0e27\u0e20\u0e39\u0e41\u0e2a\u0e07\u0e08\u0e31\u0e19\u0e17\u0e23\u0e4c') displayName = 'Khrua Phu Saeng Chan';\r\n }\r\n\r\n \/\/ Real-time EN Translation for districts\r\n let displayDistrict = rest.district;\r\n if (currentLang === 'en') {\r\n if (rest.district === '\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') displayDistrict = 'Mueang Ubon Ratchathani';\r\n else if (rest.district === '\u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23') displayDistrict = 'Pho Sai';\r\n else if (rest.district === '\u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48') displayDistrict = 'Sri Mueang Mai';\r\n else if (rest.district === '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21') displayDistrict = 'Khong Chiam';\r\n else if (rest.district === '\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23') displayDistrict = 'Sirindhorn';\r\n }\r\n\r\n \/\/ Real-time EN Translation for address\r\n let displayAddress = rest.address;\r\n if (currentLang === 'en') {\r\n if (rest.address === '168\/4 \u0e16\u0e19\u0e19 \u0e40\u0e17\u0e1e\u0e42\u0e22\u0e18\u0e35 \u0e15\u0e33\u0e1a\u0e25 \u0e43\u0e19\u0e40\u0e21\u0e37\u0e2d\u0e07 \u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = '168\/4 Thep Yothi Rd, Nai Mueang, Mueang Ubon Ratchathani';\r\n } else if (rest.address === '74 \u0e16. \u0e0a\u0e27\u0e32\u0e25\u0e32\u0e19\u0e2d\u0e01 \u0e15\u0e33\u0e1a\u0e25 \u0e43\u0e19\u0e40\u0e21\u0e37\u0e2d\u0e07 \u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = '74 Chawala Nok Rd, Nai Mueang, Mueang Ubon Ratchathani';\r\n } else if (rest.address === '457-459 \u0e16\u0e19\u0e19\u0e1e\u0e34\u0e0a\u0e34\u0e15\u0e23\u0e31\u0e07\u0e2a\u0e23\u0e23\u0e04\u0e4c \u0e15\u0e33\u0e1a\u0e25\u0e43\u0e19\u0e40\u0e21\u0e37\u0e2d\u0e07') {\r\n displayAddress = '457-459 Phichit Rangsan Rd, Nai Mueang, Mueang Ubon Ratchathani';\r\n } else if (rest.address === '\u0e15\u0e33\u0e1a\u0e25 \u0e40\u0e2b\u0e25\u0e48\u0e32\u0e07\u0e32\u0e21 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e42\u0e1e\u0e18\u0e34\u0e4c\u0e44\u0e17\u0e23 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35 34340') {\r\n displayAddress = 'Lao Ngam Sub-district, Pho Sai District, Ubon Ratchathani 34340';\r\n } else if (rest.address === '\u0e16\u0e19\u0e19 \u0e28\u0e23\u0e35\u0e21\u0e31\u0e19\u0e1b\u0e25\u0e32 \u0e15\u0e33\u0e1a\u0e25 \u0e19\u0e32\u0e04\u0e33 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48') {\r\n displayAddress = 'Sri Manpla Rd, Na Kham, Sri Mueang Mai District';\r\n } else if (rest.address === '\u0e28\u0e23\u0e35\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e43\u0e2b\u0e21\u0e48 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = 'Sri Mueang Mai District, Ubon Ratchathani';\r\n } else if (rest.address === '\u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = 'Khong Chiam District, Ubon Ratchathani';\r\n } else if (rest.address === '\u0e16\u0e19\u0e19\u0e41\u0e01\u0e25\u0e49\u0e27\u0e1b\u0e23\u0e30\u0e14\u0e34\u0e29\u0e10\u0e4c \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = 'Klaew Pradit Rd, Khong Chiam, Ubon Ratchathani';\r\n } else if (rest.address === '\u0e15\u0e33\u0e1a\u0e25 \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35 34220') {\r\n displayAddress = 'Khong Chiam Sub-district, Khong Chiam District, Ubon Ratchathani 34220';\r\n } else if (rest.address === '\u0e41\u0e21\u0e48\u0e19\u0e49\u0e33\u0e21\u0e39\u0e25 \u0e15\u0e33\u0e1a\u0e25 \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e42\u0e02\u0e07\u0e40\u0e08\u0e35\u0e22\u0e21 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = 'Mun River, Khong Chiam, Khong Chiam District, Ubon Ratchathani';\r\n } else if (rest.address === '\u0e2d\u0e33\u0e40\u0e20\u0e2d \u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = 'Sirindhorn District, Ubon Ratchathani';\r\n } else if (rest.address === '59 \u0e16.\u0e2a\u0e16\u0e34\u0e15\u0e22\u0e4c\u0e19\u0e34\u0e21\u0e32\u0e19\u0e01\u0e32\u0e25 \u0e15.\u0e04\u0e33\u0e40\u0e02\u0e37\u0e48\u0e2d\u0e19\u0e41\u0e01\u0e49\u0e27 \u0e2d.\u0e2a\u0e34\u0e23\u0e34\u0e19\u0e18\u0e23 \u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35') {\r\n displayAddress = '59 Sathitnimankan Rd, Kham Khuean Kaeo, Sirindhorn District, Ubon Ratchathani';\r\n }\r\n }\r\n\r\n const labelLocation = currentLang === 'th' ? '\ud83d\udccd \u0e17\u0e35\u0e48\u0e15\u0e31\u0e49\u0e07:' : '\ud83d\udccd Location:';\r\n const labelPhone = currentLang === 'th' ? '\ud83d\udcde \u0e42\u0e17\u0e23:' : '\ud83d\udcde Phone:';\r\n const btnCallText = currentLang === 'th' ? '\ud83d\udcde \u0e42\u0e17\u0e23\u0e40\u0e25\u0e22' : '\ud83d\udcde Call Now';\r\n const btnNoPhoneText = currentLang === 'th' ? '\ud83d\udcde \u0e44\u0e21\u0e48\u0e21\u0e35\u0e40\u0e1a\u0e2d\u0e23\u0e4c' : '\ud83d\udcde No Phone';\r\n const btnMapText = currentLang === 'th' ? '\ud83d\uddfa\ufe0f \u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48' : '\ud83d\uddfa\ufe0f Map';\r\n\r\n const phoneLink = rest.phone !== '-' ? `<a href=\"tel:${rest.phone.replace(\/\\s\/g, '')}\" class=\"btn-call\">${btnCallText}<\/a>` : `<button class=\"btn-call\" disabled style=\"opacity: 0.5;\">${btnNoPhoneText}<\/button>`;\r\n \r\n card.innerHTML = `\r\n <div class=\"card-image\">\r\n <span>${rest.icon}<\/span>\r\n <\/div>\r\n <div class=\"card-content\">\r\n <h2 class=\"card-title\">${displayName}<\/h2>\r\n <div class=\"card-district\">${displayDistrict}<\/div>\r\n <div class=\"card-info\">\r\n <div><span class=\"label\">${labelLocation}<\/span><br>${displayAddress}<\/div>\r\n <div style=\"margin-top: 0.75rem;\"><span class=\"label\">${labelPhone}<\/span> ${rest.phone}<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"card-footer\">\r\n ${phoneLink}\r\n <a href=\"${rest.mapUrl}\" target=\"_blank\" class=\"btn-location\">${btnMapText}<\/a>\r\n <\/div>\r\n `;\r\n grid.appendChild(card);\r\n });\r\n }\r\n\r\n \/\/ ===== TRANSLATION SWITCHER CONTROLLER =====\r\n function toggleLanguage() {\r\n currentLang = currentLang === 'th' ? 'en' : 'th';\r\n \r\n \/\/ 1. Update Switcher Button Label\r\n const btn = document.getElementById('langBtn');\r\n btn.innerHTML = currentLang === 'th' ? '\ud83c\udf10 <span>EN<\/span>' : '\ud83c\udf10 <span>TH<\/span>';\r\n \r\n \/\/ 2. Translate Static Elements with data-translate attribute\r\n document.querySelectorAll('[data-translate]').forEach(el => {\r\n const key = el.getAttribute('data-translate');\r\n if (translations[currentLang][key]) {\r\n el.innerHTML = translations[currentLang][key];\r\n }\r\n });\r\n\r\n \/\/ 3. Translate input placeholders\r\n document.querySelectorAll('[data-translate-placeholder]').forEach(el => {\r\n const key = el.getAttribute('data-translate-placeholder');\r\n if (translations[currentLang][key]) {\r\n el.placeholder = translations[currentLang][key];\r\n }\r\n });\r\n\r\n \/\/ 4. Re-render dynamic cards with translated texts\r\n filterByDistrict(selectedDistrict);\r\n\r\n \/\/ Update html lang attribute\r\n document.documentElement.lang = currentLang;\r\n }\r\n\r\n function filterByDistrict(district) {\r\n selectedDistrict = district;\r\n \r\n \/\/ Find filters and update active states\r\n const filterContainer = document.getElementById('districtFilters');\r\n filterContainer.querySelectorAll('.filter-btn').forEach(btn => {\r\n btn.classList.remove('active');\r\n });\r\n\r\n \/\/ Triggered from clicking a filter button or changing language\r\n if (event && event.target && event.target.classList.contains('filter-btn')) {\r\n event.target.classList.add('active');\r\n } else {\r\n \/\/ If triggered by language switch, find the corresponding button by its onclick function\r\n const buttons = filterContainer.querySelectorAll('.filter-btn');\r\n buttons.forEach(btn => {\r\n if (btn.getAttribute('onclick').includes(district)) {\r\n btn.classList.add('active');\r\n }\r\n });\r\n }\r\n \r\n let filtered = restaurants;\r\n if (district !== 'all') {\r\n filtered = restaurants.filter(r => r.district === district);\r\n }\r\n \r\n const searchTerm = document.getElementById('searchInput').value.toLowerCase();\r\n if (searchTerm) {\r\n filtered = filtered.filter(r =>\r\n r.name.toLowerCase().includes(searchTerm) ||\r\n r.address.toLowerCase().includes(searchTerm) ||\r\n r.district.toLowerCase().includes(searchTerm)\r\n );\r\n }\r\n \r\n renderRestaurants(filtered);\r\n }\r\n\r\n function searchRestaurants() {\r\n const searchTerm = document.getElementById('searchInput').value.toLowerCase();\r\n let filtered = restaurants;\r\n \r\n if (selectedDistrict !== 'all') {\r\n filtered = restaurants.filter(r => r.district === selectedDistrict);\r\n }\r\n \r\n filtered = filtered.filter(r =>\r\n r.name.toLowerCase().includes(searchTerm) ||\r\n r.address.toLowerCase().includes(searchTerm) ||\r\n r.district.toLowerCase().includes(searchTerm)\r\n );\r\n \r\n renderRestaurants(filtered);\r\n }\r\n\r\n \/\/ Initial render on load\r\n renderRestaurants(restaurants);\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u0e23\u0e49\u0e32\u0e19\u0e2d\u0e32\u0e2b\u0e32\u0e23 – \u0e2d\u0e38\u0e17\u0e22\u0e32\u0e19\u0e18\u0e23\u0e13\u0e35\u0e2d\u0e38\u0e1a\u0e25\u0e23\u0e32\u0e0a\u0e18\u0e32\u0e19\u0e35 \ud83c\udf0d \u0e2d\u0e38\u0e17\u0e22\u0e32\u0e19\u0e18\u0e23\u0e13\u0e35 \u0e2b\u0e19 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-37097","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/pages\/37097","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/comments?post=37097"}],"version-history":[{"count":8,"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/pages\/37097\/revisions"}],"predecessor-version":[{"id":37182,"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/pages\/37097\/revisions\/37182"}],"wp:attachment":[{"href":"https:\/\/ubongeopark.org\/geopark\/wp-json\/wp\/v2\/media?parent=37097"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}