<style>
.small-label {
    font-size: 15px;
}
</style>
<!---------------------------------- cloning start for Accreditation --------------------------------------------->
	
<div class="col-sm-12 col-lg-12 col-12" id="operations_div_to_clone" style="display:none;">
		<div class="row">
			<div class="col-sm-1"> 
				 <label class="control-label" for="Operation">&nbsp;<em></em></label> 
				 <input type="text" class="form-control" id="operation" name="operation[]" value="" placeholder="Operation" autocomplete="off" oninput="this.value=this.value.toUpperCase();">
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Work Station">&nbsp;<em></em></label>  
				 <? $gsi->getStationList_quotation("work_station_id[]","","100%",false,"form-control work_station_clone work_station",""); ?>
			</div>
			<div class="col-sm-1 hide"> 
				 <label class="control-label" for="Work Station Description">&nbsp;<em></em></label> 
				 <input type="text" class="form-control" id="work_station_description" name="work_station_description[]" value="" placeholder="Work Station Description" autocomplete="off" style="background-color: #FFFFE0;font-size:12px;" readonly oninput="this.value=this.value.toUpperCase();">  
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="W/HRS">&nbsp;<em></em></label> 
				 <input type="text" class="form-control w_hrs" id="w_hrs" name="w_hrs[]" value="" placeholder="W/HRS" autocomplete="off" style="background-color: #FFFFE0;"oninput="this.value=this.value.toUpperCase();">  
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Operator">&nbsp;<em></em></label> 
				 <input type="number" class="form-control operator" id="operator" name="operator[]" value="" placeholder="Operator" autocomplete="off" oninput="this.value=this.value.toUpperCase();">  
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Labour Rate">&nbsp;<em></em></label> 
				 <input type="number" class="form-control labour_rate" id="labour_rate" name="labour_rate[]" value="" placeholder="Labour Rate" autocomplete="off" style="background-color: #FFFFE0;" step="0.01"> 
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Fac Rate">&nbsp;<em></em></label> 
				 <input type="number" class="form-control fac_rate" id="fac_rate" name="fac_rate[]" value="" placeholder="Fac Rate" autocomplete="off" style="background-color: #FFFFE0;" step="0.01"> 
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Scrap (%)">&nbsp;<em></em></label> 
				 <input type="number" class="form-control scrap_percent" id="scrap_percent" name="scrap_percent[]" value="" placeholder="Scrap (%)" autocomplete="off" step="0.01"> 
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Units Per Hour">&nbsp;<em></em></label> 
				 <input type="number" class="form-control units_per_hour" id="units_per_hour" name="units_per_hour[]" value="" placeholder="Units Per Hour" autocomplete="off" >  
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Total">&nbsp;<em></em></label> 
				 <input type="number" class="form-control total" id="total" name="total[]" value="" placeholder="Total" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">  
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Per Scrap">&nbsp;<em></em></label> 
				 <input type="number" class="form-control per_scrap" id="per_scrap" name="per_scrap[]" value="" placeholder="Per Scrap" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">  
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Scrap Value">&nbsp;<em></em></label> 
				 <input type="number" class="form-control scrap_value" id="scrap_value" name="scrap_value[]" value="" placeholder="Scrap Value" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">  
			</div>
			<div class="col-sm-1"> 
				 <label class="control-label" for="Overhead Value">&nbsp;<em></em></label> 
				 <input type="text" class="form-control overhead_value" id="overhead_value" name="overhead_value[]" value="" placeholder="Overhead Value" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">  
			</div>
			<div class="col-sm-12" style="margin-top:0px;"> 
				<div class="custom-trash " style="float:right;">
					<label class="control-label"></label> 
					<span class="fa fa-trash delete_new_operations" alt="" style="color: red;"></span>
				</div>
			</div>
		</div>
	</div>	
