@extends('home.layouts.index')

@section('title')
دریافت اعتبار
@endsection

@section('script')
    <script>
    $('.close').click(function(){
        $('.modal').modal('hide');
    });
    $(document).ready(function(){
        
        
        updateInstallment();
    })
    function formatNumber(num) {

    // Convert the number to string and use regex to format

    return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");

}

    const interestRateInput = document.getElementById("interest-rate");
    const serviceFeeInput = document.getElementById("service-fee");
        const totalRepaymentDisplay = document.getElementById("total-repayment");

        $('.mobile-menu-toggle').click(function () {
            $('.loaded').addClass('mmenu-active');
        })
        $('.mobile-menu-close').click(function () {
            $('.loaded').removeClass('mmenu-active');
        })
        $('div#categories > ul.mobile-menu > li > a').append('<span class="toggle-btn"> </span>');
        $('div#categories > ul.mobile-menu > li > a').append('<span class="toggle-btn"> </span>');
        $('div#categories > ul.mobile-menu > li > a > span.toggle-btn').click(function (e) {

            e.preventDefault();
            $(this).parent().next().slideToggle(300).parent().toggleClass("show");
        })

        function SubmitForm(id) {
            $('#payment-form-' + id).submit();
        }

        $('#mobile_menu_nav').click(function () {
            $('#icon-panel').toggleClass('negative');
            $('#icon-panel').toggleClass('positive');
            $('.negative').html('-');
            $('.positive').html('+');
        })
            const monthOptions = document.querySelectorAll('.month-option');

   monthOptions.forEach(option => {
        option.addEventListener('click', () => {
            monthOptions.forEach(opt => opt.classList.remove('active'));
            option.classList.add('active');
            updateInstallment();
        });
    });
// const priceSlider = document.getElementById("price-slider");
let priceDisplay = document.getElementById("price-display");

const text = priceDisplay.textContent;




// استفاده از یک regex برای استخراج فقط عدد

const numberMatch = text.match(/(\d[\d,]*)/); // عدد و کاما را پیدا می‌کند


if (numberMatch) {

    // حذف کاما از عدد پیدا شده

     priceDisplay = numberMatch[0].replace(/,/g, '');


} else {

    console.log("عدد پیدا نشد.");

}


const installmentDisplay = document.getElementById("installment-display");
const sliderContainer = document.querySelector(".price-slider-container");


// priceSlider.addEventListener("input", () => {
//         const value = priceSlider.value;
//     const min = priceSlider.min ? priceSlider.min : 0;
//     const max = priceSlider.max ? priceSlider.max : 100;
//     const percentage = (value - min) / (max - min) * 100;   
//     priceSlider.style.background = `linear-gradient(to left, #007bff ${percentage}%, #e0e0e0 ${percentage}%)`;
//     priceDisplay.textContent = formatNumber(priceSlider.value.toLocaleString('en-US'))  + ' ' + 'میلیون';
    
//     updateInstallment(); 


// });






// const decreaseButton = document.getElementById("decreaseButton");
// const increaseButton = document.getElementById("increaseButton");


// decreaseButton.addEventListener("click", () => {
//     let currentValue = parseInt(priceSlider.value);
//     if (currentValue > priceSlider.min) {
//         priceSlider.value = currentValue - 500000; // مقدار 1000 کاهش می‌یابد
//         priceSlider.dispatchEvent(new Event('input')); // برای به‌روزرسانی محتوای نمایش قیمت
//     }
    
//     updateInstallment(); 
// });

// increaseButton.addEventListener("click", () => {
//     let currentValue = parseInt(priceSlider.value);
//     if (currentValue < priceSlider.max) {
//         priceSlider.value = currentValue + 500000; // مقدار 1000 افزایش می‌یابد
//         priceSlider.dispatchEvent(new Event('input')); // برای به‌روزرسانی محتوای نمایش قیمت
//     }
    
    
//     updateInstallment(); 
// });

