@php
    $notificationType = (isset($notification['type']) && $notification['type'] == 'error') ? "danger" : $notification['type'];
    $nType = ($type == 1) ? "danger" : $notificationType;
    $notificationTitle = "<div class='alert alert-dismissible bg-light-".$nType." border border-".$nType." border-dashed d-flex flex-column flex-sm-row w-100 p-3 mb-5'><div class='d-flex flex-column w-100 text-start'><h3 class='fw-semibold mb-0 text-".$nType."'>".$notification['title']."</h3>";
            if(isset($notification['sub_title']) && $type > 1):
                $notificationTitle .= "<span class='fs-5 text-gray-700 mt-2'>".$notification['sub_title']."</span>";
            endif;
        $notificationTitle .= "</div></div>";

    $notificationHtml = "<div class='notification_content'>";
        $id = $notification['id'];
        if(!empty($notification['video_url'])):
            $videoUrl = getYoutubeEmbedUrl($notification['video_url']);
            $notificationHtml .= '<div class="pt-5"><div class="justify-content-center mx-auto w-100"><iframe id="notification_video_'.$id.'_'.$nType.'" width="100%" height="400" src="'.$videoUrl.'" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></div></div>';
        endif;
        if(!empty($notification['image'])):
            $notificationImage = getStorageUrlLink($notification['image']);
            if(!empty($notificationImage)):
                $notificationHtml .= '<div class="pt-5"><div class="justify-content-center mx-auto w-75"><image width="100%" src="'.$notificationImage.'" /></div></div>';
            endif;
        endif;
        $notificationHtml .= "<div class='fs-5 text-gray-600 fw-semibold mb-5 text-start description'>".$notification['description']."</div></div>";
        $modalId = "notification_".$notification['id']."_".$type;
        $modalBtnId = "notificationBtn_".$notification['id']."_".$type;
@endphp

<div class="modal fade" id="{{$modalId}}" tabindex="-1" role="dialog" aria-labelledby="defaultModalTitle" data-bs-keyboard="false" data-bs-backdrop="static" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable mw-650px">
        <div class="modal-content">
            <div class="modal-header row">
                <div class="col text-start">
                    <h2 class="modal-title" id="modalTitle">{{$notification['title']}}</h2>
                </div>
                <div class="col text-end">
                    <h2 class="modal-title h2 text-white badge badge-square badge-{{$nType}} p-2" id="modalTitle">{{$notificationType}}</h2>
                </div>
            </div>
            <div class="modal-body scroll-y px-10 px-lg-15 pb-15">
                <div class="row">
                    {!! $notificationHtml !!}
                </div>
                <div class="row text-center mt-10 mb-n5">
                    <div class="justify-content-center">
                        <button type="button" class="btn btn-primary" id="{{$modalBtnId}}">Ok</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>