import React, { useEffect, useState } from 'react';
import { useDispatch } from 'react-redux';
import moment from 'moment';
import {
  extractLastNumberOrderId,
  getSession,
} from '../../../../Services/Others';
import QRcode from '../../../../Images/QRcode.png';
import { printDiv } from '../../../../Services/Others';
// import HpyImg from "../../../../Images/happyemoji.png"
import '../../../../Styles/BookingScreen/PrintTemplates/A4/PrintA4Style11.scss';
import { useSelector } from 'react-redux';
import {
  GloabalFieldDetails,
  GlobalBillName,
  Globalnotes,
  GlobalprintAmount,
  GlobalprintCashierName,
  GlobalprintCredit,
  GlobalprintDiscount,
  GlobalprintHsnCode,
  GlobalprintItem,
  GlobalprintLogo,
  GlobalprintMRP,
  GlobalprintQrcodet,
  GlobalprintQuantity,
  GlobalprintRate,
  GlobalprintSignature,
  GlobalprintSlNo,
  GlobalprintTax,
  GlobalprinttermsAndConditions,
  GlobalPritdummyData,
  GlobalSignatureImage,
  GlobalthemeFormat,
} from '../../../../Features/ThemeChange/ThemeChange';
import signature from '../../../../Images/signatureimage.jpg';
import Logo from '../../../../Images/Logo.jpg';
import QRCode from 'react-qr-code';
import { settingDataSelector } from '../../../../Features/PreferenceMaster/PreferenceMaster';
import { PreferenceData } from '../../../../Features/BookingScreen/BookingData/BookingData';

