<?php $options = get_option( 'kaveh_frame' ); 
function kaveh_get_payment_status_text($status_slug) {
    $statuses = [
        'pending'    => esc_html__('Pending Payment', 'kavehTheme'),
        'processing' => esc_html__('Processing', 'kavehTheme'),
        'on-hold'    => esc_html__('On Hold', 'kavehTheme'),
        'completed'  => esc_html__('Completed', 'kavehTheme'),
        'cancelled'  => esc_html__('Cancelled', 'kavehTheme'),
        'refunded'   => esc_html__('Refunded', 'kavehTheme'),
        'failed'     => esc_html__('Failed', 'kavehTheme'),
    ];

    return $statuses[$status_slug] ?? esc_html__('Unknown', 'kavehTheme');
}
?>
<html lang="fa" dir="rtl">
            <head>
                <meta charset="UTF-8">
                <meta name="viewport" content="width=device-width, initial-scale=1.0">
                <title><?php esc_html_e('Invoice', 'kavehTheme'); ?></title>
                <?php wp_head(  ); ?>
                <style>

                .kav__factor {
                    margin: 0 auto;
                    width: 100%;
                    padding: 30px 29px 15px;
                }
                .kav__factor__heading {
                    margin-bottom: 34px;
                }
                .kav__factor__heading .line {
                    margin: 0 17px 0 14px;
                    width: 1px;
                    height: 14px;
                    background-color: rgba(0, 0, 0, 0.3);
                }
                .kav__factor__heading .title {
                    font-size: 10px;
                    line-height: 16px;
                    font-weight: 700;
                    color: #040414;
                }
                .kav__factor__heading .qr-code {
                    margin: 0 auto 0 14px;
                }
                .kav__factor__heading .date {
                    font-size: 8px;
                    line-height: 12px;
                    font-weight: 400;
                    color: #040414;
                    margin-bottom: 2px;
                }
                .kav__factor__heading .number__serial {
                    font-size: 8px;
                    line-height: 12px;
                    font-weight: 700;
                    color: #040414;
                }
                .kav__factor__title {
                    min-width: 75px;
                    background-color: #000;
                    color: #fff;
                    border-radius: 20px;
                    padding: 4px 12px;
                    font-size: 7px;
                    line-height: 12px;
                    font-weight: 600;
                    max-width: -moz-fit-content;
                    max-width: fit-content;
                    margin: 0 auto 14px;
                    text-align: center;
                    position: relative;
                }
                .kav__factor__title::after {
                    content: "";
                    position: absolute;
                    top: 100%;
                    left: 50%;
                    transform: translate(-50%, -0.26px);
                    background-color: inherit;
                    width: 45px;
                    height: 6px;
                    -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDUiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDQ1IDYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxtYXNrIGlkPSJtYXNrMF8xMDI3XzE3IiBzdHlsZT0ibWFzay10eXBlOmFscGhhIiBtYXNrVW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4PSIwIiB5PSIwIiB3aWR0aD0iNDUiIGhlaWdodD0iNiI+CjxyZWN0IHdpZHRoPSI0NSIgaGVpZ2h0PSI2IiBmaWxsPSIjRDlEOUQ5IiBzdHlsZT0iZmlsbDojRDlEOUQ5O2ZpbGw6Y29sb3IoZGlzcGxheS1wMyAwLjg1MTAgMC44NTEwIDAuODUxMCk7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvbWFzaz4KPGcgbWFzaz0idXJsKCNtYXNrMF8xMDI3XzE3KSI+CjxwYXRoIGQ9Ik0tMTUgLTkuODczNjhDLTE1IC0xNS40NjYzIC0xMC40NjYzIC0yMCAtNC44NzM2OSAtMjBINDkuODczN0M1NS40NjYzIC0yMCA2MCAtMTUuNDY2MyA2MCAtOS44NzM2OFYtOS44NzM2OEM2MCAtNC4yODEwOCA1NS40NjYzIDAuMjUyNjMxIDQ5Ljg3MzcgMC4yNTI2MzFINDEuMjVINDAuOTU0MUMzNS4xODQ3IDAuMjUyNjMxIDMwLjA3ODEgMy42ODE1MSAyNC42MzY1IDUuNTk4NThDMjMuOTIyNyA1Ljg1MDA0IDIzLjIwMjUgNiAyMi41IDZDMjEuNzk3NSA2IDIxLjA3NzMgNS44NTAwNCAyMC4zNjM1IDUuNTk4NThDMTQuOTIxOSAzLjY4MTUxIDkuODE1MzIgMC4yNTI2MzEgNC4wNDU5MSAwLjI1MjYzMUgzLjc1SC00Ljg3MzY5Qy0xMC40NjYzIDAuMjUyNjMxIC0xNSAtNC4yODEwOCAtMTUgLTkuODczNjhWLTkuODczNjhaIiBmaWxsPSJibGFjayIgc3R5bGU9ImZpbGw6YmxhY2s7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvZz4KPC9zdmc+Cg==) center center/cover;
                            mask: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDUiIGhlaWdodD0iNiIgdmlld0JveD0iMCAwIDQ1IDYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxtYXNrIGlkPSJtYXNrMF8xMDI3XzE3IiBzdHlsZT0ibWFzay10eXBlOmFscGhhIiBtYXNrVW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4PSIwIiB5PSIwIiB3aWR0aD0iNDUiIGhlaWdodD0iNiI+CjxyZWN0IHdpZHRoPSI0NSIgaGVpZ2h0PSI2IiBmaWxsPSIjRDlEOUQ5IiBzdHlsZT0iZmlsbDojRDlEOUQ5O2ZpbGw6Y29sb3IoZGlzcGxheS1wMyAwLjg1MTAgMC44NTEwIDAuODUxMCk7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvbWFzaz4KPGcgbWFzaz0idXJsKCNtYXNrMF8xMDI3XzE3KSI+CjxwYXRoIGQ9Ik0tMTUgLTkuODczNjhDLTE1IC0xNS40NjYzIC0xMC40NjYzIC0yMCAtNC44NzM2OSAtMjBINDkuODczN0M1NS40NjYzIC0yMCA2MCAtMTUuNDY2MyA2MCAtOS44NzM2OFYtOS44NzM2OEM2MCAtNC4yODEwOCA1NS40NjYzIDAuMjUyNjMxIDQ5Ljg3MzcgMC4yNTI2MzFINDEuMjVINDAuOTU0MUMzNS4xODQ3IDAuMjUyNjMxIDMwLjA3ODEgMy42ODE1MSAyNC42MzY1IDUuNTk4NThDMjMuOTIyNyA1Ljg1MDA0IDIzLjIwMjUgNiAyMi41IDZDMjEuNzk3NSA2IDIxLjA3NzMgNS44NTAwNCAyMC4zNjM1IDUuNTk4NThDMTQuOTIxOSAzLjY4MTUxIDkuODE1MzIgMC4yNTI2MzEgNC4wNDU5MSAwLjI1MjYzMUgzLjc1SC00Ljg3MzY5Qy0xMC40NjYzIDAuMjUyNjMxIC0xNSAtNC4yODEwOCAtMTUgLTkuODczNjhWLTkuODczNjhaIiBmaWxsPSJibGFjayIgc3R5bGU9ImZpbGw6YmxhY2s7ZmlsbC1vcGFjaXR5OjE7Ii8+CjwvZz4KPC9zdmc+Cg==) center center/cover;
                    -webkit-mask-repeat: no-repeat;
                            mask-repeat: no-repeat;
                }
                .kav__factor__info {
                    border-radius: 10px;
                    background-color: #f3f6f4;
                    padding: 12px 15px 18px;
                    gap: 12px 4px;
                    flex-wrap: wrap;
                    margin-bottom: 7px;
                }
                .kav__factor__info li {
                    max-width: calc(33.333333% - 3px);
                }
                .kav__factor__info li:nth-child(n+4) {
                    max-width: calc(25% - 3px);
                }
                .kav__factor__info li, .kav__factor__info__address__phone__item {
                    font-size: 8px;
                    line-height: 12px;
                    font-weight: 600;
                    color: #040414;
                    width: 100%;
                    flex: 0 0 auto;
                }
                .kav__factor__info li::before, .kav__factor__info__address__phone__item::before {
                    content: "";
                    width: 9px;
                    height: 3px;
                    background-color: #00935e;
                    border-radius: 5px;
                    margin-left: 5px;
                    display: inline-block;
                    vertical-align: middle;
                }
                .kav__factor__info li span, .kav__factor__info__address__phone__item span {
                    font-size: 7px;
                    word-break: break-all;
                    margin-right: 2px;
                }
                .kav__factor__info__address__phone {
                    border-radius: 10px;
                    border: 1px solid rgba(0, 0, 0, 0.1);
                    padding: 13px 15px;
                    margin-bottom: 11px;
                }
                .kav__factor__info__address__phone__item {
                    max-width: 70%;
                }
                .kav__factor__info__address__phone__item:nth-child(2) {
                    max-width: 30%;
                }
                .kav__factor .kav__table {
                    border-spacing: 0 7px;
                }
                .kav__factor .kav__table thead tr th {
                    vertical-align: bottom;
                    padding: 0 4px;
                }
                .kav__factor .kav__table thead tr th:first-child {
                    padding-right: 4px;
                }
                .kav__factor .kav__table thead tr th span {
                    font-size: 7px;
                    line-height: 11px;
                    font-weight: 800;
                    color: #040414;
                    padding-bottom: 6px;
                    max-width: -moz-fit-content;
                    max-width: fit-content;
                    margin: 0 auto 8px;
                }
                .kav__factor .kav__table thead tr th span::after {
                    width: 80%;
                    height: 2px;
                    border-radius: 5px;
                }
                .kav__factor .kav__table tbody tr td {
                    font-size: 11px;
                    line-height: 16px;
                    font-weight: 600;
                    color: #000;
                    padding: 10px 4px;
                    border: solid rgba(0, 0, 0, 0.1);
                    border-width: 1px 0;
                    position: relative;
                }
                .kav__factor .kav__table tbody tr td:not(:last-child)::after {
                    content: "";
                    position: absolute;
                    top: 50%;
                    left: 0;
                    width: 1px;
                    height: 17px;
                    background-color: rgba(0, 0, 0, 0.09);
                    transform: translateY(-50%);
                }
                .kav__factor .kav__table tbody tr td:first-child {
                    border-right-width: 1px;
                    border-radius: 0 10px 10px 0;
                }
                .kav__factor .kav__table tbody tr td:last-child {
                    border-left-width: 1px;
                    border-radius: 10px 0 0 10px;
                }
                .kav__factor .kav__table tbody tr td:nth-child(3), .kav__factor .kav__table tbody tr td:nth-child(5) {
                    font-size: 8px;
                    line-height: 12px;
                }
                .kav__factor .kav__table tbody tr td:nth-child(n+6) {
                    font-weight: 800;
                    font-size: 7px;
                    line-height: 12px;
                }
                .kav__factor__count-price {
                    margin: 20px 0 17px;
                }
                .kav__factor__count-products .icon {
                    width: 29px;
                    height: 29px;
                    border: 1px solid #E9E9F1;
                    margin-left: 8px;
                }
                .kav__factor__count-products .title {
                    font-size: 10px;
                    line-height: 18px;
                    font-weight: 700;
                    color: #212529;
                    margin-left: 6px;
                }
                .kav__factor__count-products .count {
                    font-size: 9px;
                    line-height: 14px;
                    font-weight: 400;
                    color: #A4A8BA;
                }
                .kav__factor__price {
                    font-size: 9px;
                    line-height: 14px;
                    font-weight: 600;
                    color: #000;
                }
                .kav__factor__price > div {
                    font-size: 10px;
                    line-height: 16px;
                    color: #00CB8E;
                    font-weight: 900;
                }
                .kav__factor__description {
                    border-radius: 10px;
                    border: 1px solid rgba(0, 0, 0, 0.1);
                    padding: 13px 15px;
                    font-size: 8px;
                    line-height: 12px;
                    font-weight: 600;
                    color: #040414;
                }
                .kav__factor__description .text::before {
                    content: "";
                    display: inline-block;
                    vertical-align: middle;
                    width: 9px;
                    height: 3px;
                    border-radius: 5px;
                    background-color: #00935E;
                    margin-left: 5px;
                }
                .kav__factor__description .text span {
                    margin-right: 2px;
                }
                .kav__factor__seal-signature {
                    margin: 12px -10.5px 0;
                }
                .kav__factor__seal-signature__item {
                    padding: 0 10.5px;
                    width: 100%;
                    max-width: 50%;
                    flex: 0 0 auto;
                }
                .kav__factor__seal-signature__box {
                    border-radius: 10px;
                    background-color: #F3F6F4;
                    min-height: 83px;
                    padding: 16px 18px;
                }
                .kav__factor__seal-signature__box .content {
                    font-size: 8px;
                    line-height: 12px;
                    font-weight: 600;
                    color: #040414;
                }
                .kav__factor__seal-signature__box .content::before {
                    content: "";
                    width: 9px;
                    height: 3px;
                    border-radius: 5px;
                    background-color: #00935E;
                    margin-left: 5px;
                    display: inline-block;
                    vertical-align: middle;
                }
                .kav__factor__seal-signature__item:nth-child(2) .kav__factor__seal-signature__box {
                    background-color: transparent;
                    border: 1px solid rgba(0, 0, 0, 0.1);
                }
                .kav__factor__info li, .kav__factor__info__address__phone__item {
                    font-size: 9px;
                    line-height: 14px;
                }
                .kav__factor__info li span, .kav__factor__info__address__phone__item span {
                    font-size: 9px;
                    word-break: break-all;
                    margin-right: 2px;
                }
                .kav__factor .woocommerce-Price-amount.amount{
                font-size: 10px;
                line-height: 16px;
                font-weight: 300;
                color: #000 !important;
                }
                .kav__factor span.woocommerce-Price-currencySymbol {
                    font-size: 11px;
                    line-height: 15px;
                }
                .kav__factor__seal-signature__box{
                height: 120px;
                }
                .kav__factor__info li, .kav__factor__info__address__phone__item {
            font-weight: 600 !important;
            }

    @font-face {
        font-family: 'YekanBakh';
        src: url('<?php echo KAVEH_TEMPLATE_URI; ?>/assets/fonts/yekanbakh/woff/YekanBakhFaNum-VF.woff') format('woff-variations'),
        /* will be the standard and works in Safari now */
        url('<?php echo KAVEH_TEMPLATE_URI; ?>/assets/fonts/yekanbakh/woff2/YekanBakhFaNum-VF.woff2') format('woff');
        /* for the other supporting browsers */
        font-display: fallback;
    }
                body, span ,button, label, div, form, input, .price span, ul , li , td, tr, th, table, li>span , th > span , .kav__factor__heading .date , .kav__factor__heading .number__serial,.kav__factor__info li span, .kav__factor__info__address__phone__item span, .payment_status{
    font-family: 'YekanBakh' !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
}

