<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ __('clinic.print_file') }} - {{ $patient->full_name }}</title>
    <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&family=Tajawal:wght@400;700&display=swap" rel="stylesheet">
    <style>
        body {
            font-family: 'Cairo', 'Tajawal', sans-serif;
            color: #1e293b;
            margin: 0;
            padding: 2cm;
            background-color: #fff;
            line-height: 1.6;
        }

        .header-print {
            display: flex;
            justify-content: space-between;
            align-items: center;
            border-bottom: 2px solid #0f172a;
            padding-bottom: 1rem;
            margin-bottom: 2rem;
        }

        .header-left h1 {
            margin: 0;
            font-size: 1.8rem;
            color: #0f172a;
        }

        .header-left p {
            margin: 0.25rem 0 0 0;
            color: #64748b;
        }

        .header-right {
            text-align: left;
        }

        [dir="rtl"] .header-right {
            text-align: right;
        }

        .header-right h2 {
            margin: 0;
            font-size: 1.3rem;
            color: #4f46e5;
        }

        .header-right p {
            margin: 0.25rem 0 0 0;
            font-family: monospace;
            font-weight: 600;
        }

        .section-title {
            font-size: 1.2rem;
            border-bottom: 1px solid #cbd5e1;
            padding-bottom: 0.25rem;
            margin-top: 1.5rem;
            margin-bottom: 1rem;
            color: #0f172a;
            font-weight: 700;
        }

        .info-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 1rem;
            margin-bottom: 1.5rem;
        }

        .info-item dt {
            font-size: 0.8rem;
            color: #64748b;
            font-weight: 600;
        }

        .info-item dd {
            margin: 0.2rem 0 0 0;
            font-weight: 700;
            font-size: 0.95rem;
        }

        .medical-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 1.5rem;
            margin-bottom: 1.5rem;
        }

        .medical-box {
            border: 1px solid #e2e8f0;
            border-radius: 8px;
            padding: 1rem;
        }

        .medical-box h3 {
            margin-top: 0;
            margin-bottom: 0.5rem;
            font-size: 0.95rem;
            color: #4f46e5;
        }

        .medical-box p {
            margin: 0;
            font-size: 0.9rem;
        }

        .visit-card {
            border: 1px solid #cbd5e1;
            border-radius: 8px;
            padding: 1.25rem;
            margin-bottom: 1.5rem;
            page-break-inside: avoid;
        }

        .visit-header {
            display: flex;
            justify-content: space-between;
            border-bottom: 1px dashed #e2e8f0;
            padding-bottom: 0.5rem;
            margin-bottom: 0.75rem;
        }

        .visit-header h4 {
            margin: 0;
            font-size: 1rem;
        }

        .visit-header span {
            font-size: 0.8rem;
            color: #64748b;
            font-weight: 600;
        }

        .vital-table {
            width: 100%;
            border-collapse: collapse;
            margin-bottom: 0.75rem;
        }

        .vital-table th, .vital-table td {
            border: 1px solid #e2e8f0;
            padding: 0.4rem;
            font-size: 0.8rem;
            text-align: center;
        }

        .vital-table th {
            background-color: #f8fafc;
            color: #64748b;
        }

        .visit-detail {
            font-size: 0.9rem;
            margin-bottom: 0.5rem;
        }

        .visit-detail strong {
            color: #0f172a;
        }

        .no-print {
            background-color: #f1f5f9;
            padding: 1rem;
            display: flex;
            justify-content: center;
            border-bottom: 1px solid #cbd5e1;
        }

        .btn-print {
            background-color: #4f46e5;
            color: white;
            border: none;
            padding: 0.5rem 1.5rem;
            font-size: 0.95rem;
            font-weight: 600;
            border-radius: 6px;
            cursor: pointer;
        }

        @media print {
            .no-print {
                display: none;
            }
            body {
                padding: 0;
            }
        }
    </style>
