@extends('admin.layouts.admin')

@section('title', 'Editar · ' . $ingrediente->name)

@section('content')

<div class="mb-3">
    <a href="{{ route('admin.ingredientes.index') }}" class="btn-back">← Catálogo de ingredientes</a>
</div>

<div class="admin-page-title">{{ $ingrediente->name }}</div>
<p class="admin-page-sub">Usado en {{ $ingrediente->recipe_lines_count }} recetas y {{ $ingrediente->guide_lines_count }} guías.</p>

@if($errors->any())
    <div class="mb-3" style="color:#7A1A1A;">{{ $errors->first() }}</div>
@endif

<div class="row justify-content-center">
    <div class="col-12 col-lg-8">
        <div class="admin-card">
            <form method="POST" action="{{ route('admin.ingredientes.update', $ingrediente) }}">
                @csrf @method('PUT')

                <div class="row g-2">
                    <div class="col-12 col-md-6">
                        <label class="form-label">Nombre</label>
                        <input type="text" name="name" class="form-control form-control-sm" value="{{ old('name', $ingrediente->name) }}" required>
                    </div>
                    <div class="col-8 col-md-4">
                        <label class="form-label">Padre</label>
                        <select name="parent_id" class="form-select form-select-sm">
                            <option value="">(raíz)</option>
                            @foreach($arbol as $opt)
                                @if($opt['id'] !== $ingrediente->id)
                                    <option value="{{ $opt['id'] }}" {{ (int) old('parent_id', $ingrediente->parent_id) === $opt['id'] ? 'selected' : '' }}>{{ str_repeat('— ', $opt['depth']) }}{{ $opt['name'] }}</option>
                                @endif
                            @endforeach
                        </select>
                    </div>
                    <div class="col-4 col-md-2">
                        <label class="form-label">Unidad</label>
                        <select name="canonical_unit" class="form-select form-select-sm">
                            @foreach(['g'=>'g','kg'=>'kg','ml'=>'ml','l'=>'L','unit'=>'ud'] as $v => $l)
                                <option value="{{ $v }}" {{ old('canonical_unit', $ingrediente->canonical_unit) === $v ? 'selected' : '' }}>{{ $l }}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <hr class="my-3">
                <div class="d-flex justify-content-between align-items-center mb-2">
                    <div>
                        <div style="font-weight:600;">Perfil</div>
                        <div class="text-muted" style="font-size:.78rem;">Lo que el motor lee de este ingrediente (p. ej. carbPorG, velocidad, aroma). Vacío = se hereda del padre. Campos, no JSON.</div>
                    </div>
                    <button type="button" class="btn btn-fermenty-outline btn-sm" onclick="addPerfil()">+ Campo</button>
                </div>

                <div id="perfilRows" class="fm-stack" style="gap:6px;">
                    @php $perfil = old('profile_keys') ? array_combine(old('profile_keys'), old('profile_values')) : ($ingrediente->profile ?? []); @endphp
                    @forelse($perfil as $k => $v)
                        <div class="row g-2 perfil-row">
                            <div class="col-5"><input type="text" name="profile_keys[]" class="form-control form-control-sm" value="{{ $k }}" placeholder="clave"></div>
                            <div class="col-5"><input type="text" name="profile_values[]" class="form-control form-control-sm fm-data" value="{{ is_array($v) ? json_encode($v) : $v }}" placeholder="valor"></div>
                            <div class="col-2"><button type="button" class="btn btn-fermenty-outline btn-sm w-100" onclick="this.closest('.perfil-row').remove()">✕</button></div>
                        </div>
                    @empty
                    @endforelse
                </div>

                {{-- Leyenda: las claves que el motor de kombucha LEE de verdad. Las
                     demás (fermentable_carb_per_unit, acid_per_unit) son heredadas del
                     paso 5 y este motor no las usa. --}}
                <details class="mt-3" style="font-size:.8rem;">
                    <summary style="cursor:pointer;font-weight:600;">¿Qué valores puedo poner?</summary>
                    <div class="table-responsive mt-2">
                        <table class="table table-sm" style="font-size:.78rem;">
                            <thead><tr class="text-muted"><th>clave</th><th>qué es</th><th>quién</th><th>ejemplos</th></tr></thead>
                            <tbody>
                                <tr><td class="fm-data">carbPorG</td><td>Carbohidrato aprovechable por gramo (0–1). El motor lo vuelve gas y ácido.</td><td>azúcar · saborizante</td><td>blanco 1 · moreno 0.97 · panela 0.90 · liofilizada 0.70</td></tr>
                                <tr><td class="fm-data">velocidad</td><td>Rapidez de ataque (1 = azúcar blanco). &gt;1 rápido, &lt;1 lento. Mueve los días.</td><td>azúcar</td><td>fructosa 1.22 · moreno 0.92 · panela 0.82</td></tr>
                                <tr><td class="fm-data">aroma</td><td>Contribución aromática (−0.1 a 0.15). Sube la complejidad percibida, no la fermentación.</td><td>azúcar · té</td><td>blanco 0 · panela 0.14 · té 0.10</td></tr>
                                <tr><td class="fm-data">cuerpo</td><td>Cuerpo/estructura que aporta el té (0–1). Sensorial.</td><td>té</td><td>té 0.50</td></tr>
                                <tr><td class="fm-data">dosis</td><td>Dosis típica del saborizante en g/L. Punto de partida de la 2F.</td><td>saborizante</td><td>fruta-fresca 40 · liofilizada 4 · hierbas 12</td></tr>
                                <tr><td class="fm-data">simple</td><td>Fracción de azúcar simple del saborizante (0–1). 1 = todo se ataca al instante.</td><td>saborizante</td><td>fruta 1.0 · hierbas 0.5</td></tr>
                            </tbody>
                        </table>
                        <div class="text-muted">Otras claves (<span class="fm-data">fermentable_carb_per_unit</span>, <span class="fm-data">acid_per_unit</span>) son heredadas y el motor de kombucha no las lee. <span class="fm-data">estimado: 1</span> marca un valor extrapolado (p. ej. la melaza).</div>
                    </div>
                </details>

                <div class="mt-3 d-flex gap-2">
                    <button type="submit" class="btn btn-fermenty-primary btn-sm">Guardar</button>
                    <a href="{{ route('admin.ingredientes.index') }}" class="btn btn-fermenty-outline btn-sm">Cancelar</a>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection

@push('scripts')
<script>
    function addPerfil() {
        var row = document.createElement('div');
        row.className = 'row g-2 perfil-row';
        row.innerHTML = '<div class="col-5"><input type="text" name="profile_keys[]" class="form-control form-control-sm" placeholder="clave"></div>'
            + '<div class="col-5"><input type="text" name="profile_values[]" class="form-control form-control-sm fm-data" placeholder="valor"></div>'
            + '<div class="col-2"><button type="button" class="btn btn-fermenty-outline btn-sm w-100" onclick="this.closest(\'.perfil-row\').remove()">✕</button></div>';
        document.getElementById('perfilRows').appendChild(row);
    }
</script>
@endpush