@extends('layouts.kaiadmin.master')

@section('template_title')
    
@endsection

@section('content')
<section class="content container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="card">
                    <div class="card-header">
                        <div class="float-left">
                            
                        </div>
                        <div class="float-right">
                        
                        <a class="btn btn-primary text-white" href="{{ route('servicios.index') }}" ><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-left" viewBox="0 0 16 16">
                        <path fill-rule="evenodd" d="M15 8a.5.5 0 0 0-.5-.5H2.707l3.147-3.146a.5.5 0 1 0-.708-.708l-4 4a.5.5 0 0 0 0 .708l4 4a.5.5 0 0 0 .708-.708L2.707 8.5H14.5A.5.5 0 0 0 15 8z"/>
                        </svg> Regresar</a>
                        </div>
                    </div>

                    <div class="card-body">
                        
                    <table class="table table-striped table-hover">
                                <thead class="thead">
                                    <tr>
                                        <th style="text-align: center;">Servicio</th>
                                        <th style="text-align: center;">Mes</th>
										<th style="text-align: center;">Saldo</th>
                                        <th style="text-align: center;">Estado</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($servicio as $detalle)
                                        
                                            <tr>
                                                <td style="text-align: center;">{{ $detalle->UsrSerCodigo }}</td>
                                                <td style="text-align: center;">{{ $detalle->UsrCarDescripcion }}</td>    
                                                <td style="text-align: center;">Q. {{ $detalle->UsrCarCargoPeriodo }}</td>
                                                <td style="text-align: center;">
                                                <button type="button" class="btn btn-danger btn-sm text-white">Pendiente</button>                                                </td>
                                            </tr>
                                       
                                    @endforeach
                                </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        {{ $servicio->links() }}
    </section>
@endsection