@props([
    'video' => [
        'desktop' => '',
        'mobile' => '',
    ],
    'thumbnail' => [
        'desktop' => '',
        'mobile' => '',
    ],
])
@php
  //Detectar si es un mobile o un desktop
  $isMobile = preg_match('/(android|iphone|ipad|mobile)/i', request()->header('User-Agent'));
  $posterUrl = $isMobile ? $thumbnail['mobile'] : $thumbnail['desktop'];
@endphp
<div class="absolute bottom-0 left-0 right-0 top-0 z-[1] h-full w-full overflow-hidden">
  <video class="absolute bottom-0 left-0 right-0 top-0 z-[1] h-full w-full object-cover object-center" fetchpriority="high" autoplay muted
    poster="{{ $posterUrl }}" preload="metadata" loop playsinline type="video/mp4">
    <source src="{{ $video['mobile'] }}" type="video/mp4" media="(max-width: 767px)">
    <source src="{{ $video['desktop'] }}" type="video/mp4">
    Your browser does not support the video element.
  </video>
</div>