@extends('layouts.app')
@section('title', 'BWSI')

<style type="text/css">
    #select-mainline-connection .select2-container--default .select2-selection--single .select2-selection__arrow {
        display: none;
    }
    .input-wnum{
        font-size: 16px !important;
    }
</style>

@section('body')
<div class="row" style="padding-left:5px; padding-right:5px">
    <div class="box-header with-border">
        <h3 class="box-title">Customer Application</h3>
        <div class="box-tools pull-right">
            <a href="{{url('csr/application')}}" class="btn btn-sm btn-flat btn-default"><i class="fa fa-reply"></i> Go Back</a>
            <button class="btn btn-warning btn-sm btn-flat">STATUS:</button>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-xs-12 col-md-4">
        <div class="box box-default" style="height:240px">
            <div class="box-body">
                <div class="row">
                    <div class="col-xs-8">
                        <div class="form-group">
                            <strong>Account Name</strong>
                            <p>SANTIAGO, EDMARK B.</p>
                        </div>
                    </div>
                    <div class="col-xs-4">
                        <div class="form-group">
                            <strong>Account Class</strong>
                            <p>RES - A</p>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-12">
                        <div class="form-group">
                            <strong>Service Address</strong>
                            <p>001 SITIO GUSI, STO. NINO, PAOMBONG, BULACAN</p>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-xs-4">
                        <div class="form-group">
                            <strong>Connection Type</strong>
                            <p>ACROSS PAVEMENT</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-xs-12 col-md-4">
        <div class="box box-default" style="height:240px">
            <div class="box-body">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="form-group">
                            <strong>Application Fees</strong>
                            <table style="width:100%">
                                <tbody>
                                    <tr>
                                        <td style="padding:2px">Guarantee Deposit</td>
                                        <td>P700.00</td>
                                        <td><label class="label label-success">Paid</label></td>
                                    </tr>
                                    <tr>
                                        <td style="padding:2px">Service Fee</td>
                                        <td>P200.00</td>
                                        <td><label class="label label-success">Paid</label></td>
                                    </tr>
                                    <tr>
                                        <td style="padding:2px">Materials</td>
                                        <td>P200.00</td>
                                        <td><label class="label label-success">Paid</label></td>
                                    </tr>
                                </tbody>
                            </table>
                            <button class="btn btn-sm btn-flat btn-warning"><i class="fa fa-plus-circle"></i> ADDITIONAL FEE</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script type="text/javascript">
</script>
@endsection