<?= $this->extend('layouts/main') ?>
<?= $this->section('content') ?>

<div class="page-header">
  <div>
    <h1><i class="bi bi-tools me-2 text-primary"></i><?= esc($wo['wo_number']) ?></h1>
    <div class="d-flex gap-2 align-items-center mt-1 flex-wrap">
      <span class="fm-badge badge-priority-<?= esc($wo['priority']) ?>"><?= ucfirst($wo['priority']) ?></span>
      <span class="fm-badge badge-status-<?= esc($wo['status']) ?>"><?= ucfirst(str_replace('_', ' ', $wo['status'])) ?></span>
      <?php if ($wo['category']): ?><span class="fm-badge" style="background:#e0f2fe;color:#0277bd"><?= ucfirst(str_replace('_', ' ', $wo['category'])) ?></span><?php endif; ?>
      <?php if ($wo['sla_breached']): ?><span class="fm-badge" style="background:#fee2e2;color:#991b1b"><i class="bi bi-exclamation-triangle me-1"></i>SLA Breached</span><?php endif; ?>
      <?php if (($wo['approval_status'] ?? 'approved') === 'pending'): ?><span class="fm-badge" style="background:#fff3cd;color:#856404"><i class="bi bi-hourglass-split me-1"></i>Awaiting Approval</span><?php endif; ?>
    </div>
  </div>
  <div class="d-flex gap-2 flex-wrap">
    <?php if (in_array(session()->get('user_role'), ['super_admin', 'facility_manager'])): ?>
    <a href="<?= base_url('workorders/edit/' . $wo['id']) ?>" class="btn btn-fm-primary btn-sm"><i class="bi bi-pencil me-1"></i>Edit</a>
    <?php endif; ?>
    <a href="<?= base_url('workorders') ?>" class="btn btn-fm-outline btn-sm"><i class="bi bi-arrow-left me-1"></i>Back</a>
  </div>
</div>

<?php if (session()->getFlashdata('success')): ?>
<div class="alert alert-success"><?= session()->getFlashdata('success') ?></div>
<?php endif; ?>
<?php if (session()->getFlashdata('error')): ?>
<div class="alert alert-danger"><?= session()->getFlashdata('error') ?></div>
<?php endif; ?>

<!-- Quick Status Update Bar -->
<?php if (!in_array($wo['status'], ['completed', 'closed', 'cancelled']) && in_array(session()->get('user_role'), ['super_admin', 'facility_manager', 'technician'])): ?>
<div class="fm-card mb-3">
  <div class="fm-card-body py-2 px-3">
    <div class="d-flex align-items-center gap-2 flex-wrap">
      <span class="small fw-semibold text-muted">Quick Update:</span>
      <?php $nextStatuses = ['new' => ['assigned', 'in_progress'], 'assigned' => ['in_progress', 'on_hold'], 'in_progress' => ['on_hold', 'completed'], 'on_hold' => ['in_progress', 'cancelled']]; ?>
      <?php foreach ($nextStatuses[$wo['status']] ?? [] as $ns): ?>
      <button class="btn btn-sm btn-fm-outline py-1 px-3" onclick="quickStatus('<?= $ns ?>')"><?= ucfirst(str_replace('_', ' ', $ns)) ?></button>
      <?php endforeach; ?>
      <?php if (in_array(session()->get('user_role'), ['super_admin', 'facility_manager'])): ?>
      <a href="<?= base_url('workorders/escalate/' . $wo['id']) ?>" class="btn btn-sm btn-outline-danger py-1 px-3 ms-auto" onclick="return confirm('Escalate this work order?')"><i class="bi bi-arrow-up-circle me-1"></i>Escalate</a>
      <?php endif; ?>
    </div>
  </div>
</div>
<?php endif; ?>

<!-- Tabbed Content -->
<ul class="nav nav-tabs mb-3" id="woTabs">
  <li class="nav-item"><a class="nav-link active" href="#tab-overview"   data-bs-toggle="tab">Overview</a></li>
  <li class="nav-item"><a class="nav-link"        href="#tab-labor"      data-bs-toggle="tab">Labor &amp; Time <span class="badge bg-secondary ms-1"><?= count($labor) ?></span></a></li>
  <li class="nav-item"><a class="nav-link"        href="#tab-materials"  data-bs-toggle="tab">Materials <span class="badge bg-secondary ms-1"><?= count($materials) ?></span></a></li>
  <li class="nav-item"><a class="nav-link"        href="#tab-costing"    data-bs-toggle="tab">Costing</a></li>
  <?php if ($wo['asset_id']): ?>
  <li class="nav-item"><a class="nav-link"        href="#tab-asset"      data-bs-toggle="tab">Asset Info</a></li>
  <?php endif; ?>
  <li class="nav-item"><a class="nav-link"        href="#tab-docs"       data-bs-toggle="tab">Documents <span class="badge bg-secondary ms-1"><?= count($attachments) ?></span></a></li>
  <li class="nav-item"><a class="nav-link"        href="#tab-activity"   data-bs-toggle="tab">Activity <span class="badge bg-secondary ms-1"><?= count($comments) ?></span></a></li>
  <li class="nav-item"><a class="nav-link"        href="#tab-closure"    data-bs-toggle="tab">Closure &amp; Invoice</a></li>
  <li class="nav-item"><a class="nav-link"        href="#tab-approval"   data-bs-toggle="tab">Approval</a></li>
</ul>

