@model List<CarneiroTech.Models.CaseModel>
@{
    var selectedTag = ViewData["SelectedTag"] as string;
    var allTags = ViewBag.AllTags as List<string> ?? new List<string>();
}

<!-- Page Header-->
<header class="masthead" style="padding: 150px 0 100px;">
    <div class="container">
        <div class="masthead-subheading">Portfolio</div>
        <div class="masthead-heading text-uppercase">Nossos Cases</div>
    </div>
</header>

<!-- Cases List-->
<section class="page-section bg-light">
    <div class="container">
        <!-- Tags Filter -->
        @if (allTags.Any())
        {
            <div class="row mb-5">
                <div class="col-12 text-center">
                    <h5 class="mb-3">Filtrar por tecnologia:</h5>
                    <div class="btn-group-wrap">
                        <a href="/cases" class="btn @(string.IsNullOrEmpty(selectedTag) ? "btn-primary" : "btn-outline-primary") m-1">Todos</a>
                        @foreach (var tag in allTags)
                        {
                            <a href="/cases?tag=@tag" class="btn @(selectedTag == tag ? "btn-primary" : "btn-outline-primary") m-1">@tag</a>
                        }
                    </div>
                </div>
            </div>
        }

        <!-- Cases Grid -->
        <div class="row">
            @if (Model != null && Model.Any())
            {
                foreach (var caseItem in Model)
                {
                    <div class="col-lg-4 col-sm-6 mb-4">
                        <!-- Portfolio item -->
                        <div class="portfolio-item">
                            <a class="portfolio-link" href="/cases/@caseItem.Metadata.Slug">
                                <div class="portfolio-hover">
                                    <div class="portfolio-hover-content">
                                        <p class="text-white fw-bold px-3">@caseItem.Metadata.Summary</p>
                                    </div>
                                </div>
                                @if (!string.IsNullOrEmpty(caseItem.Metadata.Image))
                                {
                                    <img class="img-fluid" src="@caseItem.Metadata.Image" alt="@caseItem.Metadata.Title" />
                                }
                                else
                                {
                                    <div style="height: 300px; background: linear-gradient(135deg, #C42127 0%, #8B1E23 100%);"></div>
                                }
                            </a>
                            <div class="portfolio-caption">
                                <div class="portfolio-caption-heading">@caseItem.Metadata.Title</div>
                                <div class="portfolio-caption-subheading text-muted">@caseItem.Metadata.Industry</div>
                                <div class="mt-2">
                                    @foreach (var tag in caseItem.Metadata.Tags.Take(3))
                                    {
                                        <span class="badge bg-secondary me-1">@tag</span>
                                    }
                                </div>
                            </div>
                        </div>
                    </div>
                }
            }
            else
            {
                <div class="col-12 text-center">
                    <p class="lead text-muted">
                        @if (!string.IsNullOrEmpty(selectedTag))
                        {
                            <span>Nenhum case encontrado para a tag "@selectedTag".</span>
                        }
                        else
                        {
                            <span>Em breve, novos cases serão adicionados.</span>
                        }
                    </p>
                    <a href="/cases" class="btn btn-primary">Ver Todos os Cases</a>
                </div>
            }
        </div>
    </div>
</section>