<div class="row" style="margin-top:30px">
	<div class="col-xs-offset-3 col-xs-6" onclick="load_choices({{ customer.badge_number }})">
		<div class="alert alert-warning" style="text-align:center; margin-bottom:0">
			<span style="font-size:x-large">Go back</span>
		</div>
	</div>
</div>

<h1>{{ category }}</h1>
<div class="row">
	{% for tool in tools %}
		<div class="col-xs-6">
			<div class="panel panel-default {% if tool in unqualified_tools %}disabled{% endif %}" onclick="tool_information('{% url 'kiosk_tool_information' tool.id customer.id 'back_to_category' %}')">
				<div class="panel-body">

					<span style="font-size:x-large; margin-right:10px">{{ tool }}</span>

					{% if tool.in_use %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-user primary-highlight"></span>
					{% endif %}

					{% if tool.delayed_logoff_in_progress %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-time primary-highlight"></span>
					{% endif %}

					{% if tool.scheduled_outages %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-time danger-highlight"></span>
					{% elif tool.scheduled_partial_outages %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-time warning-highlight"></span>
					{% endif %}

					{% if tool.required_resource_is_unavailable %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-leaf danger-highlight"></span>
					{% elif tool.nonrequired_resource_is_unavailable %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-leaf warning-highlight"></span>
					{% endif %}

					{% if tool.operational == False %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-fire danger-highlight"></span>
					{% elif tool.problematic == True %}
						<span style="font-size:x-large; margin-right:10px" class="glyphicon glyphicon-wrench warning-highlight"></span>
					{% endif %}

				</div>
			</div>
		</div>
	{% endfor %}
</div>

<script>revert(60);</script>