import{S as e,_ as t,t as n}from"./index-CgONkj9l.js";import{f as r}from"./fa-Ct0OS-6Q.js";import{t as i}from"./play-BpJL-mtd.js";var a=e(t()),o=e(n()),s=({videoId:e,title:t})=>{let[n,r]=(0,a.useState)(!1);return(0,o.jsx)(`div`,{className:`w-full h-full relative cursor-pointer`,children:n?(0,o.jsx)(`iframe`,{src:`https://www.youtube.com/embed/${e}?autoplay=1&rel=0&modestbranding=1`,title:t,allow:`autoplay; encrypted-media`,allowFullScreen:!0,className:`w-full h-full rounded-2xl`}):(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(`img`,{src:`https://img.youtube.com/vi/${e}/maxresdefault.jpg`,alt:t,loading:`lazy`,className:`w-full h-full object-cover rounded-2xl`}),(0,o.jsx)(`div`,{className:`absolute inset-0 bg-black/10 flex items-center justify-center`,children:(0,o.jsx)(`div`,{className:`bg-black/50 p-4 rounded-full`,children:(0,o.jsx)(i,{className:`text-white w-8 h-8`})})}),(0,o.jsx)(`button`,{onClick:()=>r(!0),className:`absolute inset-0 cursor-pointer`,"aria-label":`Play video`})]})})};function c({data:e}){let t=(0,a.useCallback)(e=>e.split(`/`).pop(),[]);return!e||e.length===0?(0,o.jsx)(`p`,{className:`text-center text-gray-400 mt-10`,children:`Loading...`}):(0,o.jsx)(`div`,{className:`grid 
                 grid-cols-1 
                 sm:grid-cols-2
                 lg:grid-cols-3 
                 xl:grid-cols-4
                 justify-items-center 
                 px-4 py-6
                 gap-10`,children:e.map((e,n)=>(0,o.jsxs)(`div`,{className:`relative 
            w-[85vw] sm:w-[300px] md:w-[250px] lg:w-[300px]  
            aspect-[14/25] 
            rounded-2xl overflow-hidden 
            shadow-md shadow-black/20 
            hover:scale-[1.01] transition-transform duration-300 ease-in-out
            ${e.recommended?`ring-2 ring-yellow-400`:``}`,style:{animationDelay:`${n*.1}s`,willChange:`transform`},children:[e.recommended&&(0,o.jsxs)(`span`,{className:`absolute top-3 left-3 z-20
             text-xs font-bold
             px-3 py-1 rounded-full
             shadow-md
             bg-gradient-to-r from-yellow-400 via-yellow-300 to-yellow-500
             text-black
             backdrop-blur-sm
             border border-white/30 flex items-center gap-1
             transform scale-105 hover:scale-110 transition-all duration-300`,children:[(0,o.jsx)(r,{}),` Recommended`]}),(0,o.jsx)(s,{videoId:t(e.youtubeUrl),title:e.title||``})]},e.id))})}var l=(0,a.memo)(c);export{l as t};