<!-- <!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <link rel="icon" href="/favicon.png" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>ServiceNxt</title>

  
  <link rel="stylesheet" href="/assets/css/plugins/jsvectormap.min.css" />
  <link href="https://fonts.googleapis.com/css2?family=Public+Sans:wght@400;500;600;700&display=swap"
    rel="stylesheet" />
  
<link href="https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@latest/tabler-icons.min.css" rel="stylesheet" />

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css"
/>

</head>

<body data-pc-preset="preset-1" data-pc-sidebar-theme="light" data-pc-sidebar-caption="true" data-pc-direction="ltr"
  data-pc-theme="light">
  <div id="dropdown-root"></div>

  <div id="root"></div>
  <script type="module" src="/src/main.jsx"></script>
  
  <script src="/assets/js/script.js"></script>
  <script src="/assets/js/plugins/popper.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
  <script src="/assets/js/plugins/i18next.min.js"></script>
  <script src="/assets/js/theme.js"></script>
  <script src="/assets/js/plugins/feather.min.js"></script>

  <script>
    layout_change("light");
  </script>

  <script>
    layout_sidebar_change("light");
  </script>

  <script>
    change_box_container("false");
  </script>

  <script>
    layout_caption_change("true");
  </script>

  <script>
    layout_rtl_change("false");
  </script>

  <script>
    preset_change("preset-1");
  </script>
</body>

