{config_load file="$language/lang_$language.conf" section="account_history_info"}
{config_load file="$language/lang_$language.conf" section="print_order"} {config_load file="$language/lang_$language.conf" section="product_info"}
<style>
.nav-pills {
    display:none;
}

@media(min-width:768px) {
    .nav-pills {
        display: flex;
    }
    .tab-pane .border {
        display:none;
    }  
    .tab-pane .collapse{
        display:block;
    }
}

@media(max-width:767px){
    .tab-content > .tab-pane {
        display: block !important;
        opacity: 1;
    }
}
</style>
<div class="uberuns boxes pb-5">
	<div class="container bg-light border border-secondary border-2 p-3 rounded-3 shadow ">
	<h1 class="ico ico-5">{* #heading_history_info# *}Order information</h1>
<div class="mh">
	<div class="row mb-5">
		<div class="col-12 col-lg"><div class=" border-primary border-2 rounded border p-3 h-100 bg-white">
			<h3>Order details</h3>
			<table class=" table">
				<!--<tr>
					<td><b>{#status#}</b></td>
					<td><span class="badge text-bg-secondary"> {if $ORDER_STATUS}{$ORDER_STATUS}{else}Bestellung eingegangen{/if}</span></td>
				</tr>-->
				<tr>
					<td class="main"><b>{* #text_oid# *}Order number</b></td>
					<td class="main">{$ORDER_NUMBER}</td>
				</tr>
				{if $csID}
				<tr>
					<td class="main"><b>{#csID#}</b></td>
					<td class="main">{$csID}</td>
				</tr>
				{/if}
				<tr>
					<td class="main"><b>{* #text_date# *}Order date</b></td>
					<td class="main">{$ORDER_DATE}</td>
				</tr>
				{if $DATE_SHIPPING}
				<tr>
					<td class="main"><b>{* #text_date_shipping# *}Service date</b></td>
					<td class="main">{$DATE_SHIPPING}</td>
				</tr>
				{/if}
				{if $PAYMENT_METHOD}
				<tr>
					<td class="main"><b>{* #payment# *}Method of payment</b></td>
					<td class="main">{$PAYMENT_METHOD|replace:"Vorkasse":"Prepayment"}</td>
				</tr>
				{/if}
				{if $SHIPPING_METHOD}
				<tr>
					<td class="main"><b>{* #text_shipping_method# *}Shipping method</b></td>
					<td class="main">{$SHIPPING_METHOD|replace:"Versand (nach":"Shipping (to "}</td>
				</tr>
				{/if}
			
			</table>
		</div></div>
		<div class="col-12 col-lg"><div class=" border-primary border-2 rounded border p-3 h-100  bg-white">
		<h3>Our bank details</h3>
		{if $EBAY_SELLER_DATA}
		{$EBAY_SELLER_DATA.bank}
		{else}
		{$BANK_WRAP}
		{/if}
		</div></div>
		{if $EBAY_ID}
		<div class="col-12 col-lg"><div class=" border-primary border-2 rounded border p-3 h-100  bg-white">
			<h3>Ebay Details</h3>
			<table class="table">
				<tr>
					<td class="main" valign="top"><b>{#by_order_of#}</b></td>
					<td class="main">
						<b>{$EBAY_SELLER_DATA.user},{$EBAY_SELLER_DATA.store_name}</b><br /> {$EBAY_SELLER_DATA.store_name_wrap}
						{if $EBAY_SELLER_DATA.vat_id != ''}<br /><b>UST-ID:</b> {$EBAY_SELLER_DATA.vat_id}{/if}
					</td>
				</tr>
					<td class="main"><b>{#text_date#}</b></td>
					<td class="main">{$ORDER_DATE}</td>
				</tr>
			</table>
		</div></div>
		{/if}
	</div>


<!-- HTML part -->
<!-- nav/tab links -->
<ul class="nav nav-pills nav-fill" id="tab" role="tablist">
	<li class="nav-item border mx-1 rounded bg-white">
	  <a class="nav-link active" href="#pane-A" id="tab-A" data-bs-toggle="tab" role="tab">{* #text_products# *}Ordered articles</a>
	</li>
	<li class="nav-item border mx-1 rounded bg-white">
	  <a class="nav-link" href="#pane-B" id="tab-B" data-bs-toggle="tab" role="tab">{* #text_shipping_address# *}Shipping address</a>
	</li>
	<li class="nav-item border mx-1 rounded bg-white">
	  <a class="nav-link" href="#pane-C" id="tab-C" data-bs-toggle="tab" role="tab">{* #text_payment_address# *}Billing address</a>
	</li>
  </ul>
  <!-- nav/tab links ends -->
  
  <!-- nav/tab -->
  <div id="content" class="tab-content" role="tablist">
	<div id="pane-A" class="tab-pane fade show active" role="tabpanel" aria-labelledby="tab-A">
	  <div class="border rounded p-2" role="tab" id="heading-A">
		<h5 class="mb-0">
		  <a data-bs-toggle="collapse" href="#collapse-A" class="text-white bg-primary text-decoration-none d-block p-1" aria-expanded="true" aria-controls="collapse-A">
			{#text_products#|replace:':':''}
		  </a>
		</h5>
	  </div>
	  <div id="collapse-A" class="collapse show" data-bs-parent="#content" role="tabpanel"
		aria-labelledby="heading-A">
		<div class="card-body bg-white p-3">
			<table class="table table-responsive">
			<thead>
				<tr>
					<td >{#head_position#}</td>
					
					<td>{* #pos_units# *}pcs.</td>
					<td>Quantity</td>
					<td>{* #head_products# *}Product</td>
					<td class="table_right">{* #head_single_price# *}Unit price</td>
					<td class="table_right">{* #pos_price# *}Total price</td>
				</tr>

				</thead>
				<tbody>
				{foreach name=aussen item=module_data from=$PRODUCTS_ARRAY key=module_id}
				<tr>
					<td><span class=" badge bg-primary">{$module_id+1}</span></td>
					{$module_data.img}
					<td class="main" align="center"  >{$module_data.qty}</td>
					<td class="main" align="left" >
						 <a href="{$module_data.PRODUCTS_DETAILS_LINK}">{$module_data.name}</a> 
						{if $module_data.properties.0}
						<br>{#text_properties#}:<br>
						{foreach from=$module_data.properties item=property}
						{$property.property_title}: {$property.property_value}<br />
						{/foreach}
						{/if}
					</td>
					<td class="table_right">{$module_data.price|string_format:"%.2f"} EUR</td>
					<td class="table_right">{$module_data.final_price|string_format:"%.2f"} EUR</td>

				</tr>
				{/foreach}
				</tbody>
			</table>
			<div class="user_order_total">{$TOTAL_BLOCK|replace:"Zwischensumme, netto":"Subtotal, net"|replace:"Versand (nach DE)":"Shipping (to DE)"|replace:"Summe, brutto":"Total, gross"|replace:"zzgl. USt.":"plus VAT."|replace:"USt.":"VAT"|replace:"Rabatt Kupons":"Discount coupon"}</div>
		</div>
	  </div>
	</div>
  
	<div id="pane-B" class="tab-pane fade" role="tabpanel" aria-labelledby="tab-B">
	  <div class="border rounded p-2" role="tab" id="heading-B">
		<h5 class="mb-0">
		  <a class="collapsed text-white bg-primary d-block text-decoration-none p-1" data-bs-toggle="collapse" href="#collapse-B" aria-expanded="false"
			aria-controls="collapse-B">
			{#text_shipping_address#|replace:':':''}
		  </a>
		</h5>
	  </div>
	  <div id="collapse-B" class="collapse" data-bs-parent="#content" role="tabpanel"
		aria-labelledby="heading-B">
		<div class="card-body  bg-white p-3">
			{$DELIVERY_LABEL}
		</div>
	  </div>
	</div>
  
	<div id="pane-C" class="tab-pane fade" role="tabpanel" aria-labelledby="tab-C">
	  <div class="border rounded p-2" role="tab" id="heading-C">
		<h5 class="mb-0">
		  <a class="collapsed text-white bg-primary d-block text-decoration-none p-1" data-bs-toggle="collapse" href="#collapse-C" aria-expanded="false"
			aria-controls="collapse-C">
			{#text_payment_address#|replace:':':''}
		  </a>
		</h5>
	  </div>
	  <div id="collapse-C" class="collapse" role="tabpanel" data-bs-parent="#content"
		aria-labelledby="heading-C">
		<div class="card-body bg-white p-3">
			{$BILLING_LABEL}
			{if $PAYMENT_INFORMATION!=''}
			<br>{$PAYMENT_INFORMATION}
			{/if}
		</div>
	  </div>
	</div>
  </div>
  <!-- nav/tab ends -->
   <div class="bg-dark p-3 rounded rounded-2 mt-5 text-end">
  <a href="account.php" class="btn btn-secondary">
	back
	</a>
	<span class="btn btn-primary" onclick="window.open('/print_order.php?oID={$ORDER_NUMBER}', 'popup', 'toolbar=yes,scrollbars=yes,resizable=yes, width=640, height=600')">Print order
	</span>
</div>
</div>
</div>
</div>