{% extends team["id"]+'/base.html' %}

{% block title %}Tickets, memberships, and all the latest news about our players, all in one place{% endblock %}
{% block description %}Welcome to the digital home of {{team.name|safe}} on Hattrick. Tickets, memberships, and all the latest news about our players, all in one place.{% endblock %}

{% block content %}<section class="mb-5">
    <div class="mb-2">
        <h1 class="fw-bold text-center">{{team.stadium.name}}</h1>
        <p class="lead text-center">The Heart of {{team.name}}</p>
    </div>
    <div class="row mb-4">
        <div class="col-12">
            <img src="{{team.stadium.img_stadium}}" class="img-fluid rounded-4 shadow-lg w-100 object-fit-cover" style="max-height: 550px;" alt="{{team.stadium.name}} Wide View">
        </div>
    </div>
    <div class="row g-4 mb-5">
        <div class="col-lg-8">
            <p class="lead text-secondary">
                Opened in {{team.founded|format_date}} in the vibrant region of {{team.stadium.geo[1]}}, <strong>{{team.stadium.name}}</strong> is much more than a stadium: it is the temple where history is written every matchday.
            </p>
            <p class="text-muted">
                Following its latest major renovation in {{team.stadium.last_improvement|format_date}}, the stadium now features elite facilities, ensuring a top-tier experience as fans watch their legends emerge under the lights of Barcelona. With a capacity of {{ "{:,.0f}".format(team.stadium.total_capacity).replace(",",".")}} spectators, this venue has been designed to maximize atmosphere and crowd pressure.
            </p>
            <div class="row g-3 mt-4">
                <div class="col-md-6 col-xl-3">
                    <div class="p-3 bg-light-subtle rounded shadow-sm text-center border-bottom border-primary border-3">
                        <div class="small text-uppercase text-muted fw-bold">Total Capacity</div>
                        <div class="h4 fw-bold mb-0">{{ "{:,.0f}".format(team.stadium.total_capacity).replace(",",".")}}</div>
                    </div>
                </div>
                <!-- VIP -->
                <div class="col-md-6 col-xl-3">
                    <div class="p-3 bg-light-subtle rounded shadow-sm text-center border-bottom border-warning border-3">
                        <div class="small text-uppercase text-muted fw-bold">VIP Seats</div>
                        <div class="h4 fw-bold mb-0">{{ "{:,.0f}".format(team.stadium.seats_VIP).replace(",",".")}}</div>
                    </div>
                </div>
                <!-- Cubiertos -->
                <div class="col-md-6 col-xl-3">
                    <div class="p-3 bg-light-subtle rounded shadow-sm text-center border-bottom border-info border-3">
                        <div class="small text-uppercase text-muted fw-bold">Covered</div>
                        <div class="h4 fw-bold mb-0">{{ "{:,.0f}".format(team.stadium.seats_under_roof).replace(",",".")}}</div>
                    </div>
                </div>
                <!-- Modernización -->
                <div class="col-md-6 col-xl-3">
                    <div class="p-3 bg-light-subtle rounded shadow-sm text-center border-bottom border-success border-3">
                        <div class="small text-uppercase text-muted fw-bold">Last Update</div>
                        <div class="h4 fw-bold mb-0">{{team.stadium.last_improvement|format_date}}</div>
                    </div>
                </div>
                <div class="col">
                    <img src="https://www.hattrick.org/Img/Illustrations/hat-splash-reboot-bg.webp" class="img-fluid rounded shadow-sm" alt="Estadio Ilustración">
                </div>
            </div>
        </div>
        <div class="col-lg-4">
            <div class="row mb-3">
                <div class="col-12">
                    <img src="https://www88.hattrick.org/Images/Wallpapers/hattrick_ball_1280x960.jpg" class="img-fluid rounded-3" alt="stadium ball">
                </div>
            </div>
            <div class="card border-0 shadow-sm bg-dark text-white">
                <div class="card-body p-4">
                    <h2 class="fs-4 fw-bold border-bottom border-secondary pb-2 mb-3 text-warning">About the Stadium</h2>
                    <p class="small opacity-75">Located in {{team.stadium.geo[1]}} in country {{team.stadium.geo[0]}},
                        {{team.stadium.name}} (ID: {{team.stadium.stadium_id}}) is the official home of {{team.name}}. Since {{team.founded|format_date}}, it has been a benchmark in Spanish sports.
                    </p>
                    <ul class="list-unstyled small">
                        <li class="mb-2"><i class="bi bi-check2-circle text-warning me-2"></i><strong>{{ "{:,.0f}".format(team.stadium.terraces).replace(",",".")}}</strong> Terraces</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-warning me-2"></i><strong>{{ "{:,.0f}".format(team.stadium.basic_seating).replace(",",".")}}</strong> Basic Seating</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-warning me-2"></i><strong>{{ "{:,.0f}".format(team.stadium.seats_under_roof).replace(",",".")}}</strong> Seats Under Roof</li>
                        <li class="mb-2"><i class="bi bi-check2-circle text-warning me-2"></i><strong>{{ "{:,.0f}".format(team.stadium.seats_VIP).replace(",",".")}}</strong> Seats in VIP Boxes</li>
                    </ul>
                    <div class="mt-4 p-3 bg-secondary bg-opacity-25 rounded text-center italic">
                        <small class="fst-italic text-warning">"Where history is written and legends are born."</small>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="card border-0 shadow-lg overflow-hidden">
        <div class="row g-0">
            <div class="col-md-4 bg-warning d-flex align-items-center justify-content-center p-4">
                <div class="text-center">
                    <i class="bi bi-stars fs-1 text-dark"></i>
                    <h2 class="fw-bold text-dark mt-2">The Academy</h2>
                    <span class="badge bg-dark">Youth Facilities</span>
                </div>
            </div>
            <div class="col-md-8">
                <div class="card-body p-4">
                    <h3 class="fw-bold">{{team.youth_team.stadium_name}}: Where Stars Are Born</h3>
                    <p class="text-muted">
                        {{team.youth_team.stadium_name|capitalize}} is the home of our youth teams and a source of pride for the club's structure. With an intimate capacity of <strong>600 spectators</strong>, this venue is designed so our young players can feel the support of the fans as they prepare to make the big step up to {{team.stadium.name}}.
                    </p>
                    <p class="mb-0 small fw-bold text-primary">
                        <i class="bi bi-heart-fill me-1"></i> The heart of {{team.youth_team.name}}, where the future of {{team.name}} begins to beat.
                    </p>
                </div>
            </div>
        </div>
    </div>
</section>
{% endblock %}