:root {
    --chat--toggle--background: #895dda !important;
    --chat--toggle--hover--background: #6628dc !important;
    --chat--toggle--active--background: #3f1886 !important;
    --chat--message--bot--background: #dddddd;
    --chat--toggle--width: 60px !important;
    --chat--toggle--height: 60px !important;
    --chat--window--background: #ffffff !important;
    --chat--color--primary: #6628dc;
    --chat--header--background: #ffffff !important;
    --chat--header--color: black !important;
    --chat--message--border-radius: 1rem !important;
    --chat--message--user--background: #6628dc !important;
    --chat--input--send--button--color: #3f1886;
    --chat--spacing: 0.9rem;
    --chat--message--font-size: 0.9rem;
    --chat--message--padding: 0.725rem;
    --chat--header--padding: 0.725rem;
    --chat--window--width: 320px;
    --chat--window--height: 450px;
}

.chat-messages-list {
    background-color: #ffffff !important;
}

.chat-body {
    background-color: #ffffff !important;
}

@font-face {
    font-family: 'Host Grotesk';
    src: url('./fonts/HostGrotesk-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

.chat-heading {
    display: flex;
    align-items: center !important;

    h1 {
        margin: 0;
    }
}

.chat-heading::before {
    content: '';
    margin-right: 1rem;
    width: 30px;
    height: 30px;
    background-image: url('./avatar.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.chat-powered-by {
    display: none;
}

.chat-window-wrapper,
.n8n-chat,
.chat-window,
.chat-layout {
    border-radius: 1rem !important;
}

.chat-heading {
    justify-content: left;
    font-family: 'Host Grotesk', sans-serif;
    color: black;
    font-size: 10px;
    align-items: unset;
}

.chat-messages-list {
    border-bottom: 1px solid transparent;
}

.chat-layout .chat-footer {
    border-top: none !important;
}

.chat-inputs {
    align-items: center !important;
}

.chat-inputs textarea[data-test-id="chat-input"] {
    font-family: 'Poppins', sans-serif;
    border-radius: 1rem !important;
    border: 1px solid #c0c0c0 !important;
    font-size: 0.9rem;
    outline: none;
    resize: none;
    display: flex;
    align-items: center;
    line-height: 1.5;
    margin: 0.5rem 0.0 0.5rem 1rem !important;
}

.chat-inputs textarea[data-test-id="chat-input"]::placeholder {
    font-family: 'Poppins', sans-serif;
    color: #777980;
    line-height: 1.5;
}

.chat-input-send-button {
    padding: 4px;
    background-color: transparent !important;
}

.chat-message-markdown {
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    line-height: 1.5;

}

.chat-message-typing .chat-message-typing-circle {
    width: 8px;
    height: 8px;
    margin: 3px 2px;
}

@media (min-width: 980px) and (min-height: 800px) {
    :root {
        --chat--window--width: 420px !important;
        --chat--window--height: 600px !important;
    }

    .chat-heading::before {
        width: 35px;
        height: 35px;
    }

    .chat-inputs textarea[data-test-id="chat-input"] {
        font-size: 1rem;
        height: 52px !important;
    }

    .chat-message-markdown {
        font-size: 1rem;
    }
}