function updateInstallment() {

    
        const selectedMonths = parseInt(document.querySelector('.month-option.active').dataset.months);
        // const totalAmount = parseInt(priceDisplay.value);
        console.log(selectedMonths);
                const totalAmount = parseInt(priceDisplay);
                let interestRate;
if(selectedMonths == 12){
             interestRate = parseFloat(interestRateInput.textContent) / 100; // تبدیل به درصد

    
}else{
             interestRate = (parseFloat(interestRateInput.textContent) *2) / 100; // تبدیل به درصد

}
     

        // محاسبه سود ماهانه
        const totalAmountWithFee = totalAmount ;
        const totalInterest = totalAmountWithFee * interestRate;
        const totalAmountWithInterest = totalAmountWithFee + totalInterest;
        const totalRepayment =  totalAmountWithFee + totalInterest; // مجموع بازپرداخت

        const installmentAmount = Math.ceil(totalAmountWithInterest / selectedMonths);
        document.getElementById("installmentAmount").textContent = formatNumber(installmentAmount);
         totalRepaymentDisplay.textContent = formatNumber(totalRepayment.toFixed(0).toLocaleString('en-US')); // نمایش بدون اعشار
}

  interestRateInput.addEventListener("input", updateInstallment);
  
  
  $('.increase-credit').click(function () {
    $('#creditModal').modal('show'); // نمایش مدال
});

        const tabs = document.querySelectorAll('.tab');

        tabs.forEach(tab => {

            tab.addEventListener('click', () => {

                tabs.forEach(t => t.classList.remove('active'));

                tab.classList.add('active');
                $('.tab-content-installment').removeClass('show');

                $(tab.dataset.tab).addClass('show');


            });

        });
        
          $('#hasCheckbook, #agreesToTerms').change(function() {
    if ($('#hasCheckbook').is(':checked') && $('#agreesToTerms').is(':checked')) {
      $('#confirmButton').prop('disabled', false);
    } else {
      $('#confirmButton').prop('disabled', true);
    }
  });
  
    function updateModalInfo() {
    $('#monthlyInstallment').text($('#installmentAmount').text());
    $('#selectedMonths').text($('.month-option.active').data('months'));
  }

  // به‌روزرسانی اطلاعات مودال قبل از نمایش
  $('#creditModal').on('show.bs.modal', function (e) {
    updateModalInfo();
  });
  
  function showCondition(tag,id)
  {
      console.log(tag,id);
      $('.userType-condition').removeClass('white');
      $(tag).addClass('white');
      $('.conditions').removeClass('active');
      $('#condition-'+id).addClass('active');
  }
  
  $('#confirmButton').click(function(){
      let month =parseInt(document.querySelector('.month-option.active').dataset.months);
      let amount = {{summery_cart()['payment']}};
      $.ajax({
    url: "{{route('home.installment.requests.store')}}", // Replace with your URL
    type: 'post', // or 'POST' for sending data
    dataType: 'json', // Expected data type from the server
    data:{
        '_token':"{{csrf_token()}}",
        month:month,
        amount:amount
    },
    success: function(data) {
        if(data[0]){
            swal({
                icon:"success",
                message:"درخواست شما با موفقیت ثبت شد"
            });
            window.location.href=data[1]
        }
      
    },
    error: function(xhr, status, error) {
        console.error('Error:', error);
        // Handle errors here
    }
});

  });
  
    </script>
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('home/css/profile_panel.css') }}">

    <style>
    .modal{
        z-index:999999999;
    }
    .modal-backdrop{
        z-index:99999999 !important;
    }
    .interest-rate{
        background: #ecf0ff;
    color: #364fd9;
    padding: 10px 22px;
    border-radius: 25px;
    font-size: 16px;
    }
    .price-display {
    margin-top: 10px;
    font-size: 20px;
    display: flex;
    justify-content: space-between; /* قرار دادن در دو طرف */
}
    #range-slider .range-slider__thumb[data-lower] {
    width: 0;
}
        
        .additional-fees {
            margin: 20px 0;
        }

        .additional-fees input {
            width: 100%;
            padding: 10px;
            margin-top: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }
