var w=Object.defineProperty;var b=Object.getOwnPropertySymbols;var x=Object.prototype.hasOwnProperty,y=Object.prototype.propertyIsEnumerable;var u=(t,i,e)=>i in t?w(t,i,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[i]=e,v=(t,i)=>{for(var e in i||(i={}))x.call(i,e)&&u(t,e,i[e]);if(b)for(var e of b(i))y.call(i,e)&&u(t,e,i[e]);return t};import{J as $}from"./JsBarcode-DY0UjFhn.js";import{c0 as h}from"./bootstrap-Bqxdt4iG.js";const m=100,p=150,g=(t,i={})=>{const e=document.createElementNS("http://www.w3.org/2000/svg","svg");$(e,t,v({format:"CODE128",width:2,height:50,displayValue:!0,fontSize:14,margin:5},i));const n=new XMLSerializer().serializeToString(e);return`data:image/svg+xml;base64,${btoa(n)}`},k=(t,i)=>{var a;const e=g(t.tdSku),n=new Date().toLocaleDateString("en-GB",{day:"2-digit",month:"2-digit",year:"numeric"});return`
    <div class="label-v3" ${i>0?'style="page-break-before: always;"':""}>
      <!-- Header -->
      <div class="header">
        <div class="logo">
          <span class="td-logo">TD</span>
          <span class="warehouse-text">WAREHOUSE</span>
        </div>
        <div class="warehouse-code">${t.warehouseCode}</div>
      </div>

      <!-- Barcode -->
      <div class="barcode-section">
        <img src="${e}" alt="Barcode" class="barcode-img" />
      </div>

      <!-- Product Name -->
      <div class="product-name">${t.productName}</div>

      <!-- Customer -->
      <div class="customer-section">
        <span class="label-text">Customer:</span>
        <span class="customer-name">${t.clientName}</span>
      </div>

      <!-- Description -->
      <div class="description-section">
        <span class="label-text">Description:</span>
        <span class="description-value">${t.description||"-"}</span>
      </div>

      <!-- Date (current date) -->
      <div class="date-section">
        <span class="label-text">Date:</span>
        <span class="date-value">${n}</span>
      </div>

      <!-- Bottom Table (Qty, UOM, Weight, Volume) -->
      <div class="unit-details-v3">
        <div class="unit-details-grid-v3">
          <div class="unit-detail-item">
            <span class="detail-label">Qty</span>
            <span class="detail-value">${(a=t.quantity)!=null?a:"-"}</span>
          </div>
          <div class="unit-detail-item">
            <span class="detail-label">UOM</span>
            <span class="detail-value">${t.uom||"-"}</span>
          </div>
          <div class="unit-detail-item">
            <span class="detail-label">Weight</span>
            <span class="detail-value">${t.weight||"-"} kg</span>
          </div>
          <div class="unit-detail-item">
            <span class="detail-label">Volume</span>
            <span class="detail-value">${t.volume||"-"} m³</span>
          </div>
        </div>
      </div>

      <!-- Footer -->
      <div class="footer">www.tdexpress.co</div>
    </div>
  `},S=(t,i)=>{const e=g(t.tdSku,{width:1.8,height:65,fontSize:12}),n=t.originalSku?g(t.originalSku,{height:35,fontSize:12}):"",a=t.stockedAt?new Date(t.stockedAt).toLocaleDateString("en-GB",{day:"2-digit",month:"2-digit",year:"numeric"}):"-";return`
    <div class="label-v4" ${i>0?'style="page-break-before: always;"':""}>
      <div class="label-border">
        <!-- Header -->
        <div class="header">
          <div class="logo">
            <img src="/logo/logo-icon.png" alt="TD Icon" />
          </div>
          <div class="warehouse-box">
            <div class="warehouse-code">${t.warehouseCode}</div>
            <div class="warehouse-name">${t.warehouseName||""}</div>
          </div>
        </div>

        <div class="terms-barcode-group">
          <div class="terms-text">
            <span class="ito-text">ito</span> <span class="td-terms">TD EXPRESS TERMS OF SERVICES</span>
          </div>
          <div class="main-barcode">
            <img src="${e}" alt="Barcode" />
          </div>
        </div>

        <!-- Product Name & Description -->
        <div class="product-info">
          <div class="product-name">${(t.productName||"").toUpperCase()}</div>
          <div class="product-desc">${(t.description||"-").toUpperCase()}</div>
        </div>

        <div class="bottom-row-1">
          <div class="stock-in-section">
            <div class="stock-in-label">STOCK IN DATE</div>
            <div class="stock-in-value">${a}</div>
          </div>
          <div class="client-section">
            ${t.customerCode?`<div class="info-line sku-line">${t.customerCode}</div>`:""}
            <div class="client-name">${(t.clientName||"").toUpperCase()}</div>
          </div>
        </div>

        <div class="bottom-row-2">
          <div class="small-barcode">
            ${n?`<img src="${n}" alt="Small Barcode" />`:""}
          </div>
          <div class="metrics">
            <div class="metric-line">${(t.uom||"CARTON").toUpperCase()}</div>
            ${t.dimensions?`<div class="metric-line">${t.dimensions}</div>`:""}
            <div class="metric-line">${t.volume?`${t.volume} M³`:"-"}</div>
            <div class="metric-line">${t.weight?`${t.weight} KG`:"-"}</div>
          </div>
        </div>
      </div>
    </div>
  `},z=()=>`
  @page {
    size: ${m}mm ${p}mm;
    margin: 0;
  }

  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  body {
    font-family: Arial, sans-serif;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .label-v3 {
    width: ${m}mm;
    height: ${p}mm;
    padding: 4mm;
    display: flex;
    flex-direction: column;
    background: white;
  }

  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 3mm;
    border-bottom: 1px solid #333;
    margin-bottom: 3mm;
  }

  .logo {
    display: flex;
    align-items: center;
    gap: 2mm;
  }

  .td-logo {
    font-size: 12pt;
    font-weight: bold;
    color: #000;
    background: #f0f0f0;
    padding: 1mm 2mm;
    border: 2px solid #333;
  }

  .warehouse-text {
    font-size: 9pt;
    font-weight: bold;
    letter-spacing: 1px;
  }

  .warehouse-code {
    font-size: 9pt;
    font-weight: bold;
    color: #333;
  }

  .barcode-section {
    display: flex;
    justify-content: center;
    padding: 2mm 0;
  }

  .barcode-img {
    max-width: 80mm;
    height: auto;
  }

  .product-name {
    font-size: 10pt;
    font-weight: bold;
    text-align: center;
    padding: 2mm 0;
    border-top: 1px dashed #999;
    border-bottom: 1px dashed #999;
    margin: 2mm 0;
    word-break: break-word;
  }

  .customer-section,
  .description-section,
  .date-section {
    display: flex;
    align-items: center;
    gap: 2mm;
    padding: 1.5mm 0;
  }

  .label-text {
    font-size: 8pt;
    color: #666;
  }

  .customer-name {
    font-size: 9pt;
    font-weight: bold;
  }

  .description-value {
    font-size: 8pt;
    font-weight: normal;
    word-break: break-word;
  }

  .date-value {
    font-size: 9pt;
    font-weight: bold;
  }

  .unit-details-v3 {
    margin-top: 3mm;
    border: 1px solid #333;
    padding: 2mm;
  }

  .unit-details-grid-v3 {
    display: flex;
    justify-content: space-between;
  }

  .unit-detail-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 1;
    padding: 0 1mm;
  }

  .unit-detail-item:not(:last-child) {
    border-right: 1px solid #ccc;
  }

  .detail-label {
    font-size: 7pt;
    color: #666;
    text-transform: uppercase;
    margin-bottom: 1mm;
  }

  .detail-value {
    font-size: 9pt;
    font-weight: bold;
  }

  .footer {
    text-align: center;
    font-size: 8pt;
    color: #666;
    padding-top: 2mm;
    margin-top: auto;
    border-top: 1px solid #999;
  }

  @media print {
    .no-print {
      display: none !important;
    }
  }
`,N=()=>`
  @page {
    size: ${m}mm ${p}mm;
    margin: 0;
  }

  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  body {
    font-family: Arial, sans-serif;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .label-v4 {
    width: ${m}mm;
    height: ${p}mm;
    padding: 2mm;
    background: white;
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.0;
  }

  .label-border {
    border: 2px solid #000;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 3mm 4mm;
  }

  .header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .logo img {
    height: 14mm;
    object-fit: contain;
  }

  .warehouse-box {
    text-align: right;
  }

  .warehouse-code {
    font-size: 21pt;
    font-weight: bold;
    color: #000;
    line-height: 1;
  }

  .warehouse-name {
    font-size: 9pt;
    font-weight: normal;
    text-transform: uppercase;
    margin-top: 1mm;
  }

  .terms-barcode-group {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .terms-text {
    text-align: center;
    margin-bottom: 1mm;
  }

  .ito-text {
    font-family: "Pacifico", cursive, sans-serif;
    font-size: 11pt;
    font-weight: normal;
    font-style: italic;
    margin-right: 1mm;
  }

  .td-terms {
    font-size: 11pt;
    font-weight: bold;
  }

  .main-barcode {
    display: flex;
    justify-content: center;
  }

  .main-barcode img {
    max-width: 85mm;
    height: 30mm;
  }

  .product-info {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .product-name {
    font-size: 11pt;
    font-weight: normal;
    margin-bottom: 1mm;
    line-height: 1.0;
  }

  .product-desc {
    font-size: 9pt;
    color: #000;
    line-height: 1.0;
    max-width: 95%;
    margin: 0 auto;
  }

  .two-columns {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
  }

  .bottom-row-1 {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-top: 1.5px solid #fff;
    padding-top: 2mm;
    margin-top: 1mm;
  }

  .bottom-row-2 {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    border-top: 1.5px solid #fff;
    padding-top: 2mm;
  }

  .stock-in-section, .small-barcode {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    border-right: 1.5px solid #fff;
    padding-right: 2mm;
  }

  .client-section, .metrics {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding-left: 2mm;
  }

  .client-section {
    align-items: flex-start;
    text-align: left;
  }

  .metrics {
    align-items: flex-end;
    text-align: right;
  }

  .stock-in-label {
    font-size: 11pt;
    font-weight: normal;
    margin-bottom: 2mm;
  }

  .stock-in-value {
    font-size: 9pt;
    font-weight: normal;
    margin-bottom: 5mm;
  }

  .small-barcode img {
    height: 16mm;
    max-width: 45mm;
  }

  .client-section {
    margin-bottom: 0;
  }

  .sku-line {
    font-size: 9pt;
    font-weight: normal;
    margin-bottom: 0.5mm;
  }

  .client-name {
    font-size: 11pt;
    font-weight: normal;
    line-height: 1.0;
  }

  .metrics {
    font-size: 9pt;
    font-weight: normal;
    line-height: 1.0;
    text-align: right;
  }

  .metric-line {
    margin-top: 1mm;
  }

  @media print {
    .no-print {
      display: none !important;
    }
  }
`,U=(t,i="v4")=>{if(t.length===0)return console.warn("No labels to preview"),null;const e={v3:k,v4:S},n={v3:z,v4:N},a=e[i],o=n[i],s=t.map((d,c)=>a(d,c)).join(""),l=`
    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="UTF-8">
        <title>Label Preview</title>
        <link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet">
        <style>
          ${o()}
          .preview-controls {
            position: fixed;
            top: 10px;
            right: 10px;
            z-index: 1000;
            display: flex;
            gap: 10px;
          }
          .preview-btn {
            padding: 10px 20px;
            font-size: 14px;
            cursor: pointer;
            border: none;
            border-radius: 4px;
          }
          .print-btn {
            background: #1890ff;
            color: white;
          }
          .print-btn:hover {
            background: #40a9ff;
          }
          .close-btn {
            background: #f5f5f5;
            color: #333;
          }
          .close-btn:hover {
            background: #e8e8e8;
          }
          @media screen {
            body {
              background: #f0f0f0;
              padding: 20px;
            }
            .labels-container {
              display: flex;
              flex-direction: column;
              align-items: center;
              gap: 20px;
            }
            .label, .label-v2, .label-v3 {
              box-shadow: 0 2px 8px rgba(0,0,0,0.15);
            }
          }
          @media print {
            body {
              background: white;
              padding: 0;
              margin: 0;
            }
            .labels-container {
              display: block;
            }
          }
        </style>
      </head>
      <body>
        <div class="preview-controls no-print">
          <button class="preview-btn print-btn" onclick="window.print()">Print Labels</button>
          <button class="preview-btn close-btn" onclick="window.close()">Close</button>
        </div>
        <div class="labels-container">
          ${s}
        </div>
      </body>
    </html>
  `,r=window.open("","_blank","width=500,height=700");return r?(r.document.write(l),r.document.close(),r):(h.warning("Please allow pop-ups to preview labels"),null)},C=t=>{let i=0,e=0,n=0;for(const o of t.items){i+=o.quantity;const s=typeof o.weight=="string"?Number.parseFloat(o.weight)||0:o.weight;e+=s*o.quantity;const l=typeof o.volume=="string"?Number.parseFloat(o.volume)||0:o.volume;n+=l*o.quantity}const a=t.items.map(o=>`
    <tr>
      <td class="center">${o.no}</td>
      <td>${o.tdSku}</td>
      <td>${o.originalSku}</td>
      <td>${o.productName}</td>
      <td class="center">${o.uom||"-"}</td>
      <td class="right">${o.weight||"-"}</td>
      <td class="right">${o.volume||"-"}</td>
      <td class="center">${o.quantity}</td>
      <td>${o.locationCode||"-"}</td>
    </tr>
  `).join("");return`
    <!-- Header -->
    <div class="header">
      <div class="logo">
        <span class="td-logo">TD</span>
        <span class="warehouse-text">WAREHOUSE</span>
      </div>
      <div class="warehouse-code">${t.warehouseCode}</div>
    </div>

    <h2 class="title">Stuffing List</h2>

    <div class="info-row">
      <div><strong>Client:</strong> ${t.customerName}</div>
      <div><strong>Date:</strong> ${t.date}</div>
    </div>
    ${t.packingOrderCode?`<div class="info-row"><div><strong>Code:</strong> ${t.packingOrderCode}</div></div>`:""}

    <table>
      <thead>
        <tr>
          <th class="center" style="width:40px">No.</th>
          <th>TD SKU</th>
          <th>Original SKU</th>
          <th>Product Name</th>
          <th class="center" style="width:60px">UOM</th>
          <th class="right" style="width:70px">Weight</th>
          <th class="right" style="width:70px">Volume</th>
          <th class="center" style="width:50px">Qty</th>
          <th>Location</th>
        </tr>
      </thead>
      <tbody>
        ${a}
      </tbody>
      <tfoot>
        <tr class="total-row">
          <td colspan="5" class="right"><strong>Total:</strong></td>
          <td class="right"><strong>${e?e.toFixed(2):"-"}</strong></td>
          <td class="right"><strong>${n?n.toFixed(4):"-"}</strong></td>
          <td class="center"><strong>${i}</strong></td>
          <td></td>
        </tr>
      </tfoot>
    </table>

    <!-- Sign-off Section -->
    <table class="sign-off-table">
      <tr>
        <td class="notes-cell">
          <strong>Notes</strong>
          <div class="notes-content"></div>
        </td>
        <td class="sign-cell">
          <strong>Packed &amp; Checked by,</strong>
          <div class="sign-content"></div>
          <div class="date-line"><strong>Date :</strong></div>
        </td>
      </tr>
    </table>

    <div class="footer">www.tdexpress.co</div>
  `},T=()=>`
  @page {
    size: A4 landscape;
    margin: 15mm;
  }

  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  body {
    font-family: Arial, sans-serif;
    font-size: 9pt;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 3mm;
    border-bottom: 1px solid #333;
    margin-bottom: 3mm;
  }

  .logo {
    display: flex;
    align-items: center;
    gap: 2mm;
  }

  .td-logo {
    font-size: 14pt;
    font-weight: bold;
    color: #000;
    background: #f0f0f0;
    padding: 1mm 2mm;
    border: 2px solid #333;
  }

  .warehouse-text {
    font-size: 10pt;
    font-weight: bold;
    letter-spacing: 1px;
  }

  .warehouse-code {
    font-size: 10pt;
    font-weight: bold;
    color: #333;
  }

  .barcode-section {
    display: flex;
    justify-content: center;
    padding: 2mm 0;
  }

  .barcode-img {
    max-width: 60mm;
    height: auto;
  }

  .title {
    text-align: center;
    font-size: 14pt;
    margin: 4mm 0;
  }

  .info-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4mm;
    font-size: 10pt;
  }

  table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 4mm;
  }

  th, td {
    border: 1px solid #333;
    padding: 2mm 3mm;
    font-size: 8pt;
  }

  th {
    background: #f0f0f0;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 7pt;
  }

  .center { text-align: center; }
  .right { text-align: right; }

  .total-row {
    background: #f9f9f9;
  }

  .sign-off-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 6mm;
  }

  .sign-off-table td {
    border: 1px solid #333;
    padding: 3mm 4mm;
    vertical-align: top;
    font-size: 9pt;
  }

  .notes-cell {
    width: 65%;
  }

  .sign-cell {
    width: 35%;
  }

  .notes-content {
    min-height: 25mm;
  }

  .sign-content {
    min-height: 15mm;
  }

  .date-line {
    margin-top: 3mm;
    padding-top: 2mm;
  }

  .footer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 8pt;
    color: #666;
    padding: 2mm 0;
    border-top: 1px solid #999;
    background: white;
  }

  body {
    padding-bottom: 12mm;
  }

  @media print {
    .no-print {
      display: none !important;
    }
  }
`,D=t=>{let i=0,e=0,n=0;const a=t.items.map(s=>{const l=Number(s.quantity)||0,r=Number(s.weight)||0,d=Number(s.volume)||0,c=r*l,f=d*l;return i+=l,e+=c,n+=f,`
    <tr>
      <td class="center">${s.no}</td>
      <td class="center">${s.tdSku}</td>
      <td class="center">${s.originalSku}</td>
      <td>${(s.productName||"-").toUpperCase()}</td>
      <td class="center">${s.locationCode||"-"}</td>
      <td class="center">${s.uom||"-"}</td>
      <td class="right">${c.toFixed(2)}</td>
      <td class="right">${f.toFixed(4)}</td>
      <td class="center">${l}</td>
    </tr>
  `}).join("");return`
    <div class="stuffing-list-v2">
      <!-- Header Table -->
      <table class="header-table">
        <tr>
          <td class="header-left">
            <img src="/logo/logo-icon.png" alt="TD Logo" class="main-logo" />
          </td>
          <td class="header-right">
            <div class="barcode-container">
              <img src="${t.packingOrderCode?g(t.packingOrderCode,{width:1.8,height:65,fontSize:18}):""}" alt="Barcode" />
            </div>
          </td>
        </tr>
        <tr>
          <td class="header-left customer-name highlight-11">${(t.customerName||"").toUpperCase()}</td>
          <td class="header-right doc-title highlight-11">STUFFING LIST</td>
        </tr>
        <tr>
          <td class="header-left meta-row">CONTAINER NO. : ${t.containerNo||"-"}</td>
          <td class="header-right"></td>
        </tr>
        <tr>
          <td class="header-left meta-row">SEAL NO : ${t.sealNo||"-"}</td>
          <td class="header-right doc-date highlight-11">${t.date}</td>
        </tr>
      </table>

      <!-- Main Table -->
      <table class="main-table-v2">
        <thead>
          <tr>
            <th style="width: 35px;">NO</th>
            <th style="width: 100px;">TD SKU</th>
            <th style="width: 100px;">ORIGINAL SKU</th>
            <th>NAME</th>
            <th style="width: 70px;">STORAGE</th>
            <th style="width: 50px;">UOM</th>
            <th style="width: 55px;">KG</th>
            <th style="width: 55px;">M3</th>
            <th style="width: 45px;">QTY</th>
          </tr>
        </thead>
        <tbody>
          ${a}
          <tr class="total-row">
            <td colspan="6" class="right">TOTAL</td>
            <td class="right">${e.toFixed(2)}</td>
            <td class="right">${n.toFixed(4)}</td>
            <td class="center">${i}</td>
          </tr>
        </tbody>
      </table>

      <!-- Notes Section -->
      <div class="notes-section highlight-11">
        <div class="notes-title">NOTES</div>
        <ol class="notes-list">
          <li>All quantities and descriptions are recorded based on the items presented at the time of stuffing.</li>
          <li>Once the container is sealed and released, TD EXPRESS SDN BHD is not responsible for any damage or loss during transit.</li>
          <li>Any discrepancies must be reported in writing within 24 hours of the stuffing date shown above.</li>
        </ol>
      </div>
    </div>
  `},j=()=>`
  @page {
    size: A4;
    margin: 15mm;
  }

  * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }

  body {
    font-family: Arial, sans-serif;
    font-size: 9pt; /* Standard size */
    color: #000;
    line-height: 1.1;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  .stuffing-list-v2 {
    width: 100%;
  }

  /* Font size highlights */
  .highlight-11 {
    font-size: 11pt !important;
  }

  /* Header Table Styles */
  .header-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 3mm;
  }

  .header-table td {
    vertical-align: top;
    padding: 0;
  }

  .header-left { text-align: left; }
  .header-right { text-align: right; }

  .main-logo {
    height: 14mm;
    margin-bottom: 1mm;
  }

  .barcode-container img {
    height: 16mm;
    max-width: 70mm;
  }

  .barcode-text {
    font-size: 8pt;
    margin-top: 1mm;
    letter-spacing: 1px;
  }

  .client-meta { padding-top: 2mm !important; }
  .title-meta { padding-top: 2mm !important; }

  .customer-name, .doc-title {
    padding-top: 4mm !important;
  }

  .customer-name {
    font-weight: bold;
    margin-bottom: 1mm;
  }

  .meta-row {
    margin-bottom: 0.5mm;
  }

  .doc-title {
    font-weight: bold;
    margin-bottom: 2mm;
    text-decoration: underline;
  }

  /* Main Table Styles */
  .main-table-v2 {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    margin-bottom: 5mm;
  }

  .main-table-v2 th, 
  .main-table-v2 td {
    border: 0.5pt solid #000;
    padding: 1mm 1mm;
    word-wrap: break-word;
    vertical-align: middle;
  }

  .main-table-v2 th {
    font-weight: bold;
    text-align: center;
    background-color: #fff;
  }

  .center { text-align: center !important; }
  .right { text-align: right !important; }

  .total-row td {
    font-weight: bold;
  }

  /* Notes Section */
  .notes-section {
    margin-top: 5mm;
  }

  .notes-title {
    font-weight: bold;
    text-decoration: underline;
    margin-bottom: 2mm;
  }

  .notes-list {
    padding-left: 5mm;
  }

  .notes-list li {
    margin-bottom: 1mm;
  }

  @media print {
    .no-print { display: none !important; }
  }
`,A=(t,i="v2")=>{if(t.items.length===0)return h.warning("No items for stuffing list"),null;const e=i==="v1"?"v1":"v2",n={v1:C,v2:D},a={v1:T,v2:j},o=n[e],s=a[e],l=o(t),r=`
    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="UTF-8">
        <title>Stuffing List Preview - ${t.packingOrderCode||""}</title>
        <style>
          ${s()}
          .preview-controls {
            position: fixed;
            top: 10px;
            right: 10px;
            z-index: 1000;
            display: flex;
            gap: 10px;
          }
          .preview-btn {
            padding: 8px 16px;
            font-size: 13px;
            cursor: pointer;
            border: 1px solid #d9d9d9;
            border-radius: 4px;
            background: white;
            color: #333;
          }
          .print-btn {
            background: #1890ff;
            color: white;
            border-color: #1890ff;
          }
          .print-btn:hover {
            background: #40a9ff;
          }
          @media screen {
            body {
              background: #f0f2f5;
              padding: 20px;
              display: flex;
              justify-content: center;
            }
            .stuffing-list-v2, .stuffing-list {
              box-shadow: 0 0 10px rgba(0,0,0,0.1);
              background: white;
              padding: 5mm; /* Remove hardcoded padding */
              width: 210mm; /* A4 width */
              min-height: 297mm; /* A4 height */
            }
          }
          @media print {
            .no-print {
              display: none !important;
            }
            body {
              background: white;
              padding: 0;
            }
            .stuffing-list-v2, .stuffing-list {
              box-shadow: none;
              padding: 0;
              width: 100%;
            }
          }
        </style>
      </head>
      <body>
        <div class="preview-controls no-print">
          <button class="preview-btn print-btn" onclick="window.print()">Print</button>
          <button class="preview-btn" onclick="window.close()">Close</button>
        </div>
        ${l}
      </body>
    </html>
  `,d=window.open("","_blank","width=900,height=1000");return d?(d.document.write(r),d.document.close(),d):(h.warning("Please allow pop-ups to preview"),null)};export{A as a,U as p};