<!----------------------------------- Cloning end for Accreditation  --------------------------------------------->

        <section class="content">
			<!-- general form elements -->
                <form class="" method="post" name="operationForm" id="operationForm" action="index?page=view_quotation_progress&action=insert_operations" onsubmit="return validateForm(this)" enctype="multipart/form-data">
					  <div class="row">
						  <div class="col-lg-12 col-sm-12">
						  <div class="form-section mt-2">
							<? 
								$operation_query = "SELECT * FROM quot_operations WHERE quot_id='".$_REQUEST['id']."' ";
								$operation_sql=mysqli_query($conn,$operation_query);
								$operation_result=mysqli_num_rows($operation_sql);
								if($operation_result>0){
									$j = 0;
									while($mapp_row = mysqli_fetch_array($operation_sql)){
							?>
							<div class="col-sm-12 col-lg-12 col-12 initial_row_for_operations" id="new_operation<?=$mapp_row['id'];?>" data-personal_count="<?=$mapp_row['id'];?>" alt="<?=$mapp_row['id'];?>">
							<div class="row">
								<div class="col-sm-1"> 
									<label class="control-label" for="Operation">Operation<em></em></label> 
									<input type="text" id="operation" name="operation[<?=$j;?>]" class="form-control  operation" value="<?php echo $mapp_row['operation'];?>" placeholder="Operation" autocomplete="off" oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Work Station">Work Station<em></em></label> 
									<? $gsi->getStationList_quotation("work_station_id[$j]",$mapp_row['work_station_id'],"100%",false,"form-control select2 work_station","");?>
								</div>
								<div class="col-sm-1 hide"> 
									<label class="control-label small-label" for="Work Station Description">Work Station Description<em></em></label> 
									<input type="text" id="work_station_description" name="work_station_description[<?=$j;?>]" class="form-control" value="<?php echo $mapp_row['work_station_description'];?>" placeholder="Work Station Description" autocomplete="off" style="background-color: #FFFFE0;font-size:12px;" readonly oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="W/HRS">W/HRS<em></em></label> 
									<input type="text" id="w_hrs" name="w_hrs[<?=$j;?>]" class="form-control  w_hrs" value="<?php echo $mapp_row['w_hrs'];?>" placeholder="W/HRS" autocomplete="off" style="background-color: #FFFFE0;"oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Operator">Operator<em></em></label> 
									<input type="number" id="operator" name="operator[<?=$j;?>]" class="form-control operator" value="<?php echo $mapp_row['operator'];?>" placeholder="Operator" autocomplete="off"oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Labour Rate">Labour Rate<em></em></label> 
									<input type="number" id="labour_rate" name="labour_rate[<?=$j;?>]" class="form-control  labour_rate" value="<?php echo $mapp_row['labour_rate'];?>" placeholder="Labour Rate" autocomplete="off" style="background-color: #FFFFE0;" step="0.01">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Fac Rate">Fac Rate<em></em></label> 
									<input type="number" id="fac_rate" name="fac_rate[<?=$j;?>]" class="form-control fac_rate" value="<?php echo $mapp_row['fac_rate'];?>" placeholder="Fac Rate" autocomplete="off" style="background-color: #FFFFE0;" step="0.01">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Scrap (%)">Scrap (%)<em></em></label> 
									<input type="number" id="scrap_percent" name="scrap_percent[<?=$j;?>]" class="form-control scrap_percent" value="<?php echo $mapp_row['scrap_percent'];?>" placeholder="Scrap (%)" autocomplete="off" step="0.01">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Units Per Hour"style="font-size:14px;">Units Per Hour<em></em></label> 
									<input type="number" id="units_per_hour" name="units_per_hour[<?=$j;?>]" class="form-control units_per_hour" value="<?php echo $mapp_row['units_per_hour'];?>" placeholder="Units Per Hour" autocomplete="off">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Total">Total<em></em></label> 
									<input type="number" id="total" name="total[<?=$j;?>]" class="form-control total" value="<?php echo $mapp_row['total'];?>" placeholder="Total" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Per Scrap">Per Scrap<em></em></label> 
									<input type="number" id="per_scrap" name="per_scrap[<?=$j;?>]" class="form-control per_scrap" value="<?php echo $mapp_row['per_scrap'];?>" placeholder="Per Scrap" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Scrap Value">Scrap Value<em></em></label> 
									<input type="number" id="scrap_value" name="scrap_value[<?=$j;?>]" class="form-control scrap_value" value="<?php echo $mapp_row['scrap_value'];?>" placeholder="Scrap Value" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-1"> 
									<label class="control-label" for="Overhead Value" style="font-size:13px;">Overhead Value<em></em></label> 
									<input type="number" id="overhead_value" name="overhead_value[<?=$j;?>]" class="form-control overhead_value" value="<?php echo $mapp_row['overhead_value'];?>" placeholder="Overhead Value" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
								</div>
								<div class="col-sm-12" style="margin-top:0px;"> 
									<div class="custom-trash " style="float:right;">
										<label class="control-label"></label>
										<input type="hidden" name="operation_mapping_id[<?=$j;?>]" value="<?php echo $mapp_row['id'];?>">
										<?php if ($j != 0) { ?>
									    <span class="fa fa-trash delete_new_operations" style="cursor:pointer; color: red;"  alt="<?php echo $mapp_row['id'];?>"></span>
									    <?php } ?>
										<i class="fas fa-sync-alt fa-spin" id="load_new_operations<?=$mapp_row['id'];?>" style="font-size: 20px;display:none;"></i>
										<i class="fa fa-check" id="status_update_personal_done_<?=$mapp_row['id'];?>" style="color:#bad23a;font-size: 20px;display:none;"></i>
									</div>
								</div>
						    </div>
					 <hr style="background-color: #9c4893; height:1px; margin-top: 2; margin-bottom: 2;">
					</div>

					<?
					$j++;
					}}else{?>
					<div class="col-sm-12 col-lg-12 col-12 initial_row_for_operations" id="new_operation0" data-personal_count="0" alt="0">
						<div class="row">
							<div class="col-sm-1"> 
								<label class="control-label" for="Operation">Operation<em></em></label> 
								<input type="text" class="form-control operation" id="operation" name="operation[]" value="" placeholder="Operation" autocomplete="off" oninput="this.value=this.value.toUpperCase();">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Work Station">Work Station<em></em></label> 
								<? $gsi->getStationList_quotation("work_station_id[]","","100%",false,"form-control select2 work_station",""); ?>
							</div>
							<div class="col-sm-1 hide"> 
								<label class="control-label small-label" for="Work Station Description">Work Station Description<em></em></label> 
								<input type="text" class="form-control" id="work_station_description" name="work_station_description[]" value="" placeholder="Work Station Description" autocomplete="off" style="background-color: #FFFFE0;font-size:12px;" readonly oninput="this.value=this.value.toUpperCase();">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="W/HRS">W/HRS<em></em></label> 
								<input type="text" class="form-control w_hrs" id="w_hrs" name="w_hrs[]" value="" placeholder="W/HRS" autocomplete="off" style="background-color: #FFFFE0;" oninput="this.value=this.value.toUpperCase();">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Operator">Operator<em></em></label> 
								<input type="number" class="form-control operator" id="operator" name="operator[]" value="" placeholder="Operator" autocomplete="off" oninput="this.value=this.value.toUpperCase();">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Labour Rate">Labour Rate<em></em></label> 
								<input type="number" class="form-control labour_rate" id="labour_rate" name="labour_rate[]" value="" placeholder="Labour Rate" autocomplete="off">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Fac Rate">Fac Rate<em></em></label> 
								<input type="number" class="form-control fac_rate" id="fac_rate" name="fac_rate[]" value="" placeholder="Fac Rate" autocomplete="off"style="background-color: #FFFFE0;" step="0.01">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Scrap (%)">Scrap (%)<em></em></label> 
								<input type="number" class="form-control scrap_percent" id="scrap_percent" name="scrap_percent[]" value="" placeholder="Scrap (%)" autocomplete="off" step="0.01">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Units Per Hour" style="font-size:14px;">Units Per Hour<em></em></label> 
								<input type="number" class="form-control units_per_hour" id="units_per_hour" name="units_per_hour[]" value="" placeholder="Units Per Hour" autocomplete="off">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Total">Total<em></em></label> 
								<input type="number" class="form-control total" id="total" name="total[]" value="" placeholder="Total" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Per Scrap">Per Scrap<em></em></label> 
								<input type="number" class="form-control per_scrap" id="per_scrap" name="per_scrap[]" value="" placeholder="Per Scrap" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Scrap Value">Scrap Value<em></em></label> 
								<input type="number" class="form-control scrap_value" id="scrap_value" name="scrap_value[]" value="" placeholder="Scrap Value" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
							</div>
							<div class="col-sm-1"> 
								<label class="control-label" for="Overhead Value" style="font-size:13px;">Overhead Value<em></em></label> 
								<input type="number" class="form-control overhead_value" id="overhead_value" name="overhead_value[]" value="" placeholder="Overhead Value" autocomplete="off" readonly oninput="this.value=this.value.toUpperCase();">
							</div>
						</div>
					</div>
					<?}?>
					<div class="form-group col-sm-12 operations_div_to_append">	
						<label class="add_one_more_operations" style="margin-left:0%;cursor:pointer;color: #a423a4; "><span class="fa fa-plus"></span>Add More</label>
					</div>
							</div>
						
						 </div>
						 
					  </div><!-- /.row -->
					  <div class="row">
						<div class="col-sm-3"> 
							<br>
							<label class="control-label" for="grade">Enter Future Labour Rate increase: (as %)<em></em></label> 
						</div>
						<div class="col-sm-5"> 
							<label class="control-label" for="grade">To Enter a Future Rate, please enter these in the boxes below<em></em></label> 
							<input type="text" class="form-control" id="labour_rate_increment" name="labour_rate_increment" value="<?php echo $labour_rate_increment;?>" placeholder="Please enter"oninput="this.value=this.value.toUpperCase();">
						</div>
					</div>	
					<div class="row mt-2">
						<div class="col-sm-3"> 
							<br>
							<label class="control-label" for="grade">Enter Future Facility Rate increase: (as%)<em></em></label> 
						</div>
						<div class="col-sm-5"> 
							<input type="text" class="form-control" id="fact_future_increment" name="fact_future_increment" value="<?php echo $fact_future_increment;?>" placeholder="Please enter" oninput="this.value=this.value.toUpperCase();">
						</div>
					</div>	
					 <div class="card-footer">
						<input type="hidden" id="id" name="id" value="<?php echo $id;?>">
						<input type="hidden" id="quot_id" name="quot_id" value="<?php echo $_REQUEST['id'];?>">
						<input type="hidden" id="from" name="from" value="<?php echo $from;?>">
						<input type="hidden" id="query_string" name="query_string" value="<?php echo $query_string;?>">
						<input type="hidden" id="section_status_operation" name="section_status_operation" value="">
						<button type="button" id="submit_incomplete" class="btn btn-danger" onclick="submitFormoperationStatus(1,'spinner_operation_incomplete')">
							Save Incomplete
							<i class="fas fa-sync-alt fa-spin" style="display:none;" id="spinner_operation_incomplete"></i>
						</button>
						<button type="button" id="submit_completed" class="btn btn-success" onclick="submitFormoperationStatus(2, 'spinner_operation_completed')">
							Section Completed
							<i class="fas fa-sync-alt fa-spin" style="display:none;" id="spinner_operation_completed"></i>
						</button>
						<div style="float:right;">
							<button type="button" id="prevButton" class="btn btn-secondary" onclick="ToPrevTab()">Previous</button>
							<button type="button" id="nextButton" class="btn btn-secondary" onclick="ToNextTab()">Next</button>

					   </div>
                  </div>
                </form>
