@extends('layouts.dashboardlayout')
@section('content')


@if(session()->has('similartext'))      

   <div class="modal fade " id="similartextAd" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1">
	   <div class="modal-dialog">
            <div class="modal-content">
				{!! optionByKey('show_popup_similar') !!}
                <div class="modal-footer">                   
                    <a class="btn btn-outline-primary btnlink"  href="{{session('editUrl')}}">{{ optionByKey('edit_profile_show') }}</a>
                </div>
            </div>
	   </div>
   </div>
   
@endif


<div class="container">
<hr class="my-3 bg-transparent border-0">
<div class="row">
<div class="col-md-12 text-center">
    <h1 class="main-title home">{{ optionByKey('publish_for_free') }}</h1>
</div>
<div class="col-md-12 mt-5">

	<ul id="progressbar">
		<li class="active icon-user" id="personal"><strong>{{ optionByKey('insert') }}</strong></li>
		<li id="photo" class="icon-camera active"><strong>{{ optionByKey('your_photo') }}</strong></li>
		<li id="promote" class="icon-thumbs-up active"><strong>{{ optionByKey('verify') }}</strong></li>
		<li id="confirm" class="icon-checkmark"><strong>{{ optionByKey('finish') }}</strong></li>
	</ul>

   {!! Html::form('POST', url($profile_publish_url) )->open() !!}
		
	<div class="row">
		<div class="col-md-8">
			<div class="row">
		
			  
		
		
			<input type="hidden" name="secret_code" value="{{$profile_key}}">
			<input type="hidden" name="product_id" >
			<input type="hidden" name="profile_id" value="{{$profiles->id}}">
			<input type="hidden" name="time_data_id">
			<input type="hidden" name="permotiontype" value="0">
			
				<div class="col-md-12">
					<div class="select-plan-gride bg-light border rounded-3 p-3">
					   <h5 class="fw-bold"><i class="icon-top-icon"></i> TOP</h5>
					   <p class="small"> {!! str_replace('{adsid}',$profiles->post_id,optionByKey('we_will_help_you')) !!} </p>
					   <a class="fs-6 mb-2 d-inline-block show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#DiscoverVipBenefits">
						<i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}
						</a>
						
						<div class="promote-your-ad-list row">
						@foreach($products as $key=>$product)
						
						@php $val = explode('x',$product->name);
							 $price = number_format($coins_rate*$product->per_coin_rate,2,'.','');		
							 
							 $allinoneprice = number_format($coins_rate*$product->allinone_coin_rate,2,'.','');
							 
							 $excprice = number_format($coins_rate*$product->exc_coin_rate,2,'.','');
							 $randnum = explode(',',$product->randnum);
							 
							 $highlightprice = number_format($coins_rate*$product->highlight_coin_rate,2,'.','');
							 
							 $newlabelprice = number_format($coins_rate*$product->new_label_coin_rate,2,'.','');
						 @endphp
						 
							<div class="col-md-6">
								<div class="promote-your-ad-box promote-day-select promote-select-time-slot" data-pname="{{$val[0]}}X{{$val[1]}}" data-price="{{$price}}" data-coin="{{$product->per_coin_rate}}" data-product_id="{{$product->id}}" id="promote-your-ad-box_1">
									<input type="checkbox" name="optradio" id="promote-ad{{$key}}" class="check-radio-btn">
									
									<label for="promote-ad{{$key}}" class="{{ $product->days_name}} p-2 pb-3">
										<div class="promote-ad-coins-info d-flex align-items-start justify-content-between flex-column mb-4">
											<span class="select-radio-icon"></span>
											<div class="p-ad-ch d-flex justify-content-between w-100">
												<div class="promote-ad-coins-item text-start">
													<span class="prodcut-purchase-number text-end">
														<span class="item fs-3 fw-bold pinkColor">{{$val[0]}}</span>
														<span class="item fs-4 fw-bold">x</span>
														<span class="item fs-3 fw-bold">{{$val[1]}}</span>
													</span>
												</div>
												<div class="promote-ad-coins-item text-end">
													<div class="coins-quantity-text fw-bold">({{$product->per_coin_rate}} {{optionByKey('coins_name')}})</div>
													<div class="fw-bold fs-6 coins-price-title">{{$currency_symbol}}  {{ number_format($coins_rate*$product->per_coin_rate,2,'.','') }}</div>
												</div>
											</div>
											<div class="p-d-cl-n d-flex align-items-start justify-content-start">
												<p>{!! $product->description !!}</p>
											</div>
										</div>

										<div class="promote-ad-coins-bottom-info">
											<div class="pradday">{{$product->days_name}}</div>
											<div class="form-group">
												<select class="form-control custom-select time-slot-dropdown" name="" required="required" disabled>
													<option value="">{{optionByKey('select_time_slot')}}</option>
													@foreach(getProductPlan($product->id) as $plan)
														<option value="{{ $plan->id }}">{{ $plan->plan_time }}</option>
													@endforeach
												</select>
											</div>
											<div class="promote-ad-coins-toggle-wrapper">
												<!-- New Plan Section Start -->
												<div class="new-optionplan-box">
													
													{!! optionByKey('contantupgrades') !!}
													
												 <div class="upgradePanel p-2 mb-12 parrent-toggle">
														
														{!! optionByKey('contantallinone') !!}
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->allinone_coin_rate,2,'.','') }} ({{$product->allinone_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#allinoneBenefits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}</a>
														</div>
														
														<label for="terms_{{$randnum[0]}}" class="switch switch-left-right">  
															<input id="terms_{{$randnum[0]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}" data-price="{{number_format($allinoneprice,2,'.','')}}" data-coin="{{$product->allinone_coin_rate}}"  data-percoin="{{$product->per_coin_rate}}" class="switch-input onoff-switch-promote" type="checkbox" name="allinone">
															<span data-on="{!! optionByKey('yes_btn') !!}" data-off="{!! optionByKey('no_btn') !!}" class="switch-label"></span> 
															<span class="switch-handle"></span>
														</label>
													</div>
												
													<div class="upgradePanel p-2 mb-12 child-toggle">
														
														{!! optionByKey('contantexclusive') !!}
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->exc_coin_rate,2,'.','') }} ({{$product->exc_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#vipprimebenfits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}
															</a>
														</div>
														<label for="terms_{{$randnum[1]}}" class="switch switch-left-right">
															<input id="terms_{{$randnum[1]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}"data-price="{{number_format($excprice,2,'.','')}}"data-coin="{{$product->exc_coin_rate}}" data-percoin="{{$product->per_coin_rate}}" data-type="exclusive" class="switch-input onoff-switch-promote" type="checkbox" name="allpromotion">
															<span data-on="{!! optionByKey('yes_btn') !!}" data-off="{!! optionByKey('no_btn') !!}" class="switch-label"></span> 
															<span class="switch-handle"></span>
														</label>
													</div>
												
													<div class="upgradePanel p-2 mb-12 child-toggle">
														
														{!! optionByKey('contanthighlight') !!}
														
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->highlight_coin_rate,2,'.','') }} ({{$product->highlight_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#highlightBenefits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}
</a>
														</div>
														<label for="terms_{{$randnum[2]}}" class="switch switch-left-right">
															<input id="terms_{{$randnum[2]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}" data-price="{{number_format($highlightprice,2,'.','')}}" data-coin="{{$product->highlight_coin_rate}}"  data-percoin="{{$product->per_coin_rate}}" data-type="highlight" class="switch-input onoff-switch-promote" type="checkbox" name="allpromotion"> 
															<span data-on="{{optionByKey('yes_btn')}}" data-off="{{optionByKey('no_btn')}}" class="switch-label"></span> 
															<span class="switch-handle"></span>
														</label>
													</div>
												
													<div class="upgradePanel p-2  child-toggle">
														
														{!! optionByKey('contantnewlabel') !!}
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->new_label_coin_rate,2,'.','') }} ({{$product->new_label_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#labelnewBenefits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}
															</a>
														</div>
														
													   <label for="terms_{{$randnum[3]}}" class="switch switch-left-right" >
															<input id="terms_{{$randnum[3]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}" data-price="{{number_format($newlabelprice,2,'.','')}}" data-coin="{{$product->new_label_coin_rate}}" data-percoin="{{$product->per_coin_rate}}" class="switch-input onoff-switch-promote" data-type="newlabel" type="checkbox" name="allpromotion">  
															<span data-on="{{optionByKey('yes_btn')}}" data-off="{{optionByKey('no_btn')}}" class="switch-label"></span> 
															<span class="switch-handle"></span>
														</label>
														
													</div>
												
												
												</div>
												<!-- New Plan Section Start -->
											</div>
										</div>
									</label>
								</div>
							</div>
						@endforeach	
						
						
						@foreach($productstwo as $key=>$product)
						
						@php $val = explode('x',$product->name);
							 $price = number_format($coins_rate*$product->per_coin_rate,2,'.','');		
							 
							 $allinoneprice = number_format($coins_rate*$product->allinone_coin_rate,2,'.','');
							 
							 $excprice = number_format($coins_rate*$product->exc_coin_rate,2,'.','');
							 $randnum = explode(',',$product->randnum);
							 
							 $highlightprice = number_format($coins_rate*$product->highlight_coin_rate,2,'.','');
							 
							 $newlabelprice = number_format($coins_rate*$product->new_label_coin_rate,2,'.','');
						 @endphp
						 
		<div class="col-md-6">
			<div class="promote-your-ad-box promote-day-select promote-select-time-slot nightplan" data-pname="{{$val[0]}}X{{$val[1]}}" data-price="{{$price}}" data-coin="{{$product->per_coin_rate}}" data-product_id="{{$product->id}}" id="promote-your-ad-box_1">
				<input type="checkbox" name="optradio" id="promote-ad{{$key+4}}" class="check-radio-btn">								
									
				<label for="promote-ad{{$key+4}}" class="Night p-2 pb-3">
					<div class="promote-ad-coins-info d-flex align-items-start justify-content-between flex-column mb-4">
						<span class="select-radio-icon"></span>
						<div class="p-ad-ch d-flex justify-content-between w-100">
							<div class="promote-ad-coins-item text-start">
								<span class="prodcut-purchase-number text-end">
									<span class="item fs-3 fw-bold pinkColor">{{$val[0]}}</span>
									<span class="item fs-4 fw-bold">x</span>
									<span class="item fs-3 fw-bold">{{$val[1]}}</span>
								</span>
							</div>						
							<div class="promote-ad-coins-item text-end">
								<div class="coins-quantity-text fw-bold">({{$product->per_coin_rate}} {{optionByKey('coins_name')}})</div>
								<div class="fw-bold fs-6 coins-price-title">{{$currency_symbol}}  {{ number_format($coins_rate*$product->per_coin_rate,2,'.','') }}</div>
							</div>												
						</div>
						
						<div class="p-d-cl-n d-flex align-items-start justify-content-start">
							<p>{!! $product->description !!}</p>
						</div>
					</div>

					<div class="promote-ad-coins-bottom-info">
						<div class="pradday">{{$product->days_name}}</div>
							<div class="form-group p-d-cl-n">						   
								@foreach(getProductPlan($product->id) as $plan)
									<p class="night_time_slot" data-nightplanid="{{$plan->id}}"> <span class="watch-icon"></span>
									<strong>{{ $plan->plan_time }}</strong></p>
								@endforeach				
							</div>
							<div class="promote-ad-coins-toggle-wrapper">
												<!-- New Plan Section Start -->
												<div class="new-optionplan-box">
													
													{!! optionByKey('contantupgrades') !!}
													
												 <div class="upgradePanel p-2 mb-12 parrent-toggle">
														
														{!! optionByKey('contantallinone') !!}
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->allinone_coin_rate,2,'.','') }} ({{$product->allinone_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#allinoneBenefits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}</a>
														</div>
														
														<label for="terms_{{$randnum[0]}}" class="switch switch-left-right">  
															<input id="terms_{{$randnum[0]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}" data-price="{{number_format($allinoneprice,2,'.','')}}" data-coin="{{$product->allinone_coin_rate}}"  data-percoin="{{$product->per_coin_rate}}" class="switch-input onoff-switch-promote" type="checkbox" name="allinone">
															<span data-on="{!! optionByKey('yes_btn') !!}" data-off="{!! optionByKey('no_btn') !!}" class="switch-label"></span> 
															<span class="switch-handle"></span>
														</label>
													</div>
												
													<div class="upgradePanel p-2 mb-12 child-toggle">
														
														{!! optionByKey('contantexclusive') !!}
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->exc_coin_rate,2,'.','') }} ({{$product->exc_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#vipprimebenfits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}
															</a>
														</div>
														<label for="terms_{{$randnum[1]}}" class="switch switch-left-right">
															<input id="terms_{{$randnum[1]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}"data-price="{{number_format($excprice,2,'.','')}}"data-coin="{{$product->exc_coin_rate}}" data-percoin="{{$product->per_coin_rate}}" data-type="exclusive" class="switch-input onoff-switch-promote" type="checkbox" name="allpromotion">
															<span data-on="{!! optionByKey('yes_btn') !!}" data-off="{!! optionByKey('no_btn') !!}" class="switch-label"></span> 
															<span class="switch-handle"></span>
														</label>
													</div>
												
													<div class="upgradePanel p-2 mb-12 child-toggle">
														
														{!! optionByKey('contanthighlight') !!}
														
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->highlight_coin_rate,2,'.','') }} ({{$product->highlight_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#highlightBenefits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}
</a>
														</div>
														<label for="terms_{{$randnum[2]}}" class="switch switch-left-right">
															<input id="terms_{{$randnum[2]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}" data-price="{{number_format($highlightprice,2,'.','')}}" data-coin="{{$product->highlight_coin_rate}}"  data-percoin="{{$product->per_coin_rate}}" data-type="highlight" class="switch-input onoff-switch-promote" type="checkbox" name="allpromotion"> 
															<span data-on="{{optionByKey('yes_btn')}}" data-off="{{optionByKey('no_btn')}}" class="switch-label"></span> 
															<span class="switch-handle"></span>
														</label>
													</div>
												
													<div class="upgradePanel p-2  child-toggle">
														
														{!! optionByKey('contantnewlabel') !!}
														
														<div class="promote-ad-coin-detail-info fw-bold">
															+ {{$currency_symbol}} {{ number_format($coins_rate*$product->new_label_coin_rate,2,'.','') }} ({{$product->new_label_coin_rate}} {!! optionByKey('coins_name') !!})
														</div>
														<div class="show-example-link-box mb-0">
															<a class="show-example-link" href="#" data-bs-toggle="modal" data-bs-target="#labelnewBenefits"><i class="icon-eye me-2"></i> {!! optionByKey('show_example') !!}
															</a>
														</div>
														
													   <label for="terms_{{$randnum[3]}}" class="switch switch-left-right" >
															<input id="terms_{{$randnum[3]}}" data-pname="{{$val[0]}}X{{$val[1]}}" data-mainprice="{{number_format($price,2,'.','')}}" data-price="{{number_format($newlabelprice,2,'.','')}}" data-coin="{{$product->new_label_coin_rate}}" data-percoin="{{$product->per_coin_rate}}" class="switch-input onoff-switch-promote" data-type="newlabel" type="checkbox" name="allpromotion">  
															<span data-on="{{optionByKey('yes_btn')}}" data-off="{{optionByKey('no_btn')}}" class="switch-label"></span> 
															<span class="switch-handle"></span>
															
															
														</label>
														
													</div>
												
												
												</div>
												<!-- New Plan Section Start -->
											</div>
										
							</div>
						</label>
					</div>
				</div>
						
						
			@endforeach	
						
		</div>
						
						

					</div>
				</div>
			   
				<div class="col-md-12 mt-3">
					{!! optionByKey('comman_informations') !!}				
				</div>
				
			</div>
		</div>
		<div class="col-md-4">
			<div class="card total-price-box p-3 bg-light">

				<h5 class="card-title fs-6 fw-bold mb-4">{{ optionByKey('promotions') }}</h5>
			   
				<div class="pricing-features mb-4">
				   <div class="feature  fw-bold">
						<p id="add_data" class="add_data_slot">{{ optionByKey('no_promotion') }}</p>

						<div class="time_slot_error">{{ optionByKey('select_time_slot') }}</div>

						<p id="add_data_total" class="add_data_slot"></p>
					</div>                                       
				</div>
				
				<!-- Button -->				
				<button type="submit" name="buyandpublish" id="pro_button" class="btn btn-primary btn-block w-100">
					{!! optionByKey('post_ad_for_free') !!}
				</button>
			 </div>
		</div>
	</div>	
	{!! Html::form()->close() !!} 	
	
</div>
</div>
</div>


<!-- DiscoverVipBenefits Modal -->
<div class="modal fade" id="DiscoverVipBenefits" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="DiscoverVipBenefitsLabel" aria-hidden="true">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header justify-content-center">
				<h5 class="modal-title fs-4"> 
					<i class="icon-top-icon"></i>
				</h5>
				<button type="button" data-bs-dismiss="modal" aria-label="Fechar" class="position-absolute close close-btn-al">
					<span aria-hidden="true">×</span>
				</button>
			</div>
			{!! optionByKey('show_example_popup_vip') !!}
		</div>
	</div>
</div>
<!-- Modal -->    

<!-- allinoneBenefits Modal -->
<div class="modal fade" id="allinoneBenefits" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="allinoneBenefitsLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			{!! optionByKey('show_popup_allinone') !!}            
		</div>
	</div>
</div>
<!-- Modal -->

<!-- vipprimebenfits Modal -->
<div class="modal fade" id="vipprimebenfits" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="vipprimebenfitsLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">		
			{!! optionByKey('show_example_popup_exclusive') !!}              
		</div>
	</div>
</div>
<!-- Modal -->

<!-- highlightBenefits  Modal -->
<div class="modal fade" id="highlightBenefits" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="highlightBenefitsLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			{!! optionByKey('show_popup_highlight') !!}            
		</div>
	</div>
</div>
<!-- Modal -->

<!-- highlightBenefits  Modal -->
<div class="modal fade" id="labelnewBenefits" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="labelnewBenefitsLabel" aria-hidden="true">
	<div class="modal-dialog modal-lg">
		<div class="modal-content">
			{!! optionByKey('show_popup_labelnew') !!}
		</div>
	</div>
</div>
<!-- Modal -->


<div class="modal fade" id="cookieModal" tabindex="-1" aria-labelledby="cookieModalLabel" aria-hidden="true">
    <div class="modal-dialog">
		{!! optionByKey('show_popup_cookie_verifd') !!}
    </div>
</div>

@endsection


@push('css-styles')
<link rel="stylesheet" href="/static/css/dashboard.css?v={{time()}}">
<link rel="stylesheet" href="/static/css/select-plan-pg.css?v={{time()}}">
@endpush


@push('scripts')
<script>      

// Get all checkboxes    

document.addEventListener('DOMContentLoaded', function() {
$('.check-radio-btn').change(function () {
	var adBox = $(this).closest('.promote-your-ad-box');
	var select = adBox.find('select');
	if (this.checked) {
		select.prop('disabled', false);
	} else {
		select.prop('disabled', true);
	}
}); 

$('.promote-your-ad-box').click(function () {
	$('.promote-your-ad-box').not(this).each(function() {
		$(this).find('input[type="checkbox"]').prop('checked', false);
		$(this).find('select').prop('disabled', true);
	}); 			
});

const boxes = document.querySelectorAll('.promote-your-ad-box');
boxes.forEach(box => {
	const checkbox = box.querySelector('.check-radio-btn');
	checkbox.addEventListener('change', () => {
		if (checkbox.checked) {
			boxes.forEach(b => b.classList.remove('active'));
			box.classList.add('active');
			$("#pro_button").html("{!! optionByKey('buy_and_publish') !!}");
		} else {
			const anyChecked = Array.from(boxes).some(b => b.querySelector('.check-radio-btn').checked);
			if (!anyChecked) {
				box.classList.remove('active');
				$("#pro_button").html("{!! optionByKey('post_ad_for_free') !!}");
			}
		}
	});
});

// Select all dropdowns
const dropdowns = document.querySelectorAll('.time-slot-dropdown');
dropdowns.forEach(dropdown => {
	dropdown.addEventListener('change', () => {
		const wrapper = dropdown.closest('.promote-ad-coins-bottom-info').querySelector('.promote-ad-coins-toggle-wrapper');
		if (dropdown.value) {
			wrapper.classList.add('active');
		} else {
			wrapper.classList.remove('active');
		}
	});
});    


var isUpdating = false;
$(".parrent-toggle .switch-input").change(function() {
	if (isUpdating) return; 
	var isChecked = $(this).prop('checked');
	var $box = $(this).closest('.promote-your-ad-box');                
	isUpdating = true;
	$box.find('.child-toggle .switch-input').each(function() {
		$(this).prop('checked', isChecked).change(); 
	});
	isUpdating = false;
	$(this).closest('.upgradePanel').toggleClass("border-active", isChecked);
	$(this).closest('.promote-your-ad-box').find('.child-toggle .switch-input').each(function() {
		$(this).closest('.upgradePanel').toggleClass("border-active", isChecked);                    
	});
});

$(".child-toggle .switch-input").change(function() {
	if (isUpdating) return; 

	var $this = $(this);
	var $box = $this.closest('.promote-your-ad-box');
	var allChildChecked = $box.find(".child-toggle .switch-input").length === $box.find(".child-toggle .switch-input:checked").length;

	isUpdating = true;
	$box.find(".parrent-toggle .switch-input").prop('checked', allChildChecked).change();  
	isUpdating = false;
	$this.closest('.upgradePanel').toggleClass("border-active", $this.prop('checked'));
});

function checkAllChildrenActive(box) {
	return box.find(".child-toggle .switch-input").length === box.find(".child-toggle .switch-input:checked").length;
}

function resetSiblingSwitches(parentID) {
	$(".promote-your-ad-box").not("#" + parentID).find('.switch-input').each(function() {
		$(this).prop('checked', false).change();
	});
}

$(".promote-your-ad-box").click(function() {
	var parentID = $(this).attr('id');
	resetSiblingSwitches(parentID);
});           

$(".promote-your-ad-box").click(function () {
	var isChecked = $(this).find(".check-radio-btn").is(":checked");
	if (isChecked) {
		$(this).find(".custom-select").removeAttr("disabled");
		$(".pricing-features").css("display", "block");
		$(".time_slot_error").css("display", "block");
	} else {
		$(".promote-your-ad-box .custom-select").prop("disabled", true);
		$(this).find(".custom-select").prop("disabled", true);
		$(".promote-your-ad-box .custom-select").val("");
		$(".promote-ad-coins-toggle-wrapper").removeClass("active");
		$(".pricing-features").css("display", "none");
	}
});

$(".custom-select").on('change',function(){
	var value = $(this).val();
	if(value > 0){	
		$('.time_slot_error').addClass('none');	
		$('.time_slot_error').css('display', 'none');
		$(this).parents('.promote-your-ad-box').addClass('promote-select-time-slot');
		$('.common-btn-red').removeAttr("disabled");
		$('input[name=time_data_id]').val(value);
	}else{
		$('.time_slot_error').removeClass('none');
		$(this).parents('.promote-your-ad-box').removeClass('promote-select-time-slot');
		$('input[name=time_data_id]').val(0);
	} 
});			

$('.custom-select').on('change', function() {
	if(this.value === ''){
		$('.time_slot_error').removeClass('none');
	}
});

$('.onoff-switch-promote').change(function() {
		var totalcoin = 0;
		var totalprice = 0;		
		var typeArray = [];
		
		var mainPrice = parseFloat($(this).data('mainprice'));
		
		$('input[name="allpromotion"]:checked').each(function() {
			totalcoin += parseFloat($(this).attr('data-coin'));
		});
		
		$('input[name="allpromotion"]:checked').each(function() {
			totalprice += parseFloat($(this).attr('data-price'));
		});
		
		$('input[name="allpromotion"]:checked').each(function() {
			typeArray.push($(this).attr('data-type'));
		});
		
		$('input[name=permotiontype]').val(typeArray);
						
		$("#add_data").html("Top Promotion <span>" + $(this).data("pname") + "</span> (" + parseFloat(totalcoin + $(this).data("percoin")) + " {{optionByKey('coins_name')}} )");
		
		var total = mainPrice + totalprice;	

		$("#add_data_total").html('<span class="ttllbel">Total:</span> <span class="pricevalue">{{$currency_symbol}} ' + parseFloat(total).toFixed(2) + "</span>");	
});
			

$('.promote-your-ad-box').click(function(){
	$('#add_data').html('Top <span>'+$(this).data('pname')+'</span> ('+$(this).data('coin')+' {{optionByKey('coins_name')}})');			
	$('#add_data_total').html('<span class="ttllbel">Total:</span> <span class="pricevalue">{{$currency_symbol}} '+$(this).data('price')+'</span>');			 
	$('input[name=product_id]').val($(this).data('product_id'));
	var isChecked = $("input.check-radio-btn").is(":checked");
	if (isChecked) {
		var profile_promote_url = '{{url($profile_promote_url)}}';
        $('form').attr('action', profile_promote_url);
	}else{
		var profile_publish_url = '{{url($profile_publish_url)}}';  
        $('form').attr('action', profile_publish_url);
	}
});

});


document.addEventListener('DOMContentLoaded', function() {
    function handleCheckboxChange() {
        const boxes = document.querySelectorAll('.promote-your-ad-box');
        
        boxes.forEach(box => {
            const checkbox = box.querySelector('.check-radio-btn');
            const toggleWrapper = box.querySelector('.promote-ad-coins-toggle-wrapper');
            const select = box.querySelector('.time-slot-dropdown');

            if (checkbox.checked) {
                toggleWrapper.classList.add('active');			
                if (box.classList.contains('nightplan')) {
                    toggleWrapper.classList.add('active');
                } else {
                    if (select.value) {
                        toggleWrapper.classList.add('active');
                    } else {
                        toggleWrapper.classList.remove('active');
                    }
                }
            } else {
                toggleWrapper.classList.remove('active');
            }
        });
    }
   

    // Attach event listeners
    const checkboxes = document.querySelectorAll('.check-radio-btn');
    checkboxes.forEach(checkbox => {
        checkbox.addEventListener('change', handleCheckboxChange);
    });
	
	$(".nightplan").click(function () {
		var timeslotnitval = $(this).find('.night_time_slot').data('nightplanid');
		$('input[name=time_data_id]').val(timeslotnitval);
			var isChecked = $(this).find(".check-radio-btn").is(":checked");
			if (isChecked) {						
				$('.time_slot_error').css('display','none');
				$('.common-btn-red').removeAttr("disabled")
			} else {
				$(".promote-night-select .promote-ad-coins-toggle-wrapper").css('display','none');
				$('input[name=time_data_id]').val(0);
			}
	});
    
});

	
window.onload = () => {
   $("#similartextAd").modal("show");
}



document.addEventListener('DOMContentLoaded', function () {
      const cookieModal = new bootstrap.Modal(document.getElementById('cookieModal'));
      const acceptBtn = document.getElementById('acceptCookies');
      // Check if cookie consent is already given
      const cookieConsent = localStorage.getItem('cookie_consent');
      if (!cookieConsent) {
        cookieModal.show(); // Show the modal if no consent is found
      }

      // Handle "Accept" button
      acceptBtn.addEventListener('click', () => {
        localStorage.setItem('cookie_consent', 'true');
        cookieModal.hide();
      });


    });
</script>

@endpush