.kav__factor__title::after {
display: none;
}
.kav__factor .woocommerce-Price-amount.amount{
    font-family: 'YekanBakh' !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}
.kav__factor {

max-width: 700px;
}

* * span.woocommerce-Price-currencySymbol {
    font-family: 'YekanBakh' !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}
.kav__factor .kav__table tbody tr td:not(:last-child)::after {
    width: 0;
}
.download-invoice-btn {
    padding: 7px 25px;
    position: fixed;
    bottom: 10px;
    right: 25px;
    background-color: #368640;
    border:1px solid #368640;
    color: #fff;
    border-radius: 15px;
}
.download-invoice-btn:hover {
    background-color: #fff;
    color: #368640;
}
.download-invoice-btn:hover .loader {
    border: 2px solid #368640;

}
.loader {
    display: inline-block;
    width: 12px;
    height: 12px;
    border: 2px solid white;
    border-radius: 50%;
    border-top: 2px solid transparent;
    animation: spin 0.8s linear infinite;
    margin-right: 5px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


.download-invoice-img-btn{
    padding: 7px 25px;
    position: fixed;
    bottom: 60px;
    right: 25px;
    background-color:rgb(234, 49, 86);
    border:1px solid rgb(234, 49, 86);
    color: #fff;
    border-radius: 15px;
}
.download-invoice-img-btn:hover {
    background-color: #fff;
    color: rgb(234, 49, 86);
}
.download-invoice-img-btn:hover .loader {
    border: 2px solid rgb(234, 49, 86);

}

.kav__factor__heading .payment_status {
	font-size: 8px;
	line-height: 12px;
	font-weight: 700;
	color: #040414;
  }
.cart-sliding{
    display: none !important;
}
#kaveh-loader {
  position: fixed;
  z-index: 99999;
  background-color: #fff;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

#kaveh-loader .spinner {
  border: 6px solid #f3f3f3;
  border-top: 6px solid rgb(234, 49, 86);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  animation: spinLoader 1s linear infinite;
}

