<div class="card-body">
    <div class="row">
        <!-- English tier Name Input -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="tier_en">
                <%= trans.cruds.TIER.fields.title_en %> <span class="text-danger">*</span>
                </label>
                <input
                    class="form-control"
                    type="text"
                    id="tier_en"
                    name="title_en"
                    value="<%= tier?.title?.en || '' %>"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.title_en %>"
                />
            </div>
        </div>

        <!-- Arabic tier Name Input -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="tier_ar">
                <%= trans.cruds.TIER.fields.title_ar %> <span class="text-danger">*</span>
                </label>
                <input
                    class="form-control"
                    type="text"
                    id="tier_ar"
                    name="title_ar"
                    value="<%= tier?.title?.ar || '' %>"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.title_ar %>"
                />
            </div>
        </div>

        <!-- Description (English) -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="description_en">
                <%= trans.cruds.TIER.fields.description_en %>
                </label>
                <textarea
                    class="form-control"
                    name="description_en"
                    id="description_en"
                    rows="3"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.description_en %>"
                ><%= tier?.description?.en || '' %></textarea>
            </div>
        </div>

        <!-- Description (Arabic) -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="description_ar">
                <%= trans.cruds.TIER.fields.description_ar %>
                </label>
                <textarea
                    class="form-control"
                    name="description_ar"
                    id="description_ar"
                    rows="3"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.description_ar %>"
                ><%= tier?.description?.ar || '' %></textarea>
            </div>
        </div>

        <!-- Tier Number -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="tierNumber">
                    <%= trans.cruds.TIER.title_singular %> <span class="text-danger">*</span>
                </label>
                <select class="select2 form-control" id="tierNumber" name="tierNumber" placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.title_singular %>">
                    <% for (const key in TIER_NUMBERS) { %>
                        <option value="<%= key %>" <%= tier.tierNumber == key ? 'selected' : '' %>>
                            <%= trans.cruds.TIER.fields[TIER_NUMBERS[key]] %>
                        </option>
                    <% } %>
                </select>
            </div>
        </div>

        <!-- Max Posted Listings -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="maxPostedListings">
                    <%= trans.cruds.TIER.fields.maxPostedListings %> <span class="text-danger">*</span>
                </label>
                <input
                    class="form-control"
                    type="number"
                    id="maxPostedListings"
                    name="maxPostedListings"
                    min="0"
                    value="<%= tier?.maxPostedListings !== undefined ? tier.maxPostedListings : '' %>"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.maxPostedListings %>"
                    required
                />
            </div>
        </div>

        <!-- Listing Duration Days -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="listingDurationDays">
                    <%= trans.cruds.TIER.fields.listingDurationDays %> <span class="text-danger">*</span>
                </label>
                <input
                    class="form-control"
                    type="number"
                    id="listingDurationDays"
                    name="listingDurationDays"
                    min="0"
                    value="<%= tier?.listingDurationDays !== undefined ? tier.listingDurationDays : '' %>"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.listingDurationDays %>"
                    required
                />
            </div>
        </div>

        <!-- Annual Subscription -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="annualSubscription">
                    <%= trans.cruds.TIER.fields.annualSubscription %> <span class="text-danger">*</span>
                </label>
                <input
                    class="form-control"
                    type="number"
                    id="annualSubscription"
                    name="annualSubscription"
                    min="0"
                    value="<%= tier?.annualSubscription !== undefined ? tier.annualSubscription : '' %>"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.annualSubscription %>"
                    required
                />
            </div>
        </div>


        <!-- Applicable Fee Percent -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="applicableFeePercent">
                    <%= trans.cruds.TIER.fields.applicableFeePercent %> <span class="text-danger">*</span>
                </label>
                <input
                    class="form-control"
                    type="number"
                    id="applicableFeePercent"
                    name="applicableFeePercent"
                    min="0"
                    step="0.01"
                    value="<%= tier?.applicableFeePercent || '' %>"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.applicableFeePercent %>"
                    required
                />
            </div>
        </div>

        <!-- Max Fee -->
        <div class="col-12 col-sm-12 col-md-6 col-lg-6">
            <div class="form-group mb-3">
                <label class="form-label" for="maxFee">
                    <%= trans.cruds.TIER.fields.maxFee %> <span class="text-danger">*</span>
                </label>
                <input
                    class="form-control"
                    type="number"
                    id="maxFee"
                    name="maxFee"
                    min="0"
                    value="<%= tier?.maxFee || '' %>"
                    placeholder="<%= trans.global.enter_your %> <%= trans.cruds.TIER.fields.maxFee %>"
                    required
                />
            </div>
        </div>
    </div>
</div>