</section>
<script type="text/javascript">
 function calculateOp(row) {
    const operationCheck = row.find('.operationCheck').val();
    if (operationCheck === "OPERATION") {
        row.find('.total').text("Not applicable");
        row.find('.preScrap').text("Not applicable");
        row.find('.scrapValue').text("Not applicable");
        row.find('.overheadValue').text("Not applicable");
        return;
    }

    const whrs = parseFloat(row.find('.w_hrs').val()) || 0;
    const operators = parseFloat(row.find('.operator').val()) || 0;
    const labourRate = parseFloat(row.find('.labour_rate').val()) || 0;
    const facRate = parseFloat(row.find('.fac_rate').val()) || 0;
    const scrap = parseFloat(row.find('.scrap_percent').val()) || 0;
    const unitsPerHour = parseFloat(row.find('.units_per_hour').val()) || 0;

    let total = "";
    let preScrap = "";
    let scrapValue = "";
    let overheadValue = "";
    if (unitsPerHour !== 0) {
        total = ((facRate / unitsPerHour) + ((labourRate * operators) / unitsPerHour)) * ((scrap / 100) + 1);
        
        preScrap = (facRate / unitsPerHour) + ((labourRate * operators) / unitsPerHour);
        
        scrapValue = total - preScrap;
        overheadValue = facRate / unitsPerHour;
    }

    row.find('.total').val(total !== "" ? total.toFixed(2) : "0");
    row.find('.per_scrap').val(preScrap !== "" ? preScrap.toFixed(2) : "0");
    row.find('.scrap_value').val(scrapValue !== "" ? scrapValue.toFixed(2) : "0");
    row.find('.overhead_value').val(overheadValue !== "" ? overheadValue.toFixed(2) : "0");
}

