document.addEventListener('DOMContentLoaded',()=>{if(window.lucide)window.lucide.createIcons();const menu=document.querySelector('[data-pixel-mobile-menu]'),backdrop=document.querySelector('[data-pixel-mobile-backdrop]'),open=document.querySelector('[data-pixel-mobile-open]'),close=document.querySelector('[data-pixel-mobile-close]');const openMenu=()=>{if(!menu||!backdrop)return;menu.classList.remove('translate-x-full');backdrop.classList.remove('pointer-events-none','opacity-0');document.body.classList.add('overflow-hidden')};const closeMenu=()=>{if(!menu||!backdrop)return;menu.classList.add('translate-x-full');backdrop.classList.add('pointer-events-none','opacity-0');document.body.classList.remove('overflow-hidden')};open?.addEventListener('click',openMenu);close?.addEventListener('click',closeMenu);backdrop?.addEventListener('click',closeMenu);const search=document.querySelector('[data-pixel-search]'),panel=document.querySelector('[data-pixel-search-panel]');document.querySelectorAll('[data-pixel-search-open]').forEach(el=>el.addEventListener('click',()=>{search?.classList.remove('pointer-events-none','opacity-0');panel?.classList.remove('translate-y-3','opacity-0');setTimeout(()=>search?.querySelector('input')?.focus(),60)}));document.querySelector('[data-pixel-search-close]')?.addEventListener('click',()=>{search?.classList.add('pointer-events-none','opacity-0');panel?.classList.add('translate-y-3','opacity-0')});if(window.Swiper&&document.querySelector('.pixelHeroSwiper'))new Swiper('.pixelHeroSwiper',{loop:document.querySelectorAll('.pixelHeroSwiper .swiper-slide').length>1,speed:800,autoplay:{delay:6500,disableOnInteraction:false},effect:'fade',fadeEffect:{crossFade:true},pagination:{el:'.pixelHeroSwiper .swiper-pagination',clickable:true},navigation:{nextEl:'.pixel-hero-next',prevEl:'.pixel-hero-prev'}});if(window.Swiper&&document.querySelector('.pixelStaffSwiper'))new Swiper('.pixelStaffSwiper',{slidesPerView:1.35,spaceBetween:12,grabCursor:true,breakpoints:{520:{slidesPerView:2.2},768:{slidesPerView:3},1024:{slidesPerView:4}}});if(window.ApexCharts&&document.querySelector('#pixelStatsChart')&&window.DP_PIXEL_STATS){const rows=window.DP_PIXEL_STATS;new ApexCharts(document.querySelector('#pixelStatsChart'),{chart:{type:'bar',height:170,toolbar:{show:false},fontFamily:'Inter, sans-serif'},series:[{name:'Jumlah',data:rows.map(x=>Number(x.value||0))}],xaxis:{categories:rows.map(x=>x.label),labels:{style:{fontSize:'9px'}}},plotOptions:{bar:{borderRadius:5,columnWidth:'48%'}},dataLabels:{enabled:false},colors:['#247241'],grid:{borderColor:'#edf1ed'}}).render()}const root=document.querySelector('[data-pixel-projects]');if(root&&window.DP_PIXEL_ROUTES?.pembangunanApi){const url=new URL(window.DP_PIXEL_ROUTES.pembangunanApi,window.location.origin);url.searchParams.set('page[size]','4');fetch(url.toString(),{headers:{Accept:'application/json'}}).then(r=>r.ok?r.json():Promise.reject(r.status)).then(payload=>{const rows=Array.isArray(payload.data)?payload.data:[];if(!rows.length){root.innerHTML='<div class="col-span-full rounded-xl border border-dashed border-line bg-white p-5 text-center text-xs text-muted">Belum ada data pembangunan yang ditampilkan.</div>';return}root.innerHTML=rows.map(item=>{const a=item.attributes||{},title=esc(a.judul||'Kegiatan'),location=esc(a.lokasi||''),year=esc(String(a.tahun_anggaran||'')),desc=esc(String(a.keterangan||'')).slice(0,140),href=`${window.DP_PIXEL_ROUTES.site}pembangunan/${encodeURIComponent(a.slug||'')}`,img=a.foto?`<img src="${attr(a.foto)}" alt="" class="h-28 w-full object-cover" loading="lazy">`:`<div class="grid h-28 place-items-center bg-forest-50 text-forest-700"><i data-lucide="construction" class="h-7 w-7"></i></div>`;return `<a href="${href}" class="card-hover overflow-hidden rounded-2xl border border-line bg-white shadow-soft">${img}<div class="p-3"><div class="flex items-center justify-between gap-2"><b class="truncate text-xs text-ink">${title}</b>${year?`<span class="text-[9px] text-muted">${year}</span>`:''}</div>${location?`<div class="mt-1 truncate text-[9px] text-muted">${location}</div>`:''}${desc?`<p class="mt-2 line-clamp-2 text-[10px] leading-4 text-muted">${desc}</p>`:''}</div></a>`}).join('');if(window.lucide)window.lucide.createIcons()}).catch(()=>{root.innerHTML='<div class="col-span-full rounded-xl border border-dashed border-line bg-white p-5 text-center text-xs text-muted">Data pembangunan belum dapat dimuat.</div>'})}function esc(v){return String(v).replace(/[&<>"']/g,m=>({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#039;'}[m]))}function attr(v){return esc(v)}});