@if(!empty($action))
    @if($action == "navigate_stage")
        @php 
            $active_stage = (!empty($active_stage))?@$active_stage:1;
            $active_step = (!empty($active_step))?@$active_step:1;
            $active_step_key = (!empty($active_step_key))?@$active_step_key:1;
            
            $step_list = @$step_list;
            $app_status_stages = @$app_status_stages;
            $sidebar_title = @$app_status_stages[$active_stage]['sidebar_title'];
            $tab_id = "stage_content";
            $registration_fee = @$registration_fee;
            $invoice_sent_to = @$invoice_sent_to;
            
            if(config("common.portal") == "ODC"){
                $company_name = config("common.portal");
            }elseif(config("common.portal") == "ITN"){
                $company_name = config("common.portal");
            }else{
                $company_name = config("app.name");
            }
            
        @endphp 
            <div class="col-lg-8" id="{{ $tab_id }}">
                <div class="content-card timeline_stp_desc">{!! $active_step_content !!}</div>
            </div> 
            <div class="col-lg-4">
                <div class="content-card steps-card">
                    <h3>Steps</h3>
                    @foreach($step_list as $step)
                     @php
                        $statusClass = match($step->user_step_status) {
                            2 => 'completed',
                            1 => 'pending',
                            0 => 'disable',
                        };
                    @endphp
                    <div class="step" data-index="0"  @if($step->user_step_status != 0) onclick="loadStepContent('{{ $step->as_order_key }}')" @endif onclick="loadStepContent('{{ $step->as_order_key }}')">
                        <div class="icon {{ $statusClass }}">
                            <i class="fa {{ $step->as_icon }}"></i>
                        </div>
                        <div class="icon_title {{ $step->user_step_status == 0 ? 'disabled' : '' }}" >{{ $step->as_title }}</div>
                    </div>
    <!--                    <div class="panel panel-default timeline_panel" id="stp_{{ $step->as_order_key }}">
                            <div class="panel-heading b-bottom-0">  
                                <div class="form-group">
                                    <div class="row timeline-step-inner">
                                        @php
                                            if($step->as_order_key == "1_registration_fee"){
                                                if($step->user_step_status == 2){
                                                    $regi_step_desc = $step->as_desc_after;
                                                } elseif($step->user_step_status == 1){
                                                    $regi_step_desc = $step->as_desc_current;
                                                } else{
                                                    $regi_step_desc = $step->as_desc_before;
                                                }
                                                if($invoice_sent_to == 1) {
                                                    $regi_step_desc = $registration_fee. ' '. $regi_step_desc;
                                                } else {
                                                    $regi_step_desc = ltrim($regi_step_desc, 'USD/EUR');
                                                }
                                            }
                                        @endphp
                                        @if($step->user_step_status == 2)
                                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 step_circle" onclick="loadStepContent('{{ $step->as_order_key }}');">
                                                @if($active_stage!=4)<div class="step_no text-white bg-success">{{ $loop->iteration }}</div>@endif
                                                <div class="pie_progress step_pie_progress" role="progressbar" data-goal="100%" data-barcolor="#7ace4c" data-barsize="3" aria-valuemin="-100" aria-valuemax="100" rel="tooltip" title="{{ $step->as_title }}">
                                                    <div class="pie_progress__content text-success">
                                                        <i class="fa fa-check"></i>
                                                    </div>
                                                </div>
                                                @if($step->step_alert == 1)
                                                    <i class="mdi mdi-alert-outline step-alert"></i>
                                                @endif
                                            </div>
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 text-left step_title">
                                                <h4><a class="text-success cpointer" onclick="loadStepContent('{{ $step->as_order_key }}');">{{ $step->as_title }}</a></h4>
                                                <div class="panel-wrapper collapse"> 
                                                    @if($step->as_order_key == "1_registration_fee")
                                                        <small> {!! $regi_step_desc !!}</small>
                                                    @elseif($step->as_order_key == "1_j1_interview")
                                                        <small> {!! str_replace('%branding%', $company_name, $step->as_desc_after) !!}</small>
                                                    @else
                                                        <small>{!! $step->as_desc_after !!}</small> 
                                                    @endif
                                                </div>
                                            </div>
                                            <div class="step_accordion">
                                                <a data-perform="panel-collapse" class="stp_collapse m-t-5 cpointer">
                                                    <i class="text-success fa fa-chevron-down"></i>
                                                </a> 
                                            </div>
                                        @elseif($step->user_step_status == 1)
                                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 step_circle" onclick="loadStepContent('{{ $step->as_order_key }}');">
                                                @if($active_stage!=4)<div class="step_no text-white @if(config('common.portal') == 'ODC') bg-info-odc @else bg-info @endif">{{ $loop->iteration }}</div>@endif
                                                <div class="pie_progress" role="progressbar" data-goal="0%" data-barcolor="#41b3f9" data-barsize="3" aria-valuemin="-100" aria-valuemax="100" rel="tooltip" title="{{ $step->as_title }}">
                                                    <div class="pie_progress__content @if(config('common.portal') == 'ODC') text-info-odc @else text-info @endif">
                                                        <i class="fa {{ $step->as_icon }}"></i>
                                                    </div>
                                                </div>
                                                @if($step->step_alert == 1)
                                                    <i class="mdi mdi-alert-outline step-alert"></i>
                                                @endif
                                            </div>
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 text-left step_title">
                                                <h4><a class="text-info cpointer" onclick="loadStepContent('{{ $step->as_order_key }}','{{ $active_stage }}');" >{{ $step->as_title }}</a></h4>
                                                <div class="panel-wrapper collapse"> 
                                                    @if($step->as_order_key == "1_registration_fee")
                                                        <small> {!! $regi_step_desc !!}</small> 
                                                    @elseif($step->as_order_key == "1_resume_approval")
                                                        <small> {!! str_replace('%branding%', $company_name, $step->as_desc_current) !!}</small>
                                                    @elseif($step->as_order_key == "1_j1_interview")
                                                        <small> {!! str_replace('%branding%', $company_name, $step->as_desc_current) !!}</small>
                                                    @else
                                                        <small>{!! $step->as_desc_current !!}</small> 
                                                    @endif
                                                </div>
                                            </div>
                                            <div class="step_accordion">
                                                <a data-perform="panel-collapse" class="stp_collapse m-t-5 cpointer">
                                                    <i class="text-info fa fa-chevron-down"></i>
                                                </a> 
                                            </div>
                                        @else

                                            <div class="icon done">
                            <i class="fa {{ $step->as_icon }}"></i>
                        </div>
                        <div>{{ $step->as_title }}</div>
                                            <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 step_circle">
                                                @if($active_stage!=4)<div class="step_no text-white bg-muted">{{ $loop->iteration }}</div>@endif
                                                <div class="pie_progress" role="progressbar" data-goal="0%" data-barcolor="#41b3f9" data-barsize="3" aria-valuemin="-100" aria-valuemax="100" rel="tooltip" title="{{ $step->as_title }}">
                                                    <div class="pie_progress__content text-muted">
                                                        <i class="fa {{ $step->as_icon }}"></i>
                                                    </div>
                                                </div> 
                                            </div>
                                            <div class="col-lg-8 col-md-8 col-sm-8 col-xs-8 text-left step_title">
                                                <h4><span class="text-muted cpointer" >{{ $step->as_title }}</span></h4>
                                                <div class="panel-wrapper collapse"> 
                                                    @if($step->as_order_key == "1_registration_fee")
                                                        <small> {!! $regi_step_desc !!}</small> 
                                                    @elseif($step->as_order_key == "1_resume_approval")
                                                        <small> {!! str_replace('%branding%', $company_name, $step->as_desc_before) !!}</small>
                                                    @elseif($step->as_order_key == "1_j1_interview")
                                                        <small> {!! str_replace('%branding%', $company_name, $step->as_desc_before) !!}</small>
                                                    @else
                                                        <small>{!! $step->as_desc_before !!}</small> 
                                                    @endif
                                                </div>
                                            </div>
                                            <div class="step_accordion">
                                                <a data-perform="panel-collapse" class="stp_collapse m-t-5 cpointer">
                                                    <i class="text-muted fa fa-chevron-down"></i>
                                                </a> 
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>-->
                    @endforeach 
                </div>
            </div>  
    @elseif($action == "navigate_step")
        @php 
            $active_stage = (!empty($active_stage))?@$active_stage:1;
            $active_step = (!empty($active_step))?@$active_step:1;
            $current_stage = @$current_stage;
            $current_step = @$current_step;
            $active_step_key = @$request_step_data->as_order_key;
            $prev_step_key = @$request_step_data->prev_order_key;
            $next_step_key = @$request_step_data->next_order_key;
            $notify_id = "notify_{$active_stage}_{$active_step}";
            $is_step_success = @$step_verified_data['is_step_success'];
            $step_title = @$step_verified_data['step_title'];
            $is_multi_placement = @$step_verified_data['is_multi_placement']; 
            $as_step_views = config('common.as_step_views_newui'); 
            $step_view = $as_step_views[$active_step_key]; 
        @endphp
        @include($step_view)
    @endif
@endif