{% macro cycling_panel() %}
<div id="trip-cycling-block" class="trip-cycling-block">
    <div class="trip-panel-inner">
        <div class="trip-cycling-header">
            <span class="trip-cycling-icon">🚴</span>
            <span class="trip-cycling-title">Cycling Stats</span>
        </div>
        <div class="trip-cycling-grid">
            <div class="stat-block">
                <span class="stat-value" id="cyc-distance">—</span>
                <span class="stat-label">km distance</span>
            </div>
            <div class="stat-block">
                <span class="stat-value" id="cyc-ele-gain">—</span>
                <span class="stat-label">m ↑ gain</span>
            </div>
            <div class="stat-block">
                <span class="stat-value" id="cyc-ele-loss">—</span>
                <span class="stat-label">m ↓ loss</span>
            </div>
            <div class="stat-block">
                <span class="stat-value" id="cyc-highest">—</span>
                <span class="stat-label">m highest</span>
            </div>
            <div class="stat-block">
                <span class="stat-value" id="cyc-lowest">—</span>
                <span class="stat-label">m lowest</span>
            </div>
            <div class="stat-block">
                <span class="stat-value" id="cyc-moving-time">—</span>
                <span class="stat-label">moving time</span>
            </div>
            <div class="stat-block">
                <span class="stat-value" id="cyc-avg-speed">—</span>
                <span class="stat-label">km/h avg speed</span>
            </div>
        </div>
        <button class="trip-panel-close" data-toggle="trip-cycling-toggle">↑ Close cycling</button>
    </div>
</div>
{% endmacro %}