<div class="tab-content" id="woTabContent">

  <!-- ============================================================ TAB: OVERVIEW -->
  <div class="tab-pane fade show active" id="tab-overview">
    <div class="row g-3">
      <div class="col-lg-8">
        <div class="fm-card mb-3">
          <div class="fm-card-body">
            <h5 class="fw-bold mb-2" style="color:#0a3d6b"><?= esc($wo['title']) ?></h5>
            <p class="text-muted small mb-4"><?= nl2br(esc($wo['description'] ?? 'No description provided.')) ?></p>
            <div class="row g-3">
              <div class="col-sm-6">
                <div class="fm-form-section">
                  <h6><i class="bi bi-buildings"></i> Facility / Location</h6>
                  <p class="mb-0 text-muted small"><?= esc($wo['facility_name']) ?></p>
                </div>
              </div>
              <div class="col-sm-6">
                <div class="fm-form-section">
                  <h6><i class="bi bi-wrench"></i> Type</h6>
                  <p class="mb-0 text-muted small"><?= ucfirst($wo['type']) ?></p>
                </div>
              </div>
              <div class="col-sm-6">
                <div class="fm-form-section">
                  <h6><i class="bi bi-person"></i> Assigned Technician</h6>
                  <p class="mb-0 text-muted small"><?= esc($wo['assigned_name'] ?? 'Unassigned') ?></p>
                </div>
              </div>
              <div class="col-sm-6">
                <div class="fm-form-section">
                  <h6><i class="bi bi-truck"></i> Vendor</h6>
                  <p class="mb-0 text-muted small"><?= esc($wo['vendor_name'] ?? '—') ?></p>
                </div>
              </div>
              <?php if ($wo['planned_start']): ?>
              <div class="col-sm-6">
                <div class="fm-form-section">
                  <h6><i class="bi bi-calendar-event"></i> Planned Start</h6>
                  <p class="mb-0 text-muted small"><?= date('d M Y H:i', strtotime($wo['planned_start'])) ?></p>
                </div>
              </div>
              <?php endif; ?>
              <?php if ($wo['planned_end']): ?>
              <div class="col-sm-6">
                <div class="fm-form-section">
                  <h6><i class="bi bi-calendar-check"></i> Planned End</h6>
                  <p class="mb-0 text-muted small"><?= date('d M Y H:i', strtotime($wo['planned_end'])) ?></p>
                </div>
              </div>
              <?php endif; ?>
            </div>
          </div>
        </div>

        <?php if ($wo['completion_notes']): ?>
        <div class="fm-card mb-3">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-2"><i class="bi bi-clipboard2-check me-2 text-success"></i>Completion Notes</h6>
            <p class="text-muted small mb-0"><?= nl2br(esc($wo['completion_notes'])) ?></p>
          </div>
        </div>
        <?php endif; ?>

        <?php if ($wo['requester_name'] || $wo['requester_phone'] || $wo['requester_email']): ?>
        <div class="fm-card">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-3"><i class="bi bi-person-lines-fill me-2 text-primary"></i>Requester Details</h6>
            <div class="row g-2 small text-muted">
              <?php if ($wo['requester_name']): ?><div class="col-sm-4"><i class="bi bi-person me-1"></i><?= esc($wo['requester_name']) ?></div><?php endif; ?>
              <?php if ($wo['requester_phone']): ?><div class="col-sm-4"><i class="bi bi-telephone me-1"></i><?= esc($wo['requester_phone']) ?></div><?php endif; ?>
              <?php if ($wo['requester_email']): ?><div class="col-sm-4"><i class="bi bi-envelope me-1"></i><?= esc($wo['requester_email']) ?></div><?php endif; ?>
            </div>
          </div>
        </div>
        <?php endif; ?>
      </div>

      <!-- Side panel -->
      <div class="col-lg-4">
        <!-- SLA & Timing -->
        <div class="fm-card mb-3">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-3"><i class="bi bi-clock me-2"></i>SLA & Timing</h6>
            <div class="small">
              <?php
              $slaPct = 0;
              if ($wo['sla_due'] && $wo['created_at']) {
                  $total   = strtotime($wo['sla_due']) - strtotime($wo['created_at']);
                  $elapsed = time() - strtotime($wo['created_at']);
                  $slaPct  = min(100, ($total > 0 ? round($elapsed / $total * 100) : 100));
              }
              $slaColor = $slaPct >= 100 ? 'danger' : ($slaPct >= 75 ? 'warning' : 'success');
              ?>
              <div class="d-flex justify-content-between mb-1">
                <span class="text-muted">SLA Due</span>
                <strong class="text-<?= $slaColor ?>"><?= $wo['sla_due'] ? date('d M Y H:i', strtotime($wo['sla_due'])) : '—' ?></strong>
              </div>
              <div class="progress mb-3" style="height:6px">
                <div class="progress-bar bg-<?= $slaColor ?>" style="width:<?= $slaPct ?>%"></div>
              </div>
              <div class="d-flex justify-content-between mb-1"><span class="text-muted">Created</span><span><?= date('d M Y H:i', strtotime($wo['created_at'])) ?></span></div>
              <?php if ($wo['started_at']): ?><div class="d-flex justify-content-between mb-1"><span class="text-muted">Started</span><span><?= date('d M Y H:i', strtotime($wo['started_at'])) ?></span></div><?php endif; ?>
              <?php if ($wo['completed_at']): ?><div class="d-flex justify-content-between mb-1"><span class="text-muted">Completed</span><span><?= date('d M Y H:i', strtotime($wo['completed_at'])) ?></span></div><?php endif; ?>
              <?php if ($wo['started_at'] && $wo['completed_at']): ?>
              <?php $mttr = round((strtotime($wo['completed_at']) - strtotime($wo['started_at'])) / 3600, 1); ?>
              <div class="d-flex justify-content-between mt-2 pt-2 border-top"><span class="text-muted fw-semibold">MTTR</span><strong><?= $mttr ?>h</strong></div>
              <?php endif; ?>
            </div>
          </div>
        </div>

        <!-- Cost Summary -->
        <div class="fm-card mb-3">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-3"><i class="bi bi-cash-stack me-2"></i>Cost Summary</h6>
            <div class="small">
              <div class="d-flex justify-content-between mb-1"><span class="text-muted">Labor</span><span><?= $currency ?> <?= number_format($laborTotal, 2) ?></span></div>
              <div class="d-flex justify-content-between mb-1"><span class="text-muted">Materials</span><span><?= $currency ?> <?= number_format($materialTotal, 2) ?></span></div>
              <div class="d-flex justify-content-between mb-1"><span class="text-muted">Vendor</span><span><?= $currency ?> <?= number_format($vendorCost, 2) ?></span></div>
              <div class="d-flex justify-content-between fw-bold pt-2 border-top"><span>Total</span><span><?= $currency ?> <?= number_format($totalCost, 2) ?></span></div>
              <?php if ($wo['estimated_cost']): ?>
              <?php $variance = $totalCost - $wo['estimated_cost']; ?>
              <div class="d-flex justify-content-between mt-1 text-<?= $variance > 0 ? 'danger' : 'success' ?> small">
                <span>vs Estimate (<?= $currency ?> <?= number_format($wo['estimated_cost'], 2) ?>)</span>
                <span><?= $variance > 0 ? '+' : '' ?><?= number_format($variance, 2) ?></span>
              </div>
              <?php endif; ?>
            </div>
          </div>
        </div>

        <!-- Created by -->
        <div class="fm-card">
          <div class="fm-card-body small text-muted">
            <div class="mb-1"><strong>Created by:</strong> <?= esc($wo['created_by_name']) ?></div>
            <div class="mb-1"><strong>Approved by:</strong> <?= esc($wo['approved_by_name'] ?? '—') ?></div>
            <div><strong>Approval:</strong>
              <?php $apSt = $wo['approval_status'] ?? 'approved'; ?>
              <span class="fm-badge badge-status-<?= $apSt === 'approved' ? 'completed' : ($apSt === 'rejected' ? 'cancelled' : 'pending') ?>"><?= ucfirst($apSt) ?></span>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ============================================================ TAB: LABOR -->
  <div class="tab-pane fade" id="tab-labor">
    <div class="row g-3">
      <div class="col-lg-8">
        <div class="fm-card">
          <div class="card-header-fm">
            <h5><i class="bi bi-stopwatch"></i> Labor & Time Entries</h5>
          </div>
          <div class="fm-card-body p-0">
            <div class="table-responsive">
              <table class="fm-table">
                <thead><tr><th>Technician</th><th>Date</th><th>Start</th><th>End</th><th>Hours</th><th>OT Hrs</th><th>Rate</th><th>Cost</th><th>Notes</th><th></th></tr></thead>
                <tbody>
                  <?php foreach ($labor as $l): ?>
                  <tr>
                    <td class="small"><?= esc($l['tech_name']) ?></td>
                    <td class="small"><?= date('d M Y', strtotime($l['work_date'])) ?></td>
                    <td class="small"><?= $l['start_time'] ? date('H:i', strtotime($l['start_time'])) : '—' ?></td>
                    <td class="small"><?= $l['end_time']   ? date('H:i', strtotime($l['end_time']))   : '—' ?></td>
                    <td class="small"><?= $l['hours_worked'] ?>h</td>
                    <td class="small"><?= $l['overtime_hours'] ?>h</td>
                    <td class="small"><?= $currency ?> <?= number_format($l['hourly_rate'], 2) ?></td>
                    <td class="small fw-semibold"><?= $currency ?> <?= number_format($l['labor_cost'], 2) ?></td>
                    <td class="small text-muted"><?= esc($l['notes'] ?? '—') ?></td>
                    <td>
                      <?php if (in_array(session()->get('user_role'), ['super_admin', 'facility_manager'])): ?>
                      <a href="<?= base_url('workorders/labor/delete/' . $l['id']) ?>" class="btn-action bg-danger bg-opacity-10 text-danger" onclick="return confirm('Remove this entry?')"><i class="bi bi-trash"></i></a>
                      <?php endif; ?>
                    </td>
                  </tr>
                  <?php endforeach; ?>
                  <?php if (empty($labor)): ?><tr><td colspan="10" class="text-center py-4 text-muted">No labor entries yet</td></tr><?php endif; ?>
                  <?php if (!empty($labor)): ?>
                  <tr class="fw-bold" style="background:#f8fafc">
                    <td colspan="7" class="text-end small">Total Labor Cost</td>
                    <td class="small"><?= $currency ?> <?= number_format($laborTotal, 2) ?></td>
                    <td colspan="2"></td>
                  </tr>
                  <?php endif; ?>
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
      <!-- Add Labor Form -->
      <div class="col-lg-4">
        <div class="fm-card">
          <div class="card-header-fm"><h5><i class="bi bi-plus-circle"></i> Add Labor Entry</h5></div>
          <div class="fm-card-body">
            <?= form_open('workorders/labor/add/' . $wo['id']) ?>
            <div class="mb-2">
              <label class="form-label">Technician</label>
              <select name="user_id" class="form-select form-select-sm">
                <?php foreach ($technicians as $t): ?>
                <option value="<?= $t['id'] ?>" <?= session()->get('user_id') == $t['id'] ? 'selected' : '' ?>><?= esc($t['name']) ?></option>
                <?php endforeach; ?>
              </select>
            </div>
            <div class="mb-2">
              <label class="form-label">Work Date</label>
              <input type="date" name="work_date" class="form-control form-control-sm" value="<?= date('Y-m-d') ?>">
            </div>
            <div class="row g-2 mb-2">
              <div class="col-6"><label class="form-label">Start Time</label><input type="time" name="start_time" class="form-control form-control-sm"></div>
              <div class="col-6"><label class="form-label">End Time</label><input type="time" name="end_time" class="form-control form-control-sm"></div>
            </div>
            <div class="row g-2 mb-2">
              <div class="col-6"><label class="form-label">Hours Worked</label><input type="number" name="hours_worked" class="form-control form-control-sm" step="0.5" min="0" value="0"></div>
              <div class="col-6"><label class="form-label">Overtime Hrs</label><input type="number" name="overtime_hours" class="form-control form-control-sm" step="0.5" min="0" value="0"></div>
            </div>
            <div class="mb-2">
              <label class="form-label">Hourly Rate (<?= $currency ?>) — leave 0 to auto</label>
              <input type="number" name="hourly_rate" class="form-control form-control-sm" step="0.01" value="0">
            </div>
            <div class="mb-3">
              <label class="form-label">Notes</label>
              <textarea name="labor_notes" class="form-control form-control-sm" rows="2"></textarea>
            </div>
            <button type="submit" class="btn btn-fm-primary btn-sm w-100"><i class="bi bi-plus-lg me-1"></i>Add Entry</button>
            <?= form_close() ?>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ============================================================ TAB: MATERIALS -->
  <div class="tab-pane fade" id="tab-materials">
    <div class="row g-3">
      <div class="col-lg-8">
        <div class="fm-card">
          <div class="card-header-fm"><h5><i class="bi bi-boxes"></i> Materials & Parts Used</h5></div>
          <div class="fm-card-body p-0">
            <div class="table-responsive">
              <table class="fm-table">
                <thead><tr><th>Item</th><th>Code</th><th>Qty</th><th>Unit Cost</th><th>Total</th><th>Stock</th><th>Notes</th><th></th></tr></thead>
                <tbody>
                  <?php foreach ($materials as $m): ?>
                  <tr>
                    <td class="small fw-semibold"><?= esc($m['item_name']) ?></td>
                    <td class="small text-muted"><?= esc($m['item_code'] ?? '—') ?></td>
                    <td class="small"><?= $m['quantity'] ?></td>
                    <td class="small"><?= $currency ?> <?= number_format($m['unit_cost'], 2) ?></td>
                    <td class="small fw-semibold"><?= $currency ?> <?= number_format($m['total_cost'], 2) ?></td>
                    <td class="small"><?= $m['deducted_from_stock'] ? '<span class="text-success"><i class="bi bi-check-circle"></i> Deducted</span>' : '<span class="text-muted">Manual</span>' ?></td>
                    <td class="small text-muted"><?= esc($m['notes'] ?? '—') ?></td>
                    <td>
                      <?php if (in_array(session()->get('user_role'), ['super_admin', 'facility_manager'])): ?>
                      <a href="<?= base_url('workorders/material/delete/' . $m['id']) ?>" class="btn-action bg-danger bg-opacity-10 text-danger" onclick="return confirm('Remove this material? Stock will be restored if applicable.')"><i class="bi bi-trash"></i></a>
                      <?php endif; ?>
                    </td>
                  </tr>
                  <?php endforeach; ?>
                  <?php if (empty($materials)): ?><tr><td colspan="8" class="text-center py-4 text-muted">No materials logged yet</td></tr><?php endif; ?>
                  <?php if (!empty($materials)): ?>
                  <tr class="fw-bold" style="background:#f8fafc">
                    <td colspan="4" class="text-end small">Total Materials Cost</td>
                    <td class="small"><?= $currency ?> <?= number_format($materialTotal, 2) ?></td>
                    <td colspan="3"></td>
                  </tr>
                  <?php endif; ?>
                </tbody>
              </table>
            </div>
          </div>
        </div>
      </div>
      <!-- Add Material Form -->
      <div class="col-lg-4">
        <div class="fm-card">
          <div class="card-header-fm"><h5><i class="bi bi-plus-circle"></i> Add Material / Part</h5></div>
          <div class="fm-card-body">
            <?= form_open('workorders/material/add/' . $wo['id']) ?>
            <div class="mb-2">
              <label class="form-label">From Inventory (auto-deducts stock)</label>
              <select name="item_id" class="form-select form-select-sm" onchange="fillItemDetails(this)">
                <option value="">— Manual Entry —</option>
                <?php foreach ($inventoryItems as $inv): ?>
                <option value="<?= $inv['id'] ?>" data-name="<?= esc($inv['name']) ?>" data-cost="<?= $inv['unit_cost'] ?>"><?= esc($inv['name'] . ' [' . $inv['quantity'] . ' ' . $inv['unit'] . ']') ?></option>
                <?php endforeach; ?>
              </select>
            </div>
            <div class="mb-2">
              <label class="form-label">Item Name</label>
              <input type="text" name="item_name" id="item_name" class="form-control form-control-sm" placeholder="e.g. HVAC Filter 24x24">
            </div>
            <div class="row g-2 mb-2">
              <div class="col-6"><label class="form-label">Quantity</label><input type="number" name="quantity" class="form-control form-control-sm" step="0.5" value="1" min="0.5"></div>
              <div class="col-6"><label class="form-label">Unit Cost (<?= $currency ?>)</label><input type="number" name="unit_cost" id="unit_cost" class="form-control form-control-sm" step="0.01" value="0"></div>
            </div>
            <div class="mb-3">
              <label class="form-label">Notes</label>
              <textarea name="mat_notes" class="form-control form-control-sm" rows="2"></textarea>
            </div>
            <button type="submit" class="btn btn-fm-primary btn-sm w-100"><i class="bi bi-plus-lg me-1"></i>Add Material</button>
            <?= form_close() ?>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ============================================================ TAB: COSTING -->
  <div class="tab-pane fade" id="tab-costing">
    <div class="row g-3">
      <div class="col-lg-6">
        <div class="fm-card">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-4"><i class="bi bi-calculator me-2"></i>Cost Breakdown</h6>
            <table class="table table-sm">
              <tr><td>Labor (<?= count($labor) ?> entries)</td><td class="text-end fw-semibold"><?= $currency ?> <?= number_format($laborTotal, 2) ?></td></tr>
              <tr><td>Materials / Spare Parts</td><td class="text-end fw-semibold"><?= $currency ?> <?= number_format($materialTotal, 2) ?></td></tr>
              <tr><td>Vendor / Service Cost</td><td class="text-end fw-semibold"><?= $currency ?> <?= number_format($vendorCost, 2) ?></td></tr>
              <tr class="fw-bold border-top"><td>Total Actual Cost</td><td class="text-end"><?= $currency ?> <?= number_format($totalCost, 2) ?></td></tr>
              <?php if ($wo['estimated_cost']): ?>
              <tr><td class="text-muted">Estimated Cost</td><td class="text-end text-muted"><?= $currency ?> <?= number_format($wo['estimated_cost'], 2) ?></td></tr>
              <?php $var = $totalCost - $wo['estimated_cost']; ?>
              <tr><td class="text-<?= $var > 0 ? 'danger' : 'success' ?>">Variance</td><td class="text-end text-<?= $var > 0 ? 'danger' : 'success' ?> fw-semibold"><?= $var > 0 ? '+' : '' ?><?= number_format($var, 2) ?></td></tr>
              <?php endif; ?>
            </table>
            <!-- Update vendor cost -->
            <?php if (in_array(session()->get('user_role'), ['super_admin', 'facility_manager'])): ?>
            <div class="border-top pt-3 mt-2">
              <?= form_open('workorders/update/' . $wo['id']) ?>
              <input type="hidden" name="title" value="<?= esc($wo['title']) ?>">
              <input type="hidden" name="facility_id" value="<?= $wo['facility_id'] ?>">
              <input type="hidden" name="type" value="<?= $wo['type'] ?>">
              <input type="hidden" name="priority" value="<?= $wo['priority'] ?>">
              <input type="hidden" name="status" value="<?= $wo['status'] ?>">
              <label class="form-label small">Update Estimated Cost (<?= $currency ?>)</label>
              <div class="input-group input-group-sm">
                <input type="number" name="estimated_cost" class="form-control" step="0.01" value="<?= $wo['estimated_cost'] ?>">
                <button type="submit" class="btn btn-fm-primary btn-sm">Save</button>
              </div>
              <?= form_close() ?>
            </div>
            <?php endif; ?>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ============================================================ TAB: ASSET INFO -->
  <?php if ($wo['asset_id']): ?>
  <div class="tab-pane fade" id="tab-asset">
    <div class="row g-3">
      <div class="col-lg-6">
        <div class="fm-card mb-3">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-3"><i class="bi bi-cpu me-2"></i>Asset Details</h6>
            <div class="small">
              <div class="d-flex justify-content-between py-1 border-bottom"><span class="text-muted">Name</span><span class="fw-semibold"><?= esc($wo['asset_name']) ?></span></div>
              <div class="d-flex justify-content-between py-1 border-bottom"><span class="text-muted">Code</span><span><?= esc($wo['asset_code'] ?? '—') ?></span></div>
              <div class="d-flex justify-content-between py-1 border-bottom"><span class="text-muted">Brand / Model</span><span><?= esc(($wo['asset_brand'] ?? '') . ' ' . ($wo['asset_model'] ?? '')) ?></span></div>
              <div class="d-flex justify-content-between py-1 border-bottom"><span class="text-muted">Warranty Expiry</span><span class="<?= ($wo['warranty_expiry'] && strtotime($wo['warranty_expiry']) < time()) ? 'text-danger' : '' ?>"><?= $wo['warranty_expiry'] ? date('d M Y', strtotime($wo['warranty_expiry'])) : '—' ?></span></div>
              <div class="d-flex justify-content-between py-1"><span class="text-muted">Next Maintenance</span><span><?= $wo['next_maintenance'] ? date('d M Y', strtotime($wo['next_maintenance'])) : '—' ?></span></div>
            </div>
            <div class="mt-3">
              <a href="<?= base_url('asset-register/view/' . $wo['asset_id']) ?>" class="btn btn-fm-outline btn-sm"><i class="bi bi-eye me-1"></i>View Full Asset Record</a>
            </div>
          </div>
        </div>

        <!-- Meter Readings -->
        <div class="fm-card">
          <div class="card-header-fm"><h5><i class="bi bi-speedometer2"></i> Meter Readings</h5></div>
          <div class="fm-card-body p-0">
            <table class="fm-table">
              <thead><tr><th>Date</th><th>Type</th><th>Value</th><th>Recorded By</th></tr></thead>
              <tbody>
                <?php foreach ($meterReadings as $r): ?>
                <tr><td class="small"><?= date('d M Y', strtotime($r['reading_date'])) ?></td><td class="small"><?= ucfirst($r['reading_type']) ?></td><td class="small fw-semibold"><?= number_format($r['reading_value'], 2) ?></td><td class="small text-muted"><?= esc($r['recorded_by_name'] ?? '') ?></td></tr>
                <?php endforeach; ?>
                <?php if (empty($meterReadings)): ?><tr><td colspan="4" class="text-center py-3 text-muted small">No readings recorded</td></tr><?php endif; ?>
              </tbody>
            </table>
          </div>
          <div class="fm-card-body border-top">
            <?= form_open('workorders/meter/' . $wo['id']) ?>
            <div class="row g-2 align-items-end">
              <div class="col-md-3"><label class="form-label small">Type</label><select name="reading_type" class="form-select form-select-sm"><option value="hours">Hours</option><option value="km">KM</option><option value="cycles">Cycles</option><option value="other">Other</option></select></div>
              <div class="col-md-3"><label class="form-label small">Value</label><input type="number" name="reading_value" class="form-control form-control-sm" step="0.01" placeholder="0.00"></div>
              <div class="col-md-3"><label class="form-label small">Date</label><input type="date" name="reading_date" class="form-control form-control-sm" value="<?= date('Y-m-d') ?>"></div>
              <div class="col-md-3"><button type="submit" class="btn btn-fm-primary btn-sm w-100">Record</button></div>
            </div>
            <?= form_close() ?>
          </div>
        </div>
      </div>
    </div>
  </div>
  <?php endif; ?>

  <!-- ============================================================ TAB: DOCUMENTS -->
  <div class="tab-pane fade" id="tab-docs">
    <div class="row g-3">
      <div class="col-lg-8">
        <div class="fm-card mb-3">
          <div class="card-header-fm"><h5><i class="bi bi-paperclip"></i> Attachments</h5></div>
          <div class="fm-card-body">
            <?php if (empty($attachments)): ?>
            <p class="text-muted text-center py-4">No attachments uploaded yet.</p>
            <?php else: ?>
            <div class="row g-2">
              <?php foreach ($attachments as $att): ?>
              <?php $ext = strtolower(pathinfo($att['file_name'], PATHINFO_EXTENSION)); $isImg = in_array($ext, ['jpg','jpeg','png','gif','webp']); ?>
              <div class="col-md-4">
                <div class="border rounded p-2 text-center small">
                  <?php if ($isImg): ?>
                  <a href="<?= base_url($att['file_path']) ?>" target="_blank"><img src="<?= base_url($att['file_path']) ?>" class="img-fluid rounded mb-1" style="max-height:100px;object-fit:cover"></a>
                  <?php else: ?>
                  <a href="<?= base_url($att['file_path']) ?>" target="_blank" class="text-decoration-none"><i class="bi bi-file-earmark-text fs-2 text-muted d-block mb-1"></i></a>
                  <?php endif; ?>
                  <div class="text-truncate text-muted" title="<?= esc($att['file_name']) ?>"><?= esc($att['file_name']) ?></div>
                  <a href="<?= base_url($att['file_path']) ?>" target="_blank" class="btn btn-sm btn-fm-outline mt-1 py-0">Download</a>
                </div>
              </div>
              <?php endforeach; ?>
            </div>
            <?php endif; ?>
          </div>
        </div>
      </div>
      <div class="col-lg-4">
        <div class="fm-card">
          <div class="card-header-fm"><h5><i class="bi bi-upload"></i> Upload File</h5></div>
          <div class="fm-card-body">
            <form id="uploadForm" enctype="multipart/form-data">
              <input type="file" name="attachment" id="attachFile" class="form-control form-control-sm mb-2" accept="image/*,.pdf,.doc,.docx,.xls,.xlsx">
              <button type="button" class="btn btn-fm-primary btn-sm w-100" onclick="uploadFile()"><i class="bi bi-upload me-1"></i>Upload</button>
            </form>
            <div id="uploadMsg" class="mt-2"></div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ============================================================ TAB: ACTIVITY -->
  <div class="tab-pane fade" id="tab-activity">
    <div class="row g-3">
      <div class="col-lg-8">
        <div class="fm-card mb-3">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-3"><i class="bi bi-chat-left-text me-2"></i>Activity Log</h6>
            <?php foreach ($comments as $c): ?>
            <div class="d-flex gap-3 mb-3 pb-3 border-bottom">
              <div class="user-avatar flex-shrink-0"><?= strtoupper(substr($c['user_name'] ?? 'U', 0, 1)) ?></div>
              <div class="flex-grow-1">
                <div class="d-flex justify-content-between mb-1">
                  <span class="fw-semibold small"><?= esc($c['user_name'] ?? 'System') ?></span>
                  <span class="text-muted x-small"><?= date('d M Y H:i', strtotime($c['created_at'])) ?></span>
                </div>
                <div class="small text-muted"><?= nl2br(esc($c['comment'])) ?></div>
                <?php if ($c['image_path']): ?><img src="<?= base_url($c['image_path']) ?>" class="img-thumbnail mt-2" style="max-height:120px"><?php endif; ?>
              </div>
            </div>
            <?php endforeach; ?>
            <?php if (empty($comments)): ?><p class="text-muted text-center py-4">No activity yet.</p><?php endif; ?>
          </div>
        </div>
      </div>
      <div class="col-lg-4">
        <!-- Add Comment -->
        <div class="fm-card mb-3">
          <div class="card-header-fm"><h5><i class="bi bi-chat-left-dots"></i> Add Note</h5></div>
          <div class="fm-card-body">
            <textarea id="commentText" class="form-control form-control-sm mb-2" rows="4" placeholder="Add a note, update, or finding..."></textarea>
            <input type="file" id="commentImage" class="form-control form-control-sm mb-2" accept="image/*">
            <button class="btn btn-fm-primary btn-sm w-100" onclick="postComment()"><i class="bi bi-send me-1"></i>Post</button>
          </div>
        </div>
        <!-- Quick Status Update -->
        <div class="fm-card">
          <div class="card-header-fm"><h5><i class="bi bi-arrow-repeat"></i> Update Status</h5></div>
          <div class="fm-card-body">
            <select id="newStatus" class="form-select form-select-sm mb-2">
              <?php foreach (['new', 'assigned', 'in_progress', 'on_hold', 'completed', 'closed', 'cancelled'] as $s): ?>
              <option value="<?= $s ?>" <?= $wo['status'] == $s ? 'selected' : '' ?>><?= ucfirst(str_replace('_', ' ', $s)) ?></option>
              <?php endforeach; ?>
            </select>
            <textarea id="statusNotes" class="form-control form-control-sm mb-2" rows="2" placeholder="Resolution notes (optional)"></textarea>
            <input type="number" id="actualCost" class="form-control form-control-sm mb-2" placeholder="Actual cost (optional)" step="0.01">
            <input type="file" id="statusPhoto" class="form-control form-control-sm mb-2" accept="image/*">
            <button class="btn btn-fm-primary btn-sm w-100" onclick="updateStatus()"><i class="bi bi-check2 me-1"></i>Update</button>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- ============================================================ TAB: CLOSURE WORKFLOW -->
  <div class="tab-pane fade" id="tab-closure">
    <?php if (!empty($workflow['enabled'])): ?>
    <div class="fm-card mb-3">
      <div class="card-header-fm"><h5><i class="bi bi-diagram-3 me-2"></i>Closure Pipeline</h5></div>
      <div class="fm-card-body">
        <div class="row g-3 text-center mb-3">
          <?php
          $steps = [
            ['Completed', $wo['status'] === 'completed' || $wo['status'] === 'closed', 'bi-check-circle'],
            ['QA', ($wo['qa_status'] ?? 'none') === 'approved', 'bi-shield-check'],
            ['Client', ($wo['client_approval_status'] ?? 'none') === 'approved', 'bi-person-check'],
            ['Invoice', !empty($workflow['invoice']), 'bi-receipt'],
          ];
          foreach ($steps as [$label, $done, $icon]):
          ?>
          <div class="col-3">
            <div class="p-2 rounded border <?= $done ? 'border-success bg-success bg-opacity-10' : 'border-light' ?>">
              <i class="bi <?= $icon ?> fs-4 <?= $done ? 'text-success' : 'text-muted' ?>"></i>
              <div class="small fw-semibold mt-1"><?= $label ?></div>
            </div>
          </div>
          <?php endforeach; ?>
        </div>
        <div class="row g-2 small">
          <div class="col-md-6"><span class="text-muted">QA Status:</span> <strong><?= ucfirst($wo['qa_status'] ?? 'none') ?></strong></div>
          <div class="col-md-6"><span class="text-muted">Client Status:</span> <strong><?= ucfirst($wo['client_approval_status'] ?? 'none') ?></strong></div>
        </div>
        <?php if (!empty($workflow['invoice'])): ?>
        <div class="alert alert-success mt-3 mb-0">
          Invoice <a href="<?= base_url('finance/invoices/view/'.$workflow['invoice']['id']) ?>" class="fw-bold"><?= esc($workflow['invoice']['invoice_number']) ?></a>
          — <?= $currency ?> <?= number_format((float)$workflow['invoice']['total'],2) ?> (<?= ucfirst($workflow['invoice']['status']) ?>)
        </div>
        <?php endif; ?>
      </div>
    </div>

    <?php if (in_array(session()->get('user_role'), ['super_admin','facility_manager','qa_inspector'], true)): ?>
      <?php if (($wo['qa_status'] ?? '') === 'pending'): ?>
      <div class="fm-card mb-3">
        <div class="card-header-fm"><h5>QA Approval</h5></div>
        <div class="fm-card-body">
          <?= form_open(base_url('workorders/qa-approve/'.$wo['id'])) ?>
          <?= csrf_field() ?>
          <textarea name="notes" class="form-control form-control-sm mb-2" rows="2" placeholder="QA notes (optional)"></textarea>
          <div class="d-flex gap-2">
            <button type="submit" class="btn btn-success btn-sm">Approve QA</button>
            <?= form_close() ?>
            <?= form_open(base_url('workorders/qa-reject/'.$wo['id'])) ?>
            <?= csrf_field() ?>
            <button type="submit" class="btn btn-outline-danger btn-sm" onclick="return confirm('Reject QA and return to in progress?')">Reject QA</button>
            <?= form_close() ?>
          </div>
        </div>
      </div>
      <?php endif; ?>
    <?php endif; ?>

    <?php if (in_array(session()->get('user_role'), ['super_admin','facility_manager','client'], true)): ?>
      <?php if (($wo['client_approval_status'] ?? '') === 'pending' && ($wo['qa_status'] ?? '') === 'approved'): ?>
      <div class="fm-card mb-3">
        <div class="card-header-fm"><h5>Client Approval &amp; Invoice</h5></div>
        <div class="fm-card-body">
          <p class="small text-muted">Approving will auto-generate a draft invoice from labor and materials on this work order.</p>
          <?= form_open(base_url('workorders/client-approve/'.$wo['id'])) ?>
          <?= csrf_field() ?>
          <textarea name="notes" class="form-control form-control-sm mb-2" rows="2" placeholder="Client sign-off notes"></textarea>
          <div class="d-flex gap-2">
            <button type="submit" class="btn btn-fm-primary btn-sm" onclick="return confirm('Approve and create invoice?')">Client Approve &amp; Invoice</button>
            <?= form_close() ?>
            <?= form_open(base_url('workorders/client-reject/'.$wo['id'])) ?>
            <?= csrf_field() ?>
            <button type="submit" class="btn btn-outline-danger btn-sm">Reject</button>
            <?= form_close() ?>
          </div>
        </div>
      </div>
      <?php endif; ?>
    <?php endif; ?>

    <?php else: ?>
    <div class="alert alert-warning">
      Extended closure workflow requires a database update. Run: <code>php spark migrate</code> or import <code>app/Database/SQL/patch_2026_workflow_company.sql</code>.
    </div>
    <?php endif; ?>
  </div>

  <!-- ============================================================ TAB: APPROVAL -->
  <div class="tab-pane fade" id="tab-approval">
    <div class="row g-3">
      <div class="col-lg-7">
        <div class="fm-card mb-3">
          <div class="fm-card-body">
            <h6 class="fw-bold mb-3"><i class="bi bi-shield-check me-2"></i>Approval Status</h6>
            <?php $apSt = $wo['approval_status'] ?? 'approved'; ?>
            <div class="alert <?= $apSt === 'approved' ? 'alert-success' : ($apSt === 'rejected' ? 'alert-danger' : 'alert-warning') ?> mb-3">
              <strong><?= ucfirst($apSt) ?></strong>
              <?php if ($wo['approved_by_name']): ?> — by <?= esc($wo['approved_by_name']) ?> <?php endif; ?>
              <?php if ($wo['approved_at']): ?>on <?= date('d M Y H:i', strtotime($wo['approved_at'])) ?><?php endif; ?>
            </div>

            <!-- Approval log -->
            <?php if (!empty($approvals)): ?>
            <h6 class="small fw-bold text-muted mb-2 text-uppercase">Approval History</h6>
            <div class="table-responsive">
              <table class="fm-table">
                <thead><tr><th>Type</th><th>Action</th><th>By</th><th>Date</th><th>Notes</th></tr></thead>
                <tbody>
                  <?php foreach ($approvals as $ap): ?>
                  <tr>
                    <td class="small"><?= ucfirst($ap['approval_type']) ?></td>
                    <td><span class="fm-badge badge-status-<?= $ap['action'] === 'approved' ? 'completed' : 'cancelled' ?>"><?= ucfirst($ap['action']) ?></span></td>
                    <td class="small"><?= esc($ap['actioned_by_name']) ?></td>
                    <td class="small"><?= date('d M Y H:i', strtotime($ap['created_at'])) ?></td>
                    <td class="small text-muted"><?= esc($ap['notes'] ?? '—') ?></td>
                  </tr>
                  <?php endforeach; ?>
                </tbody>
              </table>
            </div>
            <?php endif; ?>
          </div>
        </div>
      </div>

      <?php if (in_array(session()->get('user_role'), ['super_admin', 'facility_manager']) && ($wo['approval_status'] ?? 'approved') === 'pending'): ?>
      <div class="col-lg-5">
        <div class="fm-card">
          <div class="card-header-fm"><h5><i class="bi bi-check2-circle"></i> Take Action</h5></div>
          <div class="fm-card-body">
            <div class="mb-2">
              <label class="form-label">Approval Type</label>
              <select name="approval_type" id="approvalType" class="form-select form-select-sm">
                <option value="supervisor">Supervisor Review</option>
                <option value="budget">Budget Approval</option>
                <option value="completion">Completion Verification</option>
              </select>
            </div>
            <div class="mb-3">
              <label class="form-label">Notes</label>
              <textarea id="approvalNotes" class="form-control form-control-sm" rows="3" placeholder="Optional remarks..."></textarea>
            </div>
            <div class="d-flex gap-2">
              <?= form_open('workorders/approve/' . $wo['id']) ?>
              <input type="hidden" name="approval_type" value="supervisor">
              <input type="hidden" name="approval_notes" id="approveNotesHidden">
              <button type="submit" class="btn btn-success btn-sm flex-grow-1" onclick="document.getElementById('approveNotesHidden').value=document.getElementById('approvalNotes').value"><i class="bi bi-check-lg me-1"></i>Approve</button>
              <?= form_close() ?>
              <?= form_open('workorders/reject/' . $wo['id']) ?>
              <input type="hidden" name="approval_type" value="supervisor">
              <input type="hidden" name="approval_notes" id="rejectNotesHidden">
              <button type="submit" class="btn btn-danger btn-sm flex-grow-1" onclick="document.getElementById('rejectNotesHidden').value=document.getElementById('approvalNotes').value"><i class="bi bi-x-lg me-1"></i>Reject</button>
              <?= form_close() ?>
            </div>
          </div>
        </div>
      </div>
      <?php endif; ?>
    </div>
  </div>

