import QtQuick
import QtQuick.Controls

TextField {
    id: control

    property color accentColor: "#00f2ff"
    property color bgColor: "#1a1a20"

    Accessible.role: Accessible.EditableText
    Accessible.name: control.placeholderText || "Text input"

    placeholderTextColor: SettingsStyle.textDisabled
    color: "#ffffff"
    font.family: "JetBrains Mono"
    font.pixelSize: 14
    selectedTextColor: "#000000"
    selectionColor: accentColor

    background: Rectangle {
        implicitWidth: 200
        implicitHeight: 40
        color: control.bgColor
        border.color: control.activeFocus ? control.accentColor : SettingsStyle.borderSubtle
        border.width: control.activeFocus ? SettingsStyle.focusRingWidth : 1
        radius: 6

        Behavior on border.color { ColorAnimation { duration: 150 } }
    }
}