<section class="section-one">
            <div class="container">
                <div class="row">
                    <div class="col-lg-9 col-md-8"> <!-- col-lg-9 start -->
                        <div class="row"><!-- row start -->
                            <div class="col-lg-7 col-md-6">
                                <div class="sectionNews-active owl-carousel">
                                    

                                         @foreach ($sliders as $slider)                                 
                                    <div class="secGllary-wrpp">                                
                                        <div class="secGllary-image">
                                            <img class="lazyload" src="{{asset('assets/images/logo/'.$gs->lazy_baner)}}" data-src="{{asset('assets/images/post/'.$slider->image_big)}}" alt="{{strlen($slider->title)>100 ? mb_substr($slider->title,0,100,"utf-8") : $slider->title}}" title="{{strlen($slider->title)>80 ? mb_substr($slider->title,0,80,"utf-8") : $slider->title}}">
                                             

                                                <h4 class="secGllary-title">
                                                    <a href="{{ route('frontend.postBySubcategory.details',[$slider->category->slug,$slider->slug])}}">{{strlen($slider->title)>100 ? mb_substr($slider->title,0,100,"utf-8") : $slider->title}}</a>
                                                </h4>
                                        </div>
                                       <p class="secGllary-details">
                                                                                       {!! strlen($slider->short_description)>250 ? mb_substr($slider->short_description,0,250,"utf-8") : $slider->short_description !!}.. <a href="{{ route('frontend.postBySubcategory.details',[$slider->category->slug,$slider->slug])}}"> {{__('Details')}}</a>  
                                        </p>
                                    </div>
									@endforeach
									
									
									
                                    
                            



                                </div>
                            </div>
                            
                            <div class="col-lg-5 col-md-6">                            
                                <div class="recentPopular">                        
                                    <ul class="nav nav-pills" id="recentPopular-tab" role="tablist">
                                        <li class="nav-item" role="presentation">
                                            <div class="nav-link active" id="recent-tab" data-bs-toggle="pill" data-bs-target="#recent" role="tab" aria-controls="recent" aria-selected="false"> {{__('Latest News')}}  </div>
                                        </li>
                                        
            
                                        <li class="nav-item" role="presentation">
                                            <div class="nav-link" id="popular-tab" data-bs-toggle="pill" data-bs-target="#popular" role="tab" aria-controls="popular" aria-selected="false"> {{__('Featured News')}} </div>
                                        </li>
                                                                            
                                    </ul>
                                </div>
                                                            

                                <div class="tab-content" id="pills-tabContent">
                                    <div class="tab-pane active show  fade" id="recent" role="tabpanel" aria-labelledby="recent">
                                        <div class="news-tavs">    
                                    
                                                                                                 
                                                                         
@foreach($is_trendings as $is_trending)	
                                            <div class="tab-item"> <!-- tab Item Start-->                             
                                                <div class="tab-image tab-border">
                                                    <img class="lazyload" src="{{asset('assets/images/logo/'.$gs->lazy_baner)}}" data-src="{{asset('assets/images/post/'.$is_trending->image_big)}}" alt="{{strlen($is_trending->title)>60 ? mb_substr($is_trending->title,0,60,"utf-8") : $is_trending->title}}" title="{{strlen($is_trending->title)>60 ? mb_substr($is_trending->title,0,60,"utf-8") : $is_trending->title}}">

                                                     

                                                    <h4 class="tab_hadding"><a href="{{ route('frontend.postBySubcategory.details',[$is_trending->category->slug,$is_trending->slug])}}">{{strlen($is_trending->title)>60 ? mb_substr($is_trending->title,0,60,"utf-8") : $is_trending->title}}</a></h4> 
                                                    <div class="conut">
                                                                                                       {{ $loop->iteration }}
                                                 
                                                    </div>
                                                </div>                                                                            
                                            </div><!-- tab Item End--> 
@endforeach
                                                                                 



                                               
    
                                              
                                         
                                                                    
                                        </div>
                                    </div>
                                    <div class="tab-pane fade" id="popular" role="tabpanel" aria-labelledby="popular">    
                                        <div class="news-tavs">  
                                            

                                             
                                                                         


