{# ── Reusable component macros ──────────────────────────────────── #}

{# Flash callout #}
{% macro flash(status, message) %}
{% if message %}
<div class="flash-message" style="border-left-color: {{ 'var(--status-running)' if status == 'success' else 'var(--accent)' if status == 'error' else 'var(--text-muted)' }};">
  {{ message }}
</div>
{% endif %}
{% endmacro %}

{# Sidebar HUD key-value row #}
{% macro hud_item(label, value, color='') %}
<div class="hud-item">
  <span class="hud-label small-caps">{{ label }}</span>
  <span class="hud-value"{% if color %} style="color:{{ color }}"{% endif %}>{{ value }}</span>
</div>
{% endmacro %}

{# Stat card for stat-grid (legacy, kept for compatibility if needed) #}
{% macro stat_card(label, value) %}
<div class="stat-card">
  <div class="stat-label small-caps">{{ label }}</div>
  <div class="stat-value" style="font-family: monospace;">{{ value }}</div>
</div>
{% endmacro %}

{# Bot card #}
{% macro bot_card(alias, running, model='', channels=none) %}
{% set status_text = 'Active' if running else 'Stopped' %}
{% set status_color = 'var(--status-running)' if running else 'var(--text-muted)' %}
<div class="bot-card"{{ ' style="border-style: dashed; opacity: 0.6;"' if not running else '' }}>
  <div class="bot-header">
    <span class="bot-name">{{ alias }}</span>
    <span class="status-pill {{ 'status-pill--running' if running else 'status-pill--idle' }}">
      <span class="pill-dot"></span> {{ status_text }}
    </span>
  </div>
  <div class="bot-details">
    {% if model %}
    <div class="bot-detail-row">
      <span class="bot-detail-label">Model</span>
      <span class="bot-detail-value">{{ model }}</span>
    </div>
    {% endif %}
    {% if channels %}
    <div class="bot-detail-row">
      <span class="bot-detail-label">Channels</span>
      <span class="bot-detail-value">{{ channels | join(', ') }}</span>
    </div>
    {% endif %}
  </div>
  {% if running %}
  <button class="btn" style="margin-top: 8px; width: 100%;" type="button"
          onclick="doAction('/bots/{{ alias }}/stop')">Stop</button>
  {% else %}
  <button class="btn" style="margin-top: auto; width: 100%;" type="button"
          onclick="doAction('/bots/{{ alias }}/start')">Start</button>
  {% endif %}
</div>
{% endmacro %}

{# Select options helper #}
{% macro select_options(options, selected) %}
{% if selected and selected not in options %}<option value="{{ selected }}" selected>{{ selected }}</option>{% endif %}
{% for opt in options %}<option value="{{ opt }}"{{ ' selected' if opt == selected }}>{{ opt }}</option>{% endfor %}
{% endmacro %}