const PrintA5Style11 = ({
  index,
  ExtraChargeTotal,
  UpiId,
  Date1,
  base64Image,
  totalQuantityFilter = 6,
  BranchCity,
  BranchZip,
  CashierName,
  totalQuantity,
  OrderDetailGST,
  OrderDetailIGST,
  OrderDetailVAT,
  table2Data,
  PaymentStatus,
  PrintGreeting,
  PrintLogo,
  printDatas,
  sportsAppPreference,
  MembershipApplied = null,
  SalesModePref,
}) => {
  const GlobalthemeFormatr = useSelector(GlobalthemeFormat);
  const GlobalSignature = useSelector(GlobalprintSignature);
  const GlobaltermsAndConditions = useSelector(GlobalprinttermsAndConditions);
  const FieldDetails = useSelector(GloabalFieldDetails);
  const GlobalIsnotes = useSelector(Globalnotes);
  const GlobalSignatureImages = useSelector(GlobalSignatureImage);
  console.log(FieldDetails, 'FieldDetails');
  const SLNO = FieldDetails?.['Sl.No'];
  const Item = FieldDetails?.['Item'];
  const MRP = FieldDetails?.['MRP'];
  const Discount = FieldDetails?.['Discount'];
  const Tax = FieldDetails?.['Tax'];
  const Quantity = FieldDetails?.['Quantity'];
  const Rate = FieldDetails?.['Rate'];
  const Amount = FieldDetails?.['Amount'];
  const HsnCode = FieldDetails?.['HsnCode'];
  const Qrcodet = FieldDetails?.['Qrcode'];
  const Signature = FieldDetails?.['signature'];
  const TermsnAdCondition = FieldDetails?.['terms&conditions'];
  const isNotes = FieldDetails?.['Notes'];
  const CashierNameField = FieldDetails?.['CashierName'];
  const LogoField = FieldDetails?.['Logo'];
  const CreditDetails = FieldDetails?.['Credit details'];
  const WeightasKg = FieldDetails?.['Weight'];
  const GlobalSlNo = useSelector(GlobalprintSlNo);
  const GlobalItem = useSelector(GlobalprintItem);
  const GlobalMRP = useSelector(GlobalprintMRP);
  const GlobalDiscount = useSelector(GlobalprintDiscount);
  const GlobalTax = useSelector(GlobalprintTax);
  const GlobalQuantity = useSelector(GlobalprintQuantity);
  const GlobalRate = useSelector(GlobalprintRate);
  const GlobalAmount = useSelector(GlobalprintAmount);
  const GlobalHsnCode = useSelector(GlobalprintHsnCode);
  const GlobalQrcodet = useSelector(GlobalprintQrcodet);
  const GlobaldummyData = useSelector(GlobalPritdummyData);
  const GlobalBilltext = useSelector(GlobalBillName);
  const GlobalCashierName = useSelector(GlobalprintCashierName);
  const GlobalLogo = useSelector(GlobalprintLogo);
  const GlobalCredit = useSelector(GlobalprintCredit);
  const SettingData = useSelector(PreferenceData);
  const estimatePrintHeader =
    SettingData?.[0]?.SettingDtlDetails?.find(
      (setting) =>
        setting?.SettingIdName?.toLowerCase() === 'estimateprintheader'
    )?.SettingValue === 'Y';
  const estimateTitle =
    SettingData?.[0]?.SettingDtlDetails?.find(
      (setting) =>
        setting?.SettingIdName?.toLowerCase() === 'estimatetitle'
    )?.SettingValue === 'Y';
  const currentDate = new Date();
  console.log(FieldDetails, 'FieldDetails');
  const day = currentDate.getDate().toString().padStart(2, '0');
  const monthNames = [
    'Jan',
    'Feb',
    'Mar',
    'Apr',
    'May',
    'Jun',
    'Jul',
    'Aug',
    'Sep',
    'Oct',
    'Nov',
    'Dec',
  ];
  const monthIndex = currentDate.getMonth();
  const year = currentDate.getFullYear().toString().slice(-2);

  const formattedDate = `${day}-${monthNames[monthIndex]}-${year}`;

  const TakeawayData = table2Data?.productDetails?.filter(
    (item) => item.BookingTypeName?.toLowerCase() === 'takeaway'
  );
  const DineInData = table2Data?.productDetails?.filter(
    (item) => item.BookingTypeName?.toLowerCase() === 'dine in'
  );
  let PaymentStatusSuccess = PaymentStatus?.filter(
    (ps) => ps.PaymentStatus === 'S'
  );
  const isEditedBill = PaymentStatus?.some(payment => {
    const type = payment?.AdjustmentType?.toLowerCase();
    return (
      (type === 'extra' || type === 'refund') &&
      payment?.BeforeAdjustment != null &&
      payment?.AfterAdjustment != null
    );
  });
  const lastTransaction = PaymentStatus?.find(
    (ps) => ps.PaymentStatus === 'S' && ps?.LastOrderTran === 'Y'
  )
  const PackageDetails = table2Data?.PackageDtl;
  const TakeawayTotal = TakeawayData?.reduce(
    (accumulator, currentValue) => accumulator + currentValue.TotalAmt,
    0
  );
  const DineInTotal = DineInData?.reduce(
    (accumulator, currentValue) => accumulator + currentValue.TotalAmt,
    0
  );
  const aggregatedPayments = PaymentStatusSuccess?.reduce(
    (acc, paymentdata) => {
      const paymentType = paymentdata?.PaymentTypeName;
      const amount = Number(paymentdata?.Amount);

      if (acc[paymentType]) {
        acc[paymentType] += amount;
      } else {
        acc[paymentType] = amount;
      }

      return acc;
    },
    {}
  );
  let TermsAndConditions = printDatas?.TermsandConditions;
  let SignatureImg = printDatas?.Signature;
  let Notestext = printDatas?.Notes;
  let BillName = printDatas?.PrintHdrName;
  let FormatTheme = printDatas?.PrintType == 'S' ? true : false;
  console.log(FormatTheme, 'TermsAndConditions');
  const productsData = table2Data?.productDetails || [];
  const offers = table2Data?.OrderOfferDetails || [];
  const paymentTypeUPI = PaymentStatus?.find(
    (ps) => ps.PaymentTypeName === 'UPI'
  );

  let TotalOfferAmount = 0;


  const products = [
    {
      id: 1,
      name: 'Butter Naan',
      price: 88.0,
      quantity: 2,
      mrp: 50,
      amt: 60,
      discount: 12,
      ProdTaxPercentage: 5,
    },
    {
      id: 2,
      name: 'Grill Chicken (f)',
      price: 300.0,
      quantity: 1,
      mrp: 50,
      amt: 60,
      discount: 12,
      ProdTaxPercentage: 5,
    },
    {
      id: 3,
      name: 'Tandoori Chicken (H) ',
      price: 200.0,
      quantity: 1,
      mrp: 50,
      amt: 60,
      discount: 12,
      ProdTaxPercentage: 0,
    },
    {
      id: 4,
      name: 'Kulfi',
      price: 30.0,
      quantity: 1,
      mrp: 50,
      amt: 60,
      discount: 12,
      ProdTaxPercentage: 18,
    },
    {
      id: 1,
      name: 'Butter Naan',
      price: 88.0,
      quantity: 2,
      mrp: 50,
      amt: 60,
      discount: 12,
      ProdTaxPercentage: 40,
    },
    {
      id: 2,
      name: 'Grill Chicken (f)',
      price: 300.0,
      quantity: 1,
      mrp: 50,
      amt: 60,
      discount: 12,
      ProdTaxPercentage: 5,
    },
  ];

  const chunkSize = 11;
  let dataSource = [];

  if (GlobaldummyData || TakeawayData?.length > 0) {
    dataSource = GlobaldummyData ? products : TakeawayData;
  } else if (DineInData?.length > 0) {
    dataSource = DineInData;
  }

  // Paginate the data
  const paginatedChunks = [];
  for (let i = 0; i < dataSource.length; i += chunkSize) {
    paginatedChunks.push(dataSource.slice(i, i + chunkSize));
  }
  const lastChunkRows =
    paginatedChunks.length > 0
      ? paginatedChunks[paginatedChunks.length - 1].length
      : 0;
  const shouldFooterBeOnNewPage = lastChunkRows > 6;

  return (
    <div
      style={{
        display: 'flex',
        flexDirection: 'column',
        minHeight: '297mm',
        pageBreakInside: 'avoid',
      }}
    >
      <div
        className="PrintA4Style11-MasterDiv"
        style={{ position: 'relative', width: '100%', minHeight: '297mm' }}
        id={`PrintStyleA5-0`}
      >
        {paginatedChunks.map((dataChunk, chunkIndex) => (
          <div
            style={{
              display: 'flex',
              flexDirection: 'column',
              justifyContent: 'space-between',
              height: FormatTheme ? '297mm' : '',
            }}
            className="print-page"
            key={chunkIndex}
          >
            <div
              className="page-headerA4Style11"
              style={{ textAlign: 'center' }}
            >
              {!estimatePrintHeader && table2Data?.OrderType === 'E' ? (
                ''
              ) : (
                <div
                  style={{
                    display: 'flex',
                    justifyContent: 'space-between',
                    alignItems: 'center',
                    textAlign: 'left',
                  }}
                >
                  <div
                    style={{
                      display: 'flex',
                      justifyContent: 'space-between',
                      alignItems: 'center',
                      padding: '12px 0',
                      borderBottom: '1px solid black',
                    }}
                  >
                    {/* Logo Image */}
                    <div style={{ marginRight: '20px' }}>
                      {GlobalLogo && GlobaldummyData && (
                        <div style={{ display: 'flex' }}>
                          {' '}
                          <img
                            src={Logo}
                            alt="Brand Logo"
                            style={{
                              width: '100px',
                              height: 'auto',
                              objectFit: 'contain',
                            }}
                          />
                        </div>
                      )}
                      {base64Image &&
                        (PrintLogo?.SettingValue === 'Y' || LogoField) ? (
                        <img
                          className="PrintA4Style11-BrandImage"
                          src={base64Image}
                          alt="Brand Logo"
                          style={{
                            width: '100px',
                            height: 'auto',
                            objectFit: 'contain',
                          }}
                        />
                      ) : null}
                    </div>
                    {/* Store Info */}
                    <div
                      style={{
                        textAlign: 'center',
                        flex: 1,
                        fontFamily: 'Lemon, Arial, sans-serif',
                        fontWeight: 600,
                      }}
                    >
                      <div
                        style={{
                          fontSize: 'clamp(1.5rem, 2.5vw, 2rem)',
                          marginBottom: '4px',
                        }}
                      >
                        {GlobaldummyData ? 'XYZ Shop' : table2Data?.BrName}
                      </div>

                      {/* Address */}
                      <div
                        style={{
                          fontSize: '12px',
                          fontWeight: 400,
                          fontFamily: 'Arial, sans-serif',
                          lineHeight: 1.4,
                        }}
                      >
                        {GlobaldummyData
                          ? 'BranchAddress, Town- 635XXX City - State'
                          : [
                            table2Data?.AddressDetails?.[0]?.Address1,
                            table2Data?.AddressDetails?.[0]?.City,
                            table2Data?.AddressDetails?.[0]?.Zip,
                          ]
                            .filter(Boolean)
                            .join(' - ')}
                        <br />
                        Mobile: +91{' '}
                        {GlobaldummyData ? '986XXXXXXX' : table2Data?.BrMobile}
                      </div>

                      {/* Order Type */}
                    </div>
                  </div>

                  {/* <div >
                  <div style={{ marginTop: '4px', fontSize: '13px', fontWeight: 600 }}>
                    {table2Data?.OrderType === "E"
                      ? "Estimate"
                      : (GlobaldummyData
                        ? "Cash"
                        : PaymentStatusSuccess?.length === 1
                          ? PaymentStatusSuccess?.[0]?.PaymentTypeName
                          : "") + table2Data?.OrderId && "Cash: " + extractLastNumberOrderId(table2Data?.OrderId, table2Data?.FYStatus)} {GlobaldummyData && "685"}
                  </div>
                </div> */}
                </div>
              )}

              <div
                style={{
                  display: 'flex',
                  justifyContent: 'space-between',
                  padding: '0rem 1rem',
                }}
              >
                <div style={{ fontWeight: '600', textAlign: 'left' }}>
                  Bill No :
                  {table2Data?.OrderId &&
                    extractLastNumberOrderId(
                      table2Data?.OrderId,
                      table2Data?.FYStatus
                    )}


                  {GlobaldummyData && '685'}
                </div>
                <div style={{ textAlign: 'center', width: '24vw' }}>
                  {GlobaldummyData
                    ? GlobalBilltext
                      ? GlobalBilltext
                      : 'Cash' + ' Bill'
                    : BillName
                      ? BillName
                      : PaymentStatusSuccess?.length === 1
                        ? PaymentStatusSuccess?.[0]?.PaymentTypeName + ' Bill'
                        : ''}
                </div>
                <div
                  style={{
                    display: 'flex',
                    justifyContent: 'space-between',
                    padding: '0rem 1rem',
                    fontSize: 'clamp(0.7rem, 2.5vw, 0.8rem)',
                    flexDirection: 'column',
                    textAlign:'left'
                  }}
                >
                  {' '}
                  <div>{Date1}</div>{' '}
                  {SalesModePref?.SettingValue == 'Y' && <div style={{ fontSize: '13px', margin: '0rem 0.5rem', fontWeight: 600 }}>
                    {' '}
                    Name : {table2Data?.SalesMode == "R" ? "RT" : "WS"}{' '}
                  </div>}
                </div>
              </div>

              <hr className="PrintA4Style11-print-dottline" />
              <br />
            </div>

            <div className="print-body">
              {(TakeawayData?.length > 0 || GlobaldummyData) && (
                <>
                  <div
                    style={{
                      display: 'flex',
                      width: '100%',
                      justifyContent: 'center',
                      alignItems: 'center',
                      fontSize: '12px',
                      fontWeight: '600',
                    }}
                  >
                    Take Away
                  </div>

                  <table className="A4TableStyle11" style={{ width: '100%' }}>
                    <thead>
                      <tr>
                        <td>
                          {/* Placeholder for the fixed-position header  */}
                          <div className="page-headerA4Style11-space"> </div>
                        </td>
                      </tr>
                    </thead>

                    <tbody>
                      <tr>
                        <td style={{ width: '100%' }}>
                          <div
                            className={FormatTheme ? 'page' : ''}
                            style={{ lineHeight: '1', fontSize: '13px' }}
                          >
                            <table
                              style={{ width: '99%', margin: 'auto' }}
                              className="A4TableA4Style11"
                            >
                              <thead>
                                <tr
                                  style={{
                                    background: '#373B44',
                                    color: '#fff',
                                  }}
                                >
                                  {GlobaldummyData
                                    ? GlobalSlNo && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        S.No
                                      </th>
                                    )
                                    : SLNO == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        S.No
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalItem && <th>Item</th>
                                    : Item == true && <th>Item</th>}
                                  {GlobaldummyData
                                    ? GlobalHsnCode && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        HSN
                                      </th>
                                    )
                                    : HsnCode == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        HSN
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalQuantity && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Qty
                                      </th>
                                    )
                                    : Quantity == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        {WeightasKg ? 'Qty/Kg' : 'Qty'}
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalMRP && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        MRP
                                      </th>
                                    )
                                    : MRP == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        MRP
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalRate && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Rate
                                      </th>
                                    )
                                    : Rate == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Rate
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalDiscount && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Dis{' '}
                                      </th>
                                    )
                                    : Discount == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Dis{' '}
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalTax && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Tax %
                                      </th>
                                    )
                                    : (Tax && table2Data?.OrderType !== 'E') && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Tax %
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalAmount && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                          textAlign: 'right',
                                        }}
                                      >
                                        Amt
                                      </th>
                                    )
                                    : Amount == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                          textAlign: 'right',
                                        }}
                                      >
                                        Amt
                                      </th>
                                    )}
                                </tr>
                              </thead>

                              <tbody>
                                {dataChunk?.map((item, index) => (
                                  <tr key={index}>
                                    {GlobaldummyData
                                      ? GlobalSlNo && (
                                        <td style={{ textAlign: 'center' }}>
                                          {index + 1}
                                        </td>
                                      )
                                      : SLNO == true && (
                                        <td style={{ textAlign: 'center' }}>
                                          {chunkIndex * chunkSize + index + 1}
                                        </td>
                                      )}
                                    {GlobaldummyData ? (
                                      GlobalItem && <td>{item?.name}</td>
                                    ) : (
                                      Item && (
                                        <td
                                          style={{
                                            display: "flex",
                                            flexDirection: "column",
                                          }}
                                        >
                                          <div>{item?.ProdName}</div>

                                          {PackageDetails?.filter(
                                            (pkg) => pkg.ProdId === item.ProdId
                                          ).length > 0 ? (
                                            <div>
                                              {PackageDetails
                                                ?.filter((pkg) => pkg.ProdId === item.ProdId)
                                                ?.map((pkg, index) => (
                                                  <span key={index} style={{ display: "block" }}>
                                                    {pkg.ParcelCount} PCS {pkg.ParcelQty} PACK ({pkg.ParcelType})
                                                  </span>
                                                ))}
                                            </div>
                                          ) : (
                                            <div>
                                              ({item?.Size || "1"}{" "}
                                              {item?.SinglePc === "Y"
                                                ? "PCS"
                                                : item?.Type !== "C"
                                                  ? item?.UomName
                                                  : "COMBO"}
                                              )
                                            </div>
                                          )}

                                          {item?.BrandName && <div>{item.BrandName}</div>}

                                          {/* Identifiers */}
                                          {item?.ProductIdentifierDtls?.length > 0
                                            ? item.ProductIdentifierDtls.map((id, index) => (
                                              <div key={index}>

                                                {/* Serial */}
                                                {id?.SerialNumber && <div>{id.SerialNumber}</div>}

                                                {/* IMEI */}
                                                {(id?.IMEI1 || id?.IMEI2) && (
                                                  <div>
                                                    {[id.IMEI1, id.IMEI2].filter(Boolean).join(",")}
                                                  </div>
                                                )}

                                                {/* Description */}
                                                {(id?.SerialNumber || id?.IMEI1 || id?.IMEI2) &&
                                                  id?.Description && (
                                                    <div>{id.Description}</div>
                                                  )}

                                              </div>
                                            ))
                                            : null}
                                        </td>
                                      )
                                    )}
                                    {GlobaldummyData
                                      ? GlobalHsnCode && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.discount}
                                        </td>
                                      )
                                      : HsnCode == true && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.HSN}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalQuantity && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.quantity}
                                        </td>
                                      )
                                      : Quantity == true && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.SalesQty}
                                        </td>
                                      )}

                                    {GlobaldummyData
                                      ? GlobalMRP && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.mrp}
                                        </td>
                                      )
                                      : MRP == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.SinglePc === 'Y'
                                            ? item?.Rate
                                            : item?.MRP}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalRate && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.Rate}
                                        </td>
                                      )
                                      : Rate == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {' '}
                                          {item?.MRP}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalDiscount && (
                                        <td>{item.discount}</td>
                                      )
                                      : Discount == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.Type != 'C'
                                            ? item?.OfferAmt || 0
                                            : item?.OfferValue || 0}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalTax && (
                                        <td>{item.ProdTaxPercentage}</td>
                                      )
                                      : (Tax && table2Data?.OrderType !== 'E') && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.ProdTaxPercentage || 0}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalAmount && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.price}
                                        </td>
                                      )
                                      : Amount == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.Type != 'C'
                                            ? item?.TotalAmt -
                                            item?.OfferAmt || 0
                                            : item?.TotalAmt -
                                            item?.OfferValue || 0}
                                        </td>
                                      )}
                                  </tr>
                                ))}
                              </tbody>
                            </table>

                            {!FormatTheme &&
                              chunkIndex === paginatedChunks.length - 1 && (
                                <div
                                  className="page-footerA4Style11"
                                  style={{
                                    marginTop: 'auto',
                                    pageBreakBefore: 'avoid',
                                    pageBreakInside: 'avoid',
                                    minHeight: 'auto',
                                  }}
                                >
                                  <>
                                    <div className="PrintA4Style11-print-ThirdDiv">
                                      <div>
                                        <div
                                          style={{
                                            display: 'flex',
                                            gap: '1rem',
                                            justifyContent: 'right',
                                            margin: '0.5rem 0rem',
                                            paddingRight: '1rem',
                                          }}
                                        >
                                          <div
                                            style={{
                                              display: 'flex',
                                              flexDirection: 'column',
                                              gap: '0.5rem',
                                            }}
                                          >
                                            <div>ITEMS</div>
                                            <div>Qty</div>
                                            {TotalOfferAmount > 0 ||
                                              table2Data?.OverallDisc ? (
                                              <div>OFFER</div>
                                            ) : (
                                              ''
                                            )}
                                            {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>Amount</div> */}
                                          </div>
                                          <div
                                            style={{
                                              textAlign: 'right',
                                              display: 'flex',
                                              flexDirection: 'column',
                                              gap: '0.5rem',
                                            }}
                                          >
                                            <div>
                                              {GlobaldummyData
                                                ? '7'
                                                : totalQuantityFilter?.length}
                                            </div>
                                            <div>
                                              {GlobaldummyData
                                                ? '9'
                                                : totalQuantity}
                                            </div>
                                            {TotalOfferAmount > 0 ||
                                              table2Data?.OverallDisc ? (
                                              <div>
                                                {Number(
                                                  TotalOfferAmount +
                                                  table2Data?.OverallDisc
                                                ).toFixed(2)}
                                              </div>
                                            ) : (
                                              ''
                                            )}
                                            {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
                                          </div>
                                        </div>
                                        <div
                                          className="total-Amount"
                                          style={{
                                            fontSize: '25px',
                                            fontWeight: '600',
                                            padding: '10px',
                                            backgroundColor: '#fdc716',
                                            textAlign: 'center',
                                          }}
                                        >
                                          Amount :
                                          {GlobaldummyData
                                            ? '1066'
                                            : Number(
                                              table2Data?.NetAmount
                                            ).toFixed(2)}
                                        </div>
                                      </div>
                                    </div>
                                    {isEditedBill && lastTransaction && (
                                      <div style={{
                                        width: '100%', marginTop: '2px',
                                        paddingTop: '2px', display: 'flex', justifyContent: 'center', alignItems: 'flex-start',
                                        flexDirection: 'column', borderTop: '1px dashed #000'
                                      }}>
                                        <div
                                          style={{
                                            fontSize: '12px',
                                            width: '100%'
                                          }}
                                        >
                                          <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                                            <span style={{ color: '#000', fontWeight: 600, }}>Bill Gross Amount</span>
                                            <strong>{(lastTransaction?.BeforeAdjustment || 0).toFixed(2)}</strong>
                                          </div>
                                          <div
                                            style={{
                                              display: 'flex',
                                              justifyContent: 'space-between',
                                              fontWeight: 600,
                                              color:
                                                lastTransaction?.AdjustmentType === 'REFUND'
                                                  ? '#000'
                                                  : '#000',
                                            }}
                                          >
                                            <span>{'Adjustment Amount'}</span>
                                            <span>
                                              {lastTransaction?.AdjustmentType === 'REFUND' ? '-' : '+'}
                                              {Math.abs((lastTransaction?.BeforeAdjustment ?? 0) -
                                                (lastTransaction?.AfterAdjustment ?? 0)).toFixed(2)}
                                            </span>
                                          </div>
                                          <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '4px' }}>
                                            <span style={{ color: '#000', fontWeight: 600 }}>Net Bill Amount</span>
                                            <strong>{(lastTransaction?.AfterAdjustment || 0).toFixed(2)}</strong>
                                          </div>
                                        </div>
                                      </div>
                                    )}
                                    {GlobaldummyData
                                      ? GlobalCredit && (
                                        <div
                                          style={{
                                            textAlign: 'left',
                                            fontSize: '14px',
                                            fontWeight: '600',
                                            lineHeight: '12px',
                                          }}
                                        >
                                          <h6>Advance Amount:</h6>
                                          <h6>Opening Balance:</h6>
                                        </div>
                                      )
                                      : CreditDetails &&
                                      table2Data?.CustomerDetails?.length >
                                      0 && (
                                        <div
                                          style={{
                                            textAlign: 'left',
                                            fontSize: '12px',
                                            fontWeight: '600',
                                            lineHeight: '12px',
                                          }}
                                        >
                                          {/* OLD CREDIT BAL */}
                                          {PaymentStatusSuccess?.[0]
                                            ?.PaymentTypeName ===
                                            'Credit' && (
                                              <>
                                                {table2Data.CustomerDetails[0]
                                                  .OldCreditBal > 0 ? (
                                                  <p>
                                                    Advance Amount:
                                                    {
                                                      table2Data
                                                        .CustomerDetails[0]
                                                        .OldCreditBal
                                                    }
                                                  </p>
                                                ) : table2Data
                                                  .CustomerDetails[0]
                                                  .OldCreditBal < 0 ? (
                                                  <p>
                                                    {' '}
                                                    Opening Balance:{' '}
                                                    {Math.abs(
                                                      table2Data
                                                        .CustomerDetails[0]
                                                        .OldCreditBal
                                                    )}
                                                  </p>
                                                ) : null}
                                              </>
                                            )}

                                          {/* CURRENT CREDIT BAL */}
                                          {table2Data.CustomerDetails[0]
                                            .CurrentCreditBal > 0 ? (
                                            <p>
                                              {' '}
                                              Current Advance Amount:{' '}
                                              {
                                                table2Data.CustomerDetails[0]
                                                  .CurrentCreditBal
                                              }
                                            </p>
                                          ) : table2Data.CustomerDetails[0]
                                            .CurrentCreditBal < 0 ? (
                                            <p>
                                              {' '}
                                              Current Balance Amount:{' '}
                                              {Math.abs(
                                                table2Data.CustomerDetails[0]
                                                  .CurrentCreditBal
                                              )}
                                            </p>
                                          ) : null}
                                        </div>
                                      )}
                                    <hr className="PrintA4Style11-print-dottline" />

                                    {(table2Data?.OrderType !== "E") && OrderDetailGST?.length > 0 &&
                                      OrderDetailGST?.[0]?.TaxAmt > 0 && (
                                        <>
                                          <p style={{ margin: 0, padding: 0, fontSize: "12px", textAlign: "center" }}>
                                            --------- GST Breakup Details -----------</p>
                                          <table className="PrintA4Style11-print-table">
                                            <thead>
                                              <tr>
                                                <th style={{ width: '10px', textAlign: 'center' }}>GST Rate</th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  Taxable Amount
                                                </th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  CGST
                                                </th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  SGST
                                                </th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  Total
                                                </th>
                                              </tr>
                                            </thead>
                                            <tbody>
                                              {OrderDetailGST?.map((item) => (
                                                <tr>
                                                  <td style={{ textAlign: 'center' }}>
                                                    {item?.TaxPercentage}%{' '}
                                                  </td>
                                                  <td style={{ textAlign: 'right' }}>
                                                    {' '}
                                                    {Number(item.WithOutTaxAmount).toFixed(2)}{' '}
                                                  </td>
                                                  <td style={{ textAlign: 'right' }}>
                                                    {' '}
                                                    {Number(item.CGST).toFixed(2)}
                                                  </td>
                                                  <td
                                                    style={{ textAlign: 'right' }}
                                                  >
                                                    {' '}
                                                    {Number(item.SGST).toFixed(2)}
                                                  </td>
                                                  <td
                                                    style={{ textAlign: 'right' }}
                                                  >
                                                    {' '}
                                                    {Number(item.TotalAmt).toFixed(2)}
                                                  </td>
                                                </tr>
                                              ))}
                                            </tbody>
                                          </table>
                                        </>
                                      )}

                                    <div className="PrintA4Style11-print-ThirdDiv2">
                                      <div
                                        style={{
                                          display: 'flex',
                                          justifyContent: 'right',
                                          flexDirection: 'column',
                                        }}
                                      >
                                        <span
                                          style={{ margin: '0.5rem 0rem' }}
                                        />
                                      </div>
                                    </div>

                                    <div
                                      style={{
                                        display: 'flex',
                                        justifyContent: 'space-between',
                                        alignItems: 'center',
                                      }}
                                    >
                                      <div
                                        style={{
                                          display: 'flex',
                                          alignItems: 'center',
                                          gap: '0.3rem',
                                        }}
                                      ></div>

                                      {GlobaldummyData
                                        ? GlobalQrcodet && (
                                          <div
                                            style={{
                                              display: 'flex',
                                              flexDirection: 'column',
                                              justifyContent: 'center',
                                              alignItems: 'center',
                                            }}
                                          >
                                            <QRCode
                                              value={`upi://pay?pa=${UpiId}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                                              size={80}
                                            />
                                            <div style={{ fontSize: '12px' }}>
                                              Scan to Pay{' '}
                                            </div>
                                            <div style={{ fontSize: '12px' }}>
                                              ₹
                                              {GlobaldummyData
                                                ? '1,066'
                                                : Number(
                                                  table2Data?.NetAmount
                                                ).toFixed(2)}
                                            </div>
                                          </div>
                                        )
                                        : Qrcodet &&
                                        paymentTypeUPI && (
                                          <div
                                            style={{
                                              display: 'flex',
                                              flexDirection: 'column',
                                              justifyContent: 'center',
                                              alignItems: 'center',
                                            }}
                                          >
                                            <QRCode
                                              value={`upi://pay?pa=${GlobalUpiID}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                                              size={80}
                                            />
                                            <div style={{ fontSize: '10px' }}>
                                              Scan to Pay{' '}
                                            </div>
                                            <div style={{ fontSize: '10px' }}>
                                              ₹
                                              {GlobaldummyData
                                                ? '1,066'
                                                : Number(
                                                  table2Data?.NetAmount
                                                ).toFixed(2)}
                                            </div>
                                          </div>
                                        )}
                                    </div>

                                    <div
                                      style={{
                                        margin: '0.5rem 0.5rem',
                                        display: 'flex',
                                        flexDirection: 'column',
                                        alignItems: 'flex-start',
                                        gap: '0.5rem',
                                        height: GlobalthemeFormatr
                                          ? '13vh'
                                          : '5vh',
                                      }}
                                    >
                                      {GlobaldummyData && GlobalCashierName && (
                                        <div className="PrintA4Style11-print-InfoDivsub">
                                          CASHIER : {CashierName}
                                        </div>
                                      )}
                                      {CashierName && CashierNameField && (
                                        <div className="PrintA4Style11-print-InfoDivsub">
                                          CASHIER : {CashierName}
                                        </div>
                                      )}
                                      <div
                                        className="PrintA4Style11-print-InfoDivsub"
                                        style={{ textTransform: 'capitalize' }}
                                      >
                                        {Date1}
                                      </div>
                                    </div>
                                  </>
                                  {sportsAppPreference && MembershipApplied && (
                                    <div
                                      style={{
                                        width: '100%',
                                        textAlign: 'center',
                                        paddingTop: '10px',
                                        fontSize: '13px',
                                      }}
                                    >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`}</div>
                                  )}

                                  {GlobaldummyData
                                    ? GlobalIsnotes && (
                                      <div>
                                        <p style={{ padding: '0rem 1rem' }}>
                                          Notes : 10 days Return policy
                                        </p>

                                        <hr className="PrintA4Style11-print-dottline" />
                                      </div>
                                    )
                                    : Notestext && (
                                      <div>
                                        <p
                                          style={{
                                            padding: '0rem 1rem',
                                            textAlign: 'center',
                                          }}
                                        >
                                          {Notestext}
                                        </p>

                                        <hr className="PrintA4Style11-print-dottline" />
                                      </div>
                                    )}

                                  <div
                                    style={{
                                      display: 'flex',
                                      width: '90%',
                                      padding: '0 1rem',
                                      justifyContent: GlobaltermsAndConditions
                                        ? 'space-between'
                                        : 'flex-end',
                                      alignItems: 'center',
                                    }}
                                  >
                                    {GlobaldummyData
                                      ? GlobaltermsAndConditions && (
                                        <div
                                          style={{
                                            margin: '8px 0',
                                            padding: '8px',
                                            fontFamily: 'sans-serif',
                                            width: '100%',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Terms & Conditions
                                          </p>
                                          <ol
                                            style={{
                                              fontSize: '12px',
                                              paddingLeft: '18px',
                                              margin: 0,
                                              lineHeight: '1',
                                            }}
                                          >
                                            <li>
                                              Once goods are sold, they are
                                              not exchangeable or refundable.
                                            </li>
                                            <li>
                                              Please check the product before
                                              leaving the counter.
                                            </li>
                                          </ol>
                                        </div>
                                      )
                                      : TermsnAdCondition == true &&
                                      TermsAndConditions?.length > 0 && (
                                        <div
                                          style={{
                                            margin: '8px 0',
                                            fontFamily: 'sans-serif',
                                            width: '100%',
                                            display: 'flex',
                                            flexDirection: 'column',
                                            alignItems: 'flex-start',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Terms & Conditions
                                          </p>
                                          <ol
                                            style={{
                                              fontSize: '12px',
                                              paddingLeft: '18px',
                                              margin: 0,
                                              lineHeight: '1',
                                            }}
                                          >
                                            {TermsAndConditions?.map(
                                              (item) => (
                                                <li
                                                  style={{
                                                    textAlign: 'start',
                                                  }}
                                                >
                                                  {item?.TermsandConditions}
                                                </li>
                                              )
                                            )}
                                            {/* <li>Please check the product before leaving the counter.</li> */}
                                          </ol>
                                        </div>
                                      )}

                                    {GlobaldummyData
                                      ? GlobalSignature && (
                                        <div
                                          style={{
                                            display: 'flex',
                                            flexDirection: 'column',
                                            alignItems: 'flex-end',
                                            paddingBottom: '1rem',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Signature
                                          </p>
                                          <img
                                            style={{
                                              width: '70px',
                                              height: '40px',
                                            }}
                                            src={
                                              GlobalSignatureImages
                                                ? GlobalSignatureImages
                                                : signature
                                            }
                                            alt=""
                                          />
                                        </div>
                                      )
                                      : Signature == true && (
                                        <div
                                          style={{
                                            display: 'flex',
                                            flexDirection: 'column',
                                            alignItems: 'center',
                                            marginTop: '1rem',
                                            paddingBottom: '1rem',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Signature
                                          </p>
                                          <img
                                            style={{
                                              width: '100px',
                                              height: '60px',
                                            }}
                                            src={SignatureImg}
                                            alt=""
                                          />
                                        </div>
                                      )}
                                  </div>
                                </div>
                              )}

                            <hr className="PrintA4Style11-print-dottline" />
                            {/* {(chunkIndex === paginatedChunks.length - 1) && (
                                 
                                )} */}
                          </div>
                        </td>
                      </tr>
                    </tbody>

                    <tfoot>
                      <tr>
                        <td>
                          <div className="page-footerA4Style11-space"></div>
                        </td>
                      </tr>
                    </tfoot>
                  </table>
                </>
              )}

              {DineInData?.length > 0 && (
                <>
                  <div
                    style={{
                      display: 'flex',
                      width: '100%',
                      justifyContent: 'center',
                      alignItems: 'center',
                      fontSize: '12px',
                      fontWeight: '600',
                    }}
                  >
                    Dine In
                  </div>
                  <table className="A4TableStyle11" style={{ width: '100%' }}>
                    <thead>
                      <tr>
                        <td>
                          {/* Placeholder for the fixed-position header  */}
                          <div className="page-headerA4Style11-space"> </div>
                        </td>
                      </tr>
                    </thead>

                    <tbody>
                      <tr>
                        <td style={{ width: '100%' }}>
                          <div
                            className={FormatTheme ? 'page' : ''}
                            style={{ lineHeight: '1', fontSize: '13px' }}
                          >
                            <table
                              style={{ width: '100%' }}
                              className="A4TableA4Style11"
                            >
                              <thead>
                                <tr
                                  style={{
                                    background: '#373B44',
                                    color: '#fff',
                                  }}
                                >
                                  {GlobaldummyData
                                    ? GlobalSlNo && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        S.No
                                      </th>
                                    )
                                    : SLNO == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        S.No
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalItem && <th>Item</th>
                                    : Item == true && <th>Item</th>}
                                  {GlobaldummyData
                                    ? GlobalHsnCode && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        HSN
                                      </th>
                                    )
                                    : HsnCode == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        HSN
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalQuantity && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Qty
                                      </th>
                                    )
                                    : Quantity == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        {WeightasKg ? 'Qty/Kg' : 'Qty'}
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalMRP && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        MRP
                                      </th>
                                    )
                                    : MRP == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        MRP
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalRate && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Rate
                                      </th>
                                    )
                                    : Rate == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Rate
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalDiscount && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Dis{' '}
                                      </th>
                                    )
                                    : Discount == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Dis{' '}
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalTax && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Tax %
                                      </th>
                                    )
                                    : (Tax && table2Data?.OrderType !== 'E') && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                        }}
                                      >
                                        Tax %
                                      </th>
                                    )}
                                  {GlobaldummyData
                                    ? GlobalAmount && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                          textAlign: 'right',
                                        }}
                                      >
                                        Amt
                                      </th>
                                    )
                                    : Amount == true && (
                                      <th
                                        style={{
                                          width: '8%',
                                          textAlign: 'center',
                                          textAlign: 'right',
                                        }}
                                      >
                                        Amt
                                      </th>
                                    )}
                                </tr>
                              </thead>

                              <tbody>
                                {dataChunk?.map((item, index) => (
                                  <tr key={index}>
                                    {GlobaldummyData
                                      ? GlobalSlNo && (
                                        <td style={{ textAlign: 'center' }}>
                                          {index + 1}
                                        </td>
                                      )
                                      : SLNO == true && (
                                        <td style={{ textAlign: 'center' }}>
                                          {chunkIndex * chunkSize + index + 1}
                                        </td>
                                      )}
                                    {GlobaldummyData ? (
                                      GlobalItem && <td>{item?.ProdName}</td>
                                    ) : (
                                      Item && (
                                        <td
                                          style={{
                                            display: "flex",
                                            flexDirection: "column",
                                          }}
                                        >
                                          <div>{item?.ProdName}</div>

                                          <div>
                                            ({item?.Size || "1"}{" "}
                                            {item?.SinglePc === "Y"
                                              ? "PCS"
                                              : item?.Type !== "C"
                                                ? item?.UomName
                                                : "COMBO"}
                                            )
                                          </div>

                                          {item?.BrandName && <div>{item.BrandName}</div>}

                                          {item?.ProductIdentifierDtls?.map((id, index) => (
                                            <div key={index}>

                                              {/* Serial Number */}
                                              {id?.SerialNumber && <div>{id.SerialNumber}</div>}

                                              {/* IMEI */}
                                              {(id?.IMEI1 || id?.IMEI2) && (
                                                <div>
                                                  {[id.IMEI1, id.IMEI2].filter(Boolean).join(",")}
                                                </div>
                                              )}

                                              {/* Description */}
                                              {(id?.SerialNumber || id?.IMEI1 || id?.IMEI2) &&
                                                id?.Description && (
                                                  <div>{id.Description}</div>
                                                )}

                                            </div>
                                          ))}
                                        </td>
                                      )
                                    )}
                                    {GlobaldummyData
                                      ? GlobalHsnCode && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.HSN}
                                        </td>
                                      )
                                      : HsnCode == true && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.HSN}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalQuantity && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.SalesQty}
                                        </td>
                                      )
                                      : Quantity == true && (
                                        <td style={{ textAlign: 'center' }}>
                                          {item?.SalesQty}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalMRP && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.MRP}
                                        </td>
                                      )
                                      : MRP == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.SinglePc === 'Y'
                                            ? item?.Rate
                                            : item?.MRP}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalRate && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.Rate}
                                        </td>
                                      )
                                      : Rate == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {' '}
                                          {item?.Rate}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalDiscount && (
                                        <td>{item.discount}</td>
                                      )
                                      : Discount == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.Type != 'C'
                                            ? item?.OfferAmt || 0
                                            : item?.OfferValue || 0}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalTax && (
                                        <td>{item.ProdTaxPercentage}</td>
                                      )
                                      : (Tax && table2Data?.OrderType !== 'E') && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.ProdTaxPercentage || 0}
                                        </td>
                                      )}
                                    {GlobaldummyData
                                      ? GlobalAmount && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.TotalAmt}
                                        </td>
                                      )
                                      : Amount == true && (
                                        <td style={{ textAlign: 'right' }}>
                                          {item?.Type != 'C'
                                            ? item?.TotalAmt -
                                            item?.OfferAmt || 0
                                            : item?.TotalAmt -
                                            item?.OfferValue || 0}
                                        </td>
                                      )}
                                  </tr>
                                ))}
                              </tbody>
                            </table>

                            {!FormatTheme &&
                              chunkIndex === paginatedChunks.length - 1 && (
                                <div
                                  className="page-footerA4Style11"
                                  style={{
                                    marginTop: 'auto',
                                    pageBreakBefore: 'avoid',
                                    pageBreakInside: 'avoid',
                                    minHeight: 'auto',
                                  }}
                                >
                                  <>
                                    <div className="PrintA4Style11-print-ThirdDiv">
                                      <div>
                                        <div
                                          style={{
                                            display: 'flex',
                                            gap: '1rem',
                                            justifyContent: 'right',
                                            margin: '0.5rem 0rem',
                                            paddingRight: '1rem',
                                          }}
                                        >
                                          <div
                                            style={{
                                              display: 'flex',
                                              flexDirection: 'column',
                                              gap: '0.5rem',
                                            }}
                                          >
                                            <div>ITEMS</div>
                                            <div>Qty</div>
                                            {TotalOfferAmount > 0 ||
                                              table2Data?.OverallDisc ? (
                                              <div>OFFER</div>
                                            ) : (
                                              ''
                                            )}
                                            {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>Amount</div> */}
                                          </div>
                                          <div
                                            style={{
                                              textAlign: 'right',
                                              display: 'flex',
                                              flexDirection: 'column',
                                              gap: '0.5rem',
                                            }}
                                          >
                                            <div>
                                              {GlobaldummyData
                                                ? '7'
                                                : totalQuantityFilter?.length}
                                            </div>
                                            <div>
                                              {GlobaldummyData
                                                ? '9'
                                                : totalQuantity}
                                            </div>
                                            {TotalOfferAmount > 0 ||
                                              table2Data?.OverallDisc ? (
                                              <div>
                                                {Number(
                                                  TotalOfferAmount +
                                                  table2Data?.OverallDisc
                                                ).toFixed(2)}
                                              </div>
                                            ) : (
                                              ''
                                            )}
                                            {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
                                          </div>
                                        </div>
                                        <div
                                          className="total-Amount"
                                          style={{
                                            fontSize: '25px',
                                            fontWeight: '600',
                                            padding: '10px',
                                            backgroundColor: '#fdc716',
                                            textAlign: 'center',
                                          }}
                                        >
                                          Amount :
                                          {GlobaldummyData
                                            ? '1066'
                                            : Number(
                                              table2Data?.NetAmount
                                            ).toFixed(2)}
                                        </div>
                                      </div>
                                    </div>
                                    {isEditedBill && lastTransaction && (
                                      <div style={{
                                        width: '100%', marginTop: '2px',
                                        paddingTop: '2px', display: 'flex', justifyContent: 'center', alignItems: 'flex-start',
                                        flexDirection: 'column', borderTop: '1px dashed #000'
                                      }}>
                                        <div
                                          style={{
                                            fontSize: '12px',
                                            width: '100%'
                                          }}
                                        >
                                          <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                                            <span style={{ color: '#000', fontWeight: 600, }}>Bill Gross Amount</span>
                                            <strong>{(lastTransaction?.BeforeAdjustment || 0).toFixed(2)}</strong>
                                          </div>
                                          <div
                                            style={{
                                              display: 'flex',
                                              justifyContent: 'space-between',
                                              fontWeight: 600,
                                              color:
                                                lastTransaction?.AdjustmentType === 'REFUND'
                                                  ? '#000'
                                                  : '#000',
                                            }}
                                          >
                                            <span>{'Adjustment Amount'}</span>
                                            <span>
                                              {lastTransaction?.AdjustmentType === 'REFUND' ? '-' : '+'}
                                              {Math.abs((lastTransaction?.BeforeAdjustment ?? 0) -
                                                (lastTransaction?.AfterAdjustment ?? 0)).toFixed(2)}
                                            </span>
                                          </div>
                                          <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '4px' }}>
                                            <span style={{ color: '#000', fontWeight: 600 }}>Net Bill Amount</span>
                                            <strong>{(lastTransaction?.AfterAdjustment || 0).toFixed(2)}</strong>
                                          </div>
                                        </div>
                                      </div>
                                    )}
                                    {GlobaldummyData
                                      ? GlobalCredit && (
                                        <div
                                          style={{
                                            textAlign: 'left',
                                            fontSize: '14px',
                                            fontWeight: '600',
                                            lineHeight: '12px',
                                          }}
                                        >
                                          <h6>Advance Amount:</h6>
                                          <h6>Opening Balance:</h6>
                                        </div>
                                      )
                                      : CreditDetails &&
                                      table2Data?.CustomerDetails?.length >
                                      0 && (
                                        <div
                                          style={{
                                            textAlign: 'left',
                                            fontSize: '12px',
                                            fontWeight: '600',
                                            lineHeight: '12px',
                                          }}
                                        >
                                          {/* OLD CREDIT BAL */}
                                          {PaymentStatusSuccess?.[0]
                                            ?.PaymentTypeName ===
                                            'Credit' && (
                                              <>
                                                {table2Data.CustomerDetails[0]
                                                  .OldCreditBal > 0 ? (
                                                  <p>
                                                    Advance Amount:
                                                    {
                                                      table2Data
                                                        .CustomerDetails[0]
                                                        .OldCreditBal
                                                    }
                                                  </p>
                                                ) : table2Data
                                                  .CustomerDetails[0]
                                                  .OldCreditBal < 0 ? (
                                                  <p>
                                                    {' '}
                                                    Opening Balance:{' '}
                                                    {Math.abs(
                                                      table2Data
                                                        .CustomerDetails[0]
                                                        .OldCreditBal
                                                    )}
                                                  </p>
                                                ) : null}
                                              </>
                                            )}

                                          {/* CURRENT CREDIT BAL */}
                                          {table2Data.CustomerDetails[0]
                                            .CurrentCreditBal > 0 ? (
                                            <p>
                                              {' '}
                                              Current Advance Amount:{' '}
                                              {
                                                table2Data.CustomerDetails[0]
                                                  .CurrentCreditBal
                                              }
                                            </p>
                                          ) : table2Data.CustomerDetails[0]
                                            .CurrentCreditBal < 0 ? (
                                            <p>
                                              {' '}
                                              Current Balance Amount:{' '}
                                              {Math.abs(
                                                table2Data.CustomerDetails[0]
                                                  .CurrentCreditBal
                                              )}
                                            </p>
                                          ) : null}
                                        </div>
                                      )}
                                    <hr className="PrintA4Style11-print-dottline" />

                                    {(table2Data?.OrderType !== "E") && OrderDetailGST?.length > 0 &&
                                      OrderDetailGST?.[0]?.TaxAmt > 0 && (
                                        <>
                                          <p style={{ margin: 0, padding: 0, fontSize: "12px", textAlign: "center" }}>
                                            --------- GST Breakup Details -----------</p>
                                          <table className="PrintA4Style11-print-table">
                                            <thead>
                                              <tr>
                                                <th style={{ width: '10px', textAlign: 'center' }}>GST Rate</th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  Taxable Amount
                                                </th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  CGST
                                                </th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  SGST
                                                </th>
                                                <th style={{ width: '10px', textAlign: 'right' }}>
                                                  Total
                                                </th>
                                              </tr>
                                            </thead>
                                            <tbody>
                                              {OrderDetailGST?.map((item) => (
                                                <tr>
                                                  <td style={{ textAlign: 'center' }}>
                                                    {item?.TaxPercentage}%{' '}
                                                  </td>
                                                  <td style={{ textAlign: 'right' }}>
                                                    {' '}
                                                    {Number(item.WithOutTaxAmount).toFixed(2)}{' '}
                                                  </td>
                                                  <td style={{ textAlign: 'right' }}>
                                                    {' '}
                                                    {Number(item.CGST).toFixed(2)}
                                                  </td>
                                                  <td
                                                    style={{ textAlign: 'right' }}
                                                  >
                                                    {' '}
                                                    {Number(item.SGST).toFixed(2)}
                                                  </td>
                                                  <td
                                                    style={{ textAlign: 'right' }}
                                                  >
                                                    {' '}
                                                    {Number(item.TotalAmt).toFixed(2)}
                                                  </td>
                                                </tr>
                                              ))}
                                            </tbody>
                                          </table>
                                        </>
                                      )}

                                    <div className="PrintA4Style11-print-ThirdDiv2">
                                      <div
                                        style={{
                                          display: 'flex',
                                          justifyContent: 'right',
                                          flexDirection: 'column',
                                        }}
                                      >
                                        <hr style={{ margin: '0.5rem 0rem' }} />
                                      </div>
                                    </div>

                                    <div
                                      style={{
                                        display: 'flex',
                                        justifyContent: 'space-between',
                                        alignItems: 'center',
                                      }}
                                    >
                                      <div
                                        style={{
                                          display: 'flex',
                                          alignItems: 'center',
                                          gap: '0.3rem',
                                        }}
                                      ></div>

                                      {GlobaldummyData
                                        ? GlobalQrcodet && (
                                          <div
                                            style={{
                                              display: 'flex',
                                              flexDirection: 'column',
                                              justifyContent: 'center',
                                              alignItems: 'center',
                                            }}
                                          >
                                            <QRCode
                                              value={`upi://pay?pa=${UpiId}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                                              size={80}
                                            />
                                            <div style={{ fontSize: '12px' }}>
                                              Scan to Pay{' '}
                                            </div>
                                            <div style={{ fontSize: '12px' }}>
                                              ₹
                                              {GlobaldummyData
                                                ? '1,066'
                                                : Number(
                                                  table2Data?.NetAmount
                                                ).toFixed(2)}
                                            </div>
                                          </div>
                                        )
                                        : Qrcodet &&
                                        paymentTypeUPI && (
                                          <div
                                            style={{
                                              display: 'flex',
                                              flexDirection: 'column',
                                              justifyContent: 'center',
                                              alignItems: 'center',
                                            }}
                                          >
                                            <QRCode
                                              value={`upi://pay?pa=${GlobalUpiID}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                                              size={80}
                                            />
                                            <div style={{ fontSize: '10px' }}>
                                              Scan to Pay{' '}
                                            </div>
                                            <div style={{ fontSize: '10px' }}>
                                              ₹
                                              {GlobaldummyData
                                                ? '1,066'
                                                : Number(
                                                  table2Data?.NetAmount
                                                ).toFixed(2)}
                                            </div>
                                          </div>
                                        )}
                                    </div>

                                    <div
                                      style={{
                                        margin: '0.5rem 0.5rem',
                                        display: 'flex',
                                        flexDirection: 'column',
                                        alignItems: 'flex-start',
                                        gap: '0.5rem',
                                        height: GlobalthemeFormatr
                                          ? '13vh'
                                          : '5vh',
                                      }}
                                    >
                                      {GlobaldummyData && GlobalCashierName && (
                                        <div className="PrintA4Style11-print-InfoDivsub">
                                          CASHIER : {CashierName}
                                        </div>
                                      )}
                                      {CashierName && CashierNameField && (
                                        <div className="PrintA4Style11-print-InfoDivsub">
                                          CASHIER : {CashierName}
                                        </div>
                                      )}
                                      <div
                                        className="PrintA4Style11-print-InfoDivsub"
                                        style={{ textTransform: 'capitalize' }}
                                      >
                                        {Date1}
                                      </div>
                                    </div>
                                  </>
                                  {sportsAppPreference && MembershipApplied && (
                                    <div
                                      style={{
                                        width: '100%',
                                        textAlign: 'center',
                                        paddingTop: '10px',
                                        fontSize: '13px',
                                      }}
                                    >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`}</div>
                                  )}

                                  {GlobaldummyData
                                    ? GlobalIsnotes && (
                                      <div>
                                        <p style={{ padding: '0rem 1rem' }}>
                                          Notes : 10 days Return policy
                                        </p>

                                        <hr className="PrintA4Style11-print-dottline" />
                                      </div>
                                    )
                                    : Notestext && (
                                      <div>
                                        <p
                                          style={{
                                            padding: '0rem 1rem',
                                            textAlign: 'center',
                                          }}
                                        >
                                          {Notestext}
                                        </p>

                                        <hr className="PrintA4Style11-print-dottline" />
                                      </div>
                                    )}

                                  <div
                                    style={{
                                      display: 'flex',
                                      width: '90%',
                                      padding: '0 1rem',
                                      justifyContent: GlobaltermsAndConditions
                                        ? 'space-between'
                                        : 'flex-end',
                                      alignItems: 'center',
                                    }}
                                  >
                                    {GlobaldummyData
                                      ? GlobaltermsAndConditions && (
                                        <div
                                          style={{
                                            margin: '8px 0',
                                            padding: '8px',
                                            fontFamily: 'sans-serif',
                                            width: '100%',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Terms & Conditions
                                          </p>
                                          <ol
                                            style={{
                                              fontSize: '12px',
                                              paddingLeft: '18px',
                                              margin: 0,
                                              lineHeight: '1',
                                            }}
                                          >
                                            <li>
                                              Once goods are sold, they are
                                              not exchangeable or refundable.
                                            </li>
                                            <li>
                                              Please check the product before
                                              leaving the counter.
                                            </li>
                                          </ol>
                                        </div>
                                      )
                                      : TermsnAdCondition == true &&
                                      TermsAndConditions?.length > 0 && (
                                        <div
                                          style={{
                                            margin: '8px 0',
                                            fontFamily: 'sans-serif',
                                            width: '100%',
                                            display: 'flex',
                                            flexDirection: 'column',
                                            alignItems: 'flex-start',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Terms & Conditions
                                          </p>
                                          <ol
                                            style={{
                                              fontSize: '12px',
                                              paddingLeft: '18px',
                                              margin: 0,
                                              lineHeight: '1',
                                            }}
                                          >
                                            {TermsAndConditions?.map(
                                              (item) => (
                                                <li
                                                  style={{
                                                    textAlign: 'start',
                                                  }}
                                                >
                                                  {item?.TermsandConditions}
                                                </li>
                                              )
                                            )}
                                            {/* <li>Please check the product before leaving the counter.</li> */}
                                          </ol>
                                        </div>
                                      )}

                                    {GlobaldummyData
                                      ? GlobalSignature && (
                                        <div
                                          style={{
                                            display: 'flex',
                                            flexDirection: 'column',
                                            alignItems: 'flex-end',
                                            paddingBottom: '1rem',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Signature
                                          </p>
                                          <img
                                            style={{
                                              width: '70px',
                                              height: '40px',
                                            }}
                                            src={
                                              GlobalSignatureImages
                                                ? GlobalSignatureImages
                                                : signature
                                            }
                                            alt=""
                                          />
                                        </div>
                                      )
                                      : Signature == true && (
                                        <div
                                          style={{
                                            display: 'flex',
                                            flexDirection: 'column',
                                            alignItems: 'center',
                                            marginTop: '1rem',
                                            paddingBottom: '1rem',
                                          }}
                                        >
                                          <p
                                            style={{
                                              fontSize: '13px',
                                              fontWeight: 'bold',
                                              marginBottom: '6px',
                                            }}
                                          >
                                            Signature
                                          </p>
                                          <img
                                            style={{
                                              width: '100px',
                                              height: '60px',
                                            }}
                                            src={SignatureImg}
                                            alt=""
                                          />
                                        </div>
                                      )}
                                  </div>
                                </div>
                              )}
                          </div>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </>
              )}
            </div>

            {(PaymentStatusSuccess?.length > 1 && !isEditedBill) && (
              <>
                {/* <p>Split Payment:</p> */}
                {Object.keys(aggregatedPayments).map((paymentType) => (
                  <div
                    key={paymentType}
                    style={{ margin: 0, padding: 0, fontSize: '12px' }}
                  >
                    {paymentType}: {aggregatedPayments[paymentType].toFixed(2)}
                  </div>
                ))}
              </>
            )}

            {chunkIndex === paginatedChunks.length - 1 &&
              !shouldFooterBeOnNewPage &&
              FormatTheme && (
                <div
                  className="page-footerA4Style11"
                  style={{
                    marginTop: 'auto',
                    pageBreakBefore: 'avoid',
                    pageBreakInside: 'avoid',
                    minHeight: 'auto',
                  }}
                >
                  <>
                    <div className="PrintA4Style11-print-ThirdDiv">
                      <div>
                        <div
                          style={{
                            display: 'flex',
                            gap: '1rem',
                            justifyContent: 'right',
                            margin: '0.5rem 0rem',
                            paddingRight: '1rem',
                          }}
                        >
                          <div
                            style={{
                              display: 'flex',
                              flexDirection: 'column',
                              gap: '0.5rem',
                            }}
                          >
                            <div>ITEMS</div>
                            <div>Qty</div>
                            {TotalOfferAmount > 0 || table2Data?.OverallDisc ? (
                              <div>OFFER</div>
                            ) : (
                              ''
                            )}
                            {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>Amount</div> */}
                          </div>
                          <div
                            style={{
                              textAlign: 'right',
                              display: 'flex',
                              flexDirection: 'column',
                              gap: '0.5rem',
                            }}
                          >
                            <div>
                              {GlobaldummyData
                                ? '7'
                                : totalQuantityFilter?.length}
                            </div>
                            <div>{GlobaldummyData ? '9' : totalQuantity}</div>
                            {TotalOfferAmount > 0 || table2Data?.OverallDisc ? (
                              <div>
                                {Number(
                                  TotalOfferAmount + table2Data?.OverallDisc
                                ).toFixed(2)}
                              </div>
                            ) : (
                              ''
                            )}
                            {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
                          </div>
                        </div>
                        <div
                          className="total-Amount"
                          style={{
                            fontSize: '25px',
                            fontWeight: '600',
                            padding: '10px',
                            backgroundColor: '#fdc716',
                            textAlign: 'center',
                          }}
                        >
                          Amount :
                          {GlobaldummyData
                            ? '1066'
                            : Number(table2Data?.NetAmount).toFixed(2)}
                        </div>
                      </div>
                    </div>
                    {isEditedBill && lastTransaction && (
                      <div style={{
                        width: '100%', marginTop: '2px',
                        paddingTop: '2px', display: 'flex', justifyContent: 'center', alignItems: 'flex-start',
                        flexDirection: 'column', borderTop: '1px dashed #000'
                      }}>
                        <div
                          style={{
                            fontSize: '12px',
                            width: '100%'
                          }}
                        >
                          <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                            <span style={{ color: '#000', fontWeight: 600, }}>Bill Gross Amount</span>
                            <strong>{(lastTransaction?.BeforeAdjustment || 0).toFixed(2)}</strong>
                          </div>
                          <div
                            style={{
                              display: 'flex',
                              justifyContent: 'space-between',
                              fontWeight: 600,
                              color:
                                lastTransaction?.AdjustmentType === 'REFUND'
                                  ? '#000'
                                  : '#000',
                            }}
                          >
                            <span>{'Adjustment Amount'}</span>
                            <span>
                              {lastTransaction?.AdjustmentType === 'REFUND' ? '-' : '+'}
                              {Math.abs((lastTransaction?.BeforeAdjustment ?? 0) -
                                (lastTransaction?.AfterAdjustment ?? 0)).toFixed(2)}
                            </span>
                          </div>
                          <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '4px' }}>
                            <span style={{ color: '#000', fontWeight: 600 }}>Net Bill Amount</span>
                            <strong>{(lastTransaction?.AfterAdjustment || 0).toFixed(2)}</strong>
                          </div>
                        </div>
                      </div>
                    )}
                    {isEditedBill && lastTransaction && (
                      <div style={{
                        width: '100%', marginTop: '2px',
                        paddingTop: '2px', display: 'flex', justifyContent: 'center', alignItems: 'flex-start',
                        flexDirection: 'column', borderTop: '1px dashed #000'
                      }}>
                        <div
                          style={{
                            fontSize: '12px',
                            width: '100%'
                          }}
                        >
                          <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                            <span style={{ color: '#000', fontWeight: 600, }}>Bill Gross Amount</span>
                            <strong>{(lastTransaction?.BeforeAdjustment || 0).toFixed(2)}</strong>
                          </div>
                          <div
                            style={{
                              display: 'flex',
                              justifyContent: 'space-between',
                              fontWeight: 600,
                              color:
                                lastTransaction?.AdjustmentType === 'REFUND'
                                  ? '#000'
                                  : '#000',
                            }}
                          >
                            <span>{'Adjustment Amount'}</span>
                            <span>
                              {lastTransaction?.AdjustmentType === 'REFUND' ? '-' : '+'}
                              {Math.abs((lastTransaction?.BeforeAdjustment ?? 0) -
                                (lastTransaction?.AfterAdjustment ?? 0)).toFixed(2)}
                            </span>
                          </div>
                          <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '4px' }}>
                            <span style={{ color: '#000', fontWeight: 600 }}>Net Bill Amount</span>
                            <strong>{(lastTransaction?.AfterAdjustment || 0).toFixed(2)}</strong>
                          </div>
                        </div>
                      </div>
                    )}
                    {GlobaldummyData
                      ? GlobalCredit && (
                        <div
                          style={{
                            textAlign: 'left',
                            fontSize: '14px',
                            fontWeight: '600',
                            lineHeight: '12px',
                          }}
                        >
                          <h6>Advance Amount:</h6>
                          <h6>Opening Balance:</h6>
                        </div>
                      )
                      : CreditDetails &&
                      table2Data?.CustomerDetails?.length > 0 && (
                        <div
                          style={{
                            textAlign: 'left',
                            fontSize: '12px',
                            fontWeight: '600',
                            lineHeight: '12px',
                          }}
                        >
                          {/* OLD CREDIT BAL */}
                          {PaymentStatusSuccess?.[0]?.PaymentTypeName ===
                            'Credit' && (
                              <>
                                {table2Data.CustomerDetails[0].OldCreditBal >
                                  0 ? (
                                  <p>
                                    Advance Amount:
                                    {table2Data.CustomerDetails[0].OldCreditBal}
                                  </p>
                                ) : table2Data.CustomerDetails[0].OldCreditBal <
                                  0 ? (
                                  <p>
                                    {' '}
                                    Opening Balance:{' '}
                                    {Math.abs(
                                      table2Data.CustomerDetails[0].OldCreditBal
                                    )}
                                  </p>
                                ) : null}
                              </>
                            )}

                          {/* CURRENT CREDIT BAL */}
                          {table2Data.CustomerDetails[0].CurrentCreditBal >
                            0 ? (
                            <p>
                              {' '}
                              Current Advance Amount:{' '}
                              {table2Data.CustomerDetails[0].CurrentCreditBal}
                            </p>
                          ) : table2Data.CustomerDetails[0].CurrentCreditBal <
                            0 ? (
                            <p>
                              {' '}
                              Current Balance Amount:{' '}
                              {Math.abs(
                                table2Data.CustomerDetails[0].CurrentCreditBal
                              )}
                            </p>
                          ) : null}
                        </div>
                      )}
                    <hr className="PrintA4Style11-print-dottline" />

                    {(table2Data?.OrderType !== "E") && OrderDetailGST?.length > 0 &&
                      OrderDetailGST?.[0]?.TaxAmt > 0 && (
                        <>
                          <p style={{ margin: 0, padding: 0, fontSize: "12px", textAlign: "center" }}>
                            --------- GST Breakup Details -----------</p>
                          <table className="PrintA4Style11-print-table">
                            <thead>
                              <tr>
                                <th style={{ width: '10px', textAlign: 'center' }}>GST Rate</th>
                                <th style={{ width: '10px', textAlign: 'right' }}>
                                  Taxable Amount
                                </th>
                                <th style={{ width: '10px', textAlign: 'right' }}>
                                  CGST
                                </th>
                                <th style={{ width: '10px', textAlign: 'right' }}>
                                  SGST
                                </th>
                                <th style={{ width: '10px', textAlign: 'right' }}>
                                  Total
                                </th>
                              </tr>
                            </thead>
                            <tbody>
                              {OrderDetailGST?.map((item) => (
                                <tr>
                                  <td style={{ textAlign: 'center' }}>
                                    {item?.TaxPercentage}%{' '}
                                  </td>
                                  <td style={{ textAlign: 'right' }}>
                                    {' '}
                                    {Number(item.WithOutTaxAmount).toFixed(2)}{' '}
                                  </td>
                                  <td style={{ textAlign: 'right' }}>
                                    {' '}
                                    {Number(item.CGST).toFixed(2)}
                                  </td>
                                  <td
                                    style={{ textAlign: 'right' }}
                                  >
                                    {' '}
                                    {Number(item.SGST).toFixed(2)}
                                  </td>
                                  <td
                                    style={{ textAlign: 'right' }}
                                  >
                                    {' '}
                                    {Number(item.TotalAmt).toFixed(2)}
                                  </td>
                                </tr>
                              ))}
                            </tbody>
                          </table>
                        </>
                      )}

                    <div className="PrintA4Style11-print-ThirdDiv2">
                      <div
                        style={{
                          display: 'flex',
                          justifyContent: 'right',
                          flexDirection: 'column',
                        }}
                      >
                        <hr style={{ margin: '0.5rem 0rem' }} />
                      </div>
                    </div>

                    <div
                      style={{
                        display: 'flex',
                        justifyContent: 'space-between',
                        alignItems: 'center',
                      }}
                    >
                      <div
                        style={{
                          display: 'flex',
                          alignItems: 'center',
                          gap: '0.3rem',
                        }}
                      ></div>

                      {GlobaldummyData
                        ? GlobalQrcodet && (
                          <div
                            style={{
                              display: 'flex',
                              flexDirection: 'column',
                              justifyContent: 'center',
                              alignItems: 'center',
                            }}
                          >
                            <QRCode
                              value={`upi://pay?pa=${UpiId}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                              size={80}
                            />
                            <div style={{ fontSize: '12px' }}>
                              Scan to Pay{' '}
                            </div>
                            <div style={{ fontSize: '12px' }}>
                              ₹
                              {GlobaldummyData
                                ? '1,066'
                                : Number(table2Data?.NetAmount).toFixed(2)}
                            </div>
                          </div>
                        )
                        : Qrcodet &&
                        paymentTypeUPI && (
                          <div
                            style={{
                              display: 'flex',
                              flexDirection: 'column',
                              justifyContent: 'center',
                              alignItems: 'center',
                            }}
                          >
                            <QRCode
                              value={`upi://pay?pa=${GlobalUpiID}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                              size={80}
                            />
                            <div style={{ fontSize: '10px' }}>
                              Scan to Pay{' '}
                            </div>
                            <div style={{ fontSize: '10px' }}>
                              ₹
                              {GlobaldummyData
                                ? '1,066'
                                : Number(table2Data?.NetAmount).toFixed(2)}
                            </div>
                          </div>
                        )}
                    </div>

                    <div
                      style={{
                        margin: '0.5rem 0.5rem',
                        display: 'flex',
                        flexDirection: 'column',
                        alignItems: 'flex-start',
                        gap: '0.5rem',
                        height: GlobalthemeFormatr ? '13vh' : '5vh',
                      }}
                    >
                      {GlobaldummyData && GlobalCashierName && (
                        <div className="PrintA4Style11-print-InfoDivsub">
                          CASHIER : {CashierName}
                        </div>
                      )}
                      {CashierName && CashierNameField && (
                        <div className="PrintA4Style11-print-InfoDivsub">
                          CASHIER : {CashierName}
                        </div>
                      )}
                      <div
                        className="PrintA4Style11-print-InfoDivsub"
                        style={{ textTransform: 'capitalize' }}
                      >
                        {Date1}
                      </div>
                    </div>
                  </>
                  {sportsAppPreference && MembershipApplied && (
                    <div
                      style={{
                        width: '100%',
                        textAlign: 'center',
                        paddingTop: '10px',
                        fontSize: '13px',
                      }}
                    >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`}</div>
                  )}

                  {GlobaldummyData
                    ? GlobalIsnotes && (
                      <div>
                        <p style={{ padding: '0rem 1rem' }}>
                          Notes : 10 days Return policy
                        </p>

                        <hr className="PrintA4Style11-print-dottline" />
                      </div>
                    )
                    : Notestext && (
                      <div>
                        <p
                          style={{
                            padding: '0rem 1rem',
                            textAlign: 'center',
                          }}
                        >
                          {Notestext}
                        </p>

                        <hr className="PrintA4Style11-print-dottline" />
                      </div>
                    )}

                  <div
                    style={{
                      display: 'flex',
                      width: '90%',
                      padding: '0 1rem',
                      justifyContent: GlobaltermsAndConditions
                        ? 'space-between'
                        : 'flex-end',
                      alignItems: 'center',
                    }}
                  >
                    {GlobaldummyData
                      ? GlobaltermsAndConditions && (
                        <div
                          style={{
                            margin: '8px 0',
                            padding: '8px',
                            fontFamily: 'sans-serif',
                            width: '100%',
                          }}
                        >
                          <p
                            style={{
                              fontSize: '13px',
                              fontWeight: 'bold',
                              marginBottom: '6px',
                            }}
                          >
                            Terms & Conditions
                          </p>
                          <ol
                            style={{
                              fontSize: '12px',
                              paddingLeft: '18px',
                              margin: 0,
                              lineHeight: '1',
                            }}
                          >
                            <li>
                              Once goods are sold, they are not exchangeable
                              or refundable.
                            </li>
                            <li>
                              Please check the product before leaving the
                              counter.
                            </li>
                          </ol>
                        </div>
                      )
                      : TermsnAdCondition == true &&
                      TermsAndConditions?.length > 0 && (
                        <div
                          style={{
                            margin: '8px 0',
                            fontFamily: 'sans-serif',
                            width: '100%',
                            display: 'flex',
                            flexDirection: 'column',
                            alignItems: 'flex-start',
                          }}
                        >
                          <p
                            style={{
                              fontSize: '13px',
                              fontWeight: 'bold',
                              marginBottom: '6px',
                            }}
                          >
                            Terms & Conditions
                          </p>
                          <ol
                            style={{
                              fontSize: '12px',
                              paddingLeft: '18px',
                              margin: 0,
                              lineHeight: '1',
                            }}
                          >
                            {TermsAndConditions?.map((item) => (
                              <li style={{ textAlign: 'start' }}>
                                {item?.TermsandConditions}
                              </li>
                            ))}
                            {/* <li>Please check the product before leaving the counter.</li> */}
                          </ol>
                        </div>
                      )}

                    {GlobaldummyData
                      ? GlobalSignature && (
                        <div
                          style={{
                            display: 'flex',
                            flexDirection: 'column',
                            alignItems: 'flex-end',
                            paddingBottom: '1rem',
                          }}
                        >
                          <p
                            style={{
                              fontSize: '13px',
                              fontWeight: 'bold',
                              marginBottom: '6px',
                            }}
                          >
                            Signature
                          </p>
                          <img
                            style={{ width: '70px', height: '40px' }}
                            src={
                              GlobalSignatureImages
                                ? GlobalSignatureImages
                                : signature
                            }
                            alt=""
                          />
                        </div>
                      )
                      : Signature == true && (
                        <div
                          style={{
                            display: 'flex',
                            flexDirection: 'column',
                            alignItems: 'center',
                            marginTop: '1rem',
                            paddingBottom: '1rem',
                          }}
                        >
                          <p
                            style={{
                              fontSize: '13px',
                              fontWeight: 'bold',
                              marginBottom: '6px',
                            }}
                          >
                            Signature
                          </p>
                          <img
                            style={{ width: '100px', height: '60px' }}
                            src={SignatureImg}
                            alt=""
                          />
                        </div>
                      )}
                  </div>
                </div>
              )}
          </div>
        ))}

        {shouldFooterBeOnNewPage && FormatTheme && (
          <div
            className="print-page"
            style={{
              display: 'flex',
              flexDirection: 'column',
              minHeight: '297mm',
              justifyContent: 'flex-end',
              pageBreakBefore: 'always',
            }}
          >
            <div
              className="page-footerA4Style11"
              style={{
                marginTop: 'auto',
                pageBreakBefore: 'avoid',
                pageBreakInside: 'avoid',
                minHeight: 'auto',
              }}
            >
              <>
                <div className="PrintA4Style11-print-ThirdDiv">
                  <div>
                    <div
                      style={{
                        display: 'flex',
                        gap: '1rem',
                        justifyContent: 'right',
                        margin: '0.5rem 0rem',
                        paddingRight: '1rem',
                      }}
                    >
                      <div
                        style={{
                          display: 'flex',
                          flexDirection: 'column',
                          gap: '0.5rem',
                        }}
                      >
                        <div>ITEMS</div>
                        <div>Qty</div>
                        {TotalOfferAmount > 0 || table2Data?.OverallDisc ? (
                          <div>OFFER</div>
                        ) : (
                          ''
                        )}
                        {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>Amount</div> */}
                      </div>
                      <div
                        style={{
                          textAlign: 'right',
                          display: 'flex',
                          flexDirection: 'column',
                          gap: '0.5rem',
                        }}
                      >
                        <div>
                          {GlobaldummyData ? '7' : totalQuantityFilter?.length}
                        </div>
                        <div>{GlobaldummyData ? '9' : totalQuantity}</div>
                        {TotalOfferAmount > 0 || table2Data?.OverallDisc ? (
                          <div>
                            {Number(
                              TotalOfferAmount + table2Data?.OverallDisc
                            ).toFixed(2)}
                          </div>
                        ) : (
                          ''
                        )}
                        {/* <div className='total-Amount' style={{ fontSize: "15px", fontWeight: "600" }}>{GlobaldummyData ? "1066" : Number(table2Data?.NetAmount).toFixed(2)}</div> */}
                      </div>
                    </div>
                    <div
                      className="total-Amount"
                      style={{
                        fontSize: '25px',
                        fontWeight: '600',
                        padding: '10px',
                        backgroundColor: '#fdc716',
                        textAlign: 'center',
                      }}
                    >
                      Amount :
                      {GlobaldummyData
                        ? '1066'
                        : Number(table2Data?.NetAmount).toFixed(2)}
                    </div>
                  </div>
                </div>
                {isEditedBill && lastTransaction && (
                  <div style={{
                    width: '100%', marginTop: '2px',
                    paddingTop: '2px', display: 'flex', justifyContent: 'center', alignItems: 'flex-start',
                    flexDirection: 'column', borderTop: '1px dashed #000'
                  }}>
                    <div
                      style={{
                        fontSize: '12px',
                        width: '100%'
                      }}
                    >
                      <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                        <span style={{ color: '#000', fontWeight: 600, }}>Bill Gross Amount</span>
                        <strong>{(lastTransaction?.BeforeAdjustment || 0).toFixed(2)}</strong>
                      </div>
                      <div
                        style={{
                          display: 'flex',
                          justifyContent: 'space-between',
                          fontWeight: 600,
                          color:
                            lastTransaction?.AdjustmentType === 'REFUND'
                              ? '#000'
                              : '#000',
                        }}
                      >
                        <span>{'Adjustment Amount'}</span>
                        <span>
                          {lastTransaction?.AdjustmentType === 'REFUND' ? '-' : '+'}
                          {Math.abs((lastTransaction?.BeforeAdjustment ?? 0) -
                            (lastTransaction?.AfterAdjustment ?? 0)).toFixed(2)}
                        </span>
                      </div>
                      <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '4px' }}>
                        <span style={{ color: '#000', fontWeight: 600 }}>Net Bill Amount</span>
                        <strong>{(lastTransaction?.AfterAdjustment || 0).toFixed(2)}</strong>
                      </div>
                    </div>
                  </div>
                )}
                {isEditedBill && lastTransaction && (
                  <div style={{
                    width: '100%', marginTop: '2px',
                    paddingTop: '2px', display: 'flex', justifyContent: 'center', alignItems: 'flex-start',
                    flexDirection: 'column', borderTop: '1px dashed #000'
                  }}>
                    <div
                      style={{
                        fontSize: '12px',
                        width: '100%'
                      }}
                    >
                      <div style={{ display: 'flex', justifyContent: 'space-between' }}>
                        <span style={{ color: '#000', fontWeight: 600, }}>Bill Gross Amount</span>
                        <strong>{(lastTransaction?.BeforeAdjustment || 0).toFixed(2)}</strong>
                      </div>
                      <div
                        style={{
                          display: 'flex',
                          justifyContent: 'space-between',
                          fontWeight: 600,
                          color:
                            lastTransaction?.AdjustmentType === 'REFUND'
                              ? '#000'
                              : '#000',
                        }}
                      >
                        <span>{'Adjustment Amount'}</span>
                        <span>
                          {lastTransaction?.AdjustmentType === 'REFUND' ? '-' : '+'}
                          {Math.abs((lastTransaction?.BeforeAdjustment ?? 0) -
                            (lastTransaction?.AfterAdjustment ?? 0)).toFixed(2)}
                        </span>
                      </div>
                      <div style={{ display: 'flex', justifyContent: 'space-between', marginTop: '4px' }}>
                        <span style={{ color: '#000', fontWeight: 600 }}>Net Bill Amount</span>
                        <strong>{(lastTransaction?.AfterAdjustment || 0).toFixed(2)}</strong>
                      </div>
                    </div>
                  </div>
                )}
                {GlobaldummyData
                  ? GlobalCredit && (
                    <div
                      style={{
                        textAlign: 'left',
                        fontSize: '14px',
                        fontWeight: '600',
                        lineHeight: '12px',
                      }}
                    >
                      <h6>Advance Amount:</h6>
                      <h6>Opening Balance:</h6>
                    </div>
                  )
                  : CreditDetails &&
                  table2Data?.CustomerDetails?.length > 0 && (
                    <div
                      style={{
                        textAlign: 'left',
                        fontSize: '12px',
                        fontWeight: '600',
                        lineHeight: '12px',
                      }}
                    >
                      {/* OLD CREDIT BAL */}
                      {PaymentStatusSuccess?.[0]?.PaymentTypeName ===
                        'Credit' && (
                          <>
                            {table2Data.CustomerDetails[0].OldCreditBal > 0 ? (
                              <p>
                                Advance Amount:
                                {table2Data.CustomerDetails[0].OldCreditBal}
                              </p>
                            ) : table2Data.CustomerDetails[0].OldCreditBal <
                              0 ? (
                              <p>
                                {' '}
                                Opening Balance:{' '}
                                {Math.abs(
                                  table2Data.CustomerDetails[0].OldCreditBal
                                )}
                              </p>
                            ) : null}
                          </>
                        )}

                      {/* CURRENT CREDIT BAL */}
                      {table2Data.CustomerDetails[0].CurrentCreditBal > 0 ? (
                        <p>
                          {' '}
                          Current Advance Amount:{' '}
                          {table2Data.CustomerDetails[0].CurrentCreditBal}
                        </p>
                      ) : table2Data.CustomerDetails[0].CurrentCreditBal <
                        0 ? (
                        <p>
                          {' '}
                          Current Balance Amount:{' '}
                          {Math.abs(
                            table2Data.CustomerDetails[0].CurrentCreditBal
                          )}
                        </p>
                      ) : null}
                    </div>
                  )}
                <hr className="PrintA4Style11-print-dottline" />

                {(table2Data?.OrderType !== "E") && OrderDetailGST?.length > 0 &&
                  OrderDetailGST?.[0]?.TaxAmt > 0 && (
                    <>
                      <p style={{ margin: 0, padding: 0, fontSize: "12px", textAlign: "center" }}>
                        --------- GST Breakup Details -----------</p>
                      <table className="PrintA4Style11-print-table">
                        <thead>
                          <tr>
                            <th style={{ width: '10px', textAlign: 'center' }}>GST Rate</th>
                            <th style={{ width: '10px', textAlign: 'right' }}>
                              Taxable Amount
                            </th>
                            <th style={{ width: '10px', textAlign: 'right' }}>
                              CGST
                            </th>
                            <th style={{ width: '10px', textAlign: 'right' }}>
                              SGST
                            </th>
                            <th style={{ width: '10px', textAlign: 'right' }}>
                              Total
                            </th>
                          </tr>
                        </thead>
                        <tbody>
                          {OrderDetailGST?.map((item) => (
                            <tr>
                              <td style={{ textAlign: 'center' }}>
                                {item?.TaxPercentage}%{' '}
                              </td>
                              <td style={{ textAlign: 'right' }}>
                                {' '}
                                {Number(item.WithOutTaxAmount).toFixed(2)}{' '}
                              </td>
                              <td style={{ textAlign: 'right' }}>
                                {' '}
                                {Number(item.CGST).toFixed(2)}
                              </td>
                              <td
                                style={{ textAlign: 'right' }}
                              >
                                {' '}
                                {Number(item.SGST).toFixed(2)}
                              </td>
                              <td
                                style={{ textAlign: 'right' }}
                              >
                                {' '}
                                {Number(item.TotalAmt).toFixed(2)}
                              </td>
                            </tr>
                          ))}
                        </tbody>
                      </table>
                    </>
                  )}

                <div className="PrintA4Style11-print-ThirdDiv2">
                  <div
                    style={{
                      display: 'flex',
                      justifyContent: 'right',
                      flexDirection: 'column',
                    }}
                  >
                    <hr style={{ margin: '0.5rem 0rem' }} />
                  </div>
                </div>

                <div
                  style={{
                    display: 'flex',
                    justifyContent: 'space-between',
                    alignItems: 'center',
                  }}
                >
                  <div
                    style={{
                      display: 'flex',
                      alignItems: 'center',
                      gap: '0.3rem',
                    }}
                  ></div>

                  {GlobaldummyData
                    ? GlobalQrcodet && (
                      <div
                        style={{
                          display: 'flex',
                          flexDirection: 'column',
                          justifyContent: 'center',
                          alignItems: 'center',
                        }}
                      >
                        <QRCode
                          value={`upi://pay?pa=${UpiId}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                          size={80}
                        />
                        <div style={{ fontSize: '12px' }}>Scan to Pay </div>
                        <div style={{ fontSize: '12px' }}>
                          ₹
                          {GlobaldummyData
                            ? '1,066'
                            : Number(table2Data?.NetAmount).toFixed(2)}
                        </div>
                      </div>
                    )
                    : Qrcodet &&
                    paymentTypeUPI && (
                      <div
                        style={{
                          display: 'flex',
                          flexDirection: 'column',
                          justifyContent: 'center',
                          alignItems: 'center',
                        }}
                      >
                        <QRCode
                          value={`upi://pay?pa=${GlobalUpiID}&pn=Merchant&am=${table2Data?.NetAmount}&cu=INR`}
                          size={80}
                        />
                        <div style={{ fontSize: '10px' }}>Scan to Pay </div>
                        <div style={{ fontSize: '10px' }}>
                          ₹
                          {GlobaldummyData
                            ? '1,066'
                            : Number(table2Data?.NetAmount).toFixed(2)}
                        </div>
                      </div>
                    )}
                </div>

                <div
                  style={{
                    margin: '0.5rem 0.5rem',
                    display: 'flex',
                    flexDirection: 'column',
                    alignItems: 'flex-start',
                    gap: '0.5rem',
                    height: GlobalthemeFormatr ? '13vh' : '5vh',
                  }}
                >
                  {GlobaldummyData && GlobalCashierName && (
                    <div className="PrintA4Style11-print-InfoDivsub">
                      CASHIER : {CashierName}
                    </div>
                  )}
                  {CashierName && CashierNameField && (
                    <div className="PrintA4Style11-print-InfoDivsub">
                      CASHIER : {CashierName}
                    </div>
                  )}
                  <div
                    className="PrintA4Style11-print-InfoDivsub"
                    style={{ textTransform: 'capitalize' }}
                  >
                    {Date1}
                  </div>
                </div>
              </>
              {sportsAppPreference && MembershipApplied && (
                <div
                  style={{
                    width: '100%',
                    textAlign: 'center',
                    paddingTop: '10px',
                    fontSize: '13px',
                  }}
                >{`*** Membership ${table2Data?.NetAmount === 0 ? 'Free Hours' : 'Discount'} Utilized - ${MembershipApplied?.Detail?.[0]?.MembershipName} ***`}</div>
              )}

              {GlobaldummyData
                ? GlobalIsnotes && (
                  <div>
                    <p style={{ padding: '0rem 1rem' }}>
                      Notes : 10 days Return policy
                    </p>

                    <hr className="PrintA4Style11-print-dottline" />
                  </div>
                )
                : Notestext && (
                  <div>
                    <p style={{ padding: '0rem 1rem', textAlign: 'center' }}>
                      {Notestext}
                    </p>

                    <hr className="PrintA4Style11-print-dottline" />
                  </div>
                )}

              <div
                style={{
                  display: 'flex',
                  width: '90%',
                  padding: '0 1rem',
                  justifyContent: GlobaltermsAndConditions
                    ? 'space-between'
                    : 'flex-end',
                  alignItems: 'center',
                }}
              >
                {GlobaldummyData
                  ? GlobaltermsAndConditions && (
                    <div
                      style={{
                        margin: '8px 0',
                        padding: '8px',
                        fontFamily: 'sans-serif',
                        width: '100%',
                      }}
                    >
                      <p
                        style={{
                          fontSize: '13px',
                          fontWeight: 'bold',
                          marginBottom: '6px',
                        }}
                      >
                        Terms & Conditions
                      </p>
                      <ol
                        style={{
                          fontSize: '12px',
                          paddingLeft: '18px',
                          margin: 0,
                          lineHeight: '1',
                        }}
                      >
                        <li>
                          Once goods are sold, they are not exchangeable or
                          refundable.
                        </li>
                        <li>
                          Please check the product before leaving the counter.
                        </li>
                      </ol>
                    </div>
                  )
                  : TermsnAdCondition == true &&
                  TermsAndConditions?.length > 0 && (
                    <div
                      style={{
                        margin: '8px 0',
                        fontFamily: 'sans-serif',
                        width: '100%',
                        display: 'flex',
                        flexDirection: 'column',
                        alignItems: 'flex-start',
                      }}
                    >
                      <p
                        style={{
                          fontSize: '13px',
                          fontWeight: 'bold',
                          marginBottom: '6px',
                        }}
                      >
                        Terms & Conditions
                      </p>
                      <ol
                        style={{
                          fontSize: '12px',
                          paddingLeft: '18px',
                          margin: 0,
                          lineHeight: '1',
                        }}
                      >
                        {TermsAndConditions?.map((item) => (
                          <li style={{ textAlign: 'start' }}>
                            {item?.TermsandConditions}
                          </li>
                        ))}
                        {/* <li>Please check the product before leaving the counter.</li> */}
                      </ol>
                    </div>
                  )}

                {GlobaldummyData
                  ? GlobalSignature && (
                    <div
                      style={{
                        display: 'flex',
                        flexDirection: 'column',
                        alignItems: 'flex-end',
                        paddingBottom: '1rem',
                      }}
                    >
                      <p
                        style={{
                          fontSize: '13px',
                          fontWeight: 'bold',
                          marginBottom: '6px',
                        }}
                      >
                        Signature
                      </p>
                      <img
                        style={{ width: '70px', height: '40px' }}
                        src={
                          GlobalSignatureImages
                            ? GlobalSignatureImages
                            : signature
                        }
                        alt=""
                      />
                    </div>
                  )
                  : Signature == true && (
                    <div
                      style={{
                        display: 'flex',
                        flexDirection: 'column',
                        alignItems: 'center',
                        marginTop: '1rem',
                        paddingBottom: '1rem',
                      }}
                    >
                      <p
                        style={{
                          fontSize: '13px',
                          fontWeight: 'bold',
                          marginBottom: '6px',
                        }}
                      >
                        Signature
                      </p>
                      <img
                        style={{ width: '100px', height: '60px' }}
                        src={SignatureImg}
                        alt=""
                      />
                    </div>
                  )}
              </div>
            </div>
          </div>
        )}
      </div>
    </div>
  );
};

export default PrintA5Style11;