test.html:

In this html I have a input function and a lightining-button component
The code is as below.

<template>
    
            <lightning-button-group style="float:right;">
            <input type="number" value="" style="width:60px;float:right;border:1px solid grey;"></input>        
                <lightning-button label="Add" ></lightning-button>
                <lightning-button-icon icon-name="utility:delete" variant="border-filled" alternative-text="Delete"></lightning-button-icon>
            </lightning-button-group><br/><br/>
            
</template>

test.js:

Here based on the input value in the html code I need to enable or disable a Add button in the html code.
The condition is if input value is o or less than o the ad buttoin should be disabled, otherwise it should get enable.

the code is as below:

import { LightningElement } from 'lwc';
export default class ButtonGroupBasic extends LightningElement {
    renderedCallback() {
        let inp = this.template.querySelector('input');
        let test = this.template.querySelector('lightning-button');
        if(inp <= 0){
            test.disabled = true;
        }
        else{
            test.disabled = false;
        }
         
    }
}

The Disbaled function is not working.
Please let me know where I am going wrong in this code.