</div><!-- end tab-content -->

<script>
const WO_ID = <?= $wo['id'] ?>;
const CSRF_NAME  = document.querySelector('meta[name="csrf-token-name"]').content;
const CSRF_VALUE = document.querySelector('meta[name="csrf-token-value"]').content;

// Open correct tab from hash
document.addEventListener('DOMContentLoaded', () => {
  const hash = location.hash;
  if (hash) {
    const trigger = document.querySelector(`[href="${hash}"]`);
    if (trigger) new bootstrap.Tab(trigger).show();
  }
  document.querySelectorAll('#woTabs .nav-link').forEach(t => {
    t.addEventListener('shown.bs.tab', e => { history.replaceState(null, '', e.target.getAttribute('href')); });
  });
});

function quickStatus(status) {
  if (!confirm('Set status to "' + status.replace('_', ' ') + '"?')) return;
  const fd = new FormData();
  fd.append(CSRF_NAME, CSRF_VALUE);
  fd.append('id', WO_ID);
  fd.append('status', status);
  fetch('<?= base_url('workorders/status') ?>', { method: 'POST', body: fd })
    .then(r => r.json()).then(() => location.reload());
}

function updateStatus() {
  const fd = new FormData();
  fd.append(CSRF_NAME, CSRF_VALUE);
  fd.append('id', WO_ID);
  fd.append('status', document.getElementById('newStatus').value);
  fd.append('completion_notes', document.getElementById('statusNotes').value);
  fd.append('actual_cost', document.getElementById('actualCost').value);
  const photo = document.getElementById('statusPhoto').files[0];
  if (photo) fd.append('status_photo', photo);
  fetch('<?= base_url('workorders/status') ?>', { method: 'POST', body: fd })
    .then(r => r.json()).then(d => { if (d.status) location.reload(); });
}

