:root {
	--ft-voice-blue-color: #4A8FFF;
	--ft-chat-green-color: #37D161;
	--ft-video-orange-color: #FF8200;
	--ft-border-gray-color: #F2F2F2;
}

.ft-select-interaction-container {
	background-color: var(--primary-white);
	box-shadow: 0px 4px 12px #000000 !important;
	/* #B1A7A74D; */
	color: #62696E;
	display: flex;
	flex-direction: column;
	font-family: var(--font-primary-regular) !important;
	height: 100%;
	justify-content: space-between !important;
	max-height: calc(100% - 50px);
	padding: 25px;
	position: fixed;
	right: 0px;
	bottom: 0px;
	-webkit-transition: all 0.6s;
	/* Safari prior 6.1 */
	transition: all 0.6s;
	width: 350px;
	z-index: 6000000 !important;
	font-size: initial !important;
}

.ft-select-interaction-container button {
	background-color: white !important;
	color: black !important;
	padding: 0px 0px 0px 0px !important;
	text-transform: none !important;
}

.ft-select-interaction-container button:before {
	display: none;
}

.ft-select-interaction-container div,
.ft-select-interaction-container button {
	display: inline-block;
}

.ft-select-interaction-container .ft-interaction-button,
#ft_interactions_available_for_call .ft-interaction-button {
	background-color: #FFFFFF !important;
	border-radius: 8px !important;
	box-shadow: 0px 6px 16px #00000038 !important;
	color: black !important;
	cursor: pointer !important;
	font-size: 1.2em !important;
	margin: 9px 0px 10px 0px !important;
	padding: 18px 0px 18px 0px !important;
	outline: none !important;
	text-align: left !important;
	text-transform: none !important;
	width: 100% !important;
	-webkit-user-select: none !important;
	-moz-user-select: none !important;
	-ms-user-select: none !important;
	user-select: none !important;
}

.ft-select-interaction-container .ft-interaction-button:disabled,
#ft_interactions_available_for_call .ft-interaction-button:disabled {
	cursor: not-allowed !important;
	opacity: 0.5;
}

#ft_interactions_available_for_call .ft-widget-submit-button {
	text-align: center !important;
	width: 100% !important;
}

#ft_interactions_available_for_call .ft-widget-submit-button:active {
	background-color: var(--ft-widget-blue-color) !important;
	color: var(--primary-white) !important;
}

.ft-select-interaction-container .ft-interaction-selection-button-icon,
#ft_interactions_available_for_call .ft-interaction-selection-button-icon {
	vertical-align: top !important;
}

.ft-select-interaction-container .ft-voice-interaction-button .ft-interaction-selection-button-icon,
#ft_interactions_available_for_call .ft-voice-interaction-button .ft-interaction-selection-button-icon {
	background-color: var(--ft-voice-blue-color) !important;
	height: 19.5px !important;
	width: 10.39px !important;
	margin: 0px 24px 0px 28px !important;
	mask: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=mute_audio.png&component=branch') center center !important;
	mask-size: 19.5px 10.39px !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-image: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=mute_audio.png&component=branch') !important;
	-webkit-mask-position: center center !important;
	-webkit-mask-size: contain !important;
	-webkit-mask-repeat: no-repeat !important;
}

.ft-select-interaction-container .ft-voice-interaction-button:active,
.ft-select-interaction-container .ft-select-interaction-container-interaction-selected .ft-voice-interaction-button,
#ft_interactions_available_for_call .ft-voice-interaction-button:active {
	background-color: var(--ft-voice-blue-color) !important;
}

.ft-select-interaction-container .ft-video-interaction-button .ft-interaction-selection-button-icon,
#ft_interactions_available_for_call .ft-video-interaction-button .ft-interaction-selection-button-icon {
	background-color: var(--ft-video-orange-color) !important;
	height: 18px !important;
	width: 26px !important;
	margin: 1px 16px 0px 21px !important;
	mask: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=mute_video.png&component=branch') center center !important;
	mask-size: 18px 26px !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-image: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=mute_video.png&component=branch') !important;
	-webkit-mask-position: center center !important;
	-webkit-mask-size: contain !important;
	-webkit-mask-repeat: no-repeat !important;
}

