@extends('aplicacion.componentes.impresion.plantilla')

{{-- ! Título del apartado personalizado del encabezado --}}
@section('tituloEncabezado','DATOS DEL AVANCE')

{{-- ! Encabezado de la parte izquierda --}}
@section('encabezadoIzquierda')

<div class="d-flex flex-row" style="line-height: 1.7">

  <div class="d-flex flex-column">

    <p>
      <span class="fw-bold">Recibimos de</span>
    </p>

    <p>
      <span>La suma de</span>
    </p>

    <p>
      <span class="fw-bold">Por Concepto De</span>
    </p>

  </div>

  <div class="d-flex flex-column p-2"></div>

  <div class="d-flex flex-column">

    <span class="fw-bold"> {{$documento[0]->id_entidad ?? ''}} {{$documento[0]->beneficiario ?? ''}} </span>

    <span> {{number_format($documento[0]->monto, 2, '.', ',')}} </span>

    <span class="fw-bold">{{$documento[0]->concepto ?? ''}}</span>

  </div>

</div>

@endsection

{{-- ! Encabezado de la parte derecha --}}
@section('encabezadoDerecha')

	<p class="d-flex justify-content-between fw-bold" style="font-size: 14px">
		<span>Documento</span>
		<span>{{$documento[0]->id_documento ?? ''}}</span>
	</p>

	<p class="d-flex justify-content-between" style="font-size: 14px">
		<span>Referencia</span>
		<span>{{$documento[0]->refenrencia ?? ''}}</span>
	</p>

	<p class="d-flex justify-content-between">
		<span>Cajero</span>
		<span>{{$documento[0]->cajero ?? ''}}</span>
	</p>

@endsection

@section('cuerpo')

<h3 class="text-center">AVANCE</h3>

	<div class="mx-3">

		<div class="d-flex flex-column align-items-start">

			<p class="fs-4 fw-bold">{{$documento[0]->tipo_avance ?? ''}}</p>

		</div>

		<div class="d-flex flex-column align-items-end">

			<span class="fs-4 text-center">{{$documento[0]->moneda ?? ''}}</span>

			<p class="d-flex justify-content-between p-1">
				<span class="text-uppercase">{{$documento[0]->medio_pago ?? ''}}</sp>
				<span class="fw-bold"> ${{ number_format($documento[0]->monto, 2, '.', ',') }} </span>
			</p>

		</div>

		<div class="d-flex flex-row gap-5 mb-5">

			<div class="border-top border-black text-center w-25"> <span class="fs-6"> Recibido Por </span> </div>

			<div class="border-top border-black text-center w-25"> <span class="fs-6"> Realizado Por </span> </div>

		</div>

	</div>

</div>

@endsection
