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"./styled-components.browser.esm-D6gQ3Ssb.js";var a=e(t()),o=e(n()),s=()=>(0,o.jsx)(c,{children:(0,o.jsxs)(`div`,{className:`dot-spinner`,children:[(0,o.jsx)(`div`,{className:`dot-spinner__dot`}),(0,o.jsx)(`div`,{className:`dot-spinner__dot`}),(0,o.jsx)(`div`,{className:`dot-spinner__dot`}),(0,o.jsx)(`div`,{className:`dot-spinner__dot`}),(0,o.jsx)(`div`,{className:`dot-spinner__dot`}),(0,o.jsx)(`div`,{className:`dot-spinner__dot`}),(0,o.jsx)(`div`,{className:`dot-spinner__dot`}),(0,o.jsx)(`div`,{className:`dot-spinner__dot`})]})}),c=i.div`
  .dot-spinner {
    --uib-size: 3.8rem;
    --uib-speed: .9s;
    --uib-color: #183153;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: var(--uib-size);
    width: var(--uib-size);
  }

  .dot-spinner__dot {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 100%;
    width: 100%;
  }

  .dot-spinner__dot::before {
    content: '';
    height: 20%;
    width: 20%;
    border-radius: 50%;
    background-color: white;
    transform: scale(0);
    opacity: 0.5;
    animation: pulse0112 calc(var(--uib-speed) * 1.111) ease-in-out infinite;
    box-shadow: 0 0 20px rgba(18, 31, 53, 0.3);
  }

  .dot-spinner__dot:nth-child(2) {
    transform: rotate(45deg);
  }

  .dot-spinner__dot:nth-child(2)::before {
    animation-delay: calc(var(--uib-speed) * -0.875);
  }

  .dot-spinner__dot:nth-child(3) {
    transform: rotate(90deg);
  }

  .dot-spinner__dot:nth-child(3)::before {
    animation-delay: calc(var(--uib-speed) * -0.75);
  }

  .dot-spinner__dot:nth-child(4) {
    transform: rotate(135deg);
  }

  .dot-spinner__dot:nth-child(4)::before {
    animation-delay: calc(var(--uib-speed) * -0.625);
  }

  .dot-spinner__dot:nth-child(5) {
    transform: rotate(180deg);
  }

  .dot-spinner__dot:nth-child(5)::before {
    animation-delay: calc(var(--uib-speed) * -0.5);
  }

  .dot-spinner__dot:nth-child(6) {
    transform: rotate(225deg);
  }

  .dot-spinner__dot:nth-child(6)::before {
    animation-delay: calc(var(--uib-speed) * -0.375);
  }

  .dot-spinner__dot:nth-child(7) {
    transform: rotate(270deg);
  }

  .dot-spinner__dot:nth-child(7)::before {
    animation-delay: calc(var(--uib-speed) * -0.25);
  }

  .dot-spinner__dot:nth-child(8) {
    transform: rotate(315deg);
  }

  .dot-spinner__dot:nth-child(8)::before {
    animation-delay: calc(var(--uib-speed) * -0.125);
  }

  @keyframes pulse0112 {
    0%,
    100% {
      transform: scale(0);
      opacity: 0.5;
    }

    50% {
      transform: scale(1);
      opacity: 1;
    }
  }`,l=s,u=({src:e,title:t})=>{let[n,r]=(0,a.useState)(!1);return(0,o.jsxs)(`div`,{className:`relative w-full`,children:[!n&&(0,o.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center bg-black rounded-xl`,children:(0,o.jsx)(l,{})}),(0,o.jsx)(`iframe`,{src:e,title:t,allowFullScreen:!0,className:`w-full h-[185px] sm:h-[270px] rounded-xl`,onLoad:()=>r(!0)})]})};function d({data:e}){return!e||e.length===0?(0,o.jsx)(`p`,{className:`text-center text-gray-400 mt-10`,children:`Loading...`}):(0,o.jsx)(`div`,{className:`flex flex-wrap justify-center gap-8`,children:e.map(e=>(0,o.jsxs)(`div`,{className:`w-[340px] sm:w-[400px] md:w-[480px] relative
            ${e.recommended?`ring-2 ring-yellow-400 rounded-xl`:``}`,style:{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)(u,{src:`${e.youtubeUrl}?rel=0&modestbranding=1`,title:`video-${e.id}`})]},e.id))})}var f=(0,a.memo)(d);export{f as t};