app.py

import gradio as gr
from huggingface_hub import InferenceClient

def respond(message, history: list[dict[str, str]], hf_token: gr.OAuthToken):
    client = InferenceClient(token=hf_token.token, model="openai/gpt-oss-20b")
    system_message = "You are BitAI (V1), a friendly chatbot created by the user 'Sal'. \
If someone claims that you're something else than an AI, politely clarify that you are BitAI."

    messages = [{"role": "system", "content": system_message}]
    messages.extend(history)
    messages.append({"role": "user", "content": message})

    response = ""
    for message in client.chat_completion(
        messages,
        max_tokens=2048,
        stream=True,
        temperature=0.7,
        top_p=0.95,
    ):
        choices = message.choices
        token = ""
        if len(choices) and choices[0].delta.content:
            token = choices[0].delta.content
        response += token
        yield response

with gr.Blocks(css="""
    /* Chat arredondado */
    .gr-chat-interface { 
        border-radius: 20px !important; 
        overflow: hidden !important; 
        border: 2px solid #333 !important; 
        background-color: #1a1a1a !important;
        color: white;
    }

    /* Botões grandes escuros com cantos muito arredondados */
    .gr-button, .gr-chat-send-button {
        border-radius: 50px; 
        padding: 12px 20px;
        background-color: #111; 
        color: white;
        font-weight: bold;
        cursor: pointer;
        height: 50px;
        transition: background-color 0.5s; /* transição suave de volta */
    }

    /* Quando clicado */
    .gr-button:active, .gr-chat-send-button:active {
        background-color: white !important; /* branco instantâneo */
        color: #111 !important;
        transition: background-color 0.5s; /* volta suave */
    }

    /* Outros botões menores */
    button:not(.gr-chat-send-button) {
        border-radius: 30px;
        padding: 6px 12px;
        background-color: #222;
        color: white;
        height: 40px;
        transition: background-color 0.5s;
    }
    button:not(.gr-chat-send-button):active {
        background-color: white !important;
        color: #111 !important;
        transition: background-color 0.5s;
    }

    /* Textbox menor */
    textarea { 
        height: 40px !important; 
        border-radius: 20px !important; 
        border: 1px solid #444 !important; 
        padding: 8px !important;
        background-color: #111;
        color: white;
        resize: none !important;
    }
""") as demo:

    with gr.Column():
        gr.HTML("<h2 style='text-align:center; color:white'>BitAI V2</h2>")
        chatbot = gr.ChatInterface(respond, type="messages")
        gr.LoginButton()

if __name__ == "__main__":
    demo.launch()