</head>
<body>

    <div class="no-print">
        <button onclick="window.print()" class="btn-print">⎙ {{ __('clinic.print_file') }}</button>
    </div>

    <div class="header-print">
        <div class="header-left">
            <h1>{{ config('app.name', 'Clinic') }}</h1>
            <p>{{ __('clinic.print_file') }}</p>
        </div>
        <div class="header-right">
            <h2>{{ $patient->full_name }}</h2>
            <p>{{ $patient->patient_code }}</p>
        </div>
    </div>

    <!-- Demographics -->
    <div class="section-title">{{ __('clinic.overview') }}</div>
    <dl class="info-grid">
        <div class="info-item">
            <dt>{{ __('clinic.phone') }}</dt>
            <dd>{{ $patient->phone }}</dd>
        </div>
        @if($patient->whatsapp)
        <div class="info-item">
            <dt>{{ __('clinic.whatsapp') }}</dt>
            <dd>{{ $patient->whatsapp }}</dd>
        </div>
        @endif
        <div class="info-item">
            <dt>{{ __('clinic.gender') }}</dt>
            <dd>{{ __('clinic.' . $patient->gender) }}</dd>
        </div>
        <div class="info-item">
            <dt>{{ __('clinic.age') }}</dt>
            <dd>{{ $patient->age ?? '—' }}</dd>
        </div>
        @if($patient->birth_date)
        <div class="info-item">
            <dt>{{ __('clinic.birth_date') }}</dt>
            <dd>{{ $patient->birth_date->format('Y-m-d') }}</dd>
        </div>
        @endif
        @if($patient->national_id)
        <div class="info-item">
            <dt>{{ __('clinic.national_id') }}</dt>
            <dd>{{ $patient->national_id }}</dd>
        </div>
        @endif
        @if($patient->address)
        <div class="info-item" style="grid-column: span 3;">
            <dt>{{ __('clinic.address') }}</dt>
            <dd>{{ $patient->address }}</dd>
        </div>
        @endif
    </dl>

    <!-- Medical Background -->
    <div class="section-title">{{ __('clinic.medical_history') }}</div>
    <div class="medical-grid">
        <div class="medical-box">
            <h3>{{ __('clinic.chronic_diseases') }}</h3>
            <p>{!! nl2br(e($patient->chronic_diseases ?? '—')) !!}</p>
        </div>
        <div class="medical-box">
            <h3>{{ __('clinic.allergies') }}</h3>
            <p>{!! nl2br(e($patient->allergies ?? '—')) !!}</p>
        </div>
        <div class="medical-box">
            <h3>{{ __('clinic.current_medications') }}</h3>
            <p>{!! nl2br(e($patient->current_medications ?? '—')) !!}</p>
        </div>
        <div class="medical-box">
            <h3>{{ __('clinic.medical_history') }}</h3>
            <p>{!! nl2br(e($patient->medical_history ?? '—')) !!}</p>
        </div>
    </div>

    <!-- Visits -->
    <div class="section-title">{{ __('clinic.visits') }}</div>
    @forelse ($patient->visits as $v)
        <div class="visit-card">
            <div class="visit-header">
                <h4>{{ $v->chief_complaint }}</h4>
                <span>{{ $v->visit_date->format('Y-m-d H:i') }} · 👨‍⚕️ {{ $v->doctor->name ?? '—' }}</span>
            </div>

            <!-- Vitals -->
            @if($v->blood_pressure || $v->pulse || $v->temperature || $v->weight || $v->height)
                <table class="vital-table">
                    <thead>
                        <tr>
                            <th>{{ __('clinic.blood_pressure') }}</th>
                            <th>{{ __('clinic.pulse') }}</th>
                            <th>{{ __('clinic.temperature') }}</th>
                            <th>{{ __('clinic.weight') }}</th>
                            <th>{{ __('clinic.height') }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>{{ $v->blood_pressure ?? '—' }}</td>
                            <td>{{ $v->pulse ?? '—' }}</td>
                            <td>{{ $v->temperature ?? '—' }}</td>
                            <td>{{ $v->weight ?? '—' }}</td>
                            <td>{{ $v->height ?? '—' }}</td>
                        </tr>
                    </tbody>
                </table>
            @endif

            @if($v->complaint_details)
                <div class="visit-detail"><strong>{{ __('clinic.complaint_details') }}:</strong> {{ $v->complaint_details }}</div>
            @endif
            @if($v->symptoms)
                <div class="visit-detail"><strong>{{ __('clinic.symptoms') }}:</strong> {{ $v->symptoms }}</div>
            @endif
            @if($v->diagnosis)
                <div class="visit-detail"><strong>{{ __('clinic.diagnosis') }}:</strong> {{ $v->diagnosis }}</div>
            @endif
            @if($v->examination_notes)
                <div class="visit-detail"><strong>{{ __('clinic.examination_notes') }}:</strong> {{ $v->examination_notes }}</div>
            @endif
            @if($v->treatment_plan)
                <div class="visit-detail"><strong>{{ __('clinic.treatment_plan') }}:</strong> {{ $v->treatment_plan }}</div>
            @endif
            @if($v->prescription_notes)
                <div class="visit-detail"><strong>💊 {{ __('clinic.prescription_notes') }}:</strong> {{ $v->prescription_notes }}</div>
            @endif
            @if($v->required_tests)
                <div class="visit-detail"><strong>{{ __('clinic.required_tests') }}:</strong> {{ $v->required_tests }}</div>
            @endif
            @if($v->required_radiology)
                <div class="visit-detail"><strong>{{ __('clinic.required_radiology') }}:</strong> {{ $v->required_radiology }}</div>
            @endif
        </div>
    @empty
        <p style="text-align: center; color: #64748b;">{{ __('clinic.no_records') }}</p>
    @endforelse

    <script>
        window.addEventListener('load', function() {
            setTimeout(function() {
                window.print();
            }, 500);
        });
    </script>
</body>
</html>