</html> -->
<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Quality Inspection Report</title>

    <style>
      /* =========================================
   GLOBAL
========================================= */

      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        font-family: "Times New Roman", serif;
      }

      body {
        background: #f3f3f3;
        padding: 12px;
      }

      /* =========================================
   MAIN CONTAINER
========================================= */

      .report-container {
        width: 1000px;
        margin: auto;
        background: #fff;
        /* border: 1.5px solid #000; */
        padding: 0;
      }

      /* =========================================
   TABLE
========================================= */

      table {
        width: 100%;
        border-collapse: collapse;
      }

      td,
      th {
        border: 1px solid #000;
        padding: 3px 5px;
        font-size: 13px;
        line-height: 1.2;
        vertical-align: middle;
        color: #000;
      }

      /* =========================================
   HEADER
========================================= */

      .main-title {
        font-size: 24px;
        font-weight: 700;
        text-align: center;
        padding: 8px 0 3px;
        letter-spacing: 0.5px;
      }

      .sub-title {
        font-size: 12.5px;
        font-weight: 700;
        text-align: center;
        padding: 3px 0;
      }

      .report-title {
        font-size: 16px;
        font-weight: 700;
        text-align: center;
        padding: 5px 0;
      }

      /* =========================================
   TEXT HELPERS
========================================= */

      .label {
        font-size: 14px;
        font-weight: 700;
        white-space: nowrap;
      }

      .value {
        font-weight: 600;
      }

      .bold {
        font-weight: 700;
      }

      .center {
        font-size: 14px;
        text-align: center;
      }

      .right {
        font-size: 14px;
        text-align: right;
      }

      /* =========================================
   TABLE HEADERS
========================================= */

      .header-gray {
        background: #f7f7f7;
        font-weight: 700;
        text-align: center;
      }

      .header-gray td {
        font-size: 16px;
      }

      .remarks {
        font-weight: 700;
      }

      /* =========================================
   COLUMN WIDTHS
========================================= */

      .w-18 {
        width: 18%;
      }

      .w-12 {
        width: 12%;
      }

      .w-10 {
        width: 10%;
      }

      .w-8 {
        width: 8%;
      }

      /* =========================================
   SIGNATURE SECTION
========================================= */
      .text {
        font-size: 14px;
      }
      
      .signature-section {
        border: 1px solid #000;
        height: 90px;
        position: relative;
      }

      .checked-by {
        position: absolute;
        left: 40px;
        bottom: 8px;
        text-align: center;
        font-size: 14px;
        font-weight: 700;
      }

      .driver-sign {
        position: absolute;
        right: 80px;
        bottom: 8px;
        text-align: center;
        font-size: 14px;
        font-weight: 700;
      }

      .sign {
        font-size: 28px;
        color: #1d2ea5;
        font-family: cursive;
        margin-bottom: 3px;
        line-height: 1;
      }

      /* =========================================
   SMALL TEXT
========================================= */

      .small {
        font-size: 12px;
      }

      /* =========================================
   PRINT
========================================= */

      @media print {
        body {
          background: #fff;
          padding: 0;
        }

        .report-container {
          width: 100%;
          border: 1.5px solid #000;
        }

        td,
        th {
          font-size: 12px;
          padding: 2px 4px;
        }
      }
    </style>
  </head>

  <body>
    <div class="report-container">
        <!-- <img src="{{logo_url}}" class="logo" /> -->
      <!-- HEADER -->
      <table>
        <tr>
           <!-- <td colspan="2" style="width:120px; text-align:center;">
    <img src="{{logo_url}}" style="width:90px;height:90px;" />
  </td> -->
          <td colspan="8" class="main-title">
            VIVEK BIO PRODUCTS PRIVATE LIMITED
          </td>
        </tr>

        <tr>
          <td colspan="8" class="sub-title">
            LINGAMPALLY VILLGE,SADHASHIVANAGAR MANDAL,KAMAREDDY DIST
          </td>
        </tr>

        <tr>
          <td colspan="8" class="report-title">Quality Inspection Report</td>
        </tr>

        <!-- TOP DETAILS -->
        <tr>
          <td class="label">SL No.</td>
          <!-- <td class="value">807</td> -->
           <td class="value">{{sl_no}}</td>

          <td class="label">PO Date</td>
          <!-- <td class="value">28/03/2026</td> -->
           <td class="value">{{po_date}}</td>

          <td class="label">PO Rate :</td>
          <!-- <td class="value center">N/A</td> -->
           <td class="value">{{po_date}}</td>

          <td class="label">PO No :</td>
          <!-- <td class="value">25CORPPORD100279</td> -->
           <td class="value">{{po_number}}</td>
        </tr>

        <tr>
          <td class="label">Date:</td>
          <td></td>

          <td class="label">4/4/2026</td>
          <td></td>

          <td colspan="2"></td>

          <td class="label">INV No:</td>
          <!-- <td class="value">44</td> -->
           <td class="value">{{invoice_no}}</td>
        </tr>

        <tr>
          <td class="label">Vendor Name:</td>
          <!-- <td colspan="7" class="value">MANAN IMPEX</td> -->
           <td colspan="7" class="value">{{vendor_name}}</td>
        </tr>

        <tr>
          <td class="label">Vehicle Number:</td>
          <!-- <td colspan="7" class="value">AP24TB9488</td> -->
           <td colspan="7" class="value">{{vehicle_number}}</td>
        </tr>

        <tr>
          <td class="label">Nature Of Sample Grain</td>
          <!-- <td colspan="7" class="value">MAIZE</td> -->
           <td colspan="7" class="value">{{material_name}}</td>
        </tr>

        <tr>
          <td class="label">Quantity In Bags:-</td>
          <!-- <td colspan="3" class="value">780</td> -->
           <td colspan="3" class="value">{{quantity_bags}}</td>

          <td colspan="2" class="label right">Received MT:-</td>
          <!-- <td colspan="2" class="value">38.330</td> -->
           <td colspan="2" class="value">{{received_weight}}</td>
        </tr>

        <!-- PARTICULARS -->
        <tr class="header-gray">
          <td class="text">Particulars</td>
          <td colspan="2">Standard Specifications</td>
          <td colspan="2">Accepted With Penality</td>
          <td colspan="2">Actual Result</td>
          <td>Reject /Remarks</td>
        </tr>

        {{parameter_rows}}

        <tr>
          <td class="bold">Result:</td>
          <td colspan="7" class="text">
             {{qc_result}}
          </td>
        </tr>

        <tr>
          <td class="bold">Partial Rejection QTY if any:</td>
          <td colspan="7">0</td>
        </tr>

        <!-- DEDUCTION TABLE -->
        <tr class="header-gray">
          <td class="text">Partuculars</td>
          <td>Bag's</td>
          <td>%</td>
          <td >In MT's</td>
          <td colspan="2">Deduction Weight</td>
        </tr>

         {{deduction_rows}}

        <!-- <tr>
          <td colspan="3" class="bold right">Total Deduction</td>
          <td colspan="2" class="center bold">{{total_deduction_weight}}</td>
        </tr> -->
        <!-- <tr>
  <th colspan="4" style="text-align:right">
    Total Deduction
  </th>
  <th>{{total_deduction_weight}}</th>

</tr> -->

        <!-- <tr>
          <td class="bold">Note:</td>
          <td colspan="7"></td>
        </tr> -->
<tr>
  <td colspan="3" style="text-align:right;font-weight:bold;">
    Total Deduction
  </td>

  <td style="font-weight:bold;text-align:center;">
    {{total_deduction_weight}}
  </td>

  <td colspan="2"></td>
</tr>

<tr>
  <td class="bold">Note:</td>
  <td colspan="5"></td>
</tr>
      </table>

      <!-- SIGNATURES -->
      <div class="signature-section">
        <div class="checked-by">
          <!-- <div class="sign">Dg</div> -->
          Checked By
        </div>

        <div class="driver-sign">
          <!-- <div class="sign">ANWAR</div> -->
          Driver signature
        </div>
      </div>
    </div>
  </body>
</html>
