@extends('admin.layouts.admin')

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

@section('content')

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

<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <div class="admin-page-title">Pasos — {{ $fermento->name }}</div>
        <p class="admin-page-sub mb-0">
            {{ $fermento->steps->count() }} pasos
        </p>
    </div>
    <a href="{{ route('admin.fermentos.pasos.create', $fermento) }}"
       class="btn btn-fermenty-primary btn-sm">
        + Nuevo paso
    </a>
</div>

@if($fermento->steps->isEmpty())
    <div class="admin-card">
        <div class="fermenty-empty">
            <div class="empty-icon">📋</div>
            <div class="empty-title">Sin pasos todavía</div>
            <div class="empty-text">Añade el primer paso a esta guía</div>
            <a href="{{ route('admin.fermentos.pasos.create', $fermento) }}"
               class="btn btn-fermenty-primary mt-3 btn-sm">+ Nuevo paso</a>
        </div>
    </div>
@else
    @foreach($fermento->steps as $step)
        <div class="admin-card mb-3">
            <div class="d-flex justify-content-between align-items-start gap-3">
                <div class="d-flex gap-3 flex-1">
                    <div class="step-number" style="flex-shrink:0;width:32px;height:32px;font-size:13px;">
                        {{ $step->step_number }}
                    </div>
                    <div class="flex-1">
                        <div class="d-flex align-items-center gap-2 mb-1 flex-wrap">
                            <div class="admin-user-name">{{ $step->title }}</div>
                            @if($step->is_optional)
                                <span class="fermenty-badge badge-paused" style="font-size:0.7rem;">opcional</span>
                            @endif
                            @if($step->min_day !== null)
                                <span class="admin-user-email">
                                    Día {{ $step->min_day }}{{ $step->max_day ? ' — ' . $step->max_day : '' }}
                                </span>
                            @endif
                        </div>

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

                        @if($step->actions->count() > 0)
                            <div class="d-flex flex-wrap gap-1 align-items-center">
                                @foreach($step->actions as $action)
                                    <span class="step-action-type step-action-{{ $action->action_type }}"
                                          style="font-size:0.7rem;padding:2px 8px;border-radius:10px;">
                                        {{ $action->action_type }}
                                    </span>
                                @endforeach
                                <span class="admin-user-email">
                                    {{ $step->actions->count() }} acciones
                                </span>
                            </div>
                        @endif

                        @if($step->hints->count() > 0)
                            <div class="mt-2"
                                 style="background:#FFF6E8;border:1px solid #F5D9AE;border-radius:10px;padding:10px 12px;">
                                <div class="d-flex align-items-center gap-2 mb-1">
                                    <span style="font-size:0.75rem;font-weight:700;color:#9A5D1A;text-transform:uppercase;">
                                        💡 Pistas
                                    </span>
                                    <span class="fermenty-badge badge-premium" style="font-size:0.68rem;">
                                        {{ $step->hints->count() }}
                                    </span>
                                </div>
                                @foreach($step->hints as $hint)
                                    <div class="step-desc mb-1" style="font-size:0.83rem;">
                                        @if($hint->title)<strong>{{ $hint->title }}:</strong>@endif
                                        {{ $hint->content }}
                                    </div>
                                @endforeach
                            </div>
                        @endif
                    </div>
                </div>

                <div class="d-flex gap-2 flex-shrink-0">
                    <a href="{{ route('admin.consejos.create', ['paso' => $step->id]) }}"
                       class="btn-xs-admin">💡 Añadir tip</a>
                    <a href="{{ route('admin.fermentos.pasos.edit', [$fermento, $step]) }}"
                       class="btn-xs-admin">Editar</a>
                    <form method="POST"
                          action="{{ route('admin.fermentos.pasos.destroy', [$fermento, $step]) }}"
                          onsubmit="return confirm('¿Eliminar este paso?')">
                        @csrf @method('DELETE')
                        <button type="submit" class="btn-xs-admin" style="color:#7A1A1A;">
                            Eliminar
                        </button>
                    </form>
                </div>
            </div>
        </div>
    @endforeach
@endif

@endsection