body {
    font-family: sans-serif;
    background-color: #2A2A2A;
    color: #ffffff;
}

.chart-session  {
    display:flex;
    flex-direction:row;
    justify-content: space-between;
    flex-wrap:nowrap;
}

.chart-session.collapse {
    border-radius: 0.8rem;
    border:solid 1px whitesmoke;
    padding:0px 16px 0px 16px !important;
}

.ai-response{
    background-color: #303030;
    border-radius: 0.8rem;
    padding:8px 0px 8px 0px;
}

.ai-response >p{
    padding:0px 16px 0px 16px !important
}

.ai-response >div{
    margin:16px !important;
}

#chat-box {
    overflow-y: auto;
    scrollbar-width: thin;
}

#buttons-container{
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
}
#buttons-container>div {
   border-radius: 1.2rem;
   border: solid 1px #808080 !important;
   margin-right: 8px;
   height: 38px;
   margin-top:8px;
}

#buttons-container>div:hover {
   border-color: whitesmoke;
   background-color: #808080;
}
.button-container{
    border: solid 1px #808080 !important;
   margin-right: 8px;
   border-radius: 1.2rem;
   background-color: #808080;

}
.button-container>div {
    font-family: serif;
    font-size: 0.875rem;
    margin: 8px 16px;
    margin-right: 10px;
    cursor: pointer;
    color: lightgray;
    border: none;
    background-color: #808080;

}

.button-container>div:hover,.button-container>.selected {
    color: #303030;
    border: solid 1px whitesmoke;
    background-color: whitesmoke;
    border-radius: 0.8rem;
}


#buttons-container button {
    font-family: serif;
    font-size: 1.1rem;
    margin: 8px 16px;
    margin-right: 10px;
    cursor: pointer;
    color: #808080;
    border: none;
    background-color: #2A2A2A;

}

#buttons-container>div:hover button  {
    color: whitesmoke;
    background-color: #808080;
}

#message-box {
    border-radius: .5rem;
    background-color: white;
    height: 100px;
    margin-bottom: 10px;
    margin-top: 10px
}

    #message-box textarea {
        outline: none;
        height: 90%;
        width: 99%;
        border: none;
        border-radius: .5rem;
        margin-top: 5px;
        margin-bottom: 5px;
    }



#initial-message {
    color: white;
    margin-bottom: 15vh;
}