@foreach ($is_recents as $is_recent)
                                            <div class="tab-item"> <!-- tab Item tart-->       
                                                <div class="tab-image tab-border">
                                                    <img class="lazyload" src="{{asset('assets/images/logo/'.$gs->lazy_baner)}}" data-src="{{asset('assets/images/post/'.$is_recent->image_big)}}" alt="{{strlen($is_recent->title)>60 ? mb_substr($is_recent->title,0,60,"utf-8") : $is_recent->title}}" title="{{strlen($is_recent->title)>60 ? mb_substr($is_recent->title,0,60,"utf-8") : $is_recent->title}}">
                                                     

                                                    <h4 class="tab_hadding"><a href="{{route('frontend.postBySubcategory.details',[$is_recent->category->slug,$is_recent->slug])}}"> {{strlen($is_recent->title)>60 ? mb_substr($is_recent->title,0,60,"utf-8") : $is_recent->title}} </a></h4> 
                                                    <div class="conut">  
                                                                                                       {{ $loop->iteration }}
                                                 
                                                    </div>
                                                </div>
                                            </div><!-- tab Item End--> 

                                                @endforeach                                  


                                                 

                                        
                                                                    
                                        </div>
                                    </div>
                                
                                </div>
                                  
                            </div>
                        </div><!-- row End -->

                        <div class="row"><!-- secOne Row start-->  
                             

                                       




@foreach ($slider_rights_firsts as $slider_rights_first)
									   
                                    <div class="themesBazar-3 themesBazar-m2">
                                <div class="secOne-wrpp"><!-- secOne Wrpp start-->
                                    <div class="sectionOne-image2">
                                        <img class="lazyload" src="{{asset('assets/images/logo/'.$gs->lazy_baner)}}" data-src="{{asset('assets/images/post/'.$slider_rights_first->image_big)}}" alt="{{strlen($slider_rights_first->title)>80 ? mb_substr($slider_rights_first->title,0,80,"utf-8") : $slider_rights_first->title}}" title="{{strlen($slider_rights_first->title)>80 ? mb_substr($slider_rights_first->title,0,80,"utf-8") : $slider_rights_first->title}}">

                                         <a href="{{ route('frontend.postBySubcategory.details',[$slider_rights_first->category->slug,$slider_rights_first->slug])}}" class="video-icon1"></a>  

                                    </div>
                                    <h5 class="secOne_title">
                                        <a href="{{ route('frontend.postBySubcategory.details',[$slider_rights_first->category->slug,$slider_rights_first->slug])}}">{{strlen($slider_rights_first->title)>60 ? mb_substr($slider_rights_first->title,0,60,"utf-8") : $slider_rights_first->title}}</a>
                                    </h5>
    
                                </div><!-- secOne Wrpp End-->
                              
                             </div>  
@endforeach
                                                                  
                                    

                                                    
                          
                            
                          
                                                   
    


                        </div><!-- secOne Content start-->




                    </div> <!-- col-lg-9 End -->
                    <div class="col-lg-3 col-md-4">
                        
                        <!-- sitebar cat -->
                        <div class="sitebar-catWrpp">
@php
    $lang = session('language_id') ?? 2; // ডিফল্ট বাংলা
@endphp

                            <div class="creativeDesign_cat02">
                                <a href="{{ route('frontend.category',$secondcat->slug ?? 'Not Found')}}"> <i class="lar la-newspaper" aria-hidden="true"></i> {{ $secondcat->title ?? 'Not Found' }} </a>
                            </div>
                        

                            
                                                                 
@foreach ($secondcatpostbig as $row)
                                    <div class="sitebarImage">
                                <img class="lazyload" src="{{asset('assets/images/logo/'.$gs->lazy_baner)}}" data-src="{{asset('assets/images/post/'.$row->image_big)}}" alt="{{strlen($row->title)>60 ? mb_substr($row->title,0,60,"utf-8") : $row->title}}" title="{{strlen($row->title)>60 ? mb_substr($row->title,0,60,"utf-8") : $row->title}}">

                                 <a href="{{ route('frontend.postBySubcategory.details',[$row->id,$row->slug])}}" class="video-icon1"><i class="la la-play"></i></a>  

                            </div>
                            <h5 class="sitbar-title">
                                <a href="{{ route('frontend.postBySubcategory.details',[$row->id,$row->slug])}}"> {{strlen($row->title)>60 ? mb_substr($row->title,0,60,"utf-8") : $row->title}}</a>
                            </h5>
                               @endforeach                           

                                                                 