function postComment() {
  const text = document.getElementById('commentText').value.trim();
  if (!text) return;
  const fd = new FormData();
  fd.append(CSRF_NAME, CSRF_VALUE);
  fd.append('comment', text);
  const img = document.getElementById('commentImage').files[0];
  if (img) fd.append('comment_image', img);
  fetch('<?= base_url('workorders/comment/' . $wo['id']) ?>', { method: 'POST', body: fd })
    .then(r => r.json()).then(d => { if (d.status) location.reload(); });
}

function uploadFile() {
  const file = document.getElementById('attachFile').files[0];
  if (!file) return;
  const fd = new FormData();
  fd.append(CSRF_NAME, CSRF_VALUE);
  fd.append('attachment', file);
  fetch('<?= base_url('workorders/upload/' . $wo['id']) ?>', { method: 'POST', body: fd })
    .then(r => r.json()).then(d => {
      document.getElementById('uploadMsg').innerHTML = d.status
        ? '<div class="alert alert-success small py-1">Uploaded: ' + d.original + '</div>'
        : '<div class="alert alert-danger small py-1">Upload failed</div>';
      if (d.status) setTimeout(() => location.reload(), 1000);
    });
}

function fillItemDetails(sel) {
  const opt = sel.options[sel.selectedIndex];
  if (opt.value) {
    document.getElementById('item_name').value = opt.dataset.name || '';
    document.getElementById('unit_cost').value  = opt.dataset.cost || '0';
  }
}
</script>

<?= $this->endSection() ?>
