@extends('layouts.admin')

@section('content')
<div class="content-header p-0 mb-3">
    <div class="container-fluid">
        <div class="row align-items-center">
            <div class="col-sm-6">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb bg-transparent p-0 mb-1">
                        <li class="breadcrumb-item"><a href="{{ url('/admin') }}"><i class="fas fa-home"></i> Inicio</a></li>
                        <li class="breadcrumb-item"><a href="{{ route('paciente.portal.historial') }}">Mi Historia Clínica</a></li>
                        <li class="breadcrumb-item active" aria-current="page">Consulta #{{ $historial->id }}</li>
                    </ol>
                </nav>
                <h1 class="m-0 font-weight-bold" style="font-size: 1.55rem; color: var(--dm-text-main, #1e293b);">
                    <i class="fas fa-file-medical text-primary mr-2"></i> Detalle de Consulta Médica
                </h1>
            </div>
            <div class="col-sm-6 text-right">
                <a href="{{ route('paciente.portal.historial.pdf', $historial->id) }}" target="_blank" class="btn btn-success shadow-sm font-weight-bold mr-2">
                    <i class="fas fa-print mr-1"></i> Imprimir Consulta (PDF)
                </a>
                <a href="{{ route('paciente.portal.historial') }}" class="btn btn-outline-secondary shadow-sm">
                    <i class="fas fa-arrow-left mr-1"></i> Volver al Historial
                </a>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <!-- Columna Izquierda: Información de la Consulta y Signos Vitales -->
    <div class="col-lg-4 col-md-12 mb-4">
        <!-- Tarjeta de la Visita Médica -->
        <div class="card shadow-sm border-0 mb-4" style="border-radius: 14px; background: var(--dm-bg-card, #ffffff);">
            <div class="card-header bg-transparent py-3 border-bottom" style="background: linear-gradient(135deg, rgba(37, 99, 235, 0.08) 0%, rgba(14, 165, 233, 0.08) 100%);">
                <h6 class="mb-0 font-weight-bold text-primary">
                    <i class="fas fa-calendar-check mr-2"></i> Datos de la Atención
                </h6>
            </div>
            <div class="card-body p-3">
                <div class="mb-3">
                    <span class="text-muted d-block small text-uppercase font-weight-bold">Fecha de Atención:</span>
                    <span class="font-weight-bold" style="font-size: 1.1rem; color: var(--dm-text-main, #1e293b);">
                        {{ \Carbon\Carbon::parse($historial->fecha_visita)->isoFormat('LL') }}
                    </span>
                </div>
                <div class="mb-3">
                    <span class="text-muted d-block small text-uppercase font-weight-bold">Médico Tratante:</span>
                    <span class="font-weight-bold" style="font-size: 1rem; color: var(--dm-text-main, #1e293b);">
                        {{ $historial->doctor ? 'Dr(a). '.$historial->doctor->nombres.' '.$historial->doctor->apellidos : 'Personal Médico Autorizado' }}
                    </span>
                    @if($historial->doctor && $historial->doctor->especialidad)
                        <div class="badge badge-light border text-primary mt-1">{{ $historial->doctor->especialidad }}</div>
                    @endif
                </div>
                <div class="mb-3">
                    <span class="text-muted d-block small text-uppercase font-weight-bold">Historia Clínica N°:</span>
                    <span class="badge badge-primary px-2 py-1 font-weight-bold" style="font-size: 0.9rem;">
                        {{ $paciente->nro_historia_clinica }}
                    </span>
                </div>
                <div>
                    <span class="text-muted d-block small text-uppercase font-weight-bold">Paciente:</span>
                    <span class="font-weight-bold" style="color: var(--dm-text-main, #1e293b);">
                        {{ $paciente->nombres }} {{ $paciente->apellidos }}
                    </span>
                    <div class="small text-muted">C.I.: {{ $paciente->cedula }} | {{ $paciente->edad }} años</div>
                </div>
            </div>
        </div>

        <!-- Tarjeta de Signos Vitales -->
        <div class="card shadow-sm border-0 mb-4" style="border-radius: 14px; background: var(--dm-bg-card, #ffffff);">
            <div class="card-header bg-transparent py-3 border-bottom">
                <h6 class="mb-0 font-weight-bold text-danger">
                    <i class="fas fa-heartbeat mr-2"></i> Signos Vitales Registrados
                </h6>
            </div>
            <div class="card-body p-3">
                <div class="row text-center">
                    <div class="col-6 mb-3">
                        <div class="p-2 rounded border bg-light">
                            <span class="text-muted d-block small">Presión Arterial</span>
                            <span class="font-weight-bold text-primary" style="font-size: 1.15rem;">
                                {{ $historial->presion_arterial ?: '---' }}
                            </span>
                            <small class="text-muted d-block">mmHg</small>
                        </div>
                    </div>
                    <div class="col-6 mb-3">
                        <div class="p-2 rounded border bg-light">
                            <span class="text-muted d-block small">Temperatura</span>
                            <span class="font-weight-bold text-danger" style="font-size: 1.15rem;">
                                {{ $historial->temperatura ? $historial->temperatura.' °C' : '---' }}
                            </span>
                            <small class="text-muted d-block">Celsius</small>
                        </div>
                    </div>
                    <div class="col-6 mb-3">
                        <div class="p-2 rounded border bg-light">
                            <span class="text-muted d-block small">Pulso / FC</span>
                            <span class="font-weight-bold text-success" style="font-size: 1.15rem;">
                                {{ $historial->pulso ?: '---' }}
                            </span>
                            <small class="text-muted d-block">lat/min</small>
                        </div>
                    </div>
                    <div class="col-6 mb-3">
                        <div class="p-2 rounded border bg-light">
                            <span class="text-muted d-block small">Frec. Respiratoria</span>
                            <span class="font-weight-bold text-info" style="font-size: 1.15rem;">
                                {{ $historial->frecuencia_respiratoria ?: '---' }}
                            </span>
                            <small class="text-muted d-block">resp/min</small>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="p-2 rounded border bg-light">
                            <span class="text-muted d-block small">Peso</span>
                            <span class="font-weight-bold text-dark" style="font-size: 1.15rem;">
                                {{ $historial->peso ? $historial->peso.' kg' : '---' }}
                            </span>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="p-2 rounded border bg-light">
                            <span class="text-muted d-block small">Talla / Estatura</span>
                            <span class="font-weight-bold text-dark" style="font-size: 1.15rem;">
                                {{ $historial->talla ? $historial->talla.' m' : '---' }}
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Columna Derecha: Motivo, Examen, Diagnóstico y Tratamiento -->
    <div class="col-lg-8 col-md-12">
        <div class="card shadow-sm border-0 mb-4" style="border-radius: 14px; background: var(--dm-bg-card, #ffffff);">
            <div class="card-header bg-transparent py-3 border-bottom d-flex justify-content-between align-items-center">
                <h5 class="mb-0 font-weight-bold text-primary">
                    <i class="fas fa-stethoscope mr-2"></i> Informe Clínico de la Consulta
                </h5>
                <span class="badge badge-light border text-muted">Solo Lectura</span>
            </div>
            <div class="card-body p-4">

                <!-- Motivo de Consulta -->
                <div class="mb-4">
                    <h6 class="font-weight-bold text-secondary text-uppercase small" style="letter-spacing: 0.5px;">
                        <i class="fas fa-comment-medical text-primary mr-1"></i> Motivo de Consulta
                    </h6>
                    <div class="p-3 rounded-lg border bg-light font-weight-bold" style="color: var(--dm-text-main, #1e293b); font-size: 1.05rem;">
                        {{ $historial->motivo_consulta ?: 'Sin especificar' }}
                    </div>
                </div>

                @if(!empty($historial->enfermedad_actual))
                <!-- Enfermedad Actual -->
                <div class="mb-4">
                    <h6 class="font-weight-bold text-secondary text-uppercase small" style="letter-spacing: 0.5px;">
                        <i class="fas fa-file-lines text-info mr-1"></i> Enfermedad o Problema Actual
                    </h6>
                    <div class="p-3 rounded-lg border" style="background: rgba(14, 165, 233, 0.04);">
                        {!! nl2br(e($historial->enfermedad_actual)) !!}
                    </div>
                </div>
                @endif

                @if(!empty($historial->examen_fisico))
                <!-- Examen Físico -->
                <div class="mb-4">
                    <h6 class="font-weight-bold text-secondary text-uppercase small" style="letter-spacing: 0.5px;">
                        <i class="fas fa-user-check text-success mr-1"></i> Hallazgos del Examen Físico
                    </h6>
                    <div class="p-3 rounded-lg border bg-light">
                        {!! nl2br(e($historial->examen_fisico)) !!}
                    </div>
                </div>
                @endif

                <!-- Diagnósticos -->
                <div class="mb-4">
                    <h6 class="font-weight-bold text-secondary text-uppercase small" style="letter-spacing: 0.5px;">
                        <i class="fas fa-stethoscope text-warning mr-1"></i> Diagnóstico(s) Establecido(s)
                    </h6>
                    <div class="p-3 rounded-lg border bg-light">
                        @if(!empty($historial->diagnostico_cie))
                            <div class="mb-2">
                                <span class="badge badge-primary px-2 py-1 font-weight-bold mr-2">CIE-10:</span>
                                <span class="font-weight-bold" style="font-size: 1.05rem;">{{ $historial->diagnostico_cie }}</span>
                                @if(!empty($historial->diagnostico_codigo))
                                    <span class="text-muted ml-1">({{ $historial->diagnostico_codigo }})</span>
                                @endif
                            </div>
                        @endif

                        @if(!empty($historial->definitivo))
                            <div class="mb-1">
                                <span class="badge badge-success px-2 py-1 font-weight-bold mr-2">Definitivo:</span>
                                <span>{{ $historial->definitivo }}</span>
                            </div>
                        @endif

                        @if(!empty($historial->presuntivo))
                            <div class="mb-1">
                                <span class="badge badge-secondary px-2 py-1 font-weight-bold mr-2">Presuntivo:</span>
                                <span>{{ $historial->presuntivo }}</span>
                            </div>
                        @endif

                        @if(empty($historial->diagnostico_cie) && empty($historial->definitivo) && empty($historial->presuntivo))
                            <span class="text-muted">Evaluación médica general y control preventivo.</span>
                        @endif
                    </div>
                </div>

                <!-- Plan de Tratamiento / Indicaciones -->
                <div class="mb-4">
                    <h6 class="font-weight-bold text-secondary text-uppercase small" style="letter-spacing: 0.5px;">
                        <i class="fas fa-prescription text-primary mr-1"></i> Plan de Tratamiento e Indicaciones Médicas
                    </h6>
                    <div class="p-3 rounded-lg border" style="background: rgba(37, 99, 235, 0.05); border-left: 4px solid #2563eb !important;">
                        @if(!empty($historial->tratamiento))
                            <div style="font-size: 1rem; line-height: 1.6; color: var(--dm-text-main, #1e293b);">
                                {!! nl2br(e($historial->tratamiento)) !!}
                            </div>
                        @else
                            <span class="text-muted">Tratamiento según pautas de receta médica adjunta.</span>
                        @endif
                    </div>
                </div>

            </div>

            <!-- Footer con Botones de Acción (Solo Ver e Imprimir) -->
            <div class="card-footer bg-transparent py-3 border-top d-flex justify-content-between align-items-center">
                <a href="{{ route('paciente.portal.historial') }}" class="btn btn-secondary">
                    <i class="fas fa-arrow-left mr-1"></i> Volver a Mis Consultas
                </a>
                <a href="{{ route('paciente.portal.historial.pdf', $historial->id) }}" target="_blank" class="btn btn-success font-weight-bold shadow-sm">
                    <i class="fas fa-print mr-1"></i> Imprimir Informe en PDF
                </a>
            </div>
        </div>
    </div>
</div>
@endsection