const defaultMarkup = (id) => (
    `<div id="${id}">
        <chat>
            <style>
                #${id}.chatHolder {
                    display: grid;
                    grid-template-rows: 1fr 100px;
                    background-color: white;
                }
                
                #${id}.chatText {
                    display: flex;
                    flex-direction: column;
                    align-items: flex-start;
                    gap: 1em;
                    height: calc(100vh – 40px – 100px – 100px – 100px);
                    padding: 1em;
                    overflow-y: auto;
                }
                
                #${id}.form {
                    display: grid;
                    grid-template-columns: 1fr 100px;
                    border-top: 1px solid #eee;
                }
                
                #${id}.textarea {
                    padding: 1em;
                    border: 0;
                    font-family: Arial, Helvetica, sans-serif;
                    font-size: 1.2em;
                }
                
                #${id}.button {
                    border: 0;
                    font-weight: bold;
                    font-size: 1.4em;
                    color: white;
                    background: linear-gradient(to right, #363795, #005C97);
                }
                
                #${id}.button:hover {
                    background: linear-gradient(90deg, rgba(54, 55, 149, 1) 0%, rgba(0, 92, 151, 1) 62%, rgba(0, 125, 205, 1) 100%);
                }
                
                #${id}.button:disabled,
                #${id}.button:hover:disabled {
                    background: linear-gradient(to right, #363795, #005C97);
                    opacity: 0.5;
                }
                
                #${id}.message {
                    flex-grow: 0;
                    padding: 1em;
                    border-radius: 10px;
                    border-bottom-left-radius: 0;
                    background-color: #eef5f8;
                }
            </style>
        
            <div class="chatHolder">
                <div class="chatText">
                    <div class="messageEnd"></div>
                </div>
                <div class="form">
                    <textarea class="textarea"></textarea>
                    <button class="button">Send</button>
                </div>
            </div>
        </chat>
    </div>`
);