{% extends "pos/base.html" %}
{% load static %}

{% block title %}Arrival Sheet #{{ challan.challan_no }}{% endblock %}

{% block content %}
<style>
  .sheet-wrap { padding: 18px; color: #111827; }
  .sheet-title { font-size: 22px; font-weight: 900; text-align: center; margin-bottom: 4px; }
  .sheet-subtitle { text-align: center; color: #6b7280; margin-bottom: 16px; }
  .sheet-info { width: 100%; margin-bottom: 14px; border-collapse: collapse; }
  .sheet-info td { border: 1px solid #d1d5db; padding: 7px; font-size: 13px; }
  .sheet-table { width: 100%; border-collapse: collapse; }
  .sheet-table th { background: #f3f4f6; border: 1px solid #d1d5db; padding: 6px; font-size: 12px; }
  .sheet-table td { border: 1px solid #d1d5db; padding: 6px; font-size: 12px; vertical-align: top; }
  .text-right { text-align: right; }
  .sign-row { margin-top: 40px; display: flex; gap: 30px; }
  .sign-box { flex: 1; border-top: 1px solid #111827; padding-top: 6px; text-align: center; font-size: 13px; }
  .no-print { margin-bottom: 12px; text-align: right; }
  @media print {
    .navbar, .sidebar, .no-print, .btn, button { display: none !important; }
    .sheet-wrap { padding: 0; }
  }
</style>

<div class="sheet-wrap">

  <div class="no-print">
    <button class="btn btn-primary btn-sm" onclick="window.print();">Print / Save PDF</button>
    <a href="{% url 'good_transport:challans:arrival_confirm' challan.t_id %}" class="btn btn-light btn-sm">Back</a>
  </div>

  <div class="sheet-title">Goods Transport Arrival Sheet</div>
  <div class="sheet-subtitle">Station Receiving Confirmation</div>

  <table class="sheet-info">
    <tr>
      <td><strong>Challan No:</strong> #{{ challan.challan_no }}</td>
      <td><strong>Date:</strong> {{ challan.challan_date|date:"d-m-Y" }}</td>
      <td><strong>Status:</strong> {{ challan.get_status_display }}</td>
    </tr>
    <tr>
      <td><strong>Route:</strong> {{ challan.from_city }} → {{ challan.to_city }}</td>
      <td><strong>Vehicle:</strong> {{ challan.vehicle_no|default:"-" }}</td>
      <td><strong>Driver:</strong> {{ challan.driver_name|default:"-" }} {{ challan.driver_mobile|default:"" }}</td>
    </tr>
    <tr>
      <td><strong>Invoices:</strong> {{ summary.invoice_count }}</td>
      <td><strong>Item Lines:</strong> {{ summary.line_count }}</td>
      <td><strong>Printed:</strong> {% now "d-m-Y h:i A" %}</td>
    </tr>
  </table>

  <table class="sheet-table">
    <thead>
      <tr>
        <th>#</th>
        <th>Invoice</th>
        <th>Builty</th>
        <th>Customer / Receiver</th>
        <th>Route</th>
        <th>Item</th>
        <th class="text-right">Booked</th>
        <th class="text-right">Arrived</th>
        <th class="text-right">Damage</th>
        <th class="text-right">Short</th>
        <th>Status</th>
        <th>Remarks</th>
      </tr>
    </thead>

    <tbody>
      {% for row in rows %}
        <tr>
          <td>{{ forloop.counter }}</td>
          <td>#{{ row.invoice_no }}</td>
          <td>{{ row.builty_no|default:"-" }}</td>
          <td>
            {{ row.customer_name|default:"-" }}<br>
            <small>{{ row.receiver_name|default:"-" }}</small>
          </td>
          <td>
            Segment: {{ row.segment_route }}<br>
            Final: {{ row.final_route }}
          </td>
          <td>{{ row.product_name|default:"Goods" }}</td>
          <td class="text-right">{{ row.booked_qty|floatformat:2 }}</td>
          <td class="text-right">{{ row.arrived_qty|floatformat:2 }}</td>
          <td class="text-right">{{ row.damaged_qty|floatformat:2 }}</td>
          <td class="text-right">{{ row.short_qty|floatformat:2 }}</td>
          <td>{{ row.status }}</td>
          <td>{{ row.remarks|default:"-" }}</td>
        </tr>
      {% empty %}
        <tr>
          <td colspan="12" style="text-align:center;">No rows found.</td>
        </tr>
      {% endfor %}
    </tbody>

    <tfoot>
      <tr>
        <th colspan="6" class="text-right">Totals</th>
        <th class="text-right">{{ summary.total_booked|floatformat:2 }}</th>
        <th class="text-right">{{ summary.total_arrived|floatformat:2 }}</th>
        <th class="text-right">{{ summary.total_damage|floatformat:2 }}</th>
        <th class="text-right">{{ summary.total_short|floatformat:2 }}</th>
        <th colspan="2"></th>
      </tr>
    </tfoot>
  </table>

  <div class="sign-row">
    <div class="sign-box">Driver Signature</div>
    <div class="sign-box">Station Incharge Signature</div>
    <div class="sign-box">Checked By</div>
  </div>

</div>
{% endblock %}