@extends('layouts.report')

@section('styles')
<style>
    .report-container {
        background: #fff;
        padding: 3rem;
        border-radius: 8px;
        font-size: 11px;
    }
    .report-table {
        width: 100%;
        border-collapse: collapse;
        margin-bottom: 15px;
        
    }
    .report-table th, .report-table td {
        border: 1px solid #dee2e6;
        padding: 5px;
        text-align: left;
        font-size: 1rem;
    }
    .report-table th {
        background-color: #f8f9fa;
        font-weight: bold;
    }
    .report-table tfoot td {
        font-weight: bold;
    }
    .logo-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.logo-container img {
    max-width: 100px;
    height: auto;
}

.logo-container h4 {
    flex-grow: 1;
    text-align: center;
    margin: 0;
}
    @media (max-width: 768px) {
        .logo-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 20px;
        }
        .logo-container img {
            max-width: 100px;
            height: auto;
        }
    }
    @media print {
    .row {
        display: flex !important;
        flex-wrap: wrap !important;
    }
    .col-md-2 {
        flex: 0 0 16.666667% !important;
        max-width: 16.666667% !important;
    }
    .report-container {
        padding: 1rem;
        page-break-inside: avoid;
    }
        .logo-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 20px;
        }
        .logo-container img {
            max-width: 100px;
            height: auto;
        }
        body {
            margin: 0;
            padding: 0;
            font-size: 8px;
        }
        .container-fluid, .card {
            margin: 0 !important;
            padding: 5px !important;
            box-shadow: none !important;
            border: none !important;
        }
        .report-container {
            padding: 5px;
            page-break-inside: avoid;
        }
        .report-table {
            width: 100%;
            font-size: 7px;
        }
        .report-table th, .report-table td {
            padding: 2px;
            font-size: 11px;
        }
        .logo-container {
            margin-bottom: 5px;
        }
        .logo-container img {
            max-width: 60px;
        }
        .btn {
            display: none;
        }
        h1, h4 {
            font-size: 12px !important;
            margin: 5px 0 !important;
        }
        .row {
            display: flex;
            flex-wrap: wrap;
            margin-bottom: 5px;
        }
        .col-md-4 {
            flex: 0 0 33.3333%;
            max-width: 33.3333%;
        }
        @page {
            size: landscape;
            margin: 2mm;
        }
    }
</style>
@endsection

@section('report-content')
<div class="report-container">

    <div class="logo-container">
        <img src="{{ asset('images/icon.png') }}" alt="GOBIERNO BOLIVARIANO DE TRUJILLO" />
        <h4 class="text-center mb-4">COMPROBANTE DE RETENCIÓN DE IMPUESTO SOBRE LA RENTA</h4>
    </div>
    
    <div class="row justify-content-between mb-4" >
        <div class="col-md-2">
            <h4 class="text-center" >FECHA DE EMISIÓN</h4>
            <h5 class="text-center">{{ date('Y-m-d') }}</h5>
        </div>
        <div class="col-md-2">
            <h4 class="text-center" >N DE COMPROBANTE</h4>
            <h5 class="text-center">N° {{ date('Ym').'00000'.$islr->id }}</h5>
        </div>
        <div class="col-md-2">
            <h4 class="text-center" >N DE ORDEN DE PAGO</h4>
            <h5 class="text-center">{{ $islr->ordenes_pago->numero_orden }}</h5>
        </div>
        <div class="col-md-2">
            <h4 class="text-center">PERIODO FISCAL</h4>
            <h5 class="text-center form-control">202501</h5>
        </div>

    </div>

<div class="row justify-content-between">
    <div class="col-6 text-left">
        <table class="report-table" id="razon-social-agente">
            <thead>
                <tr>
                    <th class="text-center">NOMBRE O RAZÓN SOCIAL DEL AGENTE DE RETENCIÓN</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td class="text-center">GOBERNACIÓN DEL ESTADO TRUJILLO</td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="col-4 text-right">
        <table class="report-table" id="rif-agente">
            <thead>
                <tr>
                    <th class="text-center">REGISTRO DE INFORMACIÓN FISCAL DEL AGENTE DE RETENCIÓN</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td class="text-center">G20000161-5</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
<div class="row">
        <div class="col-md-12 text-center">
            <table class="report-table" id="razon-social-agente">
                <thead>
                    <tr>
                        <th class="text-center">DIRECCIÓN FISCAL DEL AGENTE DE RETENCIÓN</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-center" >AV. Independencia, Palacio de Gobierno, Sector Centro, Trujillo</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <div class="row justify-content-between">
        <div class="col-6 text-left">
            <table class="report-table" id="razon-social-agente">
                <thead>
                    <tr>
                        <th class="text-center">NOMBRE O RAZÓN SOCIAL DEL SUJETO RETENIDO</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-center">{{ $islr->proveedore->empresa }}</td>
                    </tr>
                </tbody>
            </table>
        </div>
        <div class="col-4 text-right">
            <table class="report-table" id="rif-agente">
                <thead>
                    <tr>
                        <th class="text-center">REGISTRO DE INFORMACIÓN FISCAL DEL SUJETO RETENIDO</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td class="text-center">{{ $islr->proveedore->rif }}</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>


    <div class="row">
        <div class="col-md-12">
            <table class="report-table" id="direccion-sujeto">
                <thead>
                    <tr>
                        <th>DIRECCIÓN FISCAL DEL SUJETO RETENIDO</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td>aaa</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>

    <div class="table-responsive">
        <table class="report-table" id="mi-tabla-reporte">
            <thead>
                <tr>
                    <th>Nº Factura</th>
                    <th>Nº Control</th>
                    <th>Fecha de Factura</th>
                    <th>Monto Facturado</th>
                    <th>Base Imponible</th>
                    <th>% Retención</th>
                    <th>Sustraendo</th>
                    <th>Monto Retenido</th>
                </tr>
            </thead>
            <tbody>
                @foreach($islr->retenciones_islr_renglones as $key)
                <tr>
                    <td>{{ $key->factura->numero_factura }}</td>
                    <td>{{ $key->factura->numero_control }}</td>
                    <td>{{ $key->factura->fecha_factura }}</td>
                    <td>{{ number_format($key->factura->monto_facturado, 2) }}</td>
                    <td>{{ number_format($key->factura->base_imponible,2) }}</td>
                    <td>{{ $key->tarifa_porcentaje }}</td>
                    <td>{{ number_format($key->sustraendo,2) }}</td>
                    <td>{{ number_format($key->monto_retencion,2) }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
        </div>
    </div>

</div>
@endsection