{#
/**
 * Video Component
 * 
 * Displays HTML5 video player with multiple source support.
 *
 * Available variables:
 * - attributes: HTML attributes for video element.
 * - files: Array of video file sources.
 * - controls: Show video controls (default: true).
 * - autoplay: Autoplay video (default: false).
 * - loop: Loop video (default: false).
 * - muted: Mute video (default: false).
 * - poster: Poster image URL.
 * - video_utility_classes: Additional Tailwind classes.
 */
#}
{{ attach_library('tailpine/file') }}

<video{{ attributes.addClass('w-full max-w-4xl mx-auto p-4 rounded-2xl bg-gray-200 shadow-md border border-secondary/30 hover:border-primary transition-all duration-500 cursor-pointer') }}>
  {% for file in files %}
    <source{{ file.source_attributes }}>
  {% endfor %}
  Your browser does not support the video tag.
</video>
