button.Login-button:disabled {
    color: gray;
    background-image: url(../images/loading.gif);
    background-repeat: no-repeat;
    background-position: 100px;
}

.ChatBox {
    position: relative;
}

    .ChatBox:after {
        content: "";
        position: absolute;
        height: 100%;
        width: 0px;
        border: 1px dashed #cccccc;
        top: 1rem;
        left: 1.2rem;
    }

.QHeader {
    display: flex;
    align-items: center;
    margin-top: 0.9rem;
}

span.yQ {
    background: var(--blue-bg); /*#edf6fc;*/
    padding: 0.5rem 0.5rem;
    border-radius: 2rem;
    position: relative;
    z-index: 1;
    color: white; /*#1e78b4;*/
    /*font-size: 0.9rem;*/
    min-height: 40px;
    display: flex;
    align-items: center;
}

    span.yQ img {
        width: 24px;
    }

span.yQWhite {
    background: #ffffff;
    padding: 0.5rem 1.5rem;
    border-radius: 2rem;
    color: #000000;
    /*font-size: 0.9rem;*/
    padding-left: 3.5rem;
    margin-left: -3rem;
    min-height: 40px;
    display: flex;
    align-items: center;
}

.QBody {
    background: #ffffff;
    padding: 0.8rem;
    border-radius: 0.8rem;
    width: calc(100% - 2rem);
    margin-left: 2rem;
    margin-top: 0.8rem;
    box-shadow: 0px 6px 12px #00000010;
    position: relative;
}

    .QBody > span {
        font-size: 0.9rem;
        color: black;
        word-wrap: break-word;
    }

    .QBody .action_list li.chartBtn, .QBody .action_list li.tabularBtn {
        cursor: pointer;
    }

    .QBody .action_list li svg {
        fill: #c6c6c6;
    }

    .QBody .action_list li.active svg {
        fill: #1e78b4;
    }

#barChart {
    height: 150px;
}

.QBodyBottom {
    background: #f4f4f4;
    padding: 2.3rem 0.8rem 0.8rem 0.8rem;
    border-radius: 0.8rem;
    width: calc(100% - 2rem);
    margin-left: 2rem;
    margin-top: -1.5rem;
}

    .QBodyBottom button {
        background: #ffffff;
        border: 1px solid #ffffff;
        color: #008dc6;
        border-radius: 1rem;
        padding: 0.3rem 0.7rem;
        margin: 0 0.3rem;
        /*font-size: 0.75rem;*/
    }

        .QBodyBottom button:hover {
            border: 1px solid #008dc6;
        }

.QBody .pininactive img {
    mix-blend-mode: luminosity;
    opacity: 0.5;
}

.ChatBoxOuter {
    height: calc(100vh - 8rem);
    overflow: auto;
    padding-right: 0.5rem;
    margin-right: -1rem;
    background: #F4F5FF; /*#eaeaea;*/
    /*border-radius: 0.8em;*/
    padding: 0px 15px 10px 10px;
    margin-right: 10px;
}

.CreateProjectForm {
    height: calc(100vh - 8rem);
    overflow: auto;
    width: 100% !important;
}


    .CreateProjectForm .form-control {
        font-size: 0.8rem;
        color: #000 !important;
    }

    .CreateProjectForm .form-select {
        font-size: 0.8rem;
        color:#000 !important;
    }

    .CreateProjectForm textarea.form-control {
        height: 100px !important;
        color: #000 !important;
    }

    .CreateProjectForm .form-label {
        display: inline-block;
        color: #000 !important;
    }

    .CreateProjectForm .fieldInfo, #tabContainer .fa-question-circle {
        color: deepskyblue;
        cursor: pointer;
        font-size: 1.3em;
    }
/*.title_section {
    font-size: 1rem;
}
.title_section_left .form-control {
    font-size: 1rem;
}*/
.QBody div {    
    width: 100%;
    font-size: 0.6rem;
    display: block;
}

    .QBody div.comments, .QBody div.table-responsive {
        font-size: 0.9rem;
    }

