@charset "utf-8";
/* CSS Document */
/* © 2022 EX3 Inc. All Rights Reserved. */


/******************CHAT****************************/
  /* Container styling to control the size and placement on your page */
.chat-container {
	width: 400px;
	height: 80%;
	border: 1px solid #ccc;
	border-radius: 8px;
	overflow: hidden;
	box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.input-box-wrapper {
	background:black;
}

.input-content-wrapper {
	height: 50px !important
}

:host-context(.chat-wrapper) {
	border: none !important;
}

.chat-wrapper.expanded {
    position: fixed !important;
    left: 0%;
    bottom: 40px;
    height: 80%;
    width: 19.5%;
    z-index: -9;
}

.titlebar-wrapper {
	display: none !important;
}



/* GOOGLE CHAT FILLS OUR PANEL */

.chat_holder df-messenger {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;

    /* EX3 styling */
    --df-messenger-font-family: 'Playfair Display';
	/* --df-messenger-font-size:1em; */
    /* --df-messenger-primary-color: #ffffff; */
    /* --df-messenger-font-color: #000000; */
    --df-messenger-chat-background: rgba(0,0,0,0.0);
    --df-messenger-chat-border: none;
    --df-messenger-chat-border-radius: 0;
    /* Header */
    --df-messenger-titlebar-background: transparent;
    --df-messenger-titlebar-font-color: rgba(255,255,255,0.1);
	--df-messenger-titlebar-font-size: 1em;
    --df-messenger-titlebar-border-bottom: 1px solid rgba(255,255,255,.18);
    --df-messenger-titlebar-padding: 5px;

	/* --df-messenger-internal-input-color:purple; */
	--df-messenger-internal-input-font-color:purple;
	--df-messenger-internal-input-font-size: 5;

    /* Agent messages */
    --df-messenger-message-bot-background: transparent;
    --df-messenger-message-bot-font-color: #ffffff;
	--df-messenger-message-bot-font-weight: 400;
    /* User messages */
    --df-messenger-message-user-background: transparent;
    --df-messenger-message-user-font-color: rgba(255,255,255,0.3);

    /* Input */

    --df-messenger-input-background: transparent;
	/* --df-messenger-input-font-color: #000000; */
	
    --df-messenger-input-border-top: none;
    --df-messenger-input-box-border-radius: 5px;
    --df-messenger-input-padding: 5px;

    /* Send */

    --df-messenger-send-icon-color: rgba(255,255,255,0.5);
    --df-messenger-send-icon-color-hover: rgba(255,255,255,0.75);
    --df-messenger-send-icon-color-active: #ffffff;

    /* AGENT-GENERATED BUTTONS */
    --df-messenger-button-background: #191919;
    --df-messenger-button-font-color: #000000;
    --df-messenger-button-border: 1px solid rgba(255,255,255,.18);
    --df-messenger-button-border-radius: 8px;
    --df-messenger-button-padding: 14px;
    --df-messenger-button-text-align: left;

}

/* CRITICAL — DON'T GIVE CHAT ITS OWN WIDTH */

.chat_holder df-messenger-chat {

    display: block;

    width: 100%;

    height: 100%;

}