$('#operationForm').on('input', '.w_hrs, .operator, .labour_rate, .fac_rate, .scrap_percent, .units_per_hour', function () {
    var row = $(this).closest('.row');  
    calculateOp(row);
});

 
 function submitFormoperationStatus(status, spinnerId) {
    document.getElementById('section_status_operation').value = status;

    document.querySelectorAll('.fa-spin').forEach(function(spinner) {
        spinner.style.display = 'none';
    });
    document.getElementById(spinnerId).style.display = 'inline-block';
    document.getElementById('operationForm').submit();
}

$(function(){
	$('.add_one_more_operations').click(function() {		
		$('#operations_div_to_clone').show();		
		var div_count = $('.initial_row_for_operations').last().attr("data-personal_count");
		div_count++;
		var cloned_div = $('#operations_div_to_clone').clone().addClass("initial_row_for_operations").attr("id","new_operation"+div_count).attr("data-personal_count",div_count);		
		$('.operations_div_to_append').before(cloned_div);		
		$('#operations_div_to_clone').hide();
		$('#new_operation'+div_count).attr("alt",div_count)
	    $('#new_operation'+div_count).children().find(".work_station_clone").attr("id","work_station"+div_count).attr("alt",div_count).select2();		
	});
	
	
	
	$("#operationForm").on("click", ".delete_new_operations",function() {
	    if(confirm('Are you sure you want to delete?')){		
			if($(this).attr("alt") != ""){
				var operation_mapping_id = $(this).attr("alt");
				$('#load_new_operations'+operation_mapping_id).show();
				var form_data   = {'operation_mapping_id':operation_mapping_id};      
                //alert(operation_mapping_id);				
				$.ajax({
					async: true,
					type: "POST",
					url: site_url+"/modules/quotation_management/index.php?page=ajax_actions&action=delete_operation_mapping",
					//url: site_url+"/client_management/index?page=ajax_actions&action=delete_operation_mapping",
					data: form_data,
					success: function(result){    
						var resultObj = jQuery.parseJSON(result); 
						if(resultObj.status == "success"){
							$('#status_update_personal_done_'+operation_mapping_id).show();
							$('#load_new_operations'+operation_mapping_id).hide();
							
							setTimeout(function() {
								$('#status_update_personal_done_'+operation_mapping_id).hide();
								$('#new_operation'+operation_mapping_id).remove();
								//location.reload();
							},1000);
						}
					}
				});
			}else{
				$(this).parent().parent().parent().parent().remove();
			}
		}
	});
	
	
	
$("#operationForm").on("change",".work_station",function(){
		var div_no = $(this).parent().parent().parent().attr("alt");
		var work_station_id = $(this).val();
		
		if(work_station_id != ""){
			//$('#new_operation'+div_no).find("#operation_load").show();
			var form_data   = {'work_station_id':work_station_id};
			$.ajax({
				async: true,
				type: "POST",
				url: site_url+"/modules/quotation_management/index.php?page=ajax_actions&action=get_operation_details",
				data: form_data,
				success: function(result){  
					var resultObj = jQuery.parseJSON(result); 
					if(resultObj.status == 1){
						$('#new_operation'+div_no).find("#labour_rate").val(resultObj.labour_rate);
						$('#new_operation'+div_no).find("#work_station_description").val(resultObj.station);
						$('#new_operation'+div_no).find("#fac_rate").val(resultObj.facility_rate_oem);
						$('#new_operation'+div_no).find("#labour_rate").val(resultObj.labour_rate_oem);
						$('#new_operation'+div_no).find("#w_hrs").val(resultObj.hrs_week);
						//$('#new_operation'+div_no).find("#operation_load").hide();
					}
				}
			});
		}
	})
});
$(document).ready(function () {
    function formatMultiplierInput(value) {
        return value ? value + '%' : '';
    }

    function resetValues(selector) {
        $(selector).each(function () {
            $(this).val($(this).data('original')).trigger('change');
        });
    }

    function applyLabourRateIncrease() {
        $('.labour_rate').each(function () {
            $(this).data('original', $(this).val() || 0); 
        });

        let labourRateIncrement = $('#labour_rate_increment').val().replace('%', ''); 
        let multiplier = parseFloat(labourRateIncrement) / 100;

        if (isNaN(multiplier) || labourRateIncrement === "") {
            resetValues('.labour_rate');
            return; 
        }

        $('#labour_rate_increment').val(formatMultiplierInput(labourRateIncrement));

        // Apply increase
        $('.labour_rate').each(function () {
            let baseValue = parseFloat($(this).data('original'));
            let newLabourRate = baseValue * (1 + multiplier);
            $(this).val(newLabourRate.toFixed(2)).trigger('change');
        });
    }

    function applyFacilityRateIncrease() {
        $('.fac_rate').each(function () {
            $(this).data('original', $(this).val() || 0); 
        });

        let facilityRateIncrement = $('#fact_future_increment').val().replace('%', ''); 
        let multiplier = parseFloat(facilityRateIncrement) / 100;

        if (isNaN(multiplier) || facilityRateIncrement === "") {
            resetValues('.fac_rate');
            return;  
        }

        $('#fact_future_increment').val(formatMultiplierInput(facilityRateIncrement));

        // Apply increase
        $('.fac_rate').each(function () {
            let baseValue = parseFloat($(this).data('original'));
            let newFacilityRate = baseValue * (1 + multiplier);
            $(this).val(newFacilityRate.toFixed(2)).trigger('change');
        });
    }

    $('#labour_rate_increment').on('change', function() {
        if ($(this).val() === "") {
            resetValues('.labour_rate');
        } else {
            applyLabourRateIncrease();
        }
    });

    $('#fact_future_increment').on('change', function() {
        if ($(this).val() === "") {
            resetValues('.fac_rate');
        } else {
            applyFacilityRateIncrease();
        }
    });
});

</script>