@extends('admin.layouts.admin')

@section('title', $recipe ? 'Editar receta — ' . $recipe->name : 'Nueva receta')

@php
    $fmt = fn ($v) => $v !== null ? rtrim(rtrim(number_format((float) $v, 3, '.', ''), '0'), '.') : '';
    $vis = old('visibility', $recipe->visibility ?? 'public');
    $st  = old('status', $recipe->status ?? 'draft');
@endphp

@section('content')

<div class="mb-3">
    <a href="{{ route('admin.recetas.index') }}" class="btn-back">← Recetas</a>
</div>

<div class="admin-page-title">{{ $recipe ? 'Editar: ' . $recipe->name : 'Nueva receta' }}</div>
<p class="admin-page-sub">Datos básicos de la receta. Después definirás los pasos.</p>

@if($recipe)
    @include('admin.recetas.wizard._stepper', ['active' => 'base'])
@endif

<div class="row justify-content-center">
    <div class="col-12 col-lg-7">
        <div class="admin-card mt-3">
            <form method="POST" enctype="multipart/form-data"
                  action="{{ $recipe ? route('admin.recetas.wizard.basics.update', $recipe) : route('admin.recetas.wizard.store') }}"
                  class="fermenty-form">
                @csrf
                @if($recipe) @method('PUT') @endif

                @if(! $recipe)
                    <div class="mb-3">
                        <label class="form-label">Guía (define clasificación y estructura de pasos)</label>
                        <select name="guide_id" class="form-select @error('guide_id') is-invalid @enderror" required>
                            <option value="">Elige una guía…</option>
                            @foreach($guides as $g)
                                <option value="{{ $g->id }}" {{ old('guide_id') == $g->id ? 'selected' : '' }}>
                                    {{ $g->name }}
                                </option>
                            @endforeach
                        </select>
                        @error('guide_id') <div class="invalid-feedback">{{ $message }}</div> @enderror
                        <div class="form-text" style="font-size:0.8rem;">
                            Los pasos se precargan desde la guía y luego podrás editarlos libremente.
                        </div>
                    </div>
                @else
                    <div class="mb-3">
                        <div class="ferment-info-label">Guía</div>
                        <div class="admin-user-name">{{ $recipe->guide?->name }}</div>
                    </div>
                @endif

                <div class="mb-3">
                    <label class="form-label">Nombre</label>
                    <input type="text" name="name" class="form-control @error('name') is-invalid @enderror"
                           value="{{ old('name', $recipe->name ?? '') }}" placeholder="Ej. Kombucha afrutada" required>
                    @error('name') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>

                <div class="mb-3">
                    <label class="form-label">Descripción</label>
                    <textarea name="description" class="form-control" rows="3">{{ old('description', $recipe->description ?? '') }}</textarea>
                </div>

                <div class="mb-3">
                    <label class="form-label">Imagen</label>
                    @if($recipe && $recipe->image_url)
                        <div class="mb-2"><img src="{{ $recipe->image_url }}" style="height:80px;border-radius:10px;object-fit:cover;"></div>
                    @endif
                    <input type="file" name="image" accept="image/*" class="form-control @error('image') is-invalid @enderror">
                    @error('image') <div class="invalid-feedback">{{ $message }}</div> @enderror
                </div>

                <div class="row g-3 mb-3">
                    <div class="col-7">
                        <label class="form-label">Rendimiento base</label>
                        <input type="number" step="0.001" min="0" name="base_yield_value"
                               class="form-control" value="{{ old('base_yield_value', isset($recipe) ? $fmt($recipe->base_yield_value) : '') }}" placeholder="Ej. 2">
                    </div>
                    <div class="col-5">
                        <label class="form-label">Unidad</label>
                        @php $byu = old('base_yield_unit', $recipe->base_yield_unit ?? ''); @endphp
                        <select name="base_yield_unit" class="form-select">
                            <option value="" {{ $byu === '' ? 'selected' : '' }}>—</option>
                            <option value="L"  {{ $byu === 'L'  ? 'selected' : '' }}>Litros (L)</option>
                            <option value="kg" {{ $byu === 'kg' ? 'selected' : '' }}>Kilos (kg)</option>
                        </select>
                    </div>
                </div>

                @if($recipe && $usaMotor)
                    @php $pd = $recipe->perfil_defecto ?? []; @endphp
                    <div class="admin-card mb-4" style="background:var(--paper-1,#faf8f3);">
                        <div style="font-weight:600;">Perfil probado — el saborizante de 2F</div>
                        <div class="text-muted mb-2" style="font-size:.82rem;">Lo que hace esta receta distinta de otra del mismo fermento. Al formularla, viene «como está probada» con este saborizante; cambiar la carta ajusta los ejes, no lo quita.</div>
                        <div class="row g-2">
                            <div class="col-8 col-md-6">
                                <label class="form-label">Saborizante</label>
                                <select name="saborizante" class="form-select form-select-sm" id="saborSel">
                                    <option value="">— Ninguno (sin 2F) —</option>
                                    @foreach($saborizantes as $s)
                                        <option value="{{ $s['slug'] }}" data-dosis="{{ $s['dosis'] }}" {{ ($pd['saborizante'] ?? null) === $s['slug'] ? 'selected' : '' }}>{{ $s['name'] }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-4 col-md-3">
                                <label class="form-label">Dosis (g/L)</label>
                                <input type="number" step="0.1" min="0" name="dosis" id="dosisInput" class="form-control form-control-sm"
                                       value="{{ $pd['dosis'] ?? '' }}" placeholder="0">
                            </div>
                        </div>
                        <div class="text-muted mt-2" style="font-size:.75rem;">Ejes del punto probado (no editables aquí): intensidad {{ $pd['intensidad'] ?? '—' }} · equilibrio {{ $pd['equilibrio'] ?? '—' }} · gas {{ $pd['gas'] ?? '—' }} · complejidad {{ $pd['complejidad'] ?? '—' }}.</div>
                    </div>
                @endif

                <div class="row g-3 mb-4">
                    <div class="col-6">
                        <label class="form-label">Visibilidad</label>
                        <select name="visibility" class="form-select">
                            <option value="private"  {{ $vis === 'private'  ? 'selected' : '' }}>Privada</option>
                            <option value="unlisted" {{ $vis === 'unlisted' ? 'selected' : '' }}>Oculta</option>
                            <option value="public"   {{ $vis === 'public'   ? 'selected' : '' }}>Pública</option>
                        </select>
                    </div>
                    <div class="col-6">
                        <label class="form-label">Estado</label>
                        <select name="status" class="form-select">
                            <option value="draft"     {{ $st === 'draft'     ? 'selected' : '' }}>Borrador</option>
                            <option value="pending"   {{ $st === 'pending'   ? 'selected' : '' }}>Pendiente</option>
                            <option value="published" {{ $st === 'published' ? 'selected' : '' }}>Publicada</option>
                            <option value="rejected"  {{ $st === 'rejected'  ? 'selected' : '' }}>Rechazada</option>
                        </select>
                        <div class="form-text" style="font-size:0.8rem;">Solo las publicadas inician lotes.</div>
                    </div>
                </div>

                <div class="d-flex gap-3">
                    <button type="submit" class="btn btn-fermenty-primary">
                        {{ $recipe ? 'Guardar y continuar »' : 'Crear y continuar »' }}
                    </button>
                    <a href="{{ route('admin.recetas.index') }}" class="btn btn-fermenty-outline">Cancelar</a>
                </div>
            </form>
        </div>
    </div>
</div>

@endsection

@push('scripts')
<script>
    // Al cambiar el saborizante, pone su dosis por defecto (cada vez, no solo la
    // primera). Si quieres otra, la ajustas después.
    document.getElementById('saborSel')?.addEventListener('change', function () {
        var di = document.getElementById('dosisInput');
        if (!this.value) { di.value = ''; return; }
        var d = this.selectedOptions[0] && this.selectedOptions[0].dataset.dosis;
        if (d) di.value = d;
    });
</script>
@endpush