</view>

<scroll-view class="voice-category-scroll" scroll-x="true" show-scrollbar="false">
                <view class="voice-category-row">
                  <view
                    wx:for="{{voiceRecordCategories}}"
                    wx:key="*this"
                    class="voice-category-pill {{selectedRecordCategory === item ? 'active' : ''}}"
                    data-category="{{item}}"
                    bindtap="onSelectRecordCategory"
                    >{{item}}</view
                  >
                </view>
              </scroll-view>
            </view>
          </view>
        </view>
      </view>
    </view>
  </view>

<view wx:if="{{sessionInfoVisible}}" class="session-info-mask" bindtap="onCloseSessionInfo">
    <view class="session-info-panel" catchtap="noop">
      <view class="connection-diagnostics-card session-info-card" style="{{sessionInfoTheme.cardStyle}}">
        <text class="session-info-title" style="{{sessionInfoTheme.titleStyle}}">{{sessionInfoTitle}}</text>
        <view class="session-info-hero" style="{{sessionInfoTheme.heroStyle}}">
          <view class="session-info-hero-orb is-left"></view>
          <view class="session-info-hero-orb is-right"></view>
          <text class="session-info-hero-eyebrow">{{sessionInfoHero.eyebrow}}</text>
          <text class="session-info-hero-name">{{sessionInfoHero.name}}</text>
          <text class="session-info-hero-subtitle" user-select="true">{{sessionInfoHero.subtitle}}</text>
          <text wx:if="{{sessionInfoHero.route}}" class="session-info-hero-route" user-select="true"
            >{{sessionInfoHero.routeLabel}} · {{sessionInfoHero.route}}</text
          >
        </view>

<view class="session-info-status-grid">
          <view
            wx:for="{{sessionInfoStatusChips}}"
            wx:key="key"
            class="session-info-status-pill {{item.connected ? 'is-connected' : 'is-disconnected'}} {{((item.key === 'sshConnection' && !connectionActionDisabled) || (item.key === 'aiConnection' && !aiLaunchBusy)) ? 'is-actionable' : ''}}"
            data-key="{{item.key}}"
            bindtap="onSessionInfoStatusTap"
          >
            <view class="session-info-status-top">
              <text class="session-info-status-label">{{item.label}}</text>
              <text class="session-info-status-badge">{{item.badge}}</text>
            </view>
            <text class="session-info-status-value">{{item.value}}</text>
            <text class="session-info-status-note">{{item.note}}</text>
          </view>
        </view>

<view class="session-info-detail-grid">
          <view
            wx:for="{{sessionInfoDetailItems}}"
            wx:key="key"
            class="session-info-detail-card {{item.wide ? 'is-wide' : ''}}"
          >
            <text class="session-info-detail-accent">{{item.accent}}</text>
            <text class="session-info-detail-label">{{item.label}}</text>
            <text class="session-info-detail-value" user-select="true">{{item.value}}</text>
          </view>
        </view>
      </view>
    </view>
  </view>

<view
    wx:if="{{connectionDiagnosticsVisible}}"
    class="connection-diagnostics-mask"
    bindtap="onCloseConnectionDiagnostics"
  >
    <view class="connection-diagnostics-panel" catchtap="noop">
      <view
        class="connection-diagnostics-card connection-diagnostics-chart-card is-combined"
        style="{{connectionDiagnosticCombinedChart.cardStyle}}"
      >
        <view class="connection-diagnostics-chart-head">
          <view
            class="connection-diagnostics-chart-metric is-response"
            style="{{connectionDiagnosticCombinedChart.responseMetricStyle}}"
          >
            <text class="connection-diagnostics-chart-axis-pill is-response"
              >{{connectionDiagnosticCombinedChart.responseCardLabel}}</text
            >
            <view class="connection-diagnostics-chart-stats-row">
              <view
                wx:for="{{connectionDiagnosticCombinedChart.responseStatItems}}"
                wx:key="key"
                class="connection-diagnostics-chart-stat-item"
              >
                <text class="connection-diagnostics-chart-stat-label">{{item.label}}</text>
                <text class="connection-diagnostics-chart-stat-value is-response">{{item.valueLabel}}</text>
                <text wx:if="{{item.divider}}" class="connection-diagnostics-chart-stat-divider">·</text>
              </view>
            </view>
          </view>
          <view
            class="connection-diagnostics-chart-metric is-network"
            style="{{connectionDiagnosticCombinedChart.networkMetricStyle}}"
          >
            <text class="connection-diagnostics-chart-axis-pill is-network"
              >{{connectionDiagnosticCombinedChart.networkCardLabel}}</text
            >
            <view class="connection-diagnostics-chart-stats-row">
              <view
                wx:for="{{connectionDiagnosticCombinedChart.networkStatItems}}"
                wx:key="key"
                class="connection-diagnostics-chart-stat-item"
              >
                <text class="connection-diagnostics-chart-stat-label">{{item.label}}</text>
                <text class="connection-diagnostics-chart-stat-value is-network">{{item.valueLabel}}</text>
                <text wx:if="{{item.divider}}" class="connection-diagnostics-chart-stat-divider">·</text>
              </view>
            </view>
          </view>
        </view>
        <view
          class="connection-diagnostics-chart-image-shell"
          style="{{connectionDiagnosticCombinedChart.chartImageShellStyle}}"
        >
          <image
            class="connection-diagnostics-chart-image"
            src="{{connectionDiagnosticCombinedChart.imageUri}}"
            mode="widthFix"
            fade-show="{{false}}"
          />
        </view>
      </view>
    </view>
  </view>
  <bottom-nav page="terminal" />
</view>