import QtQuick
import QtQuick.Effects
import "." as M

Item {
    id: root

    default property alias content: row.children
    property color borderColor: M.Theme.base02

    visible: row.visibleChildren.length > 0

    implicitWidth: row.implicitWidth + _pad * 2
    implicitHeight: row.implicitHeight + _pad * 2

    readonly property int _pad: 6

    // Shadow source — rendered offscreen, only its glow is visible
    Rectangle {
        id: shadowSource
        anchors.fill: parent
        color: "transparent"
        border.color: root.borderColor
        border.width: 1
        radius: M.Theme.radius
        visible: false
    }

    MultiEffect {
        source: shadowSource
        anchors.fill: shadowSource
        shadowEnabled: true
        shadowColor: root.borderColor
        shadowBlur: 1.0
        shadowVerticalOffset: 0
        shadowHorizontalOffset: 0
    }

    // Background gradient — accent color fading down, connects to bar's top gradient
    Rectangle {
        anchors.fill: parent
        radius: M.Theme.radius
        gradient: Gradient {
            GradientStop { position: 0; color: Qt.rgba(root.borderColor.r, root.borderColor.g, root.borderColor.b, 0.15) }
            GradientStop { position: 1; color: "transparent" }
        }
    }

    // Visible border (on top of the glow)
    Rectangle {
        anchors.fill: parent
        color: "transparent"
        border.color: root.borderColor
        border.width: 1
        radius: M.Theme.radius
    }

    Row {
        id: row
        anchors.centerIn: parent
        spacing: M.Theme.moduleSpacing + 2
    }
}