@extends('web.layout.master')
@section('content')
<div class="container my-2">
   <input type="hidden" name="match_id" value="{{$match->match_id}}" id="match_id">
  <div id="update-score">
   <div class="row">
   	      <div class="col-lg-9 col-md-12">
         <div class="border p-3 rounded-4 mb-4">
            <h1 class="crick-blog-title">{{$match->title}}, {{$match->subtitle}} - Live Cricket Score, Commentary</h1>
           <div class="circ-meta-tags font-semi d-flex justify-content-between flex-wrap gap-2 pt-3">
                  <span><b>Series:</b> <a href="#"> {{json_decode($match->competition)->title}}</a></span> <span><b>Venue:</b>
                     {{json_decode($match->venue)->name}}, {{json_decode($match->venue)->location}}</span> <span><b>Date & Time:</b>  {{$formattedDateTime}} LOCAL</span>
               </div>
            <hr class="my-4">
            @if($match->status == 2)
            <div class="row">
               <div class="col-lg-12 col-md-12">
                  <div class="border rounded-4 p-3 mb-2">
                     <div class="d-flex justify-content-between flex-wrap ">
                        <p class="text-nowrap font-low mb-0">
                           @if($match->status == 2)<span class="success-text">Completed </span>
                           @elseif($match->status == 1)<span class="live-text">Live </span>@endif<span
                              class="style_dark_match_date"> - {{$match->subtitle}}</span> - {{json_decode($match->venue)->location}}</p>
                        <p class="text-nowrap font-low mb-0"><span class="text-dark fw-bold">
                     </div>
                     <div class="team_list_box pt-3">
                        <div class="team_list_items d-flex justify-content-between align-items-center">
                           <div class="d-flex align-items-center text-dark">
                              <img src="{{asset(asset(json_decode($match->teama)->thumb_url))}}" class="rounded mx-auto d-block" alt="">
                              <span class="first_tema_name font-low ms-2">{{json_decode($match->teama)->name}}</span>
                           </div>
                           <p class="mb-0 font-low">{{$score1->scores}}</p>
                        </div>
                        <div class="team_list_items d-flex justify-content-between align-items-center">
                           <div class="d-flex align-items-center">
                              <img src="{{asset(asset(json_decode($match->teamb)->thumb_url))}}" class="rounded mx-auto d-block" alt="">
                              <span class="second_tema_name font-low ms-2">{{json_decode($match->teamb)->name}}</span>
                           </div>
                           <p class="mb-0 font-low">{{$score2->scores}}</p>
                        </div>
                     </div>
                  </div>
               </div>
            </div>

            <div class="row">
               <div class="col-md-12 py-2 py-md-4">
                  <ul
                     class="scroll-list flex-nowrap text-nowrap resp-scroll pages-link d-flex align-items-center gap-1">
                     <li><a href="{{route('commentary',['id'=>$match->match_id])}}" class="active">Commentary</a></li>
                     <li><a href="{{route('scorecard',['id'=>$match->match_id])}}">Scorecard</a></li>
                     <li><a href="{{route('squads',['id'=>$match->match_id])}}">Squads</a></li>
                     <li><a href="{{route('highlights',['id'=>$match->match_id])}}">Highlights</a></li>
                     <li><a href="{{route('pointTable',['id'=>$match->match_id])}}">Points Table</a></li>
                  </ul>
               </div>
            </div>

            <div>

               <div>
                  <div class="row">
                     <div class=" col-lg-12 col-md-12">
                        <div class="style_personTbl___TsMV">
                           <div class="border rounded-4 table-responsive font-semi mb-4">
                              <table class="table">
                                 <thead>
                                    <tr>
                                       <th class="bg-dark text-white">Batter</th>
                                       <th class="bg-dark text-white">R</th>
                                       <th class="bg-dark text-white">B</th>
                                       <th class="bg-dark text-white">SR</th>
                                       <th class="bg-dark text-white">4s</th>
                                       <th class="bg-dark text-white">6s</th>
                                    </tr>
                                 </thead>
                                 <tbody>
                                    @foreach($score2->batsmen as $value)
                                       @if($value->how_out == 'Not out')
                                        <tr>
                                          <td>{{$value->name}}</td>
                                          <td>{{$value->runs}}</td>
                                          <td>{{$value->balls_faced}}</td>
                                          <td>{{$value->strike_rate}}</td>
                                          <td>{{$value->fours}}</td>
                                          <td>{{$value->sixes}}</td>
                                        </tr>
                                        @endif
                                     @endforeach
                                 </tbody>
                              </table>
                           </div>
                           <div class="border rounded-4 table-responsive font-semi mb-4">
                              <table class="table">
                                 <thead>
                                    <tr>
                                       <th class="bg-dark text-white">Bowler</th>
                                       <th class="bg-dark text-white">Ov</th>
                                       <th class="bg-dark text-white">M</th>
                                       <th class="bg-dark text-white">R</th>
                                       <th class="bg-dark text-white">W</th>
                                       <th class="bg-dark text-white">Eco</th>
                                    </tr>
                                 </thead>
                                 <tbody>
                                    @foreach($score1->bowlers as $value)
                                        <tr>
                                          <td>{{$value->name}}</td>
                                          <td>{{$value->overs}}</td>
                                          <td>{{$value->maidens}}</td>
                                          <td>{{$value->runs_conceded}}</td>
                                          <td>{{$value->wickets}}</td>
                                          <td>{{$value->econ}}</td>
                                        </tr>
                                      @endforeach
                                    
                                 </tbody>
                              </table>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
                <div class="inning-tabs">
                  <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
                     @if(isset($commentary1->response))
                     <li class="nav-item" role="presentation">
                        <a class="nav-link active" id="pills-inning1-tab" data-bs-toggle="pill"
                           data-bs-target="#pills-inning1" type="button" role="tab" aria-controls="pills-inning1"
                           aria-selected="true">Inning 2</a>
                     </li>
                     @endif
                     <li class="nav-item" role="presentation">
                        <a class="nav-link @if(isset($commentary1->response)) @else active @endif" id="pills-inning2-tab" data-bs-toggle="pill"
                           data-bs-target="#pills-inning2" type="button" role="tab" aria-controls="pills-inning2"
                           aria-selected="false">Inning 1</a>
                     </li>

                  </ul>
                   <div class="tab-content" id="pills-tabContent">
                     @if(isset($commentary1->response))
                     <div class="tab-pane fade show active" id="pills-inning1" role="tabpanel"
                        aria-labelledby="pills-inning1-tab">

                        <div class="match-widget-title">
                           <h3 class="title-widget">Inning 2</h3>
                        </div>