@inject('lineUnits', 'App\Services\UnitService')
@php
    $canEditLine = auth()->user()?->can('update', $batch);
    $rawQty = $ing->quantity !== null ? rtrim(rtrim(number_format((float) $ing->quantity, 3, '.', ''), '0'), '.') : '';
    $unitOpts = ['g' => 'g', 'kg' => 'kg', 'ml' => 'ml', 'l' => 'L', 'unit' => 'ud'];
@endphp

<li class="batch-ing-line py-1" style="border-bottom:1px dashed #eee;">
    <div class="batch-ing-display d-flex justify-content-between align-items-center {{ $canEditLine ? 'is-editable' : '' }}"
         @if($canEditLine) role="button" tabindex="0" @endif>
        <span>
            {{ $ing->name }}
            @if($ing->notes)
                <span class="text-muted" style="font-size:0.78rem;">— {{ $ing->notes }}</span>
            @endif
        </span>
        <span style="font-weight:600;white-space:nowrap;">
            @if($ing->quantity !== null)
                {{ $lineUnits->format((float) $ing->quantity, $ing->unit ?? 'unit', auth()->user()) }}
            @endif
            @if($canEditLine)
                <span class="text-muted ms-1" style="font-size:0.72rem;">✎</span>
            @endif
        </span>
    </div>

    @if($canEditLine)
        <form method="POST" action="{{ route('batches.ingredients.update', [$batch, $ing]) }}"
              class="batch-ing-edit row g-2 align-items-end mt-1" style="display:none;">
            @csrf @method('PUT')
            {{-- Quick edit keeps step/phase/notes; the full editor covers the rest. --}}
            <input type="hidden" name="batch_step_id" value="{{ $ing->batch_step_id }}">
            <input type="hidden" name="phase" value="{{ $ing->phase }}">
            <input type="hidden" name="notes" value="{{ $ing->notes }}">

            <div class="col-12 col-sm-6">
                <label class="form-label" style="font-size:0.72rem;">Ingrediente</label>
                <input type="text" name="name" class="form-control form-control-sm" value="{{ $ing->name }}" required>
            </div>
            <div class="col-6 col-sm-3">
                <label class="form-label" style="font-size:0.72rem;">Cantidad</label>
                <input type="number" step="0.001" min="0" name="quantity" class="form-control form-control-sm"
                       value="{{ $rawQty }}">
            </div>
            <div class="col-6 col-sm-3">
                <label class="form-label" style="font-size:0.72rem;">Unidad</label>
                <select name="unit" class="form-select form-select-sm">
                    @foreach($unitOpts as $val => $label)
                        <option value="{{ $val }}" {{ $ing->unit === $val ? 'selected' : '' }}>{{ $label }}</option>
                    @endforeach
                </select>
            </div>
            <div class="col-12 d-flex gap-2 mt-1">
                <button type="submit" class="btn btn-fermenty-primary btn-sm">Guardar</button>
                <button type="button" class="btn btn-fermenty-outline btn-sm batch-ing-cancel">Cancelar</button>
            </div>
        </form>
    @endif
</li>