@extends('admin.layouts.admin')

@section('title', 'Recetas — ' . $fermento->name)

@php
    $fmt = fn ($v) => $v !== null ? rtrim(rtrim(number_format((float) $v, 3, ',', '.'), '0'), ',') : null;
    $statusBadge = [
        'published' => 'badge-active',
        'draft'     => 'badge-paused',
        'pending'   => 'badge-warn',
        'rejected'  => 'badge-warn',
    ];
@endphp

@section('content')

<div class="mb-3">
    <a href="{{ route('admin.fermentos.show', $fermento) }}" class="btn-back">
        ← {{ $fermento->name }}
    </a>
</div>

<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <div class="admin-page-title">Recetas — {{ $fermento->name }}</div>
        <p class="admin-page-sub mb-0">
            Variantes que siguen esta guía (Clásica, Afrutada…). Cada receta define sus
            ingredientes, tiempos y cantidad base.
        </p>
    </div>
    <a href="{{ route('admin.recetas.wizard.create') }}"
       class="btn btn-fermenty-primary btn-sm">+ Nueva receta</a>
</div>

@if($recipes->isEmpty())
    <div class="admin-card">
        <div class="fermenty-empty">
            <div class="empty-icon">🧪</div>
            <div class="empty-title">Sin recetas todavía</div>
            <div class="empty-text">Crea la primera receta para {{ $fermento->name }}</div>
            <a href="{{ route('admin.recetas.wizard.create') }}"
               class="btn btn-fermenty-primary mt-3 btn-sm">+ Nueva receta</a>
        </div>
    </div>
@else
    <div class="row g-3">
        @foreach($recipes as $recipe)
            <div class="col-12 col-md-6">
                <div class="admin-card">
                    <div class="d-flex justify-content-between align-items-start mb-2">
                        <div>
                            <div class="admin-user-name">
                                {{ $recipe->name }}
                                @if($recipe->is_official)
                                    <span class="fermenty-badge badge-premium" style="font-size:0.68rem;">oficial</span>
                                @endif
                            </div>
                            <div class="admin-user-email">
                                @if($recipe->hasBaseRecipe())
                                    {{ $fmt($recipe->base_yield_value) }} {{ $recipe->base_yield_unit }}
                                @else
                                    sin rendimiento base
                                @endif
                            </div>
                        </div>
                        <span class="fermenty-badge {{ $statusBadge[$recipe->status] ?? 'badge-paused' }}">
                            {{ $recipe->status }}
                        </span>
                    </div>

                    @if($recipe->description)
                        <p class="step-desc mb-3">{{ Str::limit($recipe->description, 100) }}</p>
                    @endif

                    <div class="ferment-info-row">
                        <span class="ferment-info-label">Ingredientes</span>
                        <span class="ferment-info-value">{{ $recipe->ingredients_count }}</span>
                    </div>
                    <div class="ferment-info-row">
                        <span class="ferment-info-label">Lotes que la usan</span>
                        <span class="ferment-info-value">{{ $recipe->batches_count }}</span>
                    </div>

                    <div class="d-flex gap-2 mt-3">
                        <a href="{{ route('admin.recetas.wizard.steps', $recipe) }}"
                           class="btn-xs-admin">Editar receta</a>
                        @if($recipe->batches_count === 0)
                            <form method="POST"
                                  action="{{ route('admin.fermentos.recetas.destroy', [$fermento, $recipe]) }}"
                                  onsubmit="return confirm('¿Eliminar esta receta?')">
                                @csrf @method('DELETE')
                                <button type="submit" class="btn-xs-admin" style="color:#7A1A1A;">Eliminar</button>
                            </form>
                        @endif
                    </div>
                </div>
            </div>
        @endforeach
    </div>
@endif

@endsection