/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.chat-form-wrapper {text-align:center;}
.chat-form-wrapper #chat-form textarea {background: #444;border-radius: 24px;padding: 15px;height: 120px;box-shadow: 0 0 5px 1px #333;outline: none;color:#ddd;}
.chat-form-wrapper #chat-form textarea:focus {box-shadow: 0 0 5px 1px #fff;}
.chat-form-wrapper form#chat-form {display: flex;flex-direction: column;gap: 15px;margin-bottom: 1rem;}
.chat-form-wrapper form#chat-form button {align-self: anchor-center;padding: 1rem 3rem;}


.chat-form-wrapper {
    display: flex;
    flex-direction: column;
    height: 70vh;
}
div#text-output {
    display: flex;
    flex: 1;
    color: #aaa;
    flex-direction: column;
    align-items: flex-start;
}
.chat-actions {
    position: relative;
}
button#record-button {
    display:none;
    position: absolute;
    bottom: 0;
    right: 0;
}