/* custom styles */

body, html {
    height: 100%;
}

.bg-color {
    background-color: #1863ed;
}

.navbar {
    padding-top: 12px;
    padding-bottom: 16px;
    color: white;
    min-height: 64px;
}

.navbar-brand {
    position: absolute;
    margin-left: 4px;

}

.navbar-title {
    font-size: 24px;
    margin: 0 auto;
}

.navbar-right-menu {
    right: 0;
    position: absolute;
    margin-right: 16px;
}

.navbar a {
    text-decoration: none;
    color: white;
}


input#email, input#password {
    width: 100%;
}


button.btn, button.btn-success {
    border-radius: 0 !important;
    background-color: #1863ed;
    border: none;
    &:hover {
        background-color: #4f86ec;
    }
}



.chat {
    /* min-height: 400px; */
    /* border: 1px solid rgb(189, 196, 202);
    border-radius: 24px;
    box-shadow: inset 0 0 4px #9ba7b5; */
    overflow-y: auto;
    flex-basis: 0 !important;
}


.chat-question {
    background-color: #dbe1ec;
    border: none;
    border-radius: 24px;
    padding: 16px 24px;
    float: right;
    clear: both;
    margin: 12px 24px 12px 0;
    max-width: 80%;
}

.chat-answer-container {
    padding: 16px 24px;
    float: left;
    clear: both;
    margin: 12px 0;
    max-width: 80%;
    display: flex;
}

.loader {
    width: 42px;
    height: 42px;
    margin-left: 12px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><path fill="%23dbe1ec" stroke="%23dbe1ec" stroke-width="2" transform-origin="center" d="m148 84.7 13.8-8-10-17.3-13.8 8a50 50 0 0 0-27.4-15.9v-16h-20v16A50 50 0 0 0 63 67.4l-13.8-8-10 17.3 13.8 8a50 50 0 0 0 0 31.7l-13.8 8 10 17.3 13.8-8a50 50 0 0 0 27.5 15.9v16h20v-16a50 50 0 0 0 27.4-15.9l13.8 8 10-17.3-13.8-8a50 50 0 0 0 0-31.7Zm-47.5 50.8a35 35 0 1 1 0-70 35 35 0 0 1 0 70Z"><animateTransform type="rotate" attributeName="transform" calcMode="spline" dur="1" values="0;120" keyTimes="0;1" keySplines="0 0 1 1" repeatCount="indefinite"></animateTransform></path></svg>');
}

.chat-answer-icon {
    width: 42px;
    height: 42px;
    /* border-radius: 50%; */
}

.chat-answer {
    margin-left: 24px;
}

.user-form {
    margin: 24px auto 48px auto;
    box-shadow: -48px 0 16px 34px #fff;
    flex-basis: 0 !important;
}

.user-text {
    height: 96px;
    background-color: #dbe1ec;
    border: none;
    border-radius: 24px;
    padding: 0 24px;
    outline: none;
}