.gpt_ux {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 300px;
    background-color: #3b3e49;
}
.bg_chat {
    background-color: #3b3e49; 
}

.ux_left {
    display: flex;
    flex: 0 0 30%;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    background-color: #1d1e20;
    overflow-y: scroll;
}

.ux_right {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    background-color: #3b3e49;
    padding: 20px;
}

.ux_question_container {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.ux_question {
    display: flex;
    align-items: center;
    background-color: #2a2b2c;
    border-radius: 5px;
    padding: 10px;
    margin: 10px;
    position: relative;
}
.ux_question_header {
    display: flex;
    align-items: center;
    background-color: #3e3e3f;
    padding: 10px;
    margin: 10px 10px 0 10px;
    position: relative;
}
.ux_question_header span {
    color:white;
}
.ux_question_nowrap {
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-grow: 1;
    color:white;
}

.ux_icon_message, .ux_icon_pencil, .ux_icon_trash {
    fill: #fff !important;
    width: 20px;
    height: 20px;
    margin: 0 5px;
    color:white;
}

.ux_icon_pencil, .ux_icon_trash {
    position: absolute;
    right: 5px;
}

.ux_icon_pencil {
    top: 5px;
}

.ux_icon_trash {
    bottom: 5px;
}

.input-group .btn {
    position: relative;
    z-index: 2;
    background-color:#efefef;
    border:none;
}
.ux_question_title h1 {
    color:white;
    font: 800 .9rem Montserrat, sans-serif;
}
.ux_question_answer {
    display:flex;
    flex-flow:column;
    align-items:flex-end;
    justify-content:flex-end;
    text-align:right;
}
.ux_question_answer p{
    font: 400 .9rem Montserrat, sans-serif;
    color:rgb(155, 234, 102);
    text-align:right;
}
.ux_dialog {
    display:flex;
    flex-flow:column;
    align-items: flex-end;
}
