{% load i18n %}
{% load humanize %}
<div class="row">
    <div class="col-md-7">
        <div class="card mb-3">
            <div class="row g-0">
                <div class="col-md-4">
                    {% if item_type_icon_url is not None %}
                        <img img-fluid rounded-start src={{ item_type_icon_url }} alt={{ item_type.name }} class="img-fluid center-block" />
                    {% endif %}
                </div>
                <div class="col-md-8">
                    <div class="card-body">
                        <p class="card-text">
                            <h6 class="card-subtitle text-body-secondary">
                                {% if item_type.market_group.parent_market_group.parent_market_group.parent_market_group.parent_market_group is not null %}
                                    {{ item_type.market_group.parent_market_group.parent_market_group.parent_market_group.parent_market_group }} /
                                {% endif %}
                                {% if item_type.market_group.parent_market_group.parent_market_group.parent_market_group is not null %}
                                    {{ item_type.market_group.parent_market_group.parent_market_group.parent_market_group }} /
                                {% endif %}
                                {% if item_type.market_group.parent_market_group.parent_market_group is not null %}
                                    {{ item_type.market_group.parent_market_group.parent_market_group }} /
                                {% endif %}
                                {% if item_type.market_group.parent_market_group is not null %}
                                    {{ item_type.market_group.parent_market_group }} /
                                {% endif %}
                                {{ item_type.market_group }}
                            </h6>
                        </p>
                        <h1 class="card-title">{{ item_type.name }}</h1>
                        <p class="card-text">
                            <small class="text-body-secondary">{{ item_type.volume }}m3</small>
                        </p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-md-5">
        <div class="card mb-3">
            <div class="card-body">
                <table class="table">
                    <tbody>
                        <tr>
                            <td>&nbsp;</td>
                            <td>
                                <small>{% translate "5%" %}</small>
                            </td>
                            <td>
                                <small>{% translate "Weighted Average" %}</small>
                            </td>
                            <td>
                                <small>{% translate "Median" %}</small>
                            </td>
                            <td>
                                <small>{% translate "Volume" %}</small>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <small>{% translate "Selling" %}</small>
                            </td>
                            <td>{{ type_statistics.sell_fifth_percentile|intcomma }}</td>
                            <td>{{ type_statistics.sell_weighted_average|intcomma }}</td>
                            <td>{{ type_statistics.sell_median|intcomma }}</td>
                            <td>{{ type_statistics.sell_volume|intcomma }}</td>
                        </tr>
                        <tr>
                            <td>
                                <small>{% translate "Buying" %}</small>
                            </td>
                            <td>{{ type_statistics.buy_fifth_percentile|intcomma }}</td>
                            <td>{{ type_statistics.buy_weighted_average|intcomma }}</td>
                            <td>{{ type_statistics.buy_median|intcomma }}</td>
                            <td>{{ type_statistics.buy_volume|intcomma }}</td>
                        </tr>
                    </tbody>
                </table>
            </div>
            {% if type_statistics.explain is not null %}<div class="card-footer">{{ type_statistics.explain }}</div>{% endif %}
        </div>
    </div>
</div>