import QtQuick
import QtQuick.Controls
import QtQuick.Layouts
import ISC

// Small labeled value tile — DTW readout panel, scrubber readout, and any
// other compact label/value stat display share this one shape.
Rectangle {
    id: readoutStat
    property string label
    property string value
    property color valueColor: Theme.headingColor
    Layout.fillWidth: true
    implicitHeight: 52
    radius: Theme.radiusSm
    color: Theme.subtleSectionBackground
    border.color: Theme.cardBorder
    border.width: 1

    ColumnLayout {
        anchors.fill: parent
        anchors.margins: 8
        spacing: 2
        Label {
            text: readoutStat.label.toUpperCase()
            font.pixelSize: Theme.fontXs
            font.bold: true
            font.letterSpacing: 0.2
            color: Theme.sideMutedText
        }
        Label {
            text: readoutStat.value
            font.pixelSize: Theme.fontLg
            font.bold: true
            font.family: Theme.codeFontFamily
            color: readoutStat.valueColor
        }
    }
}