.ButtonsOuter {
    background: #ffffff;
    padding: 0.4rem;
    border-radius: 0.6rem;
    height: 30px;
    white-space: nowrap;
}

    .ButtonsOuter button {
        color: #000;
        border: 0px;
        border-right: 1px solid rgba(112, 112, 112, 0.11);
        background: #ffffff;
        padding: 0 0.6rem;
    }

        .ButtonsOuter button:last-child {
            border-right: 0;
        }

        .ButtonsOuter button:hover {
            color: #1e78b4;
        }

        .ButtonsOuter button svg {
            fill: #707070;
            margin-left: 5px;
        }

        .ButtonsOuter button:hover svg {
            fill: #1e78b4;
        }

.CreateProjectForm .mb-3 {
    margin: 0px !important;
    padding: 5px 20px 5px 5px;
}

.login_fields button {
    font-size: 1rem;
}

.build_invite_section .col-8 {
    padding-right: 25px !important;
}

.editor_code {
    background: white;
}

.PromptMain {
    font-size: 0.8rem;
    min-height: 25rem;
}

.prePrompt {
    max-width: 100%;
}

    .prePrompt p {
        font-size: 0.8rem !important;
        height: 15rem;
        max-height: 20rem;
        border: 1px solid #dee2ff;
        padding: 10px;
    }

.PromptMain ul li.active {
    background-color: #dee2ff;
    font-size: 0.8rem;
    font-weight: 600;
    margin: 0;
    /*padding: 0.6rem;*/
    color: var(--black-text);
}

.PromptMain h4 {
    font-size: 0.9rem;
}

.page_area {
    height: calc(100vh - 5rem);
}

.build_invite_section {
    height: calc(100vh - 8rem);
}

.search_section {
    position: fixed;
    bottom: 0px;
    width: calc(100vw - 10rem);
    max-width: 100%;
}

.project_name_wrap textarea.form-control {
    min-height: 100px;
    font-size: 0.9rem;
}

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

.msg-body ul li.sender {
    background-image: url(../images/chatbot.png);
    background-repeat: no-repeat;
    background-position-x: left;
    background-position-y: 5px;
}

    .msg-body ul li.sender p, .msg-body ul li.sender > div, .msg-body ul li.sender:before {
        margin-left: 30px;
    }

        .msg-body ul li.sender span.time {
            margin-left: 40px;
        }


.msg-body ul li.reply {
    background-image: url(../images/user.png);
    background-repeat: no-repeat;
    background-position-x: right;
    background-position-y: 5px;
}

    .msg-body ul li.reply p, .msg-body ul li.reply:before {
        margin-right: 30px;
    }

    .msg-body ul li.reply span.time {
        margin-right: 40px;
    }

.bullet_dropdown li:hover, .bullet_dropdown li:hover a {
    background-color: lightgray !important;
}

table#tblWorkflowUploadItem td {
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 200px;
    overflow: hidden;
}

span.form-control {
    border: 0px;
}

.workflowUploadItemID {
    font-size: 1rem;
    font-weight: bold;
    text-align: right;
}

.table-hover td {
    vertical-align: middle;
}

table.table-hover a {
    color: black;
    padding-left: 5px;
    padding-right: 5px;
}

.dataTables_length label {
    white-space: nowrap;
}

.dataTables_length select {
    display: inline;
}

i.fa {
    cursor: pointer;
}

strong.form-label {
    font-size: 0.9rem;
    font-weight: normal;
}


.alert-danger {
    color: #842029;
    background-color: #f8d7da !important;
    border-color: #f5c2c7;
}

.alert-warning {
    color: #664d03;
    background-color: #fff3cd !important;
    border-color: #ffecb5;
}

.alert-success {
    color: #0f5132;
    background-color: #d1e7dd !important;
    border-color: #badbcc;
}