{{-- resources/views/historial/partials/historial-clinico.blade.php --}}

@php
    $historialClinico = $historialClinico ?? null;

    $itemsPorSeccion = $historialClinico
        ? $historialClinico->items->groupBy('seccion')
        : collect();

    $alertasActivas = $historialClinico
        ? $historialClinico->alertas->where('activo', true)
        : collect();

    $totalAlertas = $alertasActivas->count();

    // ID único por paciente para poder reutilizar el include varias veces si fuera necesario
    $collapseId = 'historialClinicoCollapse_' . ($historialClinico->idPaciente ?? 'sin_historial');
@endphp

<div class="card border-0 shadow-sm mb-3">

    {{-- HEADER COMPACTO --}}
    <div class="card-body py-3">

        <div class="d-flex justify-content-between align-items-center flex-wrap gap-3">

            <div class="d-flex align-items-center gap-3">

                <div>
                    <i class="ti ti-notes fs-3 text-primary"></i>
                </div>

                <div>
                    <div class="fw-bold">
                        Historial clínico
                    </div>

                    @if($historialClinico)

                        <small class="{{ $totalAlertas > 0 ? 'text-danger fw-semibold' : 'text-muted' }}">

                            @if($totalAlertas > 0)
                                <i class="ti ti-alert-triangle me-1"></i>
                                Alertas a considerar: {{ $totalAlertas }}
                            @else
                                <i class="ti ti-circle-check me-1"></i>
                                Sin alertas activas
                            @endif

                        </small>

                    @else

                        <small class="text-muted">
                            Sin historial clínico registrado
                        </small>

                    @endif
                </div>

            </div>


            <div class="d-flex align-items-center gap-3">

                @if($historialClinico?->ultima_actualizacion)

                    <div class="text-end d-none d-md-block">
                        <small class="text-muted d-block">
                            Última actualización
                        </small>

                        <span class="fw-semibold small">
                            {{ $historialClinico->ultima_actualizacion->format('d/m/Y') }}
                        </span>
                    </div>

                @endif


                @if($historialClinico)

                    <button
                        class="btn btn-sm btn-light border d-flex align-items-center gap-1"
                        type="button"
                        data-bs-toggle="collapse"
                        data-bs-target="#{{ $collapseId }}"
                        aria-expanded="false"
                        aria-controls="{{ $collapseId }}"
                    >
                        <span class="historial-clinico-texto">
                            Ver más
                        </span>

                        <i class="ti ti-chevron-down historial-clinico-icon"></i>
                    </button>

                @endif

            </div>

        </div>

    </div>


    {{-- CONTENIDO DESPLEGABLE --}}
    @if($historialClinico)

        <div class="collapse" id="{{ $collapseId }}">

            <div class="border-top">

                <div class="card-body">

                    {{-- ALERTAS --}}
                    @if($alertasActivas->isNotEmpty())

                        <div class="mb-4">

                            <div class="d-flex align-items-center mb-2">
                                <i class="ti ti-alert-triangle text-danger me-2"></i>

                                <span class="fw-bold text-danger">
                                    Alertas médicas
                                </span>
                            </div>

                            <div class="row g-2">

                                @foreach($alertasActivas as $alerta)

                                    <div class="col-12 col-md-6">

                                        <div class="alert alert-danger mb-0 py-2 px-3">

                                            <div class="fw-semibold">
                                                {{ $alerta->titulo }}
                                            </div>

                                            @if($alerta->descripcion)
                                                <small>
                                                    {{ $alerta->descripcion }}
                                                </small>
                                            @endif

                                        </div>

                                    </div>

                                @endforeach

                            </div>

                        </div>

                    @endif


                    {{-- INFORMACIÓN CLÍNICA --}}
                    @if($itemsPorSeccion->isNotEmpty())

                        <div class="row g-3">

                            @foreach($itemsPorSeccion as $seccion => $items)

                                <div class="col-12 col-lg-6">

                                    <div class="border rounded h-100">

                                        <div class="px-3 py-2 bg-light border-bottom">

                                            <span class="fw-bold">
                                                {{ ucfirst(str_replace('_', ' ', $seccion)) }}
                                            </span>

                                        </div>

                                        <div class="p-3">

                                            @foreach($items as $item)

                                                <div
                                                    class="d-flex justify-content-between align-items-start gap-3
                                                    {{ !$loop->last ? 'border-bottom pb-2 mb-2' : '' }}"
                                                >

                                                    <div class="text-muted">
                                                        {{ ucfirst(str_replace('_', ' ', $item->campo)) }}
                                                    </div>

                                                    <div class="text-end">

                                                        <div class="fw-semibold">
                                                            {{ $item->valor ?: '—' }}
                                                        </div>

                                                        @if($item->detalle)
                                                            <small class="text-muted d-block">
                                                                {{ $item->detalle }}
                                                            </small>
                                                        @endif

                                                    </div>

                                                </div>

                                            @endforeach

                                        </div>

                                    </div>

                                </div>

                            @endforeach

                        </div>

                    @else
                        <div class="text-muted">
                            No hay información clínica registrada.
                        </div>

                    @endif
                    {{-- OBSERVACIONES --}}
                    @if($historialClinico->observaciones_generales)

                        <div class="mt-4">

                            <div class="fw-bold mb-2">
                                <i class="ti ti-message-dots me-1"></i>
                                Observaciones generales
                            </div>

                            <div class="bg-light border rounded p-3">
                                {!! nl2br(e($historialClinico->observaciones_generales)) !!}
                            </div>

                        </div>

                    @endif
                    {{-- ACTUALIZACIÓN EN MÓVIL --}}
                    @if($historialClinico?->ultima_actualizacion)

                        <div class="mt-3 d-md-none">
                            <small class="text-muted">
                                Última actualización:
                                <strong>
                                    {{ $historialClinico->ultima_actualizacion->format('d/m/Y H:i') }}
                                </strong>
                            </small>
                        </div>

                    @endif

                </div>

            </div>

        </div>

    @endif

</div>