@props(['video' => '', 'platform' => '', 'width' => '100%', 'height' => '100%'])
<style>
    .streamBlock-video_info1 {
        position: relative;
        width: {{ $width }};
        max-width: {{ $width }};
        height: 0;
        padding-bottom: 56.25%;
        background-color: #000;
        border-radius: 10px;
        overflow: hidden;
        box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3);
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .streamBlock-video_info1 iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: none;
    }

    /* Адаптивность */
    @media (max-width: 768px) {
        .streamBlock-video_info1 {
            max-width: 100%;
            padding-bottom: 56.25%;
        }

        .streamBlock-cover {
            font-size: 18px;
        }
    }
</style>

@if($platform == "twitch")
    <a style="width: {{ $width }};height: {{ $width }};display: contents" target="_blank"
       href="https://twitch.tv/{{ $video }}" class="streamBlock-video">
        <div class="streamBlock-video_info1">
            <iframe src="https://player.twitch.tv/?channel={{ $video }}&parent={{ request()->getHost() }}&muted=true"
                    frameborder="0" allowfullscreen="true"></iframe>
        </div>
        @if(isset($slot) && $slot)
            @if($slot->isNotEmpty())
                <hr style="margin: 10px 0 5px 0">
                <span>{{ $slot }}</span>
                <hr style="margin: 5px 0 5px 0">
            @endif
        @endif
    </a>
@elseif($platform == "youtube")
    <a style="width: {{ $width }}; height: {{ $width }};display: contents" target="_blank"
       href="https://www.youtube.com/watch?v={{ $video }}" class="streamBlock-video">
        <div class="streamBlock-video_info1">
            <iframe src="https://www.youtube.com/embed/{{ $video }}?autoplay=1&mute=1" allowfullscreen></iframe>
        </div>
        @if(isset($slot) && $slot)
            @if($slot->isNotEmpty())
                <hr style="margin: 10px 0 5px 0">
                <span>{{ $slot }}</span>
                <hr style="margin: 5px 0 5px 0">
            @endif
        @endif
    </a>
@elseif($platform == "kick")
    <a style="width: {{ $width }}; height: {{ $width }};display: contents" target="_blank"
       href="https://player.kick.com/{{ $video }}" class="streamBlock-video">
        <div class="streamBlock-video_info1">
            <iframe src="https://player.kick.com/{{ $video }}" allowfullscreen></iframe>
        </div>
        @if(isset($slot) && $slot)
            @if($slot->isNotEmpty())
                <hr style="margin: 10px 0 5px 0">
                <span>{{ $slot }}</span>
                <hr style="margin: 5px 0 5px 0">
            @endif
        @endif
    </a>
@else
    <p>Видео недоступно для этой платформы.</p>
@endif