<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Appointment {{ $appointment->ref_no }}</title>
<style>
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
* { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }

body {
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 13px;
    color: #1e293b;
    background: #fff;
}

.page {
    max-width: 860px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* ── Letterhead ─────────────────────────────────────────── */
.letterhead {
    background: linear-gradient(135deg, #1a3a5c 0%, #2563eb 60%, #3b82f6 100%);
    color: #fff;
    padding: 22px 32px 18px;
    position: relative;
    overflow: hidden;
}
.letterhead::after {
    content: '';
    position: absolute; inset: 0;
    background-image: radial-gradient(circle, rgba(255,255,255,.08) 1px, transparent 1px);
    background-size: 18px 18px;
    pointer-events: none;
}
.letterhead-inner { position: relative; z-index: 1; display: flex; align-items: center; gap: 18px; }
.clinic-icon {
    width: 56px; height: 56px; border-radius: 14px; flex-shrink: 0;
    background: rgba(255,255,255,.18);
    border: 1.5px solid rgba(255,255,255,.32);
    display: flex; align-items: center; justify-content: center;
    font-size: 26px;
}
.clinic-name { font-size: 21px; font-weight: 800; letter-spacing: -.3px; margin-bottom: 3px; }
.clinic-contact { font-size: 11.5px; color: rgba(255,255,255,.82); display: flex; flex-wrap: wrap; gap: 12px; }

/* ── Appointment strip ──────────────────────────────────── */
.apt-strip {
    background: #f1f5f9;
    border-bottom: 2px solid #e2e8f0;
    padding: 11px 32px;
    display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.apt-chip {
    background: linear-gradient(135deg, #1a3a5c, #2563eb);
    color: #fff; padding: 3px 13px; border-radius: 20px;
    font-size: 10.5px; font-weight: 700; letter-spacing: .5px;
}
.apt-ref { font-size: 16px; font-weight: 800; color: #1a3a5c; }
.apt-status {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 3px 10px; border-radius: 20px;
    font-size: 11px; font-weight: 700;
}
.apt-type-badge {
    padding: 2px 10px; border-radius: 12px;
    font-size: 11px; font-weight: 600;
    background: #dbeafe; color: #1e40af;
    border: 1px solid #bfdbfe;
}
.apt-strip-right { margin-left: auto; font-size: 11.5px; color: #64748b; text-align: right; }

/* ── Body ───────────────────────────────────────────────── */
.body { padding: 22px 32px; flex: 1; }

/* ── Section heading ────────────────────────────────────── */
.sec-hd {
    font-size: 10.5px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .6px; color: #475569;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 6px; margin-bottom: 12px; margin-top: 20px;
    display: flex; align-items: center; gap: 6px;
}
.sec-hd:first-child { margin-top: 0; }

/* ── Info cards grid ────────────────────────────────────── */
.info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 4px;
}
.info-card {
    border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden;
}
.info-card-hd {
    background: #f8fafc; padding: 5px 12px;
    font-size: 10px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .5px; color: #64748b;
    border-bottom: 1px solid #e2e8f0;
    display: flex; align-items: center; gap: 5px;
}
.info-card-body { padding: 10px 12px; }
.info-name { font-size: 14px; font-weight: 700; color: #1e293b; margin-bottom: 2px; }
.info-sub { font-size: 11.5px; color: #64748b; margin-top: 1px; }

/* ── Vitals row ─────────────────────────────────────────── */
.vitals-row { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 4px; }
.vital-box {
    flex: 1; min-width: 110px;
    background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px;
    padding: 10px; text-align: center;
}
.vital-label { font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: #94a3b8; margin-bottom: 4px; }
.vital-value { font-size: 20px; font-weight: 800; color: #1e293b; }
.vital-unit { font-size: 10px; color: #94a3b8; margin-top: 2px; }

/* ── SOAP boxes ─────────────────────────────────────────── */
.soap-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.soap-box { border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; }
.soap-box.s-box { border-left: 4px solid #3b82f6; }
.soap-box.o-box { border-left: 4px solid #22c55e; }
.soap-box.a-box { border-left: 4px solid #f59e0b; }
.soap-box.p-box { border-left: 4px solid #a855f7; }
.soap-box-hd {
    padding: 6px 12px; background: #f8fafc; border-bottom: 1px solid #e2e8f0;
    font-size: 10.5px; font-weight: 700; text-transform: uppercase;
    letter-spacing: .5px; color: #475569;
}
.soap-box-body { padding: 10px 12px; font-size: 12.5px; color: #334155; white-space: pre-wrap; min-height: 40px; }

/* ── Med plan list ──────────────────────────────────────── */
.med-item {
    display: flex; gap: 12px; align-items: flex-start;
    padding: 10px 0; border-bottom: 1px dashed #e9eef3;
}
.med-item:last-child { border-bottom: none; }
.med-num {
    width: 26px; height: 26px; border-radius: 50%; flex-shrink: 0;
    background: linear-gradient(135deg, #1a3a5c, #2563eb);
    color: #fff; font-weight: 800; font-size: 11px;
    display: flex; align-items: center; justify-content: center;
}
.med-name { font-size: 13px; font-weight: 700; color: #1e293b; margin-bottom: 4px; }
.med-pills { display: flex; flex-wrap: wrap; gap: 4px; }
.med-pill {
    display: inline-flex; align-items: center; gap: 3px;
    background: #f1f5f9; border: 1px solid #e2e8f0;
    border-radius: 10px; padding: 1px 8px;
    font-size: 10.5px; color: #475569; font-weight: 600;
}
.med-instr { font-size: 11px; color: #64748b; font-style: italic; margin-top: 3px; }

/* ── Vaccination table ──────────────────────────────────── */
table.vax-tbl { width: 100%; border-collapse: collapse; font-size: 12px; }
table.vax-tbl th {
    background: #1a3a5c; color: #fff;
    padding: 6px 10px; text-align: left; font-size: 10.5px; font-weight: 700; letter-spacing: .3px;
}
table.vax-tbl td { padding: 7px 10px; border-bottom: 1px solid #f0f0f0; }
table.vax-tbl tr:last-child td { border-bottom: none; }
table.vax-tbl tr:nth-child(even) td { background: #f8fafc; }

/* ── Prescription block ─────────────────────────────────── */
.rx-block {
    border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; margin-bottom: 10px;
}
.rx-block-hd {
    background: #f1f5f9; padding: 7px 14px;
    display: flex; align-items: center; gap: 10px;
    border-bottom: 1px solid #e2e8f0;
}
.rx-symbol { font-size: 18px; font-weight: 900; font-family: serif; color: #1a3a5c; }
.rx-ref-badge {
    background: #dbeafe; color: #1e40af; border: 1px solid #bfdbfe;
    border-radius: 12px; padding: 1px 9px; font-size: 10.5px; font-weight: 700;
}
.rx-block-body { padding: 10px 14px; }

/* ── Notes list ─────────────────────────────────────────── */
.note-item {
    padding: 10px 0; border-bottom: 1px dashed #e9eef3;
}
.note-item:last-child { border-bottom: none; }
.note-title { font-weight: 700; font-size: 12.5px; color: #1e293b; margin-bottom: 2px; }
.note-body { font-size: 12px; color: #334155; white-space: pre-wrap; }
.note-meta { font-size: 10px; color: #94a3b8; margin-top: 3px; }

/* ── Conditions chips ───────────────────────────────────── */
.cond-chip {
    display: inline-block; border-radius: 10px; padding: 2px 9px;
    font-size: 11px; margin: 2px; border: 1px solid transparent;
    font-weight: 600;
}
.cond-chip.active   { background: #fdecea; border-color: #f5c6cb; color: #721c24; }
.cond-chip.chronic  { background: #fff3cd; border-color: #ffc107; color: #856404; }
.cond-chip.resolved { background: #d4edda; border-color: #c3e6cb; color: #155724; }

/* ── Doctor notes box ───────────────────────────────────── */
.doc-notes-box {
    background: #fefce8; border: 1px solid #fde68a;
    border-left: 4px solid #f59e0b; border-radius: 8px;
    padding: 10px 14px; font-size: 13px; color: #78350f; white-space: pre-wrap;
}

/* ── Footer ─────────────────────────────────────────────── */
.footer {
    padding: 10px 32px;
    border-top: 1px solid #e2e8f0;
    display: flex; align-items: center; justify-content: space-between;
    font-size: 10.5px; color: #94a3b8; background: #f8fafc;
    margin-top: 22px;
}

/* ── Empty state ────────────────────────────────────────── */
.empty-state { text-align: center; padding: 16px; color: #94a3b8; font-size: 12px; }

@media print {
    @page { margin: 0; }
    body { padding: 0; }
    .page { max-width: 100%; }
}
</style>
</head>
<body>
@php
$statusColors = [
    'pending'     => '#f59e0b',
    'confirmed'   => '#3b82f6',
    'in_progress' => '#8b5cf6',
    'completed'   => '#22c55e',
    'cancelled'   => '#ef4444',
    'no_show'     => '#94a3b8',
];
$typeIcons = [
    'checkup'     => '🩺',
    'vaccination' => '💉',
    'surgery'     => '🔬',
    'grooming'    => '✂️',
    'emergency'   => '🚨',
    'other'       => '📋',
];
$sc  = $statusColors[$appointment->status] ?? '#94a3b8';
$tIc = $typeIcons[$appointment->type] ?? '📋';

$hasVitals = $appointment->weight_kg || $appointment->temperature || $appointment->heart_rate || $appointment->respiratory_rate;
$hasSoap   = $appointment->soap_subjective || $appointment->soap_objective || $appointment->soap_assessment || $appointment->soap_plan;
$hasMeds   = !empty($appointment->soap_plan_meds_json) && count(json_decode($appointment->soap_plan_meds_json ?? '[]', true)) > 0;
$planMeds  = $hasMeds ? json_decode($appointment->soap_plan_meds_json, true) : [];
$conditions = optional($appointment->pet)->conditions ?? collect();
@endphp

<div class="page">

    {{-- Letterhead --}}
    <div class="letterhead">
        <div class="letterhead-inner">
            <div class="clinic-icon">🐾</div>
            <div>
                <div class="clinic-name">{{ $business->name ?? 'Vet Clinic' }}</div>
                <div class="clinic-contact">
                    @if(!empty($business->mobile))
                    <span>📞 {{ $business->mobile }}</span>
                    @endif
                    @if(!empty($business->email))
                    <span>✉ {{ $business->email }}</span>
                    @endif
                    @if(!empty($business->city))
                    <span>📍 {{ $business->city }}</span>
                    @endif
                </div>
            </div>
        </div>
    </div>

    {{-- Appointment strip --}}
    <div class="apt-strip">
        <span class="apt-chip">APPOINTMENT</span>
        <span class="apt-ref">{{ $appointment->ref_no }}</span>
        <span class="apt-status" style="background:{{ $sc }}22;color:{{ $sc }};border:1px solid {{ $sc }}44;">
            ● {{ ucfirst(str_replace('_', ' ', $appointment->status)) }}
        </span>
        @if($appointment->type)
        <span class="apt-type-badge">{{ $tIc }} {{ ucfirst($appointment->type) }}</span>
        @endif
        <div class="apt-strip-right">
            <div>{{ optional($appointment->appointment_date)->format('l, d M Y') }}</div>
            @if($appointment->appointment_time)
            <div>{{ \Carbon\Carbon::parse($appointment->appointment_time)->format('h:i A') }}
                @if($appointment->duration_minutes)
                &nbsp;·&nbsp; {{ $appointment->duration_minutes }} min
                @endif
            </div>
            @endif
        </div>
    </div>

    <div class="body">

        {{-- Patient / Owner / Doctor / Department --}}
        <div class="sec-hd">📋 Appointment Details</div>
        <div class="info-grid">
            <div class="info-card">
                <div class="info-card-hd">🐾 Patient (Pet)</div>
                <div class="info-card-body">
                    <div class="info-name">{{ optional($appointment->pet)->petname ?? '—' }}</div>
                    <div class="info-sub">
                        {{ optional($appointment->pet)->species }}
                        {{ optional($appointment->pet)->breed ? '· ' . $appointment->pet->breed : '' }}
                    </div>
                    @if(optional($appointment->pet)->gender)
                    <div class="info-sub">{{ ucfirst($appointment->pet->gender) }}</div>
                    @endif
                    @if(optional($appointment->pet)->weight_kg)
                    <div class="info-sub">Weight: {{ $appointment->pet->weight_kg }} kg</div>
                    @endif
                    @if(optional($appointment->pet)->microchip_no)
                    <div class="info-sub">Chip: {{ $appointment->pet->microchip_no }}</div>
                    @endif
                </div>
            </div>

            <div class="info-card">
                <div class="info-card-hd">👤 Owner</div>
                <div class="info-card-body">
                    <div class="info-name">{{ optional($appointment->owner)->name ?? '—' }}</div>
                    @if(optional($appointment->owner)->mobile)
                    <div class="info-sub">📞 {{ $appointment->owner->mobile }}</div>
                    @endif
                    @if(optional($appointment->owner)->email)
                    <div class="info-sub">✉ {{ $appointment->owner->email }}</div>
                    @endif
                </div>
            </div>

            @if(optional($appointment->doctor)->name)
            <div class="info-card">
                <div class="info-card-hd">👨‍⚕️ Doctor</div>
                <div class="info-card-body">
                    <div class="info-name">{{ $appointment->doctor->name }}</div>
                    @if($appointment->doctor->specialization)
                    <div class="info-sub">{{ $appointment->doctor->specialization }}</div>
                    @endif
                </div>
            </div>
            @endif

            @if(optional($appointment->department)->name)
            <div class="info-card">
                <div class="info-card-hd">🏥 Department</div>
                <div class="info-card-body">
                    <div class="info-name">{{ $appointment->department->name }}</div>
                    @if(optional($appointment->location)->name)
                    <div class="info-sub">{{ $appointment->location->name }}</div>
                    @endif
                </div>
            </div>
            @endif
        </div>

        {{-- Reason / Chief complaint --}}
        @if($appointment->reason)
        <div style="margin-top:10px;background:#f8fafc;border:1px solid #e2e8f0;border-left:4px solid #3b82f6;border-radius:8px;padding:10px 14px;">
            <div style="font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#64748b;margin-bottom:4px;">Chief Complaint / Reason</div>
            <div style="font-size:13px;color:#1e293b;">{{ $appointment->reason }}</div>
        </div>
        @endif

        {{-- Medical Conditions (pet) --}}
        @if($conditions->isNotEmpty())
        <div class="sec-hd" style="margin-top:18px;">🏷️ Known Medical Conditions</div>
        <div>
            @foreach($conditions as $pc)
            <span class="cond-chip {{ $pc->status ?? 'active' }}">
                {{ optional($pc->condition)->name ?? '—' }}
                @if($pc->severity) · {{ ucfirst($pc->severity) }} @endif
            </span>
            @endforeach
        </div>
        @endif

        {{-- Vitals --}}
        @if($hasVitals)
        <div class="sec-hd" style="margin-top:18px;">📊 Vitals Recorded</div>
        <div class="vitals-row">
            @if($appointment->weight_kg)
            <div class="vital-box">
                <div class="vital-label">Weight</div>
                <div class="vital-value">{{ $appointment->weight_kg }}</div>
                <div class="vital-unit">kg</div>
            </div>
            @endif
            @if($appointment->temperature)
            <div class="vital-box">
                <div class="vital-label">Temperature</div>
                <div class="vital-value">{{ $appointment->temperature }}</div>
                <div class="vital-unit">°C</div>
            </div>
            @endif
            @if($appointment->heart_rate)
            <div class="vital-box">
                <div class="vital-label">Heart Rate</div>
                <div class="vital-value">{{ $appointment->heart_rate }}</div>
                <div class="vital-unit">bpm</div>
            </div>
            @endif
            @if($appointment->respiratory_rate)
            <div class="vital-box">
                <div class="vital-label">Resp. Rate</div>
                <div class="vital-value">{{ $appointment->respiratory_rate }}</div>
                <div class="vital-unit">brpm</div>
            </div>
            @endif
        </div>
        @endif

        {{-- SOAP Notes --}}
        @if($hasSoap)
        <div class="sec-hd" style="margin-top:18px;">📝 Clinical Notes (SOAP)</div>
        <div class="soap-grid">
            @if($appointment->soap_subjective)
            <div class="soap-box s-box">
                <div class="soap-box-hd">S — Subjective</div>
                <div class="soap-box-body">{{ $appointment->soap_subjective }}</div>
            </div>
            @endif
            @if($appointment->soap_objective)
            <div class="soap-box o-box">
                <div class="soap-box-hd">O — Objective</div>
                <div class="soap-box-body">{{ $appointment->soap_objective }}</div>
            </div>
            @endif
            @if($appointment->soap_assessment)
            <div class="soap-box a-box">
                <div class="soap-box-hd">A — Assessment</div>
                <div class="soap-box-body">{{ $appointment->soap_assessment }}</div>
            </div>
            @endif
            @if($appointment->soap_plan)
            <div class="soap-box p-box">
                <div class="soap-box-hd">P — Plan</div>
                <div class="soap-box-body">{{ $appointment->soap_plan }}</div>
            </div>
            @endif
        </div>
        @endif

        {{-- Treatment Plan medicines — only show if no formal prescriptions issued --}}
        @if($hasMeds && ($appointment->prescriptions ?? collect())->isEmpty())
        <div class="sec-hd" style="margin-top:18px;">💊 Treatment Plan — Medicines</div>
        @foreach($planMeds as $i => $med)
        <div class="med-item">
            <div class="med-num">{{ $i + 1 }}</div>
            <div style="flex:1;">
                <div class="med-name">{{ $med['name'] ?? '—' }}</div>
                <div class="med-pills">
                    @if(!empty($med['dosage']))
                    <span class="med-pill">⚗ {{ $med['dosage'] }}</span>
                    @endif
                    @if(!empty($med['freq']))
                    <span class="med-pill">🕐 {{ $med['freq'] }}</span>
                    @endif
                    @if(!empty($med['days']))
                    <span class="med-pill">📅 {{ $med['days'] }} days</span>
                    @endif
                </div>
                @if(!empty($med['note']))
                <div class="med-instr">ℹ {{ $med['note'] }}</div>
                @endif
            </div>
        </div>
        @endforeach
        @endif

        {{-- Doctor Notes --}}
        @if($appointment->doctor_notes)
        <div class="sec-hd" style="margin-top:18px;">🩺 Doctor's Notes</div>
        <div class="doc-notes-box">{{ $appointment->doctor_notes }}</div>
        @endif

        {{-- Vaccinations --}}
        @if(($appointment->vaccinations ?? collect())->isNotEmpty())
        <div class="sec-hd" style="margin-top:18px;">💉 Vaccinations Administered</div>
        <table class="vax-tbl">
            <thead>
                <tr>
                    <th>#</th>
                    <th>Vaccine</th>
                    <th>Dose</th>
                    <th>Batch No</th>
                    <th>Administered</th>
                    <th>Next Due</th>
                </tr>
            </thead>
            <tbody>
                @foreach($appointment->vaccinations as $i => $vax)
                <tr>
                    <td>{{ $i + 1 }}</td>
                    <td><strong>{{ optional($vax->vaccineType)->name ?? '—' }}</strong></td>
                    <td>{{ $vax->dose ?? '—' }}</td>
                    <td>{{ $vax->batch_no ?? '—' }}</td>
                    <td>{{ optional($vax->administered_date)->format('d M Y') ?? '—' }}</td>
                    <td>{{ optional($vax->next_due_date)->format('d M Y') ?? '—' }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
        @endif

        {{-- Prescriptions --}}
        @if(($appointment->prescriptions ?? collect())->isNotEmpty())
        <div class="sec-hd" style="margin-top:18px;">℞ Prescriptions Issued</div>
        @foreach($appointment->prescriptions as $rx)
        <div class="rx-block">
            <div class="rx-block-hd">
                <span class="rx-symbol">℞</span>
                <span class="rx-ref-badge">{{ $rx->ref_no }}</span>
                @if($rx->prescribed_date)
                <span style="font-size:11.5px;color:#64748b;">{{ optional($rx->prescribed_date)->format('d M Y') }}</span>
                @endif
                <span style="margin-left:auto;font-size:11px;font-weight:600;color:{{ $rx->status === 'active' ? '#22c55e' : '#94a3b8' }};">
                    {{ ucfirst($rx->status) }}
                </span>
            </div>
            <div class="rx-block-body">
                @if($rx->diagnosis)
                <div style="font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:#94a3b8;margin-bottom:4px;">Diagnosis</div>
                <div style="font-size:12.5px;color:#334155;margin-bottom:10px;">{{ $rx->diagnosis }}</div>
                @endif
                @forelse($rx->items as $j => $item)
                <div class="med-item" style="padding:7px 0;">
                    <div class="med-num" style="width:22px;height:22px;font-size:10px;">{{ $j + 1 }}</div>
                    <div style="flex:1;">
                        <div class="med-name" style="font-size:12.5px;">{{ $item->medicine_name }}</div>
                        <div class="med-pills">
                            @if($item->dosage)<span class="med-pill">{{ $item->dosage }}</span>@endif
                            @if($item->frequency)<span class="med-pill">{{ $item->frequency }}</span>@endif
                            @if($item->duration_days)<span class="med-pill">{{ $item->duration_days }} days</span>@endif
                        </div>
                        @if($item->instructions)<div class="med-instr">{{ $item->instructions }}</div>@endif
                    </div>
                </div>
                @empty
                <div class="empty-state" style="padding:10px;">No medicines recorded.</div>
                @endforelse
            </div>
        </div>
        @endforeach
        @endif

        {{-- Appointment Notes --}}
        @if(($appointment->appointmentNotes ?? collect())->isNotEmpty())
        <div class="sec-hd" style="margin-top:18px;">💬 Appointment Notes</div>
        @foreach($appointment->appointmentNotes as $note)
        <div class="note-item">
            @if($note->title)
            <div class="note-title">{{ $note->title }}</div>
            @endif
            <div class="note-body">{{ $note->notes }}</div>
            <div class="note-meta">
                By {{ optional($note->user)->first_name ?? '' }} {{ optional($note->user)->last_name ?? '' }}
                &nbsp;·&nbsp; {{ \Carbon\Carbon::parse($note->created_at)->format(session('business.date_format', 'd M Y') . ' ' . (session('business.time_format', 24) == 12 ? 'h:i A' : 'H:i')) }}
            </div>
        </div>
        @endforeach
        @endif

        {{-- General notes --}}
        @if($appointment->notes)
        <div class="sec-hd" style="margin-top:18px;">🗒️ General Notes</div>
        <div style="background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:10px 14px;font-size:13px;color:#334155;white-space:pre-wrap;">{{ $appointment->notes }}</div>
        @endif

    </div>{{-- /body --}}

    {{-- Footer --}}
    <div class="footer">
        <span>Printed: {{ now()->format('d M Y, H:i') }}</span>
        <span>{{ $appointment->ref_no }} &bull; {{ $business->name ?? '' }}</span>
        <span>Confidential — For medical use only</span>
    </div>

</div>

{{-- Item #8 - TPS branding footer --}}
@include('vetClinic::partials._print_branding', ['mode' => 'footer'])

<script>window.onload = function () { window.print(); };</script>
</body>
</html>
