/*------------------------------------*/
/*------- FORM CHAT ALL ON PAGE-------*/
/*------------------------------------*/

.txt-form-heading,
.chatall-header {
    display: none;
}

.submit-button span {
    display: none;
}

#messageQuestions {
    position: absolute;
    bottom: 0;
    right: -100px;
}

.bloc-form-chatall {
    background-color: #212121;
    border-radius: 15px;
    border: 3px solid #717171;
    position: relative;
}

.bloc-form-chat {
    margin-bottom: 0;
    background-color: #212121;
    border-top: 3px solid #717171;
    border-radius: 0 0 15px 15px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 6px 14px 6px 10px;
}

.bloc-form-chat input {
    margin-bottom: 5px;
}

/* .bloc-form-chat input#pseudo {
    margin-top: 4px;
} */

.bloc-form-chat textarea,
.bloc-form-chat input {
    border: none;
    padding: 0.4em 2.8em 0.35em 0.7em;
    height: 30px;
    background-color: #fff;
    color: #323232;
    border-radius: 30px;
    font-size: 0.9em;
    font-family: Arial,Helvetica,sans-serif;
    resize: none;
    width: 100%;
    transition: all ease 0.3s;
}

.bloc-form-chat textarea {
    margin-top: 0.5px;
}

.bloc-form-chat .fieldContainer {
    position: relative;
    display: block;
}

.bloc-form-chat .fieldContainer span {
    display: none;
    position: absolute;
    top: -43px;
    right: 10px;
    z-index: 99;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    color: #ffffff;
    padding: 0.5em 1em;
    font-size: 0.9em;
    border-radius: 5px;
    font-family: Arial,Helvetica,sans-serif;
    background-color: rgb(180 117 117);
    border: 2px solid #d00101;
}
.bloc-form-chat .fieldContainer span::after {
    content: "";
    position: absolute;
    bottom: -11px;
    right: 5px;
    width: 10px;
    height: 10px;
    background-color: green;
    width: 18px;
    aspect-ratio: 1/cos(30deg);
    -webkit-clip-path: polygon(50% 100%,100% 0,0 0);
            clip-path: polygon(50% 100%,100% 0,0 0);
    background: linear-gradient(45deg,#d00101,#d00101);
}

.bloc-form-chat button {
    border: none;
    width: 8%;
    background-color: transparent;
    color: rgb(150, 150, 150);
    cursor: pointer;
    font-family: Arial,Helvetica,sans-serif;
    font-weight: 400;
    font-size: 1.3em;
    transition: all ease 0.5s;
    padding: 0;
    /* text-align: right; */
}

.bloc-form-chat button:hover {
    color: rgb(255, 255, 255);
}

.bloc-form-chat .textarea-smiley-and-send-button {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.bloc-form-chat .textarea-and-smiley {
    position: relative;
    width: 90%;
}

.bloc-form-chat #smiley-button {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
    font-size: 1.3em;
    color: #7c7c7c;
    cursor: pointer;
    transition: all ease 0.3s;
}

.bloc-form-chat #smiley-button:hover {
    color: #000000;
}

/* .form-smiley-send-buttons .anonymous-input {
    position: absolute;
    left: 78px;
    top: 12px;
    font-family: Arial,Helvetica,sans-serif;
    color: #fff;
}

.form-smiley-send-buttons .anonymous-input input {
    scale: 1.4;
    margin-right: 7px;
} */

/*---------------------------------*/
/*------- CONTAINER SMILEYS -------*/
/*---------------------------------*/

.container-smileys {
    display: none;
    position: absolute;
    background-color: rgb(83, 83, 83);
    bottom: 0;
    left: 0;
    padding-top: 2em;
    height: 181px;
    border-radius: 10px;
    z-index: 99;
}

.bloc-smileys {
    height: 130px;
    overflow: auto;
    padding: 0 0.5em 0.5em 0.7em;
    font-size: 1.4em;
}

.container-smileys .emoji {
    cursor: pointer;
}

.container-smileys .cross-smileys {
    position: absolute;
    top: 0.5em;
    right: 0.5em;
    font-size: 1.2em;
    color: #fff;
    cursor: pointer;
    width: 18px;
    height: 18px;
    line-height: 1;
}


/*------------------------------------------------*/
/*------- BLOC QUESTIONS & VOTES ON DIRECT -------*/
/*------------------------------------------------*/


.container-free-chat {
    background-color: transparent;
}

.content_free_chat {
    height: 300px;
    padding: 0.4em 0;
    overflow: auto;
}

.content_free_chat .questions {
    padding: 0.2em 1em;
    display: flex;
    flex-direction: row;
    
}

.content_free_chat .bloc-first-letter {
    display: flex;
    width: 100%;
    max-width: 25px;
    height: 25px;
    border-radius: 30px;
    text-align: center;
    margin-right: 5px;
    align-items: center;
}

.content_free_chat .first-letter {
    font-family: Arial,Helvetica,sans-serif;
    font-weight: 600;
    color: #fff;
    font-size: 0.9em;
    margin: auto;
    text-transform: uppercase;
}

.content_free_chat .bloc-pseudo-time-vote {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

.content_free_chat .bloc-pseudo-question-vote {
    overflow: hidden;
    font-family: Arial,Helvetica,sans-serif;
    margin-top: 2px;
}

.content_free_chat .bloc-pseudo-question-vote p {
    margin: 0;
}

.content_free_chat .pseudo {
    margin: 0;
    color: #ffffff;
    font-size: 1em;
    font-weight: bold;
}

.content_free_chat .post-time {
    font-size: 0.8em;
}

.content_free_chat .questions p {
    font-size: 0.85em;
}

.content_free_chat .emoji-chat-first {
    font-size: 2.4em;
}

.content_free_chat .emoji-chat-txt {
    font-size: 1.3em;
}

.content_free_chat .questions .functionVote {
    position: relative;
    margin-top: 1px;
    height: 20px;
    width: 50px;
    font-size: 0.8em;
    overflow: auto;
}

.content_free_chat .post-time,
.content_free_chat .questions .sendVote,
.content_free_chat .questions .functionVote span,
.content_free_chat .questions p {
    color: rgb(177, 177, 177);
}

.content_free_chat .questions .sendVote {
    position: absolute;
    top: 0;
    right: 0;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
    transition: all ease 0.3s;
    font-size: 1em;
}

.content_free_chat .questions .functionVote span {
    font-size: 1em;
    text-align: center;
    font-family: Arial,Helvetica,sans-serif;
    transition: all ease 0.3s;
}

.content_free_chat .adejavote {
    display: none;
    color: rgb(233, 1, 1) !important;
    font-size: 0.9em !important;
    text-align: center;
    font-family: Arial,Helvetica,sans-serif;
    font-weight: 500;
    position: absolute;
    top: 4px;
    left: 0;
}

.content_free_chat .questions .sendVote:hover {
    color: rgb(245, 41, 41);
}
