<style>
   body {
      font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      margin: 0;
      padding: 20px;
      color: #333;
      background-color: #f9f9f9;
   }
   .header {
      text-align: center;
      margin-bottom: 30px;
      padding-bottom: 20px;
      border-bottom: 2px solid #3a8dff;
   }
   .header img {
      max-width: 180px;
      height: auto;
   }
   .header h1 {
      margin: 15px 0 5px;
      font-size: 28px;
      color: #2c3e50;
   }
   .header h2 {
      color: #3a8dff;
      font-size: 22px;
      margin: 15px 0 5px;
   }
   .intro {
      margin-bottom: 25px;
      font-size: 16px;
      line-height: 1.6;
      color: #555;
      background-color: #f1f8ff;
      padding: 15px;
      border-radius: 6px;
      border-left: 4px solid #3a8dff;
   }
   table {
      width: 100%;
      border-collapse: collapse;
      margin-bottom: 30px;
      box-shadow: 0 2px 4px rgba(0,0,0,0.1);
      border-radius: 6px;
      overflow: hidden;
   }
   table, th, td {
      border: none;
   }
   th, td {
      padding: 12px 15px;
      text-align: left;
   }
   th {
      background-color: #3a8dff;
      color: white;
      font-weight: 600;
   }
   tr:nth-child(even) {
      background-color: #f2f7ff;
   }
   tr:hover {
      background-color: #e6f0ff;
   }
   .footer {
      margin-top: 40px;
      padding-top: 20px;
      border-top: 1px solid #ddd;
      font-size: 14px;
      color: #666;
      line-height: 1.6;
   }
   .clinic-footer {
      text-align: center;
      font-size: 13px;
      margin-top: 30px;
      background-color: #f1f8ff;
      padding: 15px;
      border-radius: 6px;
   }
   .appointment-id {
      background-color: #f1f8ff;
      padding: 10px 15px;
      border-radius: 6px;
      margin-bottom: 20px;
      font-size: 15px;
      color: #3a8dff;
      border: 1px dashed #bbd6ff;
      display: inline-block;
   }
</style>

@php
    $identity = $clinicIdentity;
@endphp

<!-- Verificar si existe una identidad de consultorio -->
@if(isset($identity) && $identity)
<div class="header">
   @if($identity->logo_path)
   <img src="{{ asset('storage/' . $identity->logo_path) }}" alt="Logo {{ $identity->name }}">
   @endif
   <h1>{{ $identity->name }}</h1>
   @if($identity->specialty)
   <p><em>{{ $identity->specialty }}</em></p>
   @endif
   <p>{{ $identity->address }}</p>
   @if($identity->phone || $identity->email)
   <p>
      @if($identity->phone) Tel: {{ $identity->phone }} @endif
      @if($identity->phone && $identity->email) | @endif
      @if($identity->email) Email: {{ $identity->email }} @endif
   </p>
   @endif
   <h2>Reporte de Cita Médica</h2>
</div>
@else
<div class="header">
   <img src="{{ asset('images/default-logo.png') }}" alt="Logo">
   <h1>Centro Médico</h1>
   <h2>Reporte de Cita Médica</h2>
</div>
@endif

@if(isset($appointment->code))
<div class="appointment-id">
   <strong>ID de Cita:</strong> {{ $appointment->code }}
</div>
@endif

<div class="intro">
   <p>Estimado(a) <strong>{{ $patient->firstname }} {{ $patient->lastname }}</strong>,</p>
   <p>A continuación se encuentra el informe detallado de su cita médica. Conserve este documento para sus registros y contáctenos si tiene alguna pregunta o necesita asistencia adicional.</p>
</div>

<table>
   <tbody>
      <tr>
         <th>Nombre Completo</th>
         <td><strong>{{ $patient->firstname }} {{ $patient->lastname }}</strong></td>
      </tr>
      <tr>
         <th>Fecha</th>
         <td>{{$data["date"]}}</td>
      </tr>
      <tr>
         <th>Hora</th>
         <td>{{$data["hour"]}}</td>
      </tr>
      <tr>
         <th>Especialidad</th>
         <td>{{ $especialities[$appointment->especiality] }}</td>
      </tr>
      <tr>
         <th>Edad</th>
         <td>{{ $patient->age }} años</td>
      </tr>
      <tr>
         <th>Sexo</th>
         <td>{{ $patient->gender }}</td>
      </tr>
      <tr>
         <th>Correo Electrónico</th>
         <td>{{ $patient->email }}</td>
      </tr>
      <tr>
         <th>Teléfono</th>
         <td>{{ $patient->phone }}</td>
      </tr>
   </tbody>
</table>

<div class="footer">
   <p><strong>Recordatorio:</strong> Si necesita reprogramar o cancelar su cita, por favor hágalo con al menos 24 horas de anticipación. Recuerde llegar 15 minutos antes de su cita y traer su documento de identidad.</p>
   <p>Gracias por elegir nuestros servicios médicos. Nos comprometemos a brindarle la mejor atención para su salud y bienestar.</p>
</div>

@if(isset($identity) && $identity)
<div class="clinic-footer">
   <p><strong>{{ $identity->name }}</strong> - {{ $identity->address }}</p>
   @if($identity->phone || $identity->email)
   <p>
      @if($identity->phone) Tel: {{ $identity->phone }} @endif
      @if($identity->phone && $identity->email) | @endif
      @if($identity->email) Email: {{ $identity->email }} @endif
   </p>
   @endif
   @if($identity->working_hours)
   <p>Horario de atención: {{ $identity->working_hours }}</p>
   @endif
</div>
@endif