@keyframes spinLoader {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

            </style>
            </head>
       
    <body >
     <div class="app">
        <div class="kav__factor" id="invoice-container">
            <!-- Start Heading -->
            <div class="kav__factor__heading kav__flex kav__items-center">
                <!-- Start Logo -->
                <div class="logo">
                    <img src="<?php echo $options['kaveh_logo_up']; ?>" alt="logo" width="75" height="28">
                </div>
                <!-- End Logo -->
                <div class="line"></div>
                <div class="title"><?php esc_html_e('Sales Invoice for Goods and Services', 'kavehTheme'); ?></div>
                <div class="qr-code">
                </div>
                <div>
                    <div class="date">
                        <?php esc_html_e('Order Date:', 'kavehTheme'); ?>

                        <span><?php echo date( 'Y/m/d', strtotime( $this->get_order()->get_date_created() ) ) ; ?></span>

                    </div>
                    <div class="number__serial">
                        <?php esc_html_e('Order Number:', 'kavehTheme'); ?>
                        <span><?php echo esc_attr( $this->get_order()->get_order_number() ); ?></span>
                    </div>
                    <div class="payment_status">
                         <?php esc_html_e('Payment Status:', 'kavehTheme'); ?>
                        <span>
                        <?php echo kaveh_get_payment_status_text( $this->get_order()->get_status() ); ?>
                        </span>
                    </div>
                </div>
            </div>
            <!-- End Heading -->
            <!-- Start Info Seller -->
            <div class="kav__factor__title"><?php esc_html_e('Seller', 'kavehTheme'); ?></div>
            <ul class="kav__factor__info kav__flex kav__items-start">
                <li>
                    <?php esc_html_e('Store Name:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_name']; ?></span>
                </li>
                <li>
                    <?php esc_html_e('Economic Number:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_economic_code']; ?></span>
                </li>
                <li>
                    <?php esc_html_e('Registration Number / National ID:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_registration_number']; ?></span>
                </li>
                <li>
                    <?php esc_html_e('Province:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_province']; ?></span>
                </li>
                <li>
                    <?php esc_html_e('City:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_city']; ?></span>
                </li>
                <li>
                    <?php esc_html_e('10-Digit Postal Code:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_postal_code']; ?></span>
                </li>
            </ul>
            <div class="kav__factor__info__address__phone kav__flex kav__items-start kav__gap-8">
                <div class="kav__factor__info__address__phone__item">
                    <?php esc_html_e('Address:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_address']; ?></span>
                </div>
                <div class="kav__factor__info__address__phone__item">
                    <?php esc_html_e('Phone Number:', 'kavehTheme'); ?>
                    <span><?php echo $options['kaveh_seller_phone']; ?></span>
                </div>
            </div>
            <!-- End Info Seller -->
            <!-- Start Info Buyer -->
            <div class="kav__factor__title"><?php esc_html_e('Buyer Information', 'kavehTheme'); ?></div>
            <ul class="kav__factor__info kav__flex kav__items-start">
                <li>
                    <?php esc_html_e('Individual Name:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_billing_first_name() . ' ' . $this->get_order()->get_billing_last_name() ); ?></span>
                </li>
                <li>
                    <?php esc_html_e('Economic Number:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_meta('billing_registration_number') ?: '-' ); ?></span>
                </li>
                <li>
                    <?php esc_html_e('Registration Number / National ID:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_meta('billing_registration_number') ?: '-' ); ?></span>
                </li>
                <li>
                    <?php esc_html_e('Province:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_billing_state() ?: '-' ); ?></span>
                </li>
                <li>
                    <?php esc_html_e('County:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_billing_city() ?: '-' ); ?></span>
                </li>
                <li>
                    <?php esc_html_e('10-Digit Postal Code:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_billing_postcode() ?: '-' ); ?></span>
                </li>
                <li>
                    <?php esc_html_e('City:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_billing_city() ?: '-' ); ?></span>
                </li>
            </ul>

            <div class="kav__factor__info__address__phone kav__flex kav__items-start kav__gap-8">
                <div class="kav__factor__info__address__phone__item">
                    <?php esc_html_e('Address:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( trim( $this->get_order()->get_billing_address_1() . ' ' . $this->get_order()->get_billing_address_2() ) ?: '-' ); ?></span>
                </div>
                <div class="kav__factor__info__address__phone__item">
                    <?php esc_html_e('Phone Number:', 'kavehTheme'); ?>
                    <span><?php echo esc_attr( $this->get_order()->get_billing_phone() ?: '-' ); ?></span>
                </div>
            </div>

            <!-- End Info Buyer -->
            <!-- Start Products -->
            <table class="kav__table">
                <thead>
                    <tr>
                        <th><span><?php esc_html_e('Row', 'kavehTheme'); ?></span></th>
                        <th><span><?php esc_html_e('Product Code', 'kavehTheme'); ?></span></th>
                        <th><span><?php esc_html_e('Product Description', 'kavehTheme'); ?></span></th>
                        <th><span><?php esc_html_e('Quantity Amount', 'kavehTheme'); ?></span></th>
                        <th><span><?php esc_html_e('Discount Amount', 'kavehTheme'); ?></span></th>
                        <th><span><?php esc_html_e('Amount After Discount', 'kavehTheme'); ?></span></th>
                        <th><span><?php esc_html_e('Total Tax & Fees', 'kavehTheme'); ?></span></th>
                        <th><span><?php esc_html_e('Total Amount', 'kavehTheme'); ?></span></th>
                    </tr>
                </thead>
                <tbody>
                    <?php
                    $total_tax = 0;
                    $row_number = 1;
                    foreach ( $this->get_order()->get_items() as $item_id => $item ) :
                        $product = $item->get_product();
                        $tax = $item->get_total_tax();
                        $total_tax += $tax;
                        ?>
                        <tr>
                            <td><?php echo  $row_number++ ; ?></td>
                            <td><?php echo  $product ? ($product->get_sku() ?: '-') : '-' ; ?></td>
                            <td><?php echo  $item->get_name() ; ?></td>
                            <td><?php echo  $item->get_quantity() ; ?></td>
                            <td><?php echo  wc_price( $item->get_subtotal() - $item->get_total() ) ; ?></td>
                            <td><?php echo  wc_price( $item->get_total() ) ; ?></td>
                            <td><?php echo  wc_price( $tax ) ; ?></td>
                            <td><?php echo  wc_price( $item->get_total() + $tax ) ; ?></td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
            <!-- End Products -->
            <div class="kav__factor__count-price kav__flex kav__items-center kav__justify-between kav__gap-8">
                <!-- Start Count Products -->
                <div class="kav__factor__count-products kav__flex kav__items-center">
                    <div class="icon kav__flex kav__items-center kav__justify-center kav__rounded-circle">
                        <svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" fill="none" viewBox="0 0 11 11">
                            <path stroke="#00A693" stroke-linecap="round" stroke-linejoin="round" d="M1.38 5.142V7.2c0 2.058.824 2.883 2.882 2.883h2.47c2.059 0 2.884-.825 2.884-2.883V5.142"/>
                            <path stroke="#00A693" stroke-linecap="round" stroke-linejoin="round" d="M5.5 7.792c-.765 0-1.146.38-1.146 1.146v1.145h2.292V8.938c0-.766-.38-1.146-1.146-1.146Z"/>
                            <path stroke="#292D32" stroke-linecap="round" stroke-linejoin="round" d="M5.5 5.5c.839 0 1.458-.683 1.375-1.522L6.573.917h-2.14l-.308 3.061A1.359 1.359 0 0 0 5.5 5.5Z"/>
                            <path stroke="#292D32" stroke-linecap="round" stroke-linejoin="round" d="M8.392 5.5c.926 0 1.605-.752 1.513-1.673l-.128-1.26C9.612 1.375 9.153.917 7.952.917H6.555l.32 3.213c.078.756.761 1.37 1.517 1.37Zm-5.807 0c.756 0 1.44-.614 1.513-1.37l.1-1.013.22-2.2H3.022c-1.201 0-1.66.458-1.825 1.65l-.123 1.26A1.49 1.49 0 0 0 2.585 5.5Z"/>
                        </svg>
                    </div>
                    <div class="title"><?php esc_html_e('Package', 'kavehTheme'); ?></div>
                    <div class="count"><?php echo $this->get_order()->get_item_count() ; ?> <?php esc_html_e('Products', 'kavehTheme'); ?></div>
                </div>
                <!-- End Count Products -->
                <!-- Start Price -->
                <div class="kav__factor__price kav__flex kav__items-center">
                    <?php esc_html_e('Total Amount:', 'kavehTheme'); ?>
                    <div>
                        <span><?php echo wc_price( $this->get_order()->get_total() ) ; ?></span>
                    </div>
                </div>
                <!-- End Price -->
            </div>
            <!-- End Description -->
            <div class="kav__factor__description">
                <div class="text">
                    <?php esc_html_e('Description:', 'kavehTheme'); ?>
                    <span><?php echo $this->get_order()->get_customer_note() ?: '-' ; ?></span>
                </div>
            </div>
            <!-- End Description -->
            <!-- Start Seal And Signature -->
            <div class="kav__factor__seal-signature kav__flex">
                <div class="kav__factor__seal-signature__item">
                    <div class="kav__factor__seal-signature__box">
                        <div class="content">
                            <?php esc_html_e('Seller Seal and Signature:', 'kavehTheme'); ?>
                            <img src="<?php echo $options['kaveh_seller_stamp']; ?>" class="d-block mt-2" alt="" width="90" height="90">
                        </div>
                    </div>
                </div>
                <div class="kav__factor__seal-signature__item">
                    <div class="kav__factor__seal-signature__box">
                        <div class="content">
                            <?php esc_html_e('Buyer Seal and Signature:', 'kavehTheme'); ?>
                        </div>
                    </div>
                </div>
            </div>
            <!-- End Seal And Signature -->
        </div>
    </div>
    <?php $nonce = wp_create_nonce('kaveh_download_invoice'); ?>
    <button id="download-image-btn" class="download-invoice-img-btn" data-order-id="<?php echo esc_attr($this->get_order()->get_id()); ?>">
    <span class="btn-text"><?php esc_html_e('Download Invoice Image', 'kavehTheme'); ?></span>
    <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M7.50005 1.04999C7.74858 1.04999 7.95005 1.25146 7.95005 1.49999V8.41359L10.1819 6.18179C10.3576 6.00605 10.6425 6.00605 10.8182 6.18179C10.994 6.35753 10.994 6.64245 10.8182 6.81819L7.81825 9.81819C7.64251 9.99392 7.35759 9.99392 7.18185 9.81819L4.18185 6.81819C4.00611 6.64245 4.00611 6.35753 4.18185 6.18179C4.35759 6.00605 4.64251 6.00605 4.81825 6.18179L7.05005 8.41359V1.49999C7.05005 1.25146 7.25152 1.04999 7.50005 1.04999ZM2.5 10C2.77614 10 3 10.2239 3 10.5V12C3 12.5539 3.44565 13 3.99635 13H11.0012C11.5529 13 12 12.5528 12 12V10.5C12 10.2239 12.2239 10 12.5 10C12.7761 10 13 10.2239 13 10.5V12C13 13.1041 12.1062 14 11.0012 14H3.99635C2.89019 14 2 13.103 2 12V10.5C2 10.2239 2.22386 10 2.5 10Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
			</svg>
</button>

    <button id="download-pdf-btn" class="download-invoice-btn button button-primary no-print" data-order-id="<?php echo esc_attr($this->get_order()->get_id()); ?>" data-nonce="<?php echo esc_attr($nonce); ?>">
    <span class="btn-text"><?php esc_html_e('Download PDF', 'kavehTheme'); ?></span>

    <svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M7.50005 1.04999C7.74858 1.04999 7.95005 1.25146 7.95005 1.49999V8.41359L10.1819 6.18179C10.3576 6.00605 10.6425 6.00605 10.8182 6.18179C10.994 6.35753 10.994 6.64245 10.8182 6.81819L7.81825 9.81819C7.64251 9.99392 7.35759 9.99392 7.18185 9.81819L4.18185 6.81819C4.00611 6.64245 4.00611 6.35753 4.18185 6.18179C4.35759 6.00605 4.64251 6.00605 4.81825 6.18179L7.05005 8.41359V1.49999C7.05005 1.25146 7.25152 1.04999 7.50005 1.04999ZM2.5 10C2.77614 10 3 10.2239 3 10.5V12C3 12.5539 3.44565 13 3.99635 13H11.0012C11.5529 13 12 12.5528 12 12V10.5C12 10.2239 12.2239 10 12.5 10C12.7761 10 13 10.2239 13 10.5V12C13 13.1041 12.1062 14 11.0012 14H3.99635C2.89019 14 2 13.103 2 12V10.5C2 10.2239 2.22386 10 2.5 10Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path>
			</svg>
</button>
<div id="kaveh-loader">
  <div class="spinner"></div>
</div>
<script>
  document.addEventListener("DOMContentLoaded", function () {
    setTimeout(function () {
      const loader = document.getElementById("kaveh-loader");
      if (loader) {
        loader.style.opacity = "0";
        loader.style.visibility = "hidden";
        setTimeout(() => loader.remove(), 500); // Remove after complete fade out
      }
    }, 3000); // 3 seconds
  });
</script>


<?php wp_footer(); ?>

   </body>
 
</html>