@foreach ($secondcatpostsmall as $row)
                                    <div class="sitebarImage2"> <!--sitebarImage2 start-->
                                <img class="lazyload" src="{{asset('assets/images/logo/'.$gs->lazy_baner)}}" data-src="{{asset('assets/images/post/'.$row->image_big)}}" alt="{{strlen($row->title)>60 ? mb_substr($row->title,0,60,"utf-8") : $row->title}}" title="{{strlen($row->title)>60 ? mb_substr($row->title,0,60,"utf-8") : $row->title}}">
                                 

                                <h6 class="sitbar-title2">
                                    <a href="{{ route('frontend.postBySubcategory.details',[$row->id,$row->slug])}}"> {{strlen($row->title)>60 ? mb_substr($row->title,0,60,"utf-8") : $row->title}} </a>
                                </h6>
                            </div><!--sitebarImage2 End-->
                      @endforeach                                              

                            
                     

                            
                                <div class="row">
                                    <div class="col-sm-12 col-md-12">
                                        <h4 class="more_news"><a href="{{ route('frontend.category',$secondcat->slug ?? 'Not Found')}}">  {{__('More News')}} <i class="la la-angle-double-right" aria-hidden="true"></i>  </a></h4>
                                    </div>
                                </div>
                               

                        </div>


                        



@if($gs->is_live_tv == 1)
<div class="live-tv-container">
    <div class="live-tv-header">
        <h4>🔴 {{ __('Live TV') }}</h4>
        <span class="live-indicator">● LIVE</span>
    </div>

    <div class="live-tv-frame">
        {!! $gs->live_tv !!}
    </div>
</div>
@endif

<style>
/* 🎥 Live TV Section */
.live-tv-container {
    background: #000;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    margin: 15px 0;
    transition: all 0.3s ease-in-out;
}

.live-tv-container:hover {
    transform: scale(1.01);
}

.live-tv-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(90deg, #b80000, #ff3b3b);
    color: #fff;
    padding: 10px 15px;
    font-weight: 600;
    font-size: 16px;
}

.live-indicator {
    background: #fff;
    color: #b80000;
    font-weight: bold;
    font-size: 13px;
    padding: 3px 8px;
    border-radius: 20px;
    animation: blink 1s infinite;
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

.live-tv-frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
}

