@extends('layouts.app')
@section('title', session('company_code') . ' Elite System')

<style type="text/css">
    section.post-refunds{
        background : #FFF;
        padding    : 5px 20px 10px 20px;
        height     : 85%;
    }

    .select2-container--default 
    .select2-selection--single 
    .select2-selection__clear {
        display: none;
    }      

    div.dataTables_filter input {
        font-size: 14px !important;        
    }    

    #t-refunds_filter{
        margin-top  : 10px; 
        margin-left : -10px;
    }

    div.post-refunds{
        margin-top: -10px;
    }    

    .box-tools{
        margin-top: 3px;
        padding-right: 3px;
    }     

    .page-header{
        margin-bottom: 10px !important;
    }       
</style>

@section('body')
    <section class="post-refunds">

        <input type="hidden" name="" id="account-id">

        <div class="row">
            <div class="col-xs-12">        
                <h2 class="page-header">
                    Refund Voucher <span style="font-size: 16px;" class="text-muted">&emsp;</span>
                </h2>                 
            </div>
        </div>

        @include('layouts._search-customer')

        <div class="refund-fields" style="display: none;">
            <div class="row">
                <div class="col-xs-4">
                    <div class="form-group">
                        <label>Account Title</label>
                        <div>
                            <input type="text" class="form-control" value="Refund of GD & Advances" id="account-title">
                        </div>
                    </div>
                </div>
                <div class="col-xs-2">
                    <div class="form-group">
                        <label>Guarantee Deposit</label>
                        <div>
                            <input type="text" class="form-control text-right" value="" disabled="true" id="gdeposit">
                        </div>
                    </div>
                </div>            
                <div class="col-xs-2">
                    <div class="form-group">
                        <label>Advances</label>
                        <div>
                            <input type="text" class="form-control text-right" value="" disabled="true" id="advances">
                        </div>
                    </div>
                </div>
                <div class="col-xs-2">
                    <div class="form-group">
                        <label>Total Amount</label>
                        <div>
                            <input type="text" class="form-control text-right" value="" disabled="true" id="totalamount">
                        </div>
                    </div>
                </div>
                <div class="col-xs-2">
                    <div class="form-group">
                        <label>Date Refunded</label>
                        <div>
                            <input id="date-refunded" type="text" class="form-control date-masked" placeholder="yyyy-mm-dd" value="2025-12-08">
                        </div>
                    </div>
                </div>                                   
            </div>

            <div class="row">
                <div class="col-xs-4">
                    <div class="form-group">
                        <label>Explanation</label>
                        <div>
                            <input type="text" class="form-control" value="" placeholder="Optional" id="explanation">
                        </div>
                    </div>
                </div>
                <div class="col-xs-2">
                    <div class="form-group">
                        <label>Voucher No.</label>
                        <div class="input-group">
                            <input type="text" class="form-control" placeholder="Required" id="voucher-no">
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-success btn-flat" id="btn-post">Post</button>
                            </span>
                        </div>  
                    </div>
                </div>                                          
            </div>
        </div>

        <div class="show-balance" style="display: none;">
            <div class="callout callout-warning">
                <h4>Outstanding balances must be settled first.</h4> 
                <h5>Go to Teller -> Bills Payment</h5>
            </div>
        </div>

    </section>
@endsection

@section('scripts')
<script src="{{ URL::asset('js/helper.js') }}"></script>
<script src="{{ URL::asset('js/elite.js') }}"></script>
<script src="{{ URL::asset('js/teller/post-refunds.js') }}"></script>
@endsection