@use(Illuminate\Support\Number)

<div>
    <div class="grid grid-cols-[auto,minmax(0,1fr)] gap-4 items-baseline">
        <label class="label-text" for="veinte_mil">$20.000</label>
        <input class="input input-bordered" type="number" id="veinte_mil" wire:model.blur="veinte_mil"/>

        <label class="label-text" for="diez_mil">$10.000</label>
        <input class="input input-bordered" type="number" id="diez_mil" wire:model.blur="diez_mil"/>

        <label class="label-text" for="cinco_mil">$5.000</label>
        <input class="input input-bordered" type="number" id="cinco_mil" wire:model.blur="cinco_mil"/>

        <label class="label-text" for="dos_mil">$2.000</label>
        <input class="input input-bordered" type="number" id="dos_mil" wire:model.blur="dos_mil"/>

        <label class="label-text" for="mil">$1.000</label>
        <input class="input input-bordered" type="number" id="mil" wire:model.blur="mil"/>

        <label class="label-text" for="quinientos">$500</label>
        <input class="input input-bordered" type="number" id="quinientos" wire:model.blur="quinientos"/>

        <label class="label-text" for="cien">$100</label>
        <input class="input input-bordered" type="number" id="cien" wire:model.blur="cien"/>

        <label class="label-text" for="cincuenta">$50</label>
        <input class="input input-bordered" type="number" id="cincuenta" wire:model.blur="cincuenta"/>

        <label class="label-text" for="diez">$10</label>
        <input class="input input-bordered" type="number" id="diez" wire:model.blur="diez"/>

        <div class="divider col-span-full"></div>

        <label class="label-text">Total</label>
        <input class="input input-bordered bg-neutral-content" value="{{Number::currency($this->totalEfectivo)}}"
               readonly/>
    </div>
</div>