{{ header }}
<div id="account-return" class="container account-container">
	{{ oct_breadcrumbs }}
	<div class="row">
		<div class="col-lg-12">
			<h1 class="rm-page-title">{{ heading_title }}</h1>
		</div>
	</div>
	<div class="content-top-box">{{ content_top }}</div>
	<div id="content" class="row">
		{{ column_left }}
	    {% if column_left and column_right %}
	    {% set class = 'col-lg-6' %}
	    {% elseif column_left or column_right %}
	    {% set class = 'col-lg-9' %}
	    {% else %}
	    {% set class = 'col-lg-12' %}
	    {% endif %}
	    <div class="{{ class }}">
		    <div class="rm-content h-100">
				<div class="rm-content-title">{{ text_return_detail }}</div>
				<div class="rm-account-text rm-account-order">
					<div class="rm-account-text-order">{{ text_return_id }}:<span>#{{ return_id }}</span></div>
					<div class="rm-account-text-order">{{ text_date_added }}:<span>{{ date_added }}</span></div>
					<div class="rm-account-text-order">{{ text_order_id }}:<span>#{{ order_id }}</span></div>
					<div class="rm-account-text-order">{{ text_date_ordered }}:<span>{{ date_ordered }}</span></div>
				</div>
				<div class="rm-content-title">{{ text_product }}</div>
			    <div class="table-responsive-sm rm-table-box">
			        <table class="table table-hover">
			          <thead class="thead-dark">
			            <tr>
			              <th style="width: 33.3%;">{{ column_product }}</th>
			              <th style="width: 33.3%;">{{ column_model }}</th>
			              <th style="width: 33.3%;">{{ column_quantity }}</th>
			            </tr>
			          </thead>
			          <tbody>
			            <tr>
			              <td>{{ product }}</td>
			              <td>{{ model }}</td>
			              <td>{{ quantity }}</td>
			            </tr>
			          </tbody>
			        </table>
			    </div>
				<div class="rm-content-title">{{ text_reason }}</div>
			    <div class="table-responsive-sm rm-table-box">
			        <table class="table table-hover">
			          <thead class="thead-dark">
			            <tr>
			              <th style="width: 33.3%;">{{ column_reason }}</th>
			              <th style="width: 33.3%;">{{ column_opened }}</th>
			              <th style="width: 33.3%;">{{ column_action }}</th>
			            </tr>
			          </thead>
			          <tbody>
			            <tr>
			              <td>{{ reason }}</td>
			              <td>{{ opened }}</td>
			              <td>{{ action }}</td>
			            </tr>
			          </tbody>
			        </table>
			    </div>
				{% if comment %}
			    <div class="table-responsive-sm rm-table-box">
			        <table class="table table-hover">
			          <thead class="thead-dark">
			            <tr>
			              <th>{{ text_comment }}</th>
			            </tr>
			          </thead>
			          <tbody>
			            <tr>
			              <td>{{ comment }}</td>
			            </tr>
			          </tbody>
			        </table>
			    </div>
			    {% endif %}
				<div class="rm-content-title">{{ text_history }}</div>
			    <div class="table-responsive-sm rm-table-box">
			        <table class="table table-hover">
			          <thead class="thead-dark">
			            <tr>
			              <th style="width: 33.3%;">{{ column_date_added }}</th>
			              <th style="width: 33.3%;">{{ column_status }}</th>
			              <th style="width: 33.3%;">{{ column_comment }}</th>
			            </tr>
			          </thead>
			          <tbody>
			          {% if histories %}
			          {% for history in histories %}
			          <tr>
			            <td>{{ history.date_added }}</td>
			            <td>{{ history.status }}</td>
			            <td>{{ history.comment }}</td>
			          </tr>
			          {% endfor %}
			          {% else %}
			          <tr>
			            <td colspan="3">{{ text_no_results }}</td>
			          </tr>
			          {% endif %}
			            </tbody>
			        </table>
			    </div>
		      <div class="mt-4">
		        <a href="{{ continue }}" class="rm-btn dark">{{ button_continue }}</a>
		      </div>
		    </div>
	    </div>
	    {{ column_right }}
	</div>
	{{ content_bottom }}
</div>
{{ footer }}