#range-slider .range-slider__range {
    border-radius: 6px;
}
    
        .select-months {
            display: flex;
            justify-content: center;
            margin: 10px 0;
        }
        .month-option {
padding: 5px 100px;
    border: 2px solid #007bff;
    border-radius: 25px;
    margin-left: 5px;
    color: #007bff;
    cursor: pointer;
            transition: border-color 0.3s, background-color 0.3s;
        }
        .month-option.active {
            border-color: #007bff;
            background-color: #007bff;
            color: #fff;
        }
        .slider {
            margin: 20px 0;
        }
        .output {
            text-align: center;
            font-size: 20px;
            margin-top: 10px;
        }
        .header-transparent{
            position: static !important;
            background-color: #222;
        }
        .cursor-pointer {
            cursor: pointer;
        }
        
            .slider {
        margin: 20px 0;
    }


        td {
            font-size: 10pt;
            padding: 0;
            vertical-align: middle;
        }

        th {
            text-align: center;
        }

        .arrow-icons {
            width: 100%;
            display: flex;
            justify-content: space-between;
        }

        @media (min-width: 576px) {
            .modal-dialog {
                max-width: 1000px !important;
                margin: 1.75rem auto;
            }

            .arrow-icons {
                display: none;
            }
        }


        .table-row:nth-child(even) {
            background-color: #f2f2f2 !important;
        }
        
.price-slider-container {
    width: 100%;
    text-align: center;
    margin: 20px 0;
}

.range-slider {
    -webkit-appearance: none;
    width: 100%;
    height: 8px;
    background: #e0e0e0; /* حالت اولیه */
    border-radius: 5px;
    outline: none;
    margin: 0 10px;
    transition: background 0.3s; /* انتقال نرم */
}

.range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border:4px solid #007bff;
    background: #fff;
    cursor: pointer;
}

.range-slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #007bff;
    cursor: pointer;
}

.price-display {
    margin-top: 10px;
    font-size: 20px;
}
.select-months p{
    margin:0; 
    margin-left:auto;
    font-size:16px;
    font-weight:700;
}

.output button {
background-color: #fff;
    color: #007bff;
    border: none;
    padding: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.output button i {
    margin: 0; /* فاصله دور آیکون را تنظیم کنید */
}

.output{
    display:flex;
    justify-content:center;
    
        box-shadow: -1px 2px 20px 5px #f8f8f8;

    overflow: hidden;
}

.installment-container {
    
    margin-top: 20px;
    padding: 15px;
    background-color: #f9f9f9;
    border-radius: 10px;
    text-align: center;
    border: 1px solid #c3c3c3;
    /* box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); */
}
.myaccount-content h3{
        /* border-bottom: 1px dashed #eeeeee; */
    margin-bottom: 25px;
    font-size: 21px !important;
    /* border-radius: 8px; */
    text-align: center;
    /* background-color: #121212; */
    margin-bottom: 30px !important;
    text-align: right;
    color: #000;
    border-bottom: 1px solid #363636;
    padding: 18px;
    background-color:unset !important;
    border:unset !important;
    border-radius:unset !important;
    text-align:center !important;
    padding: unset !important;
}

.installment-container h3 {
    margin: 0;
    font-size: 17px !important;
}

.installment-container button {
    margin-top: 10px;
    background-color: #007bff;
    color: white;
    font-family: 'Pelak';
    border: none;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
    transition: background 0.3s;
}

.installment-container button:hover {
    background-color: #0056b3;
}
.output{
    background:#fff;
}
#decreaseButton,#increaseButton{
    margin:0;
}

.flex-row-reverse{
    flex-direction:row-reverse;
}
.installment-container p{
    margin:0 !important;
}

.box-details{
    border-bottom: 1px solid #c3c3c3;
    padding-bottom: 20px;
}
.select-months p{
    margin:0; 
    margin-left:auto !important;
    font-size:16px;
    font-weight:700;
}
#installmentAmount{
    font-size:20px;
}

.total-repayment-box{
    font-size:22px;
        margin-bottom: 14px;
        color:#007bff;
}

#increase-credit{
    
    font-size:22px;
    padding:10px 20px;
    border-radius:5px;
    font-weight:bold;
}