.ft-select-interaction-container .ft-video-interaction-button:active,
.ft-select-interaction-container .ft-select-interaction-container-interaction-selected .ft-video-interaction-button,
#ft_interactions_available_for_call .ft-video-interaction-button:active {
	background-color: var(--ft-video-orange-color) !important;
}

.ft-select-interaction-container .ft-chat-interaction-button .ft-interaction-selection-button-icon,
#ft_interactions_available_for_call .ft-chat-interaction-button .ft-interaction-selection-button-icon {
	background-color: var(--ft-chat-green-color) !important;
	height: 19.5px !important;
	width: 18.8px !important;
	margin: 1px 22px 0px 21px !important;
	mask: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=chat_icon.png') center center !important;
	mask-size: 19.5px 18.8px !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-image: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=chat_icon.png') !important;
	-webkit-mask-position: center center !important;
	-webkit-mask-size: contain !important;
	-webkit-mask-repeat: no-repeat !important;
}

.ft-select-interaction-container .ft-chat-interaction-button:active,
.ft-select-interaction-container .ft-select-interaction-container-interaction-selected .ft-chat-interaction-button,
#ft_interactions_available_for_call .ft-chat-interaction-button:active {
	background-color: var(--ft-chat-green-color) !important;
}

.ft-select-interaction-container .ft-interaction-selection-button,
#ft_interactions_available_for_call .ft-interaction-selection-button {
	opacity: 1 !important;
}

.ft-select-interaction-container .ft-interaction-selection-button:active,
.ft-select-interaction-container .ft-select-interaction-container-interaction-selected .ft-interaction-selection-button,
#ft_interactions_available_for_call .ft-interaction-selection-button:active {
	color: var(--primary-white) !important;
}

.ft-select-interaction-container .ft-interaction-selection-button:active .ft-interaction-selection-button-icon,
.ft-select-interaction-container .ft-select-interaction-container-interaction-selected .ft-interaction-selection-button-icon,
#ft_interactions_available_for_call .ft-interaction-selection-button:active .ft-interaction-selection-button-icon {
	background-color: var(--primary-white) !important;
}

.ft-select-interaction-container .ft-select-interaction-container-interaction-selected {
	border-bottom: 2px solid var(--ft-border-gray-color) !important;
	margin: 0px 0px 0px 0px !important;
	padding: 0px 25px 30px 25px !important;
}

/* undo bootstrap css */
.ft-select-interaction-container,
.ft-select-interaction-container * {
	box-sizing: unset !important;
	line-height: normal !important;
	outline: none !important;
}

.ft-select-interaction-container input::placeholder,
.ft-select-interaction-container textarea::placeholder {
	font-style: normal !important;
}

.ft-button-tag {
	border: none !important;
	/* font: inherit; */
	/* Messed up font size on minimize button. */
	color: inherit;
	background: transparent !important;
	padding: 0px !important;
}

.ft-select-interaction-container #ft_camera_audio_source,
.ft-select-interaction-container #ft_camera_video_source {
	color: var(--primary-black) !important;
}

/* media queries */
@media only screen and (max-width: 510px) {
	.ft-select-interaction-container {
		right: 10px !important;
	}
}

@media only screen and (max-width: 415px) {
	.ft-select-interaction-container {
		bottom: 10px !important;
	}
}

/*** AV Setup */
.ft-widget-audio-meter-container .ft-widget-audio-meter-overlay {
	width: 176px !important;
	height: 58px !important;
	-moz-appearance: none !important;
}

.ft-widget-audio-meter-container .ft-widget-audio-meter-overlay {
	background-color: var(--primary-white) !important;
	left: 112px !important;
	position: absolute !important;
	mask: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=audio_indicator_overlay.png') center center !important;
	mask-size: 56px 176px !important;
	mask-repeat: no-repeat !important;
	-webkit-mask-image: url('https://main.financialtown.com/financial_town/view/javascript/embed_content.php?filename=audio_indicator_overlay.png') !important;
	-webkit-mask-position: center center !important;
	-webkit-mask-size: cover !important;
	-webkit-mask-repeat: no-repeat !important;
	z-index: 1 !important;
}

@-moz-document url-prefix() {
	.ft-widget-audio-meter-container .ft-widget-audio-meter-overlay {
		left: auto !important;
		width: 241.25px !important;
	}
}