{% extends "admin/base.html" %}

{% block page_header %}
<nav aria-label="breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="{{  url('dashboard') }}">{{_("Dashboard",2)}}</a></li>
    <li class="breadcrumb-item"><a href="{{  url('dashboard-room-categories') }}">{{_("Chat Room Categories",2)}}</a></li>
    <li class="breadcrumb-item active" aria-current="page">{{edit_type_name}} {{_("Category",2)}}</li>
  </ol>
</nav>
{% endblock %}

{% block content %}

<div class="row ">
    <div class="col-md-8">
        <div class="card card-language">
            <div class="card-header">
                <div class="card-title">{{edit_type_name}} {{_("Category",2)}}</div>
            </div>
            <div class="card-body">
                <form id="room-category-form">
                    {{ csrf_token()|raw }}
                    <input type="hidden" name="edit_type" value="{{edit_type}}">
                    {% if category %}
                        <input type="hidden" name="cat_id" value="{{category.id}}">
                    {% endif %}
                    <div class="mb-3">
                        <label class="form-label" for="name">{{_("Name",2)}}</label>
                        <input type="text" class="form-control" id="name" name="name" value="{{category.name}}">
                    </div>
                    <div class="mb-3">
                        <label class="form-label" for="icon">{{_("Icon",2)}}</label>
                        <input type="text" class="form-control" id="icon" name="icon" value="{{category.icon}}">
                        <small>Enter Tabler icon class (e.g., <code>ti-atom-2</code>). Browse icons at <a href="https://tabler.io/icons" target="_blank" rel="noopener noreferrer">tabler.io/icons</a>.</small>

                    </div>
                    <button type="button" class="btn btn-primary update-room-category">{{_("Submit",2)}}</button>
                </form>
            </div>
        </div>
    </div>
</div>

{% endblock %}