@media (max-width:768px){
            .month-option {
padding: 5px 8px;
}
.select-months,.price-slider-container {
    margin-top:50px !important;
}
}

.tabs {

            display: flex;
            width:fit-content;

            justify-content: center;

            margin: 20px 0;
            
            border-radius:28px;
            padding:4px;
            background:#e5e5e5;

        }

        .tab {



            

            border-radius: 28px;

            padding: 12px 40px;

            margin: 0 5px;

            cursor: pointer;

            transition: background 0.3s;

        }

        .tab:hover {

            background-color: #fff; /* رنگ دکمه موقع هاور */
            

        }

        .tab.active {

            background-color: #fff; /* دکمه فعال */

            font-weight: bold;
            border:1px solid;
            box-shadow:0 -2px 12px rgba(40,41,61,.04),0 2px 4px rgba(96,97,112,.16);
            border-color:#fff;

        }
        
        .plan-card-info{
            border:1px solid #cfd6ff;
            background-color:#fff;
            padding:12px;
            border-radius:16px;
        }
        .plan-card-info h4{
            color:#001179;
            font-size:18px;
        }
        .plan-card-info .body-text{
            color:#001179;
        }
        
        
        .row.no-gutters {
  margin: 0;
}
.row.no-gutters > .col, .row.no-gutters > [class*="col-"] {
  padding: 0;
}
.col-auto {
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}

.tab-content-installment{
    display:none !important;
}
.tab-content-installment.show{
    display:block !important;
}

.border-divider-plan {
  border-left: 1px solid #e5e5e5;
}
.text-neutral-500 {
  color: #737373 !important;
  font-size:12px;
}

.lg-label, .parent-category-item {
  font-size: 14px;
  font-weight: 500;
}
.text-neutral-800 {
  color: #262626 !important;
}
.employee-type-buttons {
  background: #ecf0ff;
}
.radius-20 {
  border-radius: 20px !important;
}
.employee-type-buttons .white{
    background-color: #fff !important;
  border-color: #fff !important;
}
.flex-grow-1 {
  flex-grow: 1 !important;
}
.text-primary-400 {
  color: #364fd9 !important;
}
.employee-type-buttons button {
  outline: none;
  font-weight: 500;
  font-size: 11px;
  transition: all .5s;
  height: 28px !important;
}
.position-request.show{
    display:flex !important;
}
.shadow-dark{
                box-shadow:0 -2px 12px rgba(40,41,61,.04),0 2px 4px rgba(96,97,112,.16);

}
.p-20{
    padding:20px;
}
.employee-type-buttons button{
    color:#525252;
    background-color:transparent;
    border-style:none;
      font-family:'Pelak';
    
}
.employee-type-buttons{
    padding:5px;
  
}
.btn-submit{
    background:#007bff;
    color:#fff;
    
}
.custom-checkbox {
  display: block;
  position: relative;
  padding-right: 35px;
  margin-bottom: 12px;
  cursor: pointer;
  font-size: 16px;
  user-select: none;
}

.custom-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkmark {
  position: absolute;
  top: 0;
  right: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 4px;
}

.custom-checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}

.custom-checkbox input:checked ~ .checkmark {
  background-color: #2196F3;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.custom-checkbox input:checked ~ .checkmark:after {
  display: block;
}

.custom-checkbox .checkmark:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}
.modal .custom-checkbox{
    opacity:1 !important;
}
.modal .bg-light{
    background-color:#f5f5f5;
    padding:15px;
    border-radius:8px;
}
.modal .bg-light h6{
color:#007bff;
}
.modal .bg-light p,.modal .bg-light li{
color:#262626;
}
.btn-submit:disabled{
    color:#fff;
    filter:grayscale(100) !important;
}

.btn-secondary{
    color:#007bff !important;
    background:#fff !important;
    border:2px solid #007bff;
}
.btn-secondary:hover{
    background:#007bff !important;
    color:#fff !important;
    border-color:#007bff;
    
}
.modal-title{
    color:#007bff;
}

.conditions{
    display:none;
} 
.conditions.active{
    display:block !important;
}
    </style>
@endsection