.live-tv-frame iframe,
.live-tv-frame video {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* 📱 Responsive adjustments */
@media (max-width: 768px) {
    .live-tv-header {
        font-size: 14px;
        padding: 8px 12px;
    }
    .live-indicator {
        font-size: 12px;
        padding: 2px 6px;
    }
}

</style>
						
						
						

                         @if($gs->is_facebook== 1)
                        <div class="creativeDesign_facebook">
                            {{__('Our Facebook Page')}}
                        </div>
                        
                        <div class="facebook-content">
                                                        
                            
                       
                            <iframe
              src="https://www.facebook.com/plugins/page.php?href=https://www.facebook.com/{{ $gs->facebook_page_link }}&amp;tabs=time&amp;width=300&amp;height=120&amp;small_header=false&amp;adapt_container_width=true&amp;hide_cover=false&amp;show_facepile=true&amp;appId=334182264340964"
              width="260" height="120" style="border:none;overflow:hidden" scrolling="no" frameborder="0"
              allowfullscreen="true"
              allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"></iframe>
                        </div>

                        @endif
						
						
						
						
		
						
						
						
						
						
						
						 @if($gs->is_national== 1)
                        					<div>
                        <h1 class="creativeDesign_cat02">
                            <a href=""> <i class="las la-volume-up"></i> {{__('Our National Anthem')}}</a> 
                        </h1>


						<audio controls="" style="width:100%">
				 <source src="{{asset('assets/frontend/bd_national_anthem.mp3')}}" type="audio/mp3">
				</audio>


				</div>
  @endif

@if($gs->is_pool_on	== 1)
@if ($ws->poll_inhome == 1)
<div class="poll-area mt-4 card shadow-sm border-0">
  <div class="card-header bg-primary text-white d-flex justify-content-between align-items-center">
    <h5 class="mb-0">{{ __('Poll') }}</h5>
    <a href="{{ route('front.allPoll') }}" class="text-white text-decoration-underline">{{ __('Previous Result') }}</a>
  </div>

  <div class="card-body">
    @foreach ($polls as $poll)
    <div class="poll-box mb-4" data-id="{{ $poll->id }}">
      <h6 class="fw-semibold mb-3"><i class="far fa-question-circle me-1"></i> {{ $poll->question }}</h6>

      @csrf
      @foreach ($poll->child as $answer)
      <div class="form-check mb-1">
        <input class="form-check-input" type="radio" name="poll_answer_id_{{ $poll->id }}" value="{{ $answer->id }}" id="ans{{ $answer->id }}">
        <label class="form-check-label" for="ans{{ $answer->id }}">{{ $answer->poll_option }}</label>
      </div>
      @endforeach

      @php
        $ip = request()->ip();
        $isVote = App\Models\PollResult::where('poll_question_id', $poll->id)->where('ip_address', $ip)->exists();
      @endphp

      <div class="mt-3 d-flex gap-2">
        @if (!$isVote)
          <button class="btn btn-primary btn-sm vote-btn" data-id="{{ $poll->id }}">{{ __('Vote') }}</button>
        @else
          <button class="btn btn-success btn-sm" disabled>{{ __('Voted') }}</button>
          <button class="btn btn-info btn-sm view-result" data-id="{{ $poll->id }}">{{ __('View Result') }}</button>
        @endif
      </div>

      <div class="poll-message mt-2 text-danger small"></div>
      <div class="poll-result mt-3"></div>
    </div>
    @endforeach
  </div>
</div>
@endif

 @endif




<div class="archive-widget mt-4 mb-4 shadow-sm">
    <div class="archive-header" style="background: linear-gradient(90deg, #bd0202, #ff3b3b); color: #fff; padding: 12px 15px; border-radius: 8px 8px 0 0; display: flex; align-items: center; gap: 10px;">
        <i class="las la-history" style="font-size: 24px;"></i>
        <h5 class="mb-0" style="font-weight: 600; font-size: 18px; letter-spacing: 0.5px;">{{ __('Find old news') }}</h5>
    </div>
    
    <div class="archive-body" style="background: #fff; padding: 25px 20px; border: 1px solid #eee; border-top: none; border-radius: 0 0 8px 8px;">
        <form action="{{ route('frontend.postByDate') }}" method="GET">
            <div class="date-input-wrapper mb-3" style="position: relative;">
                <label for="archive_date" style="display: block; font-size: 13px; color: #666; margin-bottom: 8px; font-weight: 500;">
                    {{ __('Select date') }}
                </label>
                <div style="display: flex; align-items: center; border: 2px solid #f1f3f5; border-radius: 6px; padding: 5px 12px; background: #f8f9fa; transition: 0.3s;">
                    <i class="lar la-calendar-alt" style="color: #bd0202; font-size: 20px; margin-right: 10px;"></i>
                    <input type="date" name="date" id="archive_date" class="form-control-custom" 
                           value="{{ date('Y-m-d') }}" 
                           style="border: none; background: transparent; width: 100%; outline: none; font-size: 15px; color: #333; cursor: pointer;" required>
                </div>
            </div>
            
            <button type="submit" class="archive-search-btn" style="width: 100%; background: #222; color: #fff; border: none; padding: 12px; border-radius: 6px; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 8px; transition: all 0.3s ease; cursor: pointer;">
                <i class="las la-search"></i> {{__('Watch the news')}}
            </button>
        </form>
    </div>
</div>

<style>
    /* আর্কাইভ সেকশনের জন্য বিশেষ স্টাইল */
    .archive-widget {
        border-radius: 8px;
        transition: transform 0.3s ease;
    }
    .archive-widget:hover {
        transform: translateY(-3px);
    }
    .date-input-wrapper div:focus-within {
        border-color: #bd0202 !important;
        background: #fff !important;
        box-shadow: 0 0 0 3px rgba(189, 2, 2, 0.1);
    }
    .archive-search-btn:hover {
        background: #bd0202 !important;
        box-shadow: 0 4px 12px rgba(189, 2, 2, 0.2);
    }
    /* ব্রাউজারের ডিফল্ট ক্যালেন্ডার আইকন কাস্টমাইজ (ঐচ্ছিক) */
    input[type="date"]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: 0.6;
    }
    input[type="date"]::-webkit-calendar-picker-indicator:hover {
        opacity: 1;
    }
</style>
                    </div>
                </div>
            </div>
        </section>
