@model Convert_It_Online.Areas.TextTools.Controllers.CaseConverterViewModel

@{
    ViewData["Title"] = ViewBag.PageTitle;
}

<h1 class="mb-4">@ViewBag.PageTitle</h1>

<form asp-action="Index" method="post">
    @Html.AntiForgeryToken()
    <div class="mb-3">
        <label asp-for="InputText" class="form-label">@ViewBag.TextAreaLabel</label>
        <textarea asp-for="InputText" class="form-control" rows="8"></textarea>
    </div>

    <div class="d-flex flex-wrap gap-2">
        <button type="submit" name="ConversionType" value="upper" class="btn btn-primary">@ViewBag.ToUpperButton</button>
        <button type="submit" name="ConversionType" value="lower" class="btn btn-secondary">@ViewBag.ToLowerButton</button>
        <button type="submit" name="ConversionType" value="sentence" class="btn btn-info">@ViewBag.ToSentenceCaseButton</button>
    </div>
</form>

@if (!string.IsNullOrEmpty(Model.ResultText))
{
    <hr class="my-4" />
    <h2>@ViewBag.ResultTitle</h2>
    <textarea asp-for="ResultText" class="form-control" rows="8" readonly="readonly"></textarea>
}

<!-- FAQ Accordion -->
<div class="row mt-5">
    <div class="col-lg-10 mx-auto">
        <div class="converter-faq">
            <h3 class="h4 mb-3 text-center">Perguntas Frequentes</h3>
            <div class="accordion" id="caseConverterFaqAccordion">
                <div class="accordion-item">
                    <h2 class="accordion-header" id="headingWhatCase">
                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWhatCase" aria-expanded="false" aria-controls="collapseWhatCase">
                            <i class="bi bi-question-circle me-2"></i>@ViewBag.FaqWhatTitle
                        </button>
                    </h2>
                    <div id="collapseWhatCase" class="accordion-collapse collapse" aria-labelledby="headingWhatCase" data-bs-parent="#caseConverterFaqAccordion">
                        <div class="accordion-body">
                            @ViewBag.FaqWhatContent
                        </div>
                    </div>
                </div>

                <div class="accordion-item">
                    <h2 class="accordion-header" id="headingHowCase">
                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseHowCase" aria-expanded="false" aria-controls="collapseHowCase">
                            <i class="bi bi-gear me-2"></i>@ViewBag.FaqHowTitle
                        </button>
                    </h2>
                    <div id="collapseHowCase" class="accordion-collapse collapse" aria-labelledby="headingHowCase" data-bs-parent="#caseConverterFaqAccordion">
                        <div class="accordion-body">
                            @ViewBag.FaqHowContent
                        </div>
                    </div>
                </div>

                <div class="accordion-item">
                    <h2 class="accordion-header" id="headingWhyCase">
                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWhyCase" aria-expanded="false" aria-controls="collapseWhyCase">
                            <i class="bi bi-lightbulb me-2"></i>@ViewBag.FaqWhyTitle
                        </button>
                    </h2>
                    <div id="collapseWhyCase" class="accordion-collapse collapse" aria-labelledby="headingWhyCase" data-bs-parent="#caseConverterFaqAccordion">
                        <div class="accordion-body">
                            @ViewBag.FaqWhyContent
                        </div>
                    </div>
                </div>

                <div class="accordion-item">
                    <h2 class="accordion-header" id="headingSecurityCase">
                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseSecurityCase" aria-expanded="false" aria-controls="collapseSecurityCase">
                            <i class="bi bi-shield-check me-2"></i>@ViewBag.FaqSecurityTitle
                        </button>
                    </h2>
                    <div id="collapseSecurityCase" class="accordion-collapse collapse" aria-labelledby="headingSecurityCase" data-bs-parent="#caseConverterFaqAccordion">
                        <div class="accordion-body">
                            @ViewBag.FaqSecurityContent
                        </div>
                    </div>
                </div>

                <div class="accordion-item">
                    <h2 class="accordion-header" id="headingLimitsCase">
                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseLimitsCase" aria-expanded="false" aria-controls="collapseLimitsCase">
                            <i class="bi bi-exclamation-triangle me-2"></i>@ViewBag.FaqLimitsTitle
                        </button>
                    </h2>
                    <div id="collapseLimitsCase" class="accordion-collapse collapse" aria-labelledby="headingLimitsCase" data-bs-parent="#caseConverterFaqAccordion">
                        <div class="accordion-body">
                            @ViewBag.FaqLimitsContent
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>