@section('content')
<!-- Modal -->
<div class="modal fade" id="creditModal" tabindex="-1" aria-labelledby="creditModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title text-center w-100">راهنمای درخواست اعتبار</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p> {{$setting->text_help_installment}} </p>
        
        <div class="bg-light p-3 mb-3">
          <h6 class="font-weight-bold">شیوه پرداخت</h6>
          <p>مبلغ قسط ماهانه: <span id="monthlyInstallment">1,000,000</span> تومان</p>
          <p>تعداد ماه انتخاب شده: <span id="selectedMonths">12</span> ماه</p>
        </div>
        
        <div class="bg-light p-3 mb-3">
          <h6 class="font-weight-bold">مدارک مورد نیاز</h6>
          <ul>
            <li>کپی شناسنامه</li>
            <li>کپی کارت ملی</li>
            <li>فیش حقوقی</li>
            <li>گواهی اشتغال به کار</li>
          </ul>
        </div>
        
        <div class="form-check mb-2">
        <label class="custom-checkbox">
          دارای دسته چک به نام خود هستم
          <input for="hasCheckbook" type="checkbox" id="hasCheckbook">
          <span class="checkmark"></span>
        </label>
        

        </div>
        
        <div class="form-check mb-3">

        
        <label for="agreesToTerms" class="custom-checkbox">
          مفاهیم را خوانده و قوانین را پذیرفته‌ام
          <input type="checkbox" id="agreesToTerms">
          <span class="checkmark"></span>
        </label>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">انصراف</button>
        <button type="button" class="btn btn-primary btn-submit" id="confirmButton" disabled>تایید و ادامه</button>
      </div>
    </div>
  </div>
</div>

    <div class="my-account-wrapper main">
        <div class="container card">
            <div class="row card-body">
                <div class="col-lg-3 col-md-4">
                    @include('home.sections.profile_sidebar')
                </div>
                <div class="col-lg-9 col-md-8">
                    <div class="tab-content" id="myaccountContent">
                        <div class="myaccount-content">
<div class="container">
<div class="row">
<div class="col-12 installment-container col-md-12">
  <h3>محاسبه گر اقساط</h3>

    <div class="slider mb-md-0 mb-5">
            <div class="output">
                <p style="margin-left:20px !important">مبلغ سبد خرید:</p>
    <!--<button id="decreaseButton"><i class="fas fa-minus"></i></button>-->
         <span id="price-display">{{number_format(summery_cart()['payment'])}} میلیون</span> 
 <!--<button id="increaseButton"><i class="fas fa-plus"></i></button>-->
     
    </div>
<!--<div class="price-slider-container">-->
     
<!--    <input type="range" id="price-slider" class="range-slider" min="{{$setting->min_price_installment}}" max="{{$setting->max_price_installment}}" value="{{$setting->min_price_installment}}" step="500000">-->
    
<!--    <div class="price-display">-->
<!--        <span id="min-price-display">{{number_format($setting->min_price_installment)}}  میلیون</span> <span id="max-price-display">{{number_format($setting->max_price_installment)}} -->
<!--        میلیون</span>-->
<!--    </div>-->
<!--</div>-->
    </div>
        <div class="select-months mt-md-5 mt-5">
        <p>مدت زمان پرداخت:</p>
        @foreach($months as $key => $month)
         <div class="month-option {{$key == 0 ? 'active' : ''}}" data-months="{{$month->mounth}}">{{$month->mounth}} ماه</div>
        @endforeach
       
    </div>

</div>
<div class="col-12 text-center d-flex justify-content-center">
        <div class="tabs">

        <div data-tab=".info-request" class="tab active">جزئیات اقساط</div>

        <div data-tab=".position-request" class="tab">شرایط مورد نیاز</div>

    </div>
