@extends('index')

@section('titulo', 'Expediente — ' . $paciente->nombre)

@section('style')
    <link href="{{ asset('css/custom.css') }}" rel="stylesheet">
    <style>
        .seccion-exp { margin-bottom: 2rem; }
        .hc-badge {
            display: inline-block;
            padding: 3px 10px;
            border-radius: 20px;
            font-size: 0.73rem;
            font-weight: 600;
            margin: 2px 3px 2px 0;
        }
        .hc-si  { background: #dcfce7; color: #166534; }
        .hc-no  { background: #f1f5f9; color: #64748b; }
        .badge-estatus-exp {
            display: inline-block;
            padding: 3px 10px;
            border-radius: 20px;
            font-size: 0.73rem;
            font-weight: 600;
            color: #fff;
        }
    </style>
@endsection

@section('menu')
    @include('MenuLayout.menu_clinica')
@endsection

@section('contenido')
@php
    $coloresEstatus = [
        'activo'        => '#3b82f6',
        'en_proceso'    => '#f59e0b',
        'completado'    => '#22c55e',
        'baja'          => '#dc2626',
        'reprogramable' => '#8b5cf6',
        'reprogramado'  => '#14b8a6',
        'no_presentado' => '#6b7280',
    ];
    $hc = $paciente->historiaClinica;
@endphp

<div id="kt_app_content_container" class="app-container container-fluid">

    {{-- Botón regresar --}}
    <div class="mb-5">
        <a href="{{ route('consultas.index') }}" class="btn btn-sm btn-light-primary fw-semibold">
            <i class="ki-duotone ki-arrow-left fs-4 me-1"><span class="path1"></span><span class="path2"></span></i>
            Regresar a Consultas
        </a>
    </div>

    {{-- ══════════════════════════════════════
         ENCABEZADO DEL PACIENTE
    ══════════════════════════════════════ --}}
    <div class="card mb-6">
        <div class="card-body pt-5 pb-4">
            <div class="d-flex align-items-center gap-4">
                {{-- Avatar inicial --}}
                <div class="symbol symbol-65px symbol-circle flex-shrink-0">
                    <span class="symbol-label fs-2 fw-bold text-white"
                          style="background-color: #3b82f6">
                        {{ strtoupper(substr($paciente->nombre, 0, 1)) }}
                    </span>
                </div>
                <div>
                    <h2 class="fs-2 fw-bold text-gray-900 mb-1">{{ $paciente->nombre }}</h2>
                    <div class="d-flex flex-wrap gap-4 text-gray-500 fs-7">
                        @if($paciente->folio?->codigo_folio)
                            <span><i class="ki-duotone ki-badge fs-6 me-1"><span class="path1"></span><span class="path2"></span></i>
                            Folio: <strong class="text-gray-700">{{ $paciente->folio->codigo_folio }}</strong></span>
                        @endif
                        @if($paciente->fec_nac)
                            <span><i class="ki-duotone ki-calendar fs-6 me-1"><span class="path1"></span><span class="path2"></span></i>
                            {{ \Carbon\Carbon::parse($paciente->fec_nac)->format('d/m/Y') }}
                            ({{ $paciente->edad }} años)</span>
                        @endif
                        <span>
                            @if($paciente->sexo == 1)
                                <i class="ki-duotone ki-man fs-6 me-1 text-primary"><span class="path1"></span><span class="path2"></span></i> Masculino
                            @elseif($paciente->sexo == 2)
                                <i class="ki-duotone ki-woman fs-6 me-1 text-danger"><span class="path1"></span><span class="path2"></span></i> Femenino
                            @else
                                —
                            @endif
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row g-5">

        {{-- ══════════════════════════════════════
             COLUMNA IZQUIERDA: Datos + Dirección + Historia
        ══════════════════════════════════════ --}}
        <div class="col-lg-5">

            {{-- Datos personales --}}
            <div class="card mb-5">
                <div class="card-header pt-4 pb-3 border-bottom">
                    <h5 class="card-title fw-bold text-gray-800 mb-0">
                        <i class="ki-duotone ki-profile-circle fs-3 text-primary me-2">
                            <span class="path1"></span><span class="path2"></span><span class="path3"></span>
                        </i>Datos Personales
                    </h5>
                </div>
                <div class="card-body py-4">
                    @php
                        $datos = [
                            'CURP'          => $paciente->curp ?? '—',
                            'Teléfono'      => $paciente->telefono ?? '—',
                            'Correo'        => $paciente->email ?? '—',
                            'Estado civil'  => $paciente->estadoCivil?->descripcion ?? '—',
                            'Ocupación'     => $paciente->oficio?->descripcion ?? '—',
                        ];
                    @endphp
                    @foreach($datos as $etiqueta => $valor)
                        <div class="d-flex justify-content-between py-2 border-bottom border-dashed">
                            <span class="text-gray-500 fw-semibold fs-7">{{ $etiqueta }}</span>
                            <span class="text-gray-800 fw-semibold fs-7 text-end">{{ $valor }}</span>
                        </div>
                    @endforeach
                </div>
            </div>

            {{-- Dirección --}}
            @if($paciente->direccion)
            <div class="card mb-5">
                <div class="card-header pt-4 pb-3 border-bottom">
                    <h5 class="card-title fw-bold text-gray-800 mb-0">
                        <i class="ki-duotone ki-geolocation fs-3 text-success me-2">
                            <span class="path1"></span><span class="path2"></span>
                        </i>Dirección
                    </h5>
                </div>
                <div class="card-body py-4">
                    @php $dir = $paciente->direccion; @endphp
                    <p class="text-gray-700 fs-7 mb-1">
                        {{ $dir->calle_numero ?? '—' }}
                        @if($dir->colonia), Col. {{ $dir->colonia }}@endif
                    </p>
                    <p class="text-gray-600 fs-7 mb-0">
                        {{ $dir->ciudad ?? '' }}
                        @if($dir->estado), {{ $dir->estado }}@endif
                        @if($dir->codigo_postal) &nbsp;C.P. {{ $dir->codigo_postal }}@endif
                    </p>
                </div>
            </div>
            @endif

            {{-- Historia Clínica --}}
            @if($hc)
            <div class="card">
                <div class="card-header pt-4 pb-3 border-bottom">
                    <h5 class="card-title fw-bold text-gray-800 mb-0">
                        <i class="ki-duotone ki-heart fs-3 text-danger me-2">
                            <span class="path1"></span><span class="path2"></span>
                        </i>Historia Clínica
                    </h5>
                </div>
                <div class="card-body py-4">

                    {{-- Antecedentes familiares --}}
                    <p class="text-gray-600 fw-bold fs-8 text-uppercase mb-2">Antecedentes Familiares</p>
                    <div class="mb-4">
                        <span class="hc-badge {{ $hc->ant_fam_diabetes ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->ant_fam_diabetes ? '✓' : '✗' }} Diabetes
                        </span>
                        <span class="hc-badge {{ $hc->ant_fam_cancer ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->ant_fam_cancer ? '✓' : '✗' }} Cáncer
                        </span>
                        <span class="hc-badge {{ $hc->ant_fam_presion_alta ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->ant_fam_presion_alta ? '✓' : '✗' }} Presión Alta
                        </span>
                        @if($hc->ant_fam_otros)
                            <span class="hc-badge hc-si">✓ Otras: {{ $hc->ant_fam_otros }}</span>
                        @endif
                    </div>

                    {{-- Antecedentes patológicos --}}
                    <p class="text-gray-600 fw-bold fs-8 text-uppercase mb-2">Antecedentes Patológicos</p>
                    <div class="mb-4">
                        <span class="hc-badge {{ $hc->pat_alergias ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->pat_alergias ? '✓' : '✗' }} Alergias
                        </span>
                        <span class="hc-badge {{ $hc->pat_medicamentos ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->pat_medicamentos ? '✓' : '✗' }} Medicamentos
                        </span>
                        <span class="hc-badge {{ $hc->pat_cirugias ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->pat_cirugias ? '✓' : '✗' }} Cirugías
                        </span>
                        <span class="hc-badge {{ $hc->pat_transfusiones ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->pat_transfusiones ? '✓' : '✗' }} Transfusiones
                        </span>
                        <span class="hc-badge {{ $hc->pat_hepatitis ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->pat_hepatitis ? '✓' : '✗' }} Hepatitis
                        </span>
                        <span class="hc-badge {{ $hc->pat_diabetico ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->pat_diabetico ? '✓' : '✗' }} Diabético
                        </span>
                        <span class="hc-badge {{ $hc->pat_presion_alta ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->pat_presion_alta ? '✓' : '✗' }} Presión Alta
                        </span>
                        @if($hc->pat_enfermedades_importantes)
                            <div class="mt-2">
                                <span class="text-gray-500 fs-8 fw-semibold">Enfermedades importantes:</span>
                                <span class="text-gray-700 fs-7">{{ $hc->pat_enfermedades_importantes }}</span>
                            </div>
                        @endif
                    </div>

                    {{-- Antecedentes no patológicos --}}
                    <p class="text-gray-600 fw-bold fs-8 text-uppercase mb-2">Hábitos y Estilo de Vida</p>
                    <div class="mb-4">
                        <span class="hc-badge {{ $hc->nopat_fuma ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->nopat_fuma ? '✓' : '✗' }} Fuma
                        </span>
                        <span class="hc-badge {{ $hc->nopat_alcohol ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->nopat_alcohol ? '✓' : '✗' }} Alcohol
                        </span>
                        <span class="hc-badge {{ $hc->nopat_drogas ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->nopat_drogas ? '✓' : '✗' }} Drogas
                        </span>
                        <span class="hc-badge {{ $hc->nopat_ejercicio ? 'hc-si' : 'hc-no' }}">
                            {{ $hc->nopat_ejercicio ? '✓' : '✗' }} Ejercicio
                        </span>
                    </div>

                    {{-- Motivo inicial --}}
                    @if($hc->motivo_consulta_inicial)
                        <p class="text-gray-600 fw-bold fs-8 text-uppercase mb-1">Motivo de Consulta Inicial</p>
                        <p class="text-gray-700 fs-7 mb-0 p-3 bg-light rounded">
                            {{ $hc->motivo_consulta_inicial }}
                        </p>
                    @endif

                </div>
            </div>
            @endif

        </div>

        {{-- ══════════════════════════════════════
             COLUMNA DERECHA: Historial de consultas
        ══════════════════════════════════════ --}}
        <div class="col-lg-7">
            <div class="card">
                <div class="card-header pt-4 pb-3 border-bottom">
                    <h5 class="card-title fw-bold text-gray-800 mb-0">
                        <i class="ki-duotone ki-calendar-tick fs-3 text-primary me-2">
                            <span class="path1"></span><span class="path2"></span>
                            <span class="path3"></span><span class="path4"></span>
                            <span class="path5"></span><span class="path6"></span>
                        </i>Historial de Consultas
                        <span class="badge badge-light-primary ms-2 fs-8">{{ $paciente->consultas->count() }}</span>
                    </h5>
                </div>
                <div class="card-body p-0">
                    @if($paciente->consultas->isEmpty())
                        <div class="text-center py-10">
                            <p class="text-gray-400 fs-7">Este paciente no tiene consultas registradas.</p>
                        </div>
                    @else
                        <div class="table-responsive">
                            <table class="table table-row-dashed table-row-gray-200 align-middle gs-4 gy-3 mb-0">
                                <thead>
                                    <tr class="fw-bold text-gray-500 fs-8 text-uppercase bg-light">
                                        <th class="ps-5">Fecha</th>
                                        <th>Hora</th>
                                        <th>Médico</th>
                                        <th>Tipo</th>
                                        <th>Estatus</th>
                                        <th>Motivo</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($paciente->consultas as $consulta)
                                    @php
                                        $slugEst = $consulta->estatus?->slug ?? '';
                                        $colorEst = $coloresEstatus[$slugEst] ?? '#6b7280';
                                        $esFuncional = $consulta->fk_tipo_consulta == \App\Models\TipoConsulta::FUNCIONAL;
                                    @endphp
                                    <tr>
                                        <td class="ps-5">
                                            <span class="text-gray-700 fw-semibold fs-8">
                                                {{ \Carbon\Carbon::parse($consulta->fecha)->format('d/m/Y') }}
                                            </span>
                                        </td>
                                        <td>
                                            <span class="text-gray-600 fs-8">
                                                {{ substr((string) $consulta->hora, 0, 5) }}
                                            </span>
                                        </td>
                                        <td>
                                            <span class="text-gray-600 fs-8">
                                                {{ $consulta->doctor?->nombre ?? 'Ambos médicos' }}
                                            </span>
                                        </td>
                                        <td>
                                            <span class="badge fs-8"
                                                  style="background:{{ $esFuncional ? '#dcfce7' : '#dbeafe' }};
                                                         color:{{ $esFuncional ? '#166534' : '#1e40af' }}">
                                                {{ $consulta->tipoConsulta?->nombre ?? '—' }}
                                            </span>
                                        </td>
                                        <td>
                                            <span class="badge-estatus-exp" style="background-color:{{ $colorEst }}">
                                                {{ $consulta->estatus?->descripcion ?? '—' }}
                                            </span>
                                        </td>
                                        <td>
                                            <span class="text-gray-600 fs-8">
                                                {{ $consulta->motivo ?? '—' }}
                                            </span>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    @endif
                </div>
            </div>
        </div>

    </div>{{-- fin row --}}
</div>
@endsection