<!--
  PocketPaw Dashboard - Terminal Component

  Changes (2026-02-04):
  - Fixed scrolling: Added overflow-y-auto to make terminal scrollable
  Changes (2026-02-03):
  - Extracted from monolithic index.html
  - Displays logs data with timestamp and colored log levels
-->
<!-- Terminal View -->
<div class="flex-1 flex flex-col pt-24 px-4 md:px-8 pb-8 overflow-hidden bg-black font-mono" x-show="view === 'terminal'">
    <div class="terminal-output flex-1 overflow-y-auto text-[12px] md:text-[13px] text-[#BBB] leading-relaxed space-y-1" x-ref="terminal">
    <template x-for="(log, index) in logs" :key="index">
        <div class="flex gap-3" :class="'term-' + log.level">
        <span class="text-[#555] whitespace-nowrap" x-text="log.time"></span>
        <span x-text="log.message" class="break-words"></span>
        </div>
    </template>
    </div>
</div>
