{% extends '::baseAjax.html.twig' %} 
{% block ajax_body %}
{# 	<link href='{{ ob_project_base_url~asset(ob_project_assets_base_url ~ '/css/printPageBase.css') }}' rel='stylesheet' type='text/css'/>#}
	<style>
/* 	.media-none, .availability-row {display:none;}
	.more-product{display:none !important ;}
	.content-none *{display:none;} */
	
	.print-comparision .modal-dialog{width:auto;max-width:1170px}
	
 	.ob-product-compare .color-block > img {left: 0;position: absolute;height: 100%;width: 100%;border-radius: 10px;} 
 	.ob-product-compare .color-block {position:relative;margin: auto 3px 5px; border: 1px solid #000; 
    border-radius: 10px;
    display: inline-block;
    height: 18px;
    margin-right: 7px;
    vertical-align: top;
    width: 18px;}
 	.ob-product-compare .color-block {overflow:hidden !important;}
 	.print-comparision .print-head{margin:20px;}
	.ob-product-compare .pro-img .img-block img{max-height: 220px;max-width: 190px;}
	.model-popup-black .modal-header{width:1145px;}
	.ob-product-compare .compare-block td.feature-block{width:20%;}
	.ob-product-compare .compare-block td.feature-block .more-product {/* border:none */; height:65px}
	.ob-product-compare .compare-block {
	    border-collapse: separate !important;
	    border-spacing: 0;
	    border-top: 1px solid #000;
	    text-align: center;
	    vertical-align: middle;
	    margin-left: 20px;
	    margin-right: 20px;
	    width: 97%;
	    
	}
	.ob-product-compare .dark-bg {
	    background: #f5f5f5 none repeat scroll 0 0;
	}
	.ob-product-compare .feature.light-bg {
	    background: #fafafa none repeat scroll 0 0;
	}
	.ob-product-compare .compare-block > tbody > tr:first-child > td {
	    padding: 20px 20px 0;
	}
	.ob-product-compare .compare-block td.feature-block {
	    color: #4d4d4d;
	    font-family: "robotobold";
	    font-size: 14px;
	}
	.ob-product-compare .compare-block td.feature-block {
	    background: #fff none repeat scroll 0 0;
	    border-left: 1px solid #000;
	    color: #404040;
	    font: 14px roboto_condensedregular;
	    text-align: left;
	    text-transform: uppercase;
	    vertical-align: top;
	}
	.ob-product-compare .compare-block > tbody > tr > td {
	    border-right: 1px solid #000;
	    padding: 10px;
	    position: relative;
	    text-align: center;
	    vertical-align: top;
	    width: 20%;
	}
	.ob-product-compare .feature td {
	    border-bottom: 1px solid #000;
	}
	.ob-product-compare .feature.summary td, .ob-product-compare .feature-block {white-space:pre-wrap;word-break: break-word;text-align: left;}
	.ob-product-compare .product-name{white-space:pre-wrap;word-break: break-word;text-align: left;}
	.ob-product-compare .pro-img{height: 226px;display: table;background: #fff none repeat scroll 0 0;}
	.ob-product-compare .pro-img .img-block{display: table-cell;vertical-align: middle;}
	.ob-product-compare .color-block{margin-bottom:5px}
	.ob-product-compare{padding-top:20px;}
	</style>
<div class='pdf-compare-product'>
	<div class='model-popup-black print-comparision'>
		<div class="modal-dialog modal-lg">
	        <div class="modal-content">
				<div class="modal-header">
					{% block page_title %}{{ 'product_compare.product_compare'|trans }}{% endblock page_title %}
				</div>
				<div class="modal-body">
					<div class="row print-head">
						<div class="col-xs-6">
{# 			               	{% use 'OfficeBrainCustomBundleThemeBundle:IdmeTheme:BaseUIElements/Header/logo.html.twig' %}#}
{# 							{% block header_logo %} {{ parent() }} {% endblock header_logo %}#}
							
{# 							<a href="{{ url('office_brain_page_homepage_view') }}">#}
									
								<img src="{{  (ob_project_base_url~asset(ob_project_assets_base_url ~ 'images/goldstar/goldstar-logo-png.png') ) | logo }}" alt="">
									
{# 							</a>#}
							
						</div>
						<div class="col-xs-6"></div>
					</div>
					<div class="ob-product-compare">
						<div class="scroll-block">
							<table class="compare-block" cellspacing="0" cellpadding="10" width="100%" border="0">
								{#% block product_image_title %}{% endblock product_image_title %}
								{% block product_price_quantity %}{% endblock product_price_quantity %}
								{% block product_transaction_button %}{% endblock product_transaction_button %}		
								{% block product_sku %}{% endblock product_sku %}
								{% block product_rating %}{% endblock product_rating %}
								{% block product_brand %}{% endblock product_brand %}
								{% block product_color %}{% endblock product_color %}
								{% block product_feature %}{% endblock product_feature %}
								{% block product_description %}{% endblock product_description %}
								{% block product_quantity_availability %}{% endblock product_quantity_availability %} #}
								
								{% embed 'OfficeBrainCompareProductBundle:CompareProduct:compareProductRow.html.twig' %}
								
									{% block product_color %}
										{% if ob_project_transaction_configuration_rule.compare_product.list.option.product_color.status ==1%}
									    	<tr class="feature light-bg">
									        	<td class="feature-block">{{ 'product_compare.color'|trans }}</td>
									            {% for row in record_set %}
									            	<td>
									{# 					<span class="feature-title">{{ 'product_compare.color'|trans }} :</span>#}
														{% if row.attributes|length>0 %}
															{% for attr in row.attributes %}
																{% if attr.id=="10" %}
																	{% for index,color in attr.values %}
																		<div class="color-block" style="margin: auto 3px 5px;"  data-toggle="tooltip" data-placement="left" title="{{ color }}">
																			<img src="{{ ob_project_product_color_base_url~index~'.jpg' }}"/>
{# 																			<label title="{{ color }}" for="request_quote_color_{{ attr.id }}_{{ index }}"  data-attribute-id="{{ attr.id }}" data-attribute-value-id="{{ index }}" data-product-id="{{ product_id }}"></label>#}
																		</div>
																	{% endfor %}
																{% endif %}
															{% endfor %}
														{% endif %}
													</td>
												{% endfor %}
												{% set i=1 %}
												{% for i in range(1, remaining_compare_product) if remaining_compare_product >0 %}
													<td class="">&nbsp;</td>
												{% endfor %}
											</tr>
										{% endif %}
									{% endblock product_color %}
								{% endembed %}
							</table>
						</div>
					</div>
	      		</div>
			</div>
		</div>
	</div>
</div>
{% endblock ajax_body %}