</div>
<div class="col-12 shadow-dark radius-20 p-20 row aling-center tab-content-installment position-request">
    
    <div class="border-divider-plan flex-grow-1 col-md-3 col-12">
        <p class="mb-2 text-neutral-500 md-label">
            شرایط طرح
        </p>
        <div class="lg-label text-neutral-800 mt-2">
            <i class="icon icon-tick-circle text-primary-300 fs-17 align-middle"></i>
            پرداخت به موقع اقساط
                </div>
        
                
    </div>
    
    
      <div class="border-divider-plan flex-grow-1 col-md-4 col-12">
        <p class="mb-2 text-neutral-500 md-label">
            شرایط طرح
        </p>
        <div class="radius-20 my-2 pa-1 employee-type-buttons d-flex flex-row justify-space-between">
            @foreach($userType as $key =>$type)
            <button onclick="showCondition(this,{{$type->id}})" class="flex-grow-1 userType-condition radius-20 text-primary-400 {{$key == 0 ? 'white' : ''}}">
                {{$type->user_type}}
                  </button>
                  @endforeach
 
        </div>
        @foreach($userType as $key =>$type)
        <div class="conditions active" id="condition-{{$type->id}}">
            @foreach($type->conditions as $condition)
                    <div class="lg-label text-neutral-800 mt-2">
            <i class="fas fa-circle text-primary-400 fs-17 align-middle"></i>
            {{$condition->condition_installment}}
                </div>
                @endforeach
                
        </div>
        @endforeach

                
    </div>
    
    <div class="d-flex align-items-center justify-content-center col-md-3 col-12 col-md-5 ">
            
    
    
        <div class="d-flex w-100 flex-column justify-content-center align-items-center ">
       <div class="w-100">
           <button id="increase-credit" class="w-100 increase-credit btn btn-submit btn-primary">درخواست اعتبار</button>
       </div>
  

    </div>
    </div>
    
</div>

<div class="col-12 tab-content-installment show info-request col-md-6">
    {{$setting->text_help_installment}}
</div>
<div class="col-12 tab-content-installment show info-request col-md-6 d-flex flex-column installment-container">
    <h3 class="mb-3">جزئیات اقساط</h3>
    <div class="d-flex flex-row justify-content-between align-items-center mb-6 mb-md-5 ">
        <div class="d-flex align-items-center flex-row-reverse">
       
            <img width="100" style="height:15px !important" src="{{ asset('home/images/dark_maxen.png') }}">
        </div>
        <div class="interest-rate">
            <span id="interest-rate"> 
            {{$setting->profit_percent_installment}}
            
         
            </span>
           درصد
        </div>
    </div>
    <div class="d-flex flex-row justify-content-between align-items-center mb-6 mb-md-5 box-details">
        <span>مبلغ قسط ماهانه</span>
        <div class="text-dark">
        <span id="installmentAmount">0</span> تومان
        </div>
    </div>
    <div class="d-flex flex-column justify-content-center align-items-center mb-6 mb-md-5">
                <div class="text-dark total-repayment-box">
    <span class="total-repayment" id="total-repayment">0</span> تومان
    </div>
        <span> مجموع بازپرداخت </span>

    </div>
    
    
        <div class="d-flex flex-column justify-content-center align-items-center ">
       <div class="w-100">
           <button id="increase-credit" class="w-100 increase-credit btn btn-primary">درخواست اعتبار</button>
       </div>
  

    </div>


</div>

</div>

<div class="row justify-space-between mt-5">
      <div class="col-12 col-md-6">
          <div class="plan-info pa-3 plan-card-info white rounded-16 row no-gutters">
            <div class="col ml-3 col-auto">
                <img src="{{asset('home/images/etebar.png')}}">
            </div>
            <div class="col-9">
                <h4>
                    دریافت اعتبار
                </h4>
                <div class="body-text">
                                        برای دریافت راهنمایی روی این دکمه کلیک کنید

                </div>
            </div>
        </div>
    </div>
    <div class="col-12 col-md-6">
        <div class="plan-info pa-3 plan-card-info white rounded-16 row no-gutters">
            <div class="col ml-3 col-auto">
                <img src="{{asset('home/images/chek.png')}}">
            </div>
            <div class="col-9 ">
                <h4>
                    راهنمای دریافت دسته چک
                </h4>
                <div class="body-text">
                    
                    برای دریافت راهنمایی روی این دکمه کلیک کنید
                </div>
            </div>
        </div>
    </div>
</div>



</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection