<?php use App\Core\Auth; 
  $ticketDisplay = $incident['ticket_id'] ?? '';
  if (empty($ticketDisplay)) { $ticketDisplay = $incident['reference'] ?? ('INC-' . (int)$incident['id']); }
  $title = 'Incident ' . htmlspecialchars($ticketDisplay);
?>
<?php
  $cu = Auth::user();
  $role = $cu['role_key'] ?? '';
  $isAssigned = false;
  if (!empty($assignedUsers)) { foreach ($assignedUsers as $a) { if (($cu['name'] ?? '') === ($a['name'] ?? '')) { $isAssigned = true; break; } } }
  $canTreat = in_array($role, ['admin','agent'], true) || ($role==='technicien' && $isAssigned && in_array($treatmentState ?? 'none',['none','draft'],true));
  $canViewTreatment = in_array($role, ['admin','manager','superviseur','supervisor','agent','technicien'], true);
  $canFinalReport = ($role==='technicien' && $isAssigned && ($treatmentState==='validated') && ($finalReportState!=='completed'));
  
  // Calculs d'état
  $priorityClass = match($incident['priority']) {
    'Urgent' => 'danger', 'Haute' => 'warning', 'Moyenne' => 'info', 'Basse' => 'secondary', default => 'secondary'
  };
  $incidentStatusKey = strtolower($incident['status_key'] ?? '');
  $incidentStatusLabelLow = strtolower($incident['status_label'] ?? '');
  $isIncidentClosed = in_array($incidentStatusKey, ['closed','resolu','resolved','cloture','clôturé'], true)
    || str_contains($incidentStatusLabelLow, 'clôtur') || str_contains($incidentStatusLabelLow, 'clos');
  $isIncidentTreated = in_array($incidentStatusKey, ['treated','traite','processed'], true) || str_contains($incidentStatusLabelLow, 'trait');
  $canAssignTechnician = in_array($role, ['admin','agent'], true) && !$isIncidentClosed && !$isIncidentTreated;
  $hasRestoration = !empty($finalReport['restoration_at']);
  $forceCompleted = $isIncidentClosed || ($hasRestoration && ($finalReportState === 'completed'));
  $kpiIntervState = $interventionState ?? 'none';
  if ($forceCompleted && $kpiIntervState !== 'completed') { $kpiIntervState = 'completed'; }
  
  // Fallback commentaires
  $tree = isset($commentsTree) && is_array($commentsTree) ? $commentsTree : (isset($commentTree) && is_array($commentTree) ? $commentTree : []);
  if (empty($tree) && (!isset($comments) || !is_array($comments))) {
    try {
      $pdoC = \App\Core\Database::pdo();
      $stC = $pdoC->prepare('SELECT id, author_name, content, created_at FROM incident_comments WHERE incident_id = ? ORDER BY created_at DESC');
      $stC->execute([(int)$incident['id']]);
      $comments = $stC->fetchAll();
    } catch (\Throwable $e) { $comments = []; }
  }
?>

<style>
  /* Design moderne pour la page incident */
  .incident-hero {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 16px;
    color: white;
    padding: 2rem;
    margin-bottom: 2rem;
    box-shadow: 0 10px 40px rgba(102, 126, 234, 0.2);
  }
  .incident-hero .ticket-id {
    font-size: 1.75rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
  }
  .incident-hero .incident-title {
    font-size: 1.25rem;
    opacity: 0.95;
    font-weight: 500;
  }
  .incident-hero .status-badge {
    padding: 0.5rem 1.25rem;
    border-radius: 50px;
    font-weight: 600;
    font-size: 0.875rem;
    backdrop-filter: blur(10px);
    background: rgba(255,255,255,0.2);
    border: 1px solid rgba(255,255,255,0.3);
  }
  
  /* Cartes KPI modernes */
  .kpi-card-modern {
    border-radius: 12px;
    border: none;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
  }
  .kpi-card-modern:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0,0,0,0.1);
  }
  .kpi-card-modern::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
  }
  .kpi-card-modern.priority::before { background: linear-gradient(90deg, #ef4444, #f97316); }
  .kpi-card-modern.status::before { background: linear-gradient(90deg, #3b82f6, #06b6d4); }
  .kpi-card-modern.sla::before { background: linear-gradient(90deg, #8b5cf6, #a855f7); }
  .kpi-card-modern.intervention::before { background: linear-gradient(90deg, #10b981, #059669); }
  .kpi-card-modern.rapport::before { background: linear-gradient(90deg, #f59e0b, #d97706); }
  .kpi-card-modern.pauses::before { background: linear-gradient(90deg, #6366f1, #4f46e5); }
  
  .kpi-card-modern .kpi-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    margin-bottom: 1rem;
  }
  .kpi-card-modern.priority .kpi-icon { background: linear-gradient(135deg, #fecaca, #fca5a5); color: #dc2626; }
  .kpi-card-modern.status .kpi-icon { background: linear-gradient(135deg, #bfdbfe, #93c5fd); color: #2563eb; }
  .kpi-card-modern.sla .kpi-icon { background: linear-gradient(135deg, #ddd6fe, #c4b5fd); color: #7c3aed; }
  .kpi-card-modern.intervention .kpi-icon { background: linear-gradient(135deg, #bbf7d0, #86efac); color: #059669; }
  .kpi-card-modern.rapport .kpi-icon { background: linear-gradient(135deg, #fed7aa, #fdba74); color: #d97706; }
  .kpi-card-modern.pauses .kpi-icon { background: linear-gradient(135deg, #c7d2fe, #a5b4fc); color: #4f46e5; }
  
  .kpi-card-modern .kpi-label {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #64748b;
    margin-bottom: 0.5rem;
  }
  .kpi-card-modern .kpi-value {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 0.25rem;
  }
  .kpi-card-modern .kpi-subtitle {
    font-size: 0.875rem;
    color: #64748b;
  }
  
  /* Onglets modernes */
  .nav-tabs-modern {
    border: none;
    gap: 0.5rem;
  }
  .nav-tabs-modern .nav-link {
    border: none;
    border-radius: 12px;
    padding: 0.875rem 1.5rem;
    font-weight: 600;
    color: #64748b;
    transition: all 0.3s ease;
    position: relative;
  }
  .nav-tabs-modern .nav-link:hover {
    background: #f1f5f9;
    color: #475569;
  }
  .nav-tabs-modern .nav-link.active {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
  }
  .nav-tabs-modern .nav-link i {
    margin-right: 0.5rem;
  }
  
  /* Cards sidebar modernes */
  .sidebar-card {
    border-radius: 12px;
    border: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    margin-bottom: 1.5rem;
  }
  .sidebar-card .card-header {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: none;
    border-radius: 12px 12px 0 0;
    padding: 1rem 1.25rem;
  }
  .sidebar-card .card-header h6 {
    margin: 0;
    font-weight: 700;
    color: #1e293b;
  }
  
  /* Timeline historique */
  .timeline {
    position: relative;
    padding-left: 2rem;
  }
  .timeline::before {
    content: '';
    position: absolute;
    left: 0.5rem;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
  }
  .timeline-item {
    position: relative;
    margin-bottom: 1.5rem;
  }
  .timeline-item::before {
    content: '';
    position: absolute;
    left: -1.6rem;
    top: 0.25rem;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: white;
    border: 3px solid #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
  }
  
  /* Commentaires style chat */
  .comment-item {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.5rem;
  }
  .comment-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
  }
  .comment-content {
    flex: 1;
    background: #f8fafc;
    border-radius: 12px;
    padding: 1rem;
  }
  .comment-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.5rem;
  }
  .comment-author {
    font-weight: 700;
    color: #1e293b;
  }
  .comment-time {
    font-size: 0.875rem;
    color: #64748b;
  }
  .comment-text {
    color: #475569;
    line-height: 1.6;
  }
  
  /* Animations */
  @keyframes fadeInUp {
    from {
      opacity: 0;
      transform: translateY(20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .fade-in-up {
    animation: fadeInUp 0.5s ease;
  }
  
  /* Responsive */
  @media (max-width: 768px) {
    .incident-hero {
      padding: 1.5rem;
    }
    .incident-hero .ticket-id {
      font-size: 1.5rem;
    }
  }
</style>

<!-- Hero Section -->
<div class="incident-hero fade-in-up">
  <div class="container-fluid px-0">
    <?php if (!empty($_GET['success']) || !empty($_GET['error'])): ?>
      <div class="mb-3">
        <?php if (!empty($_GET['success'])): ?>
          <div class="alert alert-success mb-0">
            <?php if ($_GET['success'] === 'unassigned'): ?>Technicien désassigné avec succès.<?php else: ?>Action réussie.<?php endif; ?>
          </div>
        <?php elseif (!empty($_GET['error'])): ?>
          <div class="alert alert-danger mb-0">
            <?php if ($_GET['error'] === 'already_assigned'): ?>Une assignation active existe déjà.<?php elseif($_GET['error']==='assignment_not_allowed'): ?>Assignation interdite pour cet état d'incident.<?php elseif($_GET['error']==='unassign_not_allowed'): ?>Désassignation interdite pour cet état d'incident.<?php else: ?>Action impossible.<?php endif; ?>
          </div>
        <?php endif; ?>
      </div>
    <?php endif; ?>
    <div class="row align-items-center">
      <div class="col-lg-8">
        <a href="<?= htmlspecialchars(route_url('/incidents')) ?>" class="btn btn-sm btn-light mb-3">
          <i class="fas fa-arrow-left me-2"></i>Retour aux incidents
        </a>
        <div class="ticket-id">
          <i class="fas fa-ticket-alt me-2"></i><?= htmlspecialchars($ticketDisplay) ?>
        </div>
        <div class="incident-title"><?= htmlspecialchars($incident['title']) ?></div>
        <?php if (!empty($incident['incident_number'])): ?>
          <div class="mt-2 opacity-75">
            <small><i class="fas fa-hashtag me-1"></i>Référence: <?= htmlspecialchars($incident['incident_number']) ?></small>
          </div>
        <?php endif; ?>
        <div class="mt-3 d-flex flex-wrap gap-2 align-items-center">
          <div><i class="fas fa-user me-1"></i><?= htmlspecialchars($incident['client_name']) ?></div>
          <div><i class="fas fa-location-dot me-1"></i><?= htmlspecialchars($incident['location_name']) ?></div>
          <div><i class="fas fa-calendar me-1"></i><?= date('d/m/Y H:i', strtotime($incident['declared_at'])) ?></div>
        </div>
      </div>
      <div class="col-lg-4 text-lg-end mt-3 mt-lg-0">
        <div class="status-badge mb-3" style="background:<?= htmlspecialchars($incident['status_color']) ?>;">
          <?= htmlspecialchars($incident['status_label']) ?>
        </div>
        <div class="d-flex flex-wrap gap-2 justify-content-lg-end">
          <?php if ($canTreat): ?>
            <a href="<?= htmlspecialchars(route_url('/incidents/treatment',['id'=>$incident['id']])) ?>" class="btn btn-light btn-sm">
              <i class="fas fa-wrench me-1"></i>Traiter
            </a>
          <?php endif; ?>
          <?php if ($canViewTreatment): ?>
            <a href="<?= htmlspecialchars(route_url('/incidents/treatment',['id'=>$incident['id'],'view'=>1])) ?>" class="btn btn-light btn-sm">
              <i class="fas fa-eye me-1"></i>Voir
            </a>
          <?php endif; ?>
          <?php if ($canFinalReport): ?>
            <a href="#" class="btn btn-light btn-sm" data-bs-toggle="modal" data-bs-target="#finalReportModal">
              <i class="fas fa-file-signature me-1"></i>Clôturer
            </a>
          <?php endif; ?>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- KPI Cards -->
<div class="row g-3 mb-4 fade-in-up" style="animation-delay: 0.1s">
  <!-- Priorité -->
  <div class="col-6 col-lg-4 col-xl-2">
    <div class="card kpi-card-modern priority h-100">
      <div class="card-body">
        <div class="kpi-icon">
          <i class="fas fa-flag"></i>
        </div>
        <div class="kpi-label">Priorité</div>
        <div class="kpi-value">
          <span class="badge bg-<?= $priorityClass ?> bg-gradient"><?= htmlspecialchars($incident['priority'] ?? '—') ?></span>
        </div>
      </div>
    </div>
  </div>
  
  <!-- Statut -->
  <div class="col-6 col-lg-4 col-xl-2">
    <div class="card kpi-card-modern status h-100">
      <div class="card-body">
        <div class="kpi-icon">
          <i class="fas fa-circle-check"></i>
        </div>
        <div class="kpi-label">Statut</div>
        <div class="kpi-value">
          <span class="badge" style="background:<?= htmlspecialchars((string)($incident['status_color'] ?? '#6c757d')) ?>;"><?= htmlspecialchars((string)($incident['status_label'] ?? '')) ?></span>
        </div>
      </div>
    </div>
  </div>
  
  <!-- SLA -->
  <div class="col-6 col-lg-4 col-xl-2">
    <div class="card kpi-card-modern sla h-100">
      <div class="card-body">
        <div class="kpi-icon">
          <i class="fas fa-clock"></i>
        </div>
        <div class="kpi-label">SLA Résolution</div>
        <div class="kpi-subtitle">
          <?php $expRes = $incident['expected_resolution_at'] ?? null; echo $expRes ? date('d/m H:i', strtotime($expRes)) : '—'; ?>
        </div>
      </div>
    </div>
  </div>
  
  <!-- Intervention -->
  <div class="col-6 col-lg-4 col-xl-2">
    <div class="card kpi-card-modern intervention h-100">
      <div class="card-body">
        <div class="kpi-icon">
          <i class="fas fa-person-digging"></i>
        </div>
        <div class="kpi-label">Intervention</div>
        <div class="kpi-subtitle">
          <?php
            $intervLabel = match($kpiIntervState) {
              'active' => 'En cours', 'paused' => 'En pause', 'completed' => 'Terminée', default => 'Aucune'
            };
          ?>
          <?= $intervLabel ?> • <?= htmlspecialchars($interventionDurationHuman ?? '0m') ?>
        </div>
      </div>
    </div>
  </div>
  
  <!-- Rapport final -->
  <div class="col-6 col-lg-4 col-xl-2">
    <div class="card kpi-card-modern rapport h-100">
      <div class="card-body">
        <div class="kpi-icon">
          <i class="fas fa-file-signature"></i>
        </div>
        <div class="kpi-label">Rapport final</div>
        <div class="kpi-subtitle">
          <?php
            $frLabel = match($finalReportState ?? 'none') {
              'completed' => 'Clôturé', 'pending' => 'En attente', default => 'Aucun'
            };
          ?>
          <?= $frLabel ?>
        </div>
      </div>
    </div>
  </div>
  
  <!-- Pauses -->
  <div class="col-6 col-lg-4 col-xl-2">
    <div class="card kpi-card-modern pauses h-100">
      <div class="card-body">
        <div class="kpi-icon">
          <i class="fas fa-pause"></i>
        </div>
        <div class="kpi-label">Pauses</div>
        <div class="kpi-value"><?= (int)($pauseCount ?? 0) ?></div>
      </div>
    </div>
  </div>
</div>

<!-- Main Content avec Tabs -->
<div class="row g-4 fade-in-up" style="animation-delay: 0.2s">
  <div class="col-xl-8">
    <!-- Tabs Navigation -->
    <ul class="nav nav-tabs-modern mb-4" id="incidentTabs" role="tablist">
      <li class="nav-item" role="presentation">
        <button class="nav-link active" id="tab-overview" data-bs-toggle="tab" data-bs-target="#pane-overview" type="button" role="tab">
          <i class="fas fa-circle-info"></i>Aperçu
        </button>
      </li>
      <li class="nav-item" role="presentation">
        <button class="nav-link" id="tab-comments" data-bs-toggle="tab" data-bs-target="#pane-comments" type="button" role="tab">
          <i class="fas fa-comments"></i>Commentaires
        </button>
      </li>
      <li class="nav-item" role="presentation">
        <button class="nav-link" id="tab-history" data-bs-toggle="tab" data-bs-target="#pane-history" type="button" role="tab">
          <i class="fas fa-clock-rotate-left"></i>Historique
        </button>
      </li>
    </ul>

    <!-- Tabs Content -->
    <div class="tab-content" id="incidentTabsContent">
      <!-- Aperçu -->
      <div class="tab-pane fade show active" id="pane-overview" role="tabpanel">
        <div class="card sidebar-card">
          <div class="card-header">
            <h5 class="mb-0"><i class="fas fa-circle-info me-2"></i>Détails de l'incident</h5>
          </div>
          <div class="card-body">
            <div class="row g-3">
              <div class="col-md-6">
                <div class="mb-3">
                  <label class="text-muted small mb-1">Client</label>
                  <div class="fw-semibold"><?= htmlspecialchars($incident['client_name']) ?></div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="mb-3">
                  <label class="text-muted small mb-1">Localisation</label>
                  <div class="fw-semibold"><?= htmlspecialchars((string)($incident['location_name'] ?? '')) ?></div>
                  <?php if (!empty($incident['location_address'])): ?>
                    <small class="text-muted"><?= htmlspecialchars((string)$incident['location_address']) ?></small>
                  <?php endif; ?>
                </div>
              </div>
              <div class="col-md-6">
                <div class="mb-3">
                  <label class="text-muted small mb-1">Cause</label>
                  <div class="fw-semibold"><?= !empty($incident['cause_name']) ? htmlspecialchars((string)$incident['cause_name']) : '<em class="text-muted">Non identifiée</em>' ?></div>
                </div>
              </div>
              <div class="col-md-6">
                <div class="mb-3">
                  <label class="text-muted small mb-1">Déclaré par</label>
                  <div class="fw-semibold"><?= htmlspecialchars((string)($incident['declared_by_name'] ?? '')) ?></div>
                  <small class="text-muted"><?= date('d/m/Y à H:i', strtotime($incident['declared_at'])) ?></small>
                </div>
              </div>
              <?php if (!empty($incident['description'])): ?>
              <div class="col-12">
                <div class="mb-3">
                  <label class="text-muted small mb-1">Description</label>
                  <div class="p-3 bg-light rounded"><?= nl2br(htmlspecialchars((string)$incident['description'])) ?></div>
                </div>
              </div>
              <?php endif; ?>
            </div>
          </div>
        </div>
      </div>

      <!-- Commentaires -->
      <div class="tab-pane fade" id="pane-comments" role="tabpanel">
        <?php
          $canAdd = false;
          try {
            $me = \App\Core\Auth::user();
            $roleX = $me['role_key'] ?? '';
            if (in_array($roleX, ['admin','agent'], true)) { $canAdd = true; }
            elseif ($roleX === 'technicien') {
              $pdoX = \App\Core\Database::pdo();
              $chkX = $pdoX->prepare('SELECT COUNT(*) FROM incident_assignments WHERE incident_id=? AND user_id=? AND active=1');
              $chkX->execute([(int)$incident['id'], (int)$me['id']]);
              $canAdd = ((int)$chkX->fetchColumn() > 0);
            }
          } catch (\Throwable $e) { }
        ?>
        
        <?php if ($canAdd): ?>
        <div class="card sidebar-card mb-4">
          <div class="card-body">
            <form method="post" action="<?= htmlspecialchars(route_url('/incidents/comment')) ?>" enctype="multipart/form-data">
              <input type="hidden" name="incident_id" value="<?= (int)$incident['id'] ?>">
              <div class="mb-3">
                <label class="form-label fw-semibold">Ajouter un commentaire</label>
                <textarea name="comment" class="form-control" rows="3" required placeholder="Votre commentaire..."></textarea>
              </div>
              <div class="row g-3 mb-3">
                <div class="col-md-6">
                  <div class="form-check">
                    <input class="form-check-input" type="checkbox" value="1" id="isInternalCheck" name="is_internal">
                    <label class="form-check-label" for="isInternalCheck">
                      <small>Commentaire interne</small>
                    </label>
                  </div>
                </div>
                <div class="col-md-6">
                  <input type="file" name="attachments[]" class="form-control form-control-sm" multiple>
                </div>
              </div>
              <button type="submit" class="btn btn-primary">
                <i class="fas fa-paper-plane me-1"></i>Publier
              </button>
            </form>
          </div>
        </div>
        <?php endif; ?>

        <div class="card sidebar-card">
          <div class="card-body">
            <?php if (!empty($tree)): ?>
              <?php foreach ($tree as $c): ?>
                <div class="comment-item">
                  <div class="comment-avatar">
                    <?= strtoupper(substr($c['user_name'] ?? 'U', 0, 1)) ?>
                  </div>
                  <div class="comment-content">
                    <div class="comment-header">
                      <span class="comment-author"><?= htmlspecialchars($c['user_name'] ?? 'Utilisateur') ?></span>
                      <span class="comment-time">
                        <?= !empty($c['created_at']) ? date('d/m H:i', strtotime($c['created_at'])) : '' ?>
                      </span>
                    </div>
                    <div class="comment-text">
                      <?= !empty($c['comment'] ?? $c['content'] ?? '') ? nl2br(htmlspecialchars($c['comment'] ?? $c['content'])) : '<em class="text-muted">(Vide)</em>' ?>
                    </div>
                    <?php if (!empty($c['attachments']) && is_array($c['attachments'])): ?>
                      <div class="mt-2 d-flex flex-wrap gap-2">
                        <?php foreach ($c['attachments'] as $att):
                          $raw = is_array($att) ? ($att['path'] ?? '') : $att;
                          $clean = ltrim((string)$raw, '/');
                          if (str_starts_with($clean, 'storage/uploads/')) { $clean = substr($clean, strlen('storage/uploads/')); }
                          $url = upload_url($clean);
                          $ext = strtolower(pathinfo($clean, PATHINFO_EXTENSION));
                          $isImg = in_array($ext, ['jpg','jpeg','png','gif','webp'], true);
                        ?>
                          <?php if ($isImg): ?>
                            <a href="<?= htmlspecialchars($url) ?>" data-file-url="<?= htmlspecialchars($url) ?>" class="js-open-file">
                              <img src="<?= htmlspecialchars($url) ?>" class="img-thumbnail" style="max-height:80px; border-radius:8px;" alt="pièce jointe">
                            </a>
                          <?php else: ?>
                            <a href="<?= htmlspecialchars($url) ?>" data-file-url="<?= htmlspecialchars($url) ?>" class="btn btn-sm btn-outline-secondary js-open-file">
                              <i class="fas fa-paperclip me-1"></i>Fichier
                            </a>
                          <?php endif; ?>
                        <?php endforeach; ?>
                      </div>
                    <?php endif; ?>
                  </div>
                </div>
              <?php endforeach; ?>
            <?php elseif (!empty($comments) && is_array($comments)): ?>
              <ul class="list-unstyled mb-0" id="commentsList">
                <?php foreach ($comments as $c): ?>
                  <div class="comment-item">
                    <div class="comment-avatar">
                      <?= strtoupper(substr($c['user_name'] ?? 'U', 0, 1)) ?>
                    </div>
                    <div class="comment-content">
                      <div class="comment-header">
                        <span class="comment-author"><?= htmlspecialchars($c['user_name'] ?? $c['author_name'] ?? 'Utilisateur') ?></span>
                        <span class="comment-time">
                          <?= !empty($c['created_at']) ? date('d/m H:i', strtotime($c['created_at'])) : '' ?>
                        </span>
                      </div>
                      <div class="comment-text">
                        <?= !empty($c['comment'] ?? $c['content'] ?? '') ? nl2br(htmlspecialchars($c['comment'] ?? $c['content'])) : '<em class="text-muted">(Vide)</em>' ?>
                      </div>
                    </div>
                  </div>
                <?php endforeach; ?>
              </ul>
            <?php else: ?>
              <p class="text-muted text-center mb-0" id="noCommentsMsg">
                <i class="fas fa-comments fa-2x mb-2 opacity-25"></i><br>
                Aucun commentaire pour le moment
              </p>
            <?php endif; ?>
          </div>
        </div>
      </div>

      <!-- Historique -->
      <div class="tab-pane fade" id="pane-history" role="tabpanel">
        <div class="card sidebar-card">
          <div class="card-body">
            <?php if (!empty($history) && is_array($history)): ?>
              <div class="timeline">
                <?php foreach ($history as $h): ?>
                  <?php
                    $field = trim($h['field_name'] ?? ($h['event_label'] ?? ''));
                    $newVal = trim($h['new_value'] ?? ($h['details'] ?? ''));
                    $oldVal = trim($h['old_value'] ?? '');
                    $when = $h['changed_at'] ?? ($h['created_at'] ?? null);
                    $by = trim($h['changed_by_name'] ?? '');
                    $label = $field !== '' ? $field : 'Événement';
                    $details = '';
                    if ($newVal !== '' && $oldVal !== '') {
                      $details = 'De <strong>' . htmlspecialchars($oldVal) . '</strong> à <strong>' . htmlspecialchars($newVal) . '</strong>';
                    } elseif ($newVal !== '') { $details = htmlspecialchars($newVal); }
                    elseif ($oldVal !== '') { $details = 'Ancien: ' . htmlspecialchars($oldVal); }
                    if ($label === '' && $details === '') { continue; }
                  ?>
                  <div class="timeline-item">
                    <div class="d-flex justify-content-between align-items-start mb-1">
                      <span class="badge bg-primary bg-gradient"><?= htmlspecialchars($label) ?></span>
                      <small class="text-muted">
                        <?= $when ? date('d/m H:i', strtotime($when)) : '' ?>
                      </small>
                    </div>
                    <?php if ($details !== ''): ?>
                      <div class="small text-muted"><?= $details ?></div>
                    <?php endif; ?>
                    <?php if ($by !== ''): ?>
                      <div class="small text-muted mt-1">
                        <i class="fas fa-user me-1"></i><?= htmlspecialchars($by) ?>
                      </div>
                    <?php endif; ?>
                  </div>
                <?php endforeach; ?>
              </div>
            <?php else: ?>
              <p class="text-muted text-center mb-0">
                <i class="fas fa-clock-rotate-left fa-2x mb-2 opacity-25"></i><br>
                Aucun événement historisé
              </p>
            <?php endif; ?>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- Sidebar -->
  <div class="col-xl-4">
    <!-- Intervention -->
    <?php if (in_array($role, ['technicien','admin','agent'])): ?>
      <?php
        $origInterventionState = $interventionState ?? 'none';
        $state = $origInterventionState;
        if ($forceCompleted && $state !== 'completed') { $state = 'completed'; }
        $durHuman = htmlspecialchars($interventionDurationHuman ?? '0m');
        $pauseCountInt = (int)($pauseCount ?? 0);
      ?>
      <div class="sidebar-card">
        <div class="card-header">
          <h6><i class="fas fa-toolbox me-2"></i>Intervention</h6>
        </div>
        <div class="card-body" id="interventionCardBody">
          <?php if ($state === 'active'): ?>
            <div class="alert alert-success mb-3">
              <i class="fas fa-person-digging me-2"></i>Intervention en cours
            </div>
            <div class="mb-3">
              <small class="text-muted">Durée</small>
              <div class="fw-semibold"><?= $durHuman ?></div>
            </div>
            <button type="button" id="btnInterventionPause" class="btn btn-warning btn-sm w-100">
              <i class="fas fa-pause me-1"></i>Mettre en pause
            </button>
          <?php elseif ($state === 'paused'): ?>
            <div class="alert alert-warning mb-3">
              <i class="fas fa-pause me-2"></i>Intervention en pause
            </div>
            <button type="button" id="btnInterventionResume" class="btn btn-success btn-sm w-100">
              <i class="fas fa-play me-1"></i>Reprendre
            </button>
          <?php elseif ($state === 'completed'): ?>
            <div class="alert alert-info mb-3">
              <i class="fas fa-flag-checkered me-2"></i>Intervention terminée
            </div>
            <div class="mb-3">
              <small class="text-muted">Durée totale</small>
              <div class="fw-semibold"><?= $durHuman ?></div>
            </div>
          <?php else: ?>
            <p class="text-muted small mb-3">Aucune intervention en cours</p>
            <button type="button" id="btnInterventionStart" class="btn btn-primary btn-sm w-100">
              <i class="fas fa-play me-1"></i>Démarrer l'intervention
            </button>
          <?php endif; ?>
          
          <div class="mt-3 d-flex gap-2">
            <a class="btn btn-sm btn-outline-secondary" href="<?= htmlspecialchars(route_url('/incidents/intervention/export-csv',['id'=>$incident['id']])) ?>">
              <i class="fas fa-file-csv"></i>
            </a>
            <a class="btn btn-sm btn-outline-secondary" href="<?= htmlspecialchars(route_url('/incidents/intervention/export-pdf',['id'=>$incident['id']])) ?>">
              <i class="fas fa-file-pdf"></i>
            </a>
            <a class="btn btn-sm btn-outline-info" href="<?= htmlspecialchars(route_url('/incidents/intervention/metrics-pdf',['id'=>$incident['id']])) ?>">
              <i class="fas fa-chart-line"></i>
            </a>
          </div>
        </div>
      </div>
    <?php endif; ?>

    <!-- Rapport (Admin) -->
    <?php if ($role === 'admin'): ?>
      <?php
        // Préparer les données du rapport existant pour pré-remplissage
        $report = $treatmentReport ?? null;
        $equipmentsArr = [];
        if ($report && !empty($report['impacted_equipment'])) {
          $decoded = json_decode($report['impacted_equipment'], true);
          $equipmentsArr = is_array($decoded) ? $decoded : [];
        }
        $equipmentsText = !empty($equipmentsArr) ? implode(', ', $equipmentsArr) : '';
        
        // Formater les dates pour datetime-local
        $takeoverFormatted = '';
        $startFormatted = '';
        $endFormatted = '';
        if ($report && !empty($report['takeover_at'])) {
          $d = \DateTime::createFromFormat('Y-m-d H:i:s', $report['takeover_at']);
          if ($d) $takeoverFormatted = $d->format('Y-m-d\TH:i');
        }
        if ($report && !empty($report['intervention_start'])) {
          $d = \DateTime::createFromFormat('Y-m-d H:i:s', $report['intervention_start']);
          if ($d) $startFormatted = $d->format('Y-m-d\TH:i');
        }
        if ($report && !empty($report['intervention_end'])) {
          $d = \DateTime::createFromFormat('Y-m-d H:i:s', $report['intervention_end']);
          if ($d) $endFormatted = $d->format('Y-m-d\TH:i');
        }
      ?>
      <div class="sidebar-card">
        <div class="card-header">
          <h6><i class="fas fa-file-circle-plus me-2"></i>Rapport de traitement (Admin)</h6>
        </div>
        <div class="card-body">
          <p class="small text-muted mb-2"><?= $report ? 'Compléter et clôturer le rapport existant.' : 'Créer un rapport de traitement.' ?></p>
          <button type="button" class="btn btn-sm btn-primary w-100" data-bs-toggle="modal" data-bs-target="#adminReportModal">
            <i class="fas fa-<?= $report ? 'check' : 'plus' ?> me-1"></i><?= $report ? 'Clôturer le rapport' : 'Ajouter un rapport' ?>
          </button>
        </div>
      </div>
    <?php endif; ?>

    <!-- Techniciens assignés -->
    <?php if ((!empty($assignedUsers) && is_array($assignedUsers)) || $canAssignTechnician): ?>
      <div class="sidebar-card">
        <div class="card-header">
          <h6><i class="fas fa-users me-2"></i>Techniciens</h6>
        </div>
        <div class="card-body">
          <?php if (!empty($assignedUsers) && is_array($assignedUsers)): ?>
            <div class="list-group list-group-flush mb-3">
              <?php foreach ($assignedUsers as $u): ?>
                <div class="list-group-item small d-flex align-items-center gap-2 px-0">
                  <div class="comment-avatar" style="width:32px;height:32px;font-size:0.875rem;">
                    <?= strtoupper(substr($u['name'] ?? 'T', 0, 1)) ?>
                  </div>
                  <div>
                    <div class="fw-semibold"><?= htmlspecialchars($u['name'] ?? 'Technicien') ?></div>
                  <?php if ($role === 'admin'): ?>
                  <!-- Modal: Rapport Admin -->
                  <div class="modal fade" id="adminReportModal" tabindex="-1" aria-hidden="true">
                    <div class="modal-dialog modal-lg modal-dialog-scrollable">
                      <div class="modal-content">
                        <div class="modal-header">
        <h5 class="modal-title"><i class="fas fa-file-circle-plus me-2"></i><?= $report ? 'Clôturer le rapport' : 'Nouveau rapport' ?> (Admin)</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <form method="post" action="<?= htmlspecialchars(route_url('/incidents/treatment/save')) ?>" enctype="multipart/form-data" id="adminReportForm">
        <input type="hidden" name="incident_id" value="<?= (int)$incident['id'] ?>">
        <input type="hidden" name="action_type" value="submit">
        <div class="modal-body">
          <?php if ($report): ?>
          <div class="alert alert-info mb-3">
            <i class="fas fa-info-circle me-2"></i>Les données ci-dessous proviennent du rapport validé. <strong>Seul le rapport final (PDF) est requis pour clôturer l'incident.</strong>
          </div>
          <?php endif; ?>
          
          <div class="row g-3">
            <div class="col-md-6">
              <label class="form-label small">Équipe</label>
              <input type="text" name="team_name" class="form-control" value="<?= htmlspecialchars($report['team_name'] ?? $cu['name'] ?? '') ?>" readonly>
            </div>
            <div class="col-md-6">
              <label class="form-label small">Contact équipe</label>
              <input type="text" name="team_contact" class="form-control" value="<?= htmlspecialchars($report['team_contact'] ?? '') ?>" placeholder="Téléphone / Email" readonly>
            </div>

            <div class="col-md-6">
              <label class="form-label small">Type d'incident</label>
              <input type="text" name="type_of_incident" class="form-control" value="<?= htmlspecialchars($report['type_of_incident'] ?? '') ?>" placeholder="Ex: Coupure" readonly>
            </div>
            <div class="col-md-6">
              <label class="form-label small">Mode de détection</label>
              <input type="text" name="detection_mode" class="form-control" value="<?= htmlspecialchars($report['detection_mode'] ?? '') ?>" placeholder="Ex: OTDR" readonly>
            </div>

            <div class="col-md-4">
              <label class="form-label small">Longueur de coupure (km)</label>
              <input type="number" step="0.01" min="0" name="cut_distance_km" class="form-control" value="<?= htmlspecialchars($report['cut_distance_km'] ?? '') ?>" placeholder="0.00" readonly>
            </div>
            <div class="col-md-4">
              <label class="form-label small">GPS Lat</label>
              <input type="text" name="gps_lat" class="form-control" value="<?= htmlspecialchars($report['gps_lat'] ?? '') ?>" placeholder="12.345678" readonly>
            </div>
            <div class="col-md-4">
              <label class="form-label small">GPS Lng</label>
              <input type="text" name="gps_lng" class="form-control" value="<?= htmlspecialchars($report['gps_lng'] ?? '') ?>" placeholder="-1.234567" readonly>
            </div>

            <div class="col-md-4">
              <label class="form-label small">Prise en charge</label>
              <input type="datetime-local" name="takeover_at" class="form-control" value="<?= htmlspecialchars($takeoverFormatted ?? '') ?>" readonly>
            </div>
            <div class="col-md-4">
              <label class="form-label small">Début intervention</label>
              <input type="datetime-local" name="intervention_start" class="form-control" value="<?= htmlspecialchars($startFormatted ?? '') ?>" readonly>
            </div>
            <div class="col-md-4">
              <label class="form-label small">Fin intervention</label>
              <input type="datetime-local" name="intervention_end" class="form-control" value="<?= htmlspecialchars($endFormatted ?? '') ?>" readonly>
            </div>

            <div class="col-md-6">
              <label class="form-label small">Type de réparation</label>
              <input type="text" name="repair_type" class="form-control" value="<?= htmlspecialchars($report['repair_type'] ?? '') ?>" placeholder="Ex: Raccordement / Remplacement" readonly>
            </div>
            <div class="col-md-6">
              <label class="form-label small">Équipements impactés</label>
              <input type="text" name="impacted_equipment_text" id="impactedEqText" class="form-control" value="<?= htmlspecialchars($equipmentsText ?? '') ?>" placeholder="Séparer par des virgules" readonly>
            </div>

            <div class="col-12">
              <label class="form-label small">Commentaires de travail</label>
              <textarea name="work_comments" class="form-control" rows="3" readonly placeholder="Observations, travaux effectués..."><?= htmlspecialchars($report['work_comments'] ?? '') ?></textarea>
            </div>

            <div class="col-12">
              <hr class="my-3">
              <div class="alert alert-warning">
                <i class="fas fa-exclamation-triangle me-2"></i><strong>Rapport final requis pour clôturer l'incident</strong>
              </div>
              <label class="form-label small fw-bold">Rapport final de clôture <span class="text-danger">*</span></label>
              <input type="file" name="final_report_pdf" id="finalReportPdfInput" class="form-control" accept=".pdf,.doc,.docx" required>
              <small class="text-muted">Formats acceptés: PDF, DOC, DOCX</small>
            </div>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
          <button type="submit" class="btn btn-success" id="adminReportSubmitBtn"><i class="fas fa-check-circle me-1"></i>Clôturer l'incident</button>
        </div>
      </form>
    </div>
  </div>
  </div>
<?php endif; ?>

    <!-- Techniciens assignés -->
    <?php if ((!empty($assignedUsers) && is_array($assignedUsers)) || $canAssignTechnician): ?>
      <div class="sidebar-card">
        <div class="card-header">
          <h6><i class="fas fa-users me-2"></i>Techniciens</h6>
        </div>
        <div class="card-body">
          <?php if (!empty($assignedUsers) && is_array($assignedUsers)): ?>
            <div class="list-group list-group-flush mb-3">
              <?php foreach ($assignedUsers as $u): ?>
                <div class="list-group-item small d-flex align-items-center gap-2 px-0">
                  <div class="comment-avatar" style="width:32px;height:32px;font-size:0.875rem;">
                    <?= strtoupper(substr($u['name'] ?? 'T', 0, 1)) ?>
                  </div>
                  <div>
                    <div class="fw-semibold"><?= htmlspecialchars($u['name'] ?? 'Technicien') ?></div>
          <?php else: ?>
            <p class="text-muted small mb-3">Aucun technicien assigné</p>
          <?php endif; ?>

          <?php if ($canAssignTechnician && (empty($assignedUsers) || count((array)$assignedUsers) === 0)): ?>
          <form method="post" action="<?= htmlspecialchars(route_url('/incidents/assign')) ?>" class="row g-2 align-items-end">
            <input type="hidden" name="incident_id" value="<?= (int)$incident['id'] ?>">
            <div class="col-12">
              <label for="assignTechSelect" class="form-label small mb-1">Assigner un technicien</label>
              <?php $assignedIds = array_map(fn($x) => (int)($x['user_id'] ?? 0), is_array($assignedUsers)?$assignedUsers:[]); ?>
              <select class="form-select form-select-sm" name="user_id" id="assignTechSelect" required>
                <option value="" selected disabled>— Sélectionner —</option>
                <?php if (!empty($techniciens) && is_array($techniciens)): ?>
                  <?php foreach ($techniciens as $t): $tid=(int)($t['id'] ?? 0); if ($tid<=0 || in_array($tid,$assignedIds,true)) { continue; } ?>
                    <option value="<?= $tid ?>"><?= htmlspecialchars($t['name'] ?? 'Technicien') ?></option>
                  <?php endforeach; ?>
                <?php endif; ?>
              </select>
            </div>
            <div class="col-12 d-grid">
              <button type="submit" class="btn btn-sm btn-primary"><i class="fas fa-user-plus me-1"></i> Assigner</button>
            </div>
          </form>
          <?php elseif ($canAssignTechnician): ?>
            <p class="small text-muted mb-0"><i class="fas fa-lock me-1"></i> Assignation indisponible (statut traité/clôturé).</p>
          <?php endif; ?>
        </div>
      </div>
    <?php endif; ?>
  </div>
</div>

<!-- Modals (inclure les mêmes que detail.php) -->
<!-- Modal aperçu fichier -->
<div class="modal fade" id="filePreviewModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title"><i class="fas fa-file me-2"></i> Aperçu</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Fermer"></button>
      </div>
      <div class="modal-body p-0" id="filePreviewBody">
        <iframe id="filePreviewFrame" src="" class="w-100 border-0" style="height:70vh; background:#fff"></iframe>
      </div>
      <div class="modal-footer">
        <a id="fileDownloadLink" href="#" class="btn btn-primary" target="_blank"><i class="fas fa-download me-1"></i> Ouvrir</a>
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Fermer</button>
      </div>
    </div>
  </div>
</div>

<!-- Modal motif de pause -->
<div class="modal fade" id="pauseReasonModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title"><i class="fas fa-pause me-2"></i>Motif de mise en pause</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <div class="modal-body">
        <div class="mb-2">
          <label for="pauseReasonInput" class="form-label">Motif</label>
          <textarea id="pauseReasonInput" class="form-control" rows="3" placeholder="Ex: attente matériel..."></textarea>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
        <button type="button" class="btn btn-warning" id="pauseReasonSubmit"><i class="fas fa-check me-1"></i> Valider</button>
      </div>
    </div>
  </div>
</div>

<!-- Modal confirmation désassignation -->
<div class="modal fade" id="unassignConfirmModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title"><i class="fas fa-user-minus me-2"></i>Confirmer la désassignation</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
      </div>
      <div class="modal-body">
        Voulez-vous désassigner le technicien <strong id="unassignTechName">—</strong> ?
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
        <button type="button" class="btn btn-danger" id="unassignConfirmBtn"><i class="fas fa-check me-1"></i> Oui, désassigner</button>
      </div>
    </div>
  </div>
  </div>

<!-- Formulaire caché pour POST désassignation -->
<form id="unassignHiddenForm" method="post" action="<?= htmlspecialchars(route_url('/incidents/unassign')) ?>" class="d-none">
  <input type="hidden" name="incident_id" id="unassignIncidentId" value="">
  <input type="hidden" name="user_id" id="unassignUserId" value="">
  <input type="hidden" name="_csrf" value="">
</form>

<script>
document.addEventListener('DOMContentLoaded', function() {
  // Active le bon onglet Bootstrap si un hash est présent
  (function(){
    const hash = window.location.hash;
    if (hash) {
      const tabTriggerEl = document.querySelector(`button[data-bs-target="${hash}"]`);
      if (tabTriggerEl) {
        try { if (window.bootstrap && bootstrap.Tab) { new bootstrap.Tab(tabTriggerEl).show(); } } catch(e) { }
      }
    }
    document.querySelectorAll('button[data-bs-toggle="tab"]').forEach(btn=>{
      btn.addEventListener('shown.bs.tab', e => {
        const target = e.target?.getAttribute('data-bs-target');
        if (target && history.replaceState) { history.replaceState(null, '', target); }
      });
    });
  })();

  // Gestion des actions d'intervention
  const btnStart = document.getElementById('btnInterventionStart');
  const btnPause = document.getElementById('btnInterventionPause');
  const btnResume = document.getElementById('btnInterventionResume');
  const incidentId = <?= (int)$incident['id'] ?>;
  const pauseReasonInput = document.getElementById('pauseReasonInput');
  const pauseReasonSubmitBtn = document.getElementById('pauseReasonSubmit');
  let pauseModal = null;
  const pauseModalEl = document.getElementById('pauseReasonModal');
  if (pauseModalEl && window.bootstrap && bootstrap.Modal) { pauseModal = new bootstrap.Modal(pauseModalEl); }

  function waitForBootstrap(cb, timeoutMs){
    const max = typeof timeoutMs === 'number' ? timeoutMs : 4000;
    const start = Date.now();
    if (window.bootstrap) return void cb();
    const iv = setInterval(()=>{
      if (window.bootstrap || (Date.now()-start) > max) { clearInterval(iv); if (window.bootstrap) cb(); }
    }, 120);
  }

  async function postIntervention(action, extraParams) {
    const urlMap = {
      start: '<?= htmlspecialchars(route_url('/incidents/intervention/start')) ?>',
      pause: '<?= htmlspecialchars(route_url('/incidents/intervention/pause')) ?>',
      resume: '<?= htmlspecialchars(route_url('/incidents/intervention/resume')) ?>'
    };
    const params = new URLSearchParams({ incident_id: String(incidentId), ajax: '1' });
    if (extraParams) {
      Object.entries(extraParams).forEach(([k, v]) => { if (v !== undefined && v !== null) params.append(k, v); });
    }
    try {
      const resp = await fetch(urlMap[action], {
        method: 'POST',
        headers: { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8', 'X-Requested-With': 'XMLHttpRequest' },
        body: params.toString(),
        credentials: 'same-origin'
      });
      const data = await resp.json().catch(() => ({}));
      if (resp.ok && data && data.status === 'ok') {
        location.reload(); // Recharger pour simplifier
      } else {
        alert(data && data.message ? data.message : 'Action échouée');
      }
    } catch (e) {
      alert('Erreur lors de l\'action');
    }
  }

  if (btnStart) {
    btnStart.addEventListener('click', () => postIntervention('start'));
  }
  if (btnPause) {
    btnPause.addEventListener('click', () => {
      if (pauseReasonInput) pauseReasonInput.value = '';
      if (!pauseModal && pauseModalEl && window.bootstrap && bootstrap.Modal) {
        pauseModal = new bootstrap.Modal(pauseModalEl);
      }
      if (pauseModal) {
        pauseModal.show();
      } else {
        waitForBootstrap(() => {
          if (!pauseModal && pauseModalEl && window.bootstrap && bootstrap.Modal) {
            pauseModal = new bootstrap.Modal(pauseModalEl);
          }
          if (pauseModal) pauseModal.show();
        });
      }
    });
  }
  if (btnResume) {
    btnResume.addEventListener('click', () => postIntervention('resume'));
  }

  if (pauseReasonSubmitBtn) {
    pauseReasonSubmitBtn.addEventListener('click', () => {
      const val = pauseReasonInput ? String(pauseReasonInput.value).trim() : '';
      if (!val) { alert('Motif requis'); return; }
      postIntervention('pause', { reason: val }).then(() => { if (pauseModal) pauseModal.hide(); });
    });
  }

  // Désassignation via modal Bootstrap
  let unassignModal = null;
  const unassignModalEl = document.getElementById('unassignConfirmModal');
  const unassignBtn = document.getElementById('unassignConfirmBtn');
  const unassignTechName = document.getElementById('unassignTechName');
  const unassignForm = document.getElementById('unassignHiddenForm');
  const unassignIncidentInput = document.getElementById('unassignIncidentId');
  const unassignUserInput = document.getElementById('unassignUserId');
  if (unassignModalEl && window.bootstrap && bootstrap.Modal) { unassignModal = new bootstrap.Modal(unassignModalEl); }

  document.addEventListener('click', function(e){
    const btn = e.target.closest && e.target.closest('.js-unassign-btn');
    if (!btn) return;
    e.preventDefault();
    const uid = btn.getAttribute('data-user-id');
    const iid = btn.getAttribute('data-incident-id');
    const uname = btn.getAttribute('data-user-name') || 'Technicien';
    if (unassignTechName) unassignTechName.textContent = uname;
    if (unassignIncidentInput) unassignIncidentInput.value = iid || '';
    if (unassignUserInput) unassignUserInput.value = uid || '';
    if (unassignModal) {
      unassignModal.show();
    } else if (typeof waitForBootstrap === 'function') {
      waitForBootstrap(() => {
        if (!unassignModal && unassignModalEl && window.bootstrap && bootstrap.Modal) {
          unassignModal = new bootstrap.Modal(unassignModalEl);
        }
        if (unassignModal) unassignModal.show();
      });
    }
  });

  if (unassignBtn) {
    unassignBtn.addEventListener('click', function(){
      if (!unassignForm) return;
      unassignForm.submit();
    });
  }

  // Délégation : ouverture des fichiers en modal
  (function(){
    const modalEl = document.getElementById('filePreviewModal');
    const frame = document.getElementById('filePreviewFrame');
    const dl = document.getElementById('fileDownloadLink');
    let modal;
    if (modalEl && window.bootstrap && bootstrap.Modal) { modal = new bootstrap.Modal(modalEl); }
    document.addEventListener('click', function(e){
      const a = e.target.closest && e.target.closest('a.js-open-file');
      if (!a) return;
      e.preventDefault();
      const url = a.getAttribute('data-file-url') || a.getAttribute('href');
      if (!url || !frame) return;
      frame.src = url;
      if (dl) dl.href = url;
      modal && modal.show();
    });
  })();

  // Soumission AJAX des commentaires (optionnel, simplifié pour le redesign)
  const commentForm = document.querySelector('#pane-comments form[action*="/incidents/comment"]');
  if (commentForm) {
    const uploadBase = '<?= htmlspecialchars(rtrim(upload_url(""), "/")) ?>';
    commentForm.addEventListener('submit', async function(e) {
      e.preventDefault();
      const fd = new FormData(commentForm);
      fd.append('ajax', '1');
      const submitBtn = commentForm.querySelector('button[type="submit"]');
      if (submitBtn) { submitBtn.disabled = true; submitBtn.innerHTML = '<i class="fas fa-spinner fa-spin me-1"></i> Publication...'; }
      try {
        const resp = await fetch(commentForm.action, {
          method: 'POST',
          body: fd,
          headers: { 'X-Requested-With': 'XMLHttpRequest' },
          credentials: 'same-origin'
        });
        const data = await resp.json().catch(() => ({}));
        if (resp.ok && data && data.status === 'ok') {
          location.reload(); // Recharger pour simplifier
        } else {
          alert(data && data.message ? data.message : 'Publication échouée');
        }
      } catch (err) {
        alert('Erreur de publication');
      } finally {
        if (submitBtn) { submitBtn.disabled = false; submitBtn.innerHTML = '<i class="fas fa-paper-plane me-1"></i>Publier'; }
      }
    });
  }
  // Transformer "Équipements impactés" en impacted_equipment[] (modal admin)
  const adminReportForm = document.getElementById('adminReportForm');
  if (adminReportForm) {
    adminReportForm.addEventListener('submit', function(e){
      const eqText = document.getElementById('impactedEqText');
      if (!eqText) return;
      const raw = String(eqText.value || '').split(',');
      raw
        .map(s => s.trim())
        .filter(s => s.length > 0)
        .forEach(val => {
          const inp = document.createElement('input');
          inp.type = 'hidden';
          inp.name = 'impacted_equipment[]';
          inp.value = val;
          adminReportForm.appendChild(inp);
        });
    });
  }
});
</script>
