.init-modal{width:100%;height:100%;position:fixed;left:0;top:0;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:1;background:var(--chat-background)}.init-modal h3{font-weight:300;color:#777}.init-modal input.username{width:350px;max-width:80%;height:55px;background-color:#eee;margin-top:25px;color:var(--chat-text-color);font-size:13px;background:var(--chat-panel-background);border-radius:12px;padding:0 1em;border:none}.init-modal input.username:focus{outline:none}.init-modal .chat__conversation-panel{background:var(--chat-panel-background);border-radius:12px;padding:0 1em;height:55px;margin:25px 0 0;width:350px;max-width:80%}.init-modal .chat__conversation-panel__container{display:flex;flex-direction:row;align-items:center;height:100%}.init-modal .chat__conversation-panel__button{background:grey;height:20px;width:30px;border:0;padding:0;outline:none;cursor:pointer;position:relative}.init-modal .chat__conversation-panel .send-message-button{background:var(--chat-send-button-background);height:30px;min-width:30px;border-radius:50%;transition:.3s ease}.init-modal .chat__conversation-panel .send-message-button:active{transform:scale(.97)}.init-modal .chat__conversation-panel .send-message-button svg{margin:1px -1px;stroke:#fff;fill:#fff;width:50%;height:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.init-modal .chat__conversation-panel__input{width:100%;height:100%;outline:none;position:relative;color:var(--chat-text-color);font-size:13px;background:transparent;border:0;font-family:Lato,sans-serif;resize:none}.--dark-theme{--vh:100svh;--chat-background:#1d1d1d;--chat-panel-background:#2f3236;--chat-bubble-background:#383b40;--chat-owner-bubble-background:#0086ff;--chat-bubble-active-background:#171a1b;--chat-add-button-background:#212324;--chat-send-button-background:#8147fc;--chat-text-color:#b5b7ba;--chat-options-svg:#a3a3a3}html{height:100%;scroll-behavior:smooth}body{margin:0;background:url(../img/background.7a819295.jpeg);background-size:cover}#chat{background:var(--chat-background);max-width:600px;margin:25px auto;box-sizing:border-box;padding:1em .5em 1em 1em;border-radius:12px;position:relative;overflow:hidden}#chat:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}#chat .btn-icon{position:relative;cursor:pointer}#chat .btn-icon svg{stroke:#fff;fill:#fff;width:50%;height:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#chat .chat__conversation-board{padding:1em 0 2em;height:calc(100vh - 105px - 5.5em);overflow:auto}#chat .chat__conversation-board::-webkit-scrollbar{width:6px}#chat .chat__conversation-board::-webkit-scrollbar-track{background:hsla(0,0%,100%,.2);border-radius:20px}#chat .chat__conversation-board::-webkit-scrollbar-thumb{border-radius:20px;background:var(--chat-text-color)}#chat .chat__conversation-board::-webkit-scrollbar-thumb:hover{background:var(--chat-text-color)}#chat .chat__conversation-board__message-container.reversed{flex-direction:row-reverse}#chat .chat__conversation-board__message-container.reversed .chat__conversation-board__message__bubble{position:relative;text-align:right}#chat .chat__conversation-board__message-container.reversed .chat__conversation-board__message__bubble .message__text{border-radius:20px 20px 0 20px;background:var(--chat-owner-bubble-background);color:#fff}#chat .chat__conversation-board__message-container.reversed .chat__conversation-board__message__bubble .message__text:not(:last-child){margin:0 0 2em 0}#chat .chat__conversation-board__message-container.reversed .chat__conversation-board__message__person{margin:0 0 0 1.2em}#chat .chat__conversation-board__message-container.reversed .chat__conversation-board__message__options{align-self:center;position:absolute;left:0;display:none}#chat .chat__conversation-board__message-container{position:relative;display:flex;flex-direction:row}#chat .chat__conversation-board__message-container:hover .chat__conversation-board__message__options{display:flex;align-items:center}#chat .chat__conversation-board__message-container:hover .option-item:not(:last-child){margin:0 .5em 0 0}#chat .chat__conversation-board__message-container:not(:last-child){margin:0 0 2em 0}#chat .chat__conversation-board__message__person{text-align:center;margin:0 1.2em 0 0}#chat .chat__conversation-board__message__person__avatar{height:35px;width:35px;overflow:hidden;border-radius:50%;-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative}#chat .chat__conversation-board__message__person__avatar:before{content:"";position:absolute;height:100%;width:100%}#chat .chat__conversation-board__message__person__avatar img{height:100%;width:auto}#chat .chat__conversation-board__message__person__nickname{font-size:9px;color:#484848;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:none}#chat .chat__conversation-board__message__context{max-width:80%;align-self:flex-end;padding-right:.5em}#chat .chat__conversation-board__message__options{align-self:center;position:absolute;right:0;display:none}#chat .chat__conversation-board__message__options .option-item{border:0;background:0;padding:0;margin:0;height:16px;width:16px;outline:none}#chat .chat__conversation-board__message__options .emoji-button svg,#chat .chat__conversation-board__message__options .more-button svg{stroke:var(--chat-options-svg);fill:transparent;width:100%}#chat .chat__conversation-board__message__bubble .message__text{width:-moz-fit-content;width:fit-content;display:inline-table;word-wrap:break-word;background:var(--chat-bubble-background);font-size:14px;color:var(--chat-text-color);padding:15px;line-height:1.5;border-radius:20px 20px 20px 0;font-family:Lato,sans-serif}#chat .chat__conversation-board__message__bubble .message__text .message__name{font-size:1em;font-weight:700;margin-bottom:3px;color:#fff}#chat .chat__conversation-board__message__bubble .message__text .message__name span{margin-left:5px}#chat .chat__conversation-board__message__bubble:not(:last-child){margin:0 0 .3em}#chat .chat__conversation-board__message__bubble:active{background:var(--chat-bubble-active-background)}#chat .chat__conversation-panel{background:var(--chat-panel-background);border-radius:12px;padding:0 1em;height:55px;margin:.5em 0 0}#chat .chat__conversation-panel__container{display:flex;flex-direction:row;align-items:center;height:100%}#chat .chat__conversation-panel__container .panel-item:not(:last-child){margin:0 1em 0 0}#chat .chat__conversation-panel__button{background:grey;height:20px;width:30px;border:0;padding:0;outline:none;cursor:pointer}#chat .chat__conversation-panel .add-file-button{height:23px;min-width:23px;width:23px;background:var(--chat-add-button-background);border-radius:50%}#chat .chat__conversation-panel .add-file-button svg{width:70%;stroke:#54575c}#chat .chat__conversation-panel .emoji-button{min-width:23px;width:23px;height:23px;background:transparent;border-radius:50%}#chat .chat__conversation-panel .emoji-button svg{width:100%;fill:transparent;stroke:#54575c}#chat .chat__conversation-panel .send-message-button{background:var(--chat-send-button-background);height:30px;min-width:30px;border-radius:50%;transition:.3s ease}#chat .chat__conversation-panel .send-message-button:active{transform:scale(.97)}#chat .chat__conversation-panel .send-message-button svg{margin:1px -1px}#chat .chat__conversation-panel__input{width:100%;height:100%;outline:none;position:relative;color:var(--chat-text-color);font-size:13px;background:transparent;border:0;font-family:Lato,sans-serif;resize:none}@media only screen and (max-width:600px){#chat{margin:0;border-radius:0}#chat .chat__conversation-board{height:calc(var(--vh) - 55px - 5.5em)}#chat .chat__conversation-board__message__options{display:none!important}}