{% extends "widgets/base.widget.html" %}
{% block content %}
<div class="container no-header">

	<div class="row g-2">

		<div class="col-auto col-md-9 col-xl-9">
			<div class="row">
				<div class="form-selectgroup">
					<label class="form-selectgroup-item">
						<input type="radio" name="room-category-select" value="0" class="form-selectgroup-input" checked="">
						<span class="form-selectgroup-label">
							<i class="ti ti-home icon me-1"></i>{{_("Home")}}
						</span>
					</label>
					{% for room_category in room_categories %}
					<label class="form-selectgroup-item">
						<input type="radio" name="room-category-select" value="{{room_category.id}}" class="form-selectgroup-input">
						<span class="form-selectgroup-label">
							<i class="ti {{room_category.icon}} icon me-1"></i>
							{{room_category.name}}
						</span>
					</label>
					{% endfor %}
				</div>
			</div>
		</div>

		<div class="col-md-auto col-md-3 col-xl-auto  ms-auto">
			{% include "room_search.html" %}
		</div>

	</div>
	{% if SETTINGS.ad_main_top %}
	<div class="ad-space ad-main-top">
		{{SETTINGS.ad_main_top|htmlspecialchars_decode|raw}}
	</div>
	{% endif %}

	{% if chat_rooms %}
		<div class="room-list-row mt-3" id="chat-room-loop">
			{% include "room_loop.html" %}
		</div>
		<div class="row">
			<input type="hidden" id="chat_room_cont"
				value="{{ SETTINGS.homepage_chat_room_limit?SETTINGS.homepage_chat_room_limit:6 }}">
			<div class="row justify-content-md-center  mb-3 mt-4">
				<div class="col-md-3 text-center">
					<div id="load-more-end" class="hidden">{{ _("You've Reached The End!") }}</div>
					<div id="load-more" class="hidden"><i class="ti ti-loader ti-spin"></i></div>
				</div>
			</div>
		</div>
	{% else %}	
		
		<div class="alert alert-important alert-info mt-3" role="alert">
			<i class="ti ti-heart-exclamation icon me-1"></i>
			No chat rooms on the radar yet. Looks like the party hasn’t started!
		</div>

	{% endif %}



	
	{% if SETTINGS.ad_main_bottom %}
	<div class="ad-space ad-main-bottom">
		{{SETTINGS.ad_main_bottom|htmlspecialchars_decode|raw}}
	</div>
	{% endif %}

</div>
{% endblock  %}