{% extends 'www/base.html.twig' %}

{% import 'www/partials/_macros.html.twig' as macros %}

{% block link_alternate %}
	{% for translation in _cms_translations %}
		<link rel="altername" hreflang="{{ translation.getLocale() }}" href="{{ path(app.request.get('_route'), {_locale: translation.getLocale(), 'id': offer.id,  'addressId': app.request.query.get('addressId')}) }}"/>
	{% endfor %}
{% endblock %}

{% block content %}
	<div>
		{{ _cms_content|raw }}
	</div>

	{{ form_start(form, {'attr': {'class': 'offer-ask-form mt-4'}}) }}	
		<div class="card">
			<div class="card-header">
				<h3 class="card-title text-capitalize fs-4 mb-0">
					{{ 'ask_offer_form.offer_data_header'|trans }}
				</h3>
			</div>
			
			<div class="card-body">
				<h6 class="text-uppercase">
					{{ 'ask_offer_form.offer_name'|trans }}
				</h6>

				<p>
					{% if offer.isTypeInternet() %}
						<i class="fa fa-wifi"></i>
					{% elseif offer.isTypeTelevision() %}
						<i class="fa fa-tv"></i>
					{% endif %}
					{{ offer.getTypeName()|trans|capitalize }}
					-
					{{ offer.getName() }}
				</p>

				<h6 class="text-uppercase">
					{{ 'common.contract_duration'|trans }}
				</h6>		

				<p>
					<i class="fa fa-clock"></i>
					{{ offer.periodName|trans }}
				</p>

				{% if offer.isTypeInternet() %}
					<h6>
						{{ 'common.speed'|trans|upper }}
					</h6>

					<div class="row">
						<div class="col-lg-9">
							<div class="col">
								<i class="fa fa-download me-2"></i>

								<span>
									{{ 'common.download_speed'|trans }}:
								</span>

								<span class="fw-bold">
									{{ offer.downloadSpeed }} Mb/s
								</span>
							</div>

							<div class="col">
								<i class="fa fa-upload me-2"></i>

								<span>
									{{ 'common.upload_speed'|trans }}:
								</span>

								<span class="fw-bold">
									{{ offer.uploadSpeed }} Mb/s
								</span>
							</div>
						</div>
					</div>
				{% elseif offer.isTypeTelevision() %}
					<h6>
						{{ 'common.details'|trans|upper }}
					</h6>

					<p>
						{{ offer.getShortDescription() }}
					</p>
				{% endif %}

				<h6 class="text-uppercase mt-3">
					{{ 'ask_offer_form.address'|trans }}
				</h6>		

				<p>
					<i class="fa fa-map-marker-alt"></i>
					{{ address.name }}
					{{ building_number_name }},
					{{ address.zipCodePart1 }}-{{ address.zipCodePart2 }}
					Kraków
				</p>
			</div>
		</div>

		<div class="card mt-4">
			<div class="card-header">
				<h3 class="card-title fs-4 mb-0 text-capitalize">					
					{{ 'ask_offer_form.contact_data_header'|trans }}
				</h3>

				<small>
					{{ 'ask_offer_form.contact_data_header_sub'|trans }}        			
    			</small>
			</div>

			<div class="card-body">
				{{ form_row(form.name )}}

				<div class="row">
					<div class="col-lg-6 mb-3">
						{{ form_label(form.email) }}
						{{ form_widget(form.email )}}
						{{ form_help(form.email) }}
						{{ form_errors(form.email) }}
					</div>
					<div class="col-lg-6 mb-3">
						{{ form_label(form.phone) }}
						{{ form_widget(form.phone )}}
						{{ form_help(form.phone) }}
						{{ form_errors(form.phone) }}
					</div>
				</div>

				{{ form_row(form.notice )}}
			</div>
		</div>

		<div class="d-flex justify-content-end mt-3">
			<div>
				<div class="fs-6 text-uppercase">
					{{ 'common.subscription'|trans }}
				</div>

				<div class="price">
					<span class="price-value fs-1">
						{{ offer.price|price_integer_part }}
						<sup class="price-value-sup">
							{{ offer.price|price_decimal_part }}
						</sup>						
					</span>

					<span class="price-currency fs-6">
						zł/{{ 'common.month_short'|trans }}
					</span>
				</div>			
			</div>
		</div>

		<div class="text-end mt-3">
			<button class="btn btn-primary btn-lg">
				{{ 'ask_offer_form.submit'|trans }}
				<i class="fa fa-chevron-right"></i>
			</button>
		</div>
	{{ form_end(form) }}
{% endblock %}