{% extends 'base.html' %}
{% load static %}
{% block title %} CERCA {% endblock title %}

{% block content %}
    

	<!-- page title -->
	<section class="section section--first section--bg" data-bg="https://i.ibb.co/1rMvtMS/section.jpg">
		<div class="container">
			<div class="row">
				<div class="col-12">
					<div style="justify-content: center!important;" class="section__wrap">
						<!-- section title -->
						<h2 class="section__title">CERCA FILM,SERIE TV e ANIME</h2>
						<!-- end section title -->
					</div>
				</div>
			</div>
		</div>
	</section>
    <!-- end page title -->
    
	<!-- catalog -->
	<div style="margin-top: 30px;" class="catalog">
		<div class="container">
			<div class="row">
                <!-- card -->
                {% for media_trovati in media %}
				<div class="col-6 col-sm-4 col-lg-3 col-xl-3">
					<div class="card">
						<div class="card__cover">
							<img src="{{ media_trovati.immagine_poster.url }}" alt="">
							<a href="{{ media_trovati.get_absolute_url }}" class="card__play">
								<i class="icon ion-ios-play"></i>
							</a>
						</div>
						<div class="card__content">
							<h3 class="card__title"><a href="{{ media_trovati.get_absolute_url }}">{{ media_trovati.titolo }}</a></h3>
							<span class="card__category">
                                {% for genere_media in media_trovati.genere.all %}
                                <a href="{{ genere_media.get_absolute_url }}">{{ genere_media.genere }}</a>
                                {% endfor %}
							</span>
							<span class="card__rate"><i class="icon ion-ios-star"></i>{{ media_trovati.voto }}</span>
						</div>
					</div>
				</div>
				{% empty %}
				<div style="margin: 0 auto;" class="sign__form">
                    <p class="sign__text">
                        Ci dispiace, nessun contenuto trovato...
                    </p>
                </div>
                {% endfor %}
                <!-- end card -->

			</div>
		</div>
	</div>
	<!-- end catalog -->
{% endblock content %}