:root {
	/* == container variables == */
	--chat-upload-width: 42px;
	--chat-counter-width: 42px;
	--chat-input-width: 100vw;
	--chat-submit-width: 100vw;
	--chat-submit-width-desktop: 20vw;
	--footer-input-offset: 11px;
}

::-webkit-scrollbar {
	width: 8px;
}

::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: #858585;
}

html,
body {
	height: 100%;
	width: 100%;
	overflow-x: hidden;
}

body {
	position: absolute;
	bottom: 0;
	font-weight: 400;
	font-size: 13px;
	background-color: transparent;
	overflow: hidden;
}

body.minimized {
	height: 80px;
}

body.minimized .button-minimize {
	display: none;
}

* {
	font-family: "Poppins", Arial, Helvetica, sans-serif;
	scrollbar-width: thin;
}

#mainframe {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	position: absolute;
	bottom: 0;
	height: calc(100% - 20px);
	width: calc(100% - 20px);
	box-shadow: 4px 2px 8px 0 rgba(0, 0, 0, 0.2);
	margin: 10px;
	z-index: 1;
}

/* Mobile style */
body.mobile #mainframe,
body.embedded #mainframe {
	height: 100%;
	width: 100%;
	margin: 0;
	box-shadow: none;
}

body.minimized #mainframe {
	display: none;
}

/**
 * WINDOW CONTROLS
 */

#window-controls {
	display: none;
	position: absolute;
	width: 100%;
	bottom: 0;
	z-index: 0;
	margin: 0;
	padding: 0 4px 10px 10px;
	text-align: right;
}

body.minimized #window-controls {
	display: block;
}

body.embedded #windows-controls {
	display: none;
}

#window-controls.mobile {
	height: 70px;
	opacity: 1;
}

#maximize {
	position: relative;
}

.counter {
	position: absolute;
	right: 46px;
	top: 18px;
	width: 20px;
	height: 20px;
	color: white;
	font-size: 1em;
	line-height: 20px;
	font-weight: 700;
	text-align: center;
	background: #081a3e;
	border-radius: 50px;
	pointer-events: none;
}

/*.counter:not(.disabled) ~ #close-window{
    display: none;
    pointer-events: none;
}*/

.control {
	margin-top: 4px;
	width: 56px;
	height: 56px;
	right: 10px;
	border-radius: 50%;
	border: none;
	box-shadow:
		0 0 10px 0 rgba(0, 0, 0, 0.08),
		0 0 5px 0 rgba(0, 0, 0, 0.12);
	background: #081a3e;
	text-align: center;
	vertical-align: top;
}

#close-window {
	display: none;
	position: absolute;
	top: -2px;
	right: 2px;
	width: 16px;
	height: 16px;
	border: none;
	border-radius: 8px;
	background-color: #081a3e;
	padding: 0;
	color: white;
	z-index: 999;
}

#close-window svg {
	width: 8px;
	height: 10px;
}

body.minimized #close-window {
	display: block;
}

.control svg {
	margin-top: 5px;
}

.control img {
	width: 24px;
	height: 25px;
}

/**
 * GLOBAL STYLES
 */

li {
	list-style: none;
}

/* for the generator. we use ul lis' in the text */
.bubble span ul {
	margin-top: 5px;
	padding-left: 5px;
}

.bubble span ul li:before {
	content: "-";
	margin-right: 5px;
}

/****************/

.disabled:not(#chat-writing-box):not([data-persist]) {
	display: none !important;
}

.invisible {
	opacity: 0;
	visibility: hidden;
}

.error {
	color: red !important;
}

.flex {
	display: flex;
}

.inline-flex {
	display: inline-flex !important;
}

.flex-row {
	flex-direction: row;
}

.flex-row-end {
	justify-content: flex-end;
}

.flex-row-reverse {
	flex-direction: row-reverse;
}

.flex-column {
	flex-direction: column;
}

.text-align--left {
	text-align: left !important;
}

.text-align--center {
	text-align: center !important;
}

.text-align--right {
	text-align: right !important;
}

.centered {
	margin: 0 auto !important;
}

.no-mb {
	margin-bottom: 0 !important;
}

.wide {
	width: 100%;
}

.uppercase {
	text-transform: uppercase;
}

.button-round {
	width: 32px;
	height: 32px;
	overflow: hidden;
	border-radius: 16px;
	border: none;
	font-size: 20px;
	line-height: 32px;
	text-align: center;
}

.aria-label {
	position: absolute;
	opacity: 0;
	pointer-events: none;
	touch-action: none;
}

/**
 * COLOR PALETTE
 */
.main-bg-color {
	background-color: #081a3e;
}

.main-color {
	color: #081a3e;
}

.text-color {
	color: black;
}

/**
 *   CHAT-HEADER
 */
header,
.header {
	width: 100%;
	height: 50px;
	border-radius: 5px 5px 0 0;
	color: white;
}

body.mobile header,
body.mobile .header,
body.embedded header,
body.embedded .header {
	border-radius: 0;
	color: white;
}

#chat-header {
	height: 50px;
}

.header__title {
	flex: 1;
	font-size: 12px;
	line-height: 50px;
	padding: 0 12px;
}

.header__title h1 {
	font-size: 14px;
}

.header__actions {
	z-index: 999;
	max-width: 48px;
	min-width: 24px;
}

.header__actions:first-of-type {
	margin-left: 10px;
}

.header__actions:last-of-type {
	margin-right: 10px;
}

body.mobile .header__actions {
	position: relative;
	z-index: 999;
}

#toggle-menu.header__actions--menu {
	margin-top: 15px;
}

#toggle-menu.header__actions--menu svg {
	width: 24px;
	height: 20px;
}

#minimize.header__actions--minimize {
	position: relative;
	top: 0;
	left: 0;
	display: inline-block;
	margin-top: 10px;
	width: 32px;
	height: 30px;
	padding: 5px;
	color: white;
	z-index: 999;
}

#minimize.header__actions--minimize span:not(.aria-label) {
	display: block;
	margin: 0px 4px;
	width: 16px;
	height: 2px;
	background-color: white;
}

/**
 * MENU
 */

.menu-page {
	background-color: white;
	overflow-x: hidden;
	overflow-y: auto;
	transition: transform 0.25s ease-out;
}

.menu-page.closed {
	transform: translate(-100%, 0);
}

#menu.closed {
	pointer-events: none;
}

.menu-page .menu__title * {
	display: inline-block;
}

.menu-page .menu__title button {
	width: 80px;
	margin-left: 8px;
	border: none;
	background: none;
	font-size: 20px;
	font-weight: 600;
}

.menu-page .menu__title h1 {
	width: calc(100% - 132px);
	text-align: center;
	font-size: 20px;
	font-weight: 700;
}

.menu-page .menu__title small {
	font-size: 13px;
	vertical-align: middle;
	padding-bottom: 3px;
	font-weight: 400;
}

.menu-page h2 {
	font-size: 16px;
	font-weight: 700;
}

.menu-page article {
	padding: 20px;
	overflow: auto;
}

.menu-page article button,
.button,
.cta-button {
	font-weight: 700;
	padding: 0.7em 0;
	min-width: 130px;
	border: none;
	border-radius: 8px;
	font-size: 14px;
	box-shadow: 0px 4px 8px rgba(3, 10, 24, 0.16);
}

.menu-page article button:not(.alternative),
.cta-button {
	color: white;
	background: #081a3e;
	border: 1px solid #081a3e;
}

.menu-page article button.alternative,
.button {
	background: white;
	color: black;
	border: 1px solid black;
}

.menu-page article button:hover,
.menu-page article button:active,
.menu-page article button:focus,
.cta-button:hover,
.cta-button:active,
.cta-button:focus {
	box-shadow: 0px 4px 8px rgba(3, 10, 24, 0.32);
}

.menu-page article button:active,
.cta-button:active {
	box-shadow: inset 0px 4px 8px rgba(3, 10, 24, 0.2);
}

#menu {
	z-index: 1000;
}

#legal {
	z-index: 1001;
}

#legal article:not(:last-of-type) {
	padding-bottom: 0;
}

#legal label {
	display: block;
	font-weight: 600;
	cursor: pointer;
}

#legal label h2 {
	display: inline;
}

#legal .arrow {
	display: inline-block;
	width: 0.8em;
	height: 0.8em;
	margin-right: 5px;
	border-bottom: 2px solid black;
	border-right: 2px solid black;
	transform: scale(0.8, 1) translateY(-0.15em) rotateZ(45deg);
	transition: 0.3s transform ease-out;
}

#legal label ~ p {
	padding-top: 0.5em;
	font-weight: 400;
}

#legal input[type="checkbox"] {
	display: none;
}

#legal input[type="checkbox"]:checked + label .arrow {
	transform: scale(0.8, 1) translateY(0.3em) rotateZ(225deg);
}

#legal input[type="checkbox"] ~ p {
	display: none;
}

#legal input[type="checkbox"]:checked ~ p {
	display: block;
}

#legal span:not(:last-of-type) {
	display: block;
	margin-bottom: 1em;
}

/**
 * CHAT SEPARATOR
 */
.separator p {
	width: 100%;
	margin-top: 10px;
	padding: 5px 0 10px 0;
	border-top: 1px solid #eeeeee;
	color: #4a4a4a;
	font-weight: 400;
	font-size: 14px;
	text-align: center;
}

/**
 * ACTION BUTTONS
 */

.action--small {
	margin-top: 20px;
	font-size: 13px;
}

.action--small:hover span,
.action--small:active span,
.action--small:focus span {
	text-decoration: underline;
}

.action--small span {
	margin-left: 4px;
	vertical-align: text-bottom;
}

.action--primary {
	height: 32px;
	padding: 5px 20px;
	border: 1px solid #081a3e;
	border-radius: 17.5px;
	background: #081a3e;
	color: white;
	font-size: 13px;
	line-height: 20px;
	text-align: center;
}

.action--primary:hover,
.action--primary:focus,
.action--primary:active {
	background: white;
	color: #081a3e;
}

button.component_action,
button.component_not_action {
	padding: 0;
	margin: 0;
	border: none;
	background: transparent;
}

/**
 *   MESSAGES CONTAINER
 */
#content {
	min-height: 243px;
	background-color: #e4e4e7;
	box-shadow: 0 -8px 16px 0 #eeeeee inset;
}

#content,
#content-appli {
	flex: 1;
}

.embedded #content {
	background-color: white;
}

#div-chat,
#div-chat > .clearfix,
#chat-message-container2,
#chat-message-list {
	height: 100%;
}

#chat-message-list {
	width: 100%;
	margin: 0;
	overflow-y: scroll;
	overflow-x: hidden;
	padding-top: 16px;
}

.message-container {
	padding: 0;
	margin-bottom: 10px;
}

.message-container .message-container_content {
	padding: 0;
	width: 100%;
}

.message-container_timestamp {
	margin-top: 4px;
	display: block;
	font-size: 12px;
	font-weight: 300;
	text-align: left;
}

.message-container[data-author="prospect"] .message-container_timestamp {
	text-align: right;
}

#chat-message-list .message-container_content > li,
#chat-message-list .message-container_content > .bubble {
	display: inline-flex;
}

#chat-message-list .message-container_content > .bubble:not(.bubble:last-child),
#chat-message-list .message-container_content > li:not(li:last-child) {
	margin-bottom: 10px;
}

#chat-message-list .message-container_content > li.margin-reduced {
	margin-bottom: 5px;
}

.message-container--flex {
	display: flex;
}

.message-container--no-icon {
	padding-left: 29px;
}

*:not(.message-desambig)[data-status="undelivered"] .bubble {
	cursor: pointer;
}

.bubble--left {
	border-radius: 8px 8px 8px 0px;
}

.bubble--right {
	border-radius: 8px 8px 0px 8px;
}

.bubble.bubble--wide {
	width: 100%;
	max-width: 100%;
}

.bubble_content {
	min-height: 40px;
	padding: 16px;
	font-size: 14px;
	word-break: break-word;
}

.bubble_content a {
	color: #081a3e;
}

.bubble_content hr {
	margin: 16px 0;
	background-color: #d2d2d2;
}

.bubble_content--no-pb {
	padding-bottom: 0;
}

/* Partial bubble */
.bubble_content--upper {
	border-bottom-right-radius: 0;
}

.bubble_content--lower {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 45px;
	background: white;
	border: 1px solid #eeeeee;
	border-top: 0;
	border-bottom-right-radius: 40.5px;
}

.bubble_content--lower-noflex {
	display: block;
}

.bubble--debug {
	margin-bottom: 10px;
	background: #e09ba6;
	border-radius: 0;
	padding: 10px;
	color: white;
}

.message-container[data-author="prospect"] > .message-container--flex {
	width: calc(100% - 29px);
	margin-left: 29px;
	justify-content: flex-end;
	color: white;
}

.message-container[data-author="prospect"] .bubble_content {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	background: #181818;
}

.message-container:not([data-author="prospect"]) > .message-container--flex {
	justify-content: flex-start;
	color: black;
}

.message-container:not([data-author="prospect"]) .bubble_content {
	border-bottom-left-radius: 0;
	background: #ffffff;
	border-top-left-radius: 0;
}

.embedded .message-container:not([data-author="prospect"]) .bubble_content {
	background: #f2f2f2;
}

.message-container:not([data-author="prospect"]) .icon-left,
.advisor-icon {
	flex: 0;
	display: flex;
	justify-content: center;
	min-width: 24px;
	padding: 0;
	margin-right: 5px;
}

.message-container:not([data-author="prospect"]) .icon-left img,
.advisor-icon img {
	align-self: flex-end;
	max-width: 27px;
	max-height: 28px;
}

.pseudo b {
	color: #081a3e;
	display: inline-block;
	font-weight: 500;
}

/*   INTRO MESSAGE   */
.message-intro {
	margin-top: 10px;
}

.message-intro .message-intro_container {
	padding: 19.5px 15px 10px 15px;
	text-align: center;
}

.message-intro__image {
	width: 19%;
}

.message-intro__text {
	padding: 8px 25px 9px 25px;
	font-size: 13px;
}

.message-intro__actions {
	padding: 0;
}

.message-intro__actions .desambig-choice {
	margin-bottom: 8px;
}

/*   MESSAGES WITH COMPLEMENTS   */
.message-route_content {
	padding: 0;
}

.message-route_content .bubble:not(.hidden) {
	margin-top: 8px;
}

.message-route_button {
	padding: 5px 0;
	display: block;
	text-align: center;
}

.choiceclick .action--small {
	margin-top: 0;
	margin-bottom: 10px;
}

/**
 * DESAMBIG STYLES
 */

.message-desambig {
	min-width: 100px;
}

.message-desambig_list {
	padding: 0;
	display: flex;
	flex-direction: column;
	align-items: start;
}

.message-desambig_list:not(.message-desambig_list--buttons):first-of-type {
	margin-top: 10px;
}

.button--expand {
	font-weight: 700;
}

.button--expand svg {
	vertical-align: middle;
}

.message-desambig_list.expandable {
	transition: ease-out 0.2s height;
}

.message-desambig_list.expandable.closed {
	height: 0;
	overflow: hidden;
}

.message-desambig_list--buttons {
	max-width: 100%;
}

.desambig-choice {
	display: inline-block;
	cursor: pointer;
	color: #181818;
}

.desambig-choice:not(:last-child):not(.desambig-choice--button):not(.desambig-choice--chip) {
	border-bottom: 1px solid #eeeeee;
}

.desambig-choice p {
	padding: 7px 14px;
}

.desambig-choice:hover:not(.desambig-choice--chip) p,
.desambig-choice:focus:not(.desambig-choice--chip) p,
.desambig-choice:active:not(.desambig-choice--chip) p {
	text-decoration: underline;
}

.desambig-choice--chip {
	padding: 6px 10px;
	margin-bottom: 5px;
	border-radius: 17.5px;
	border: 1px solid #181818;
	background-color: transparent;
}

.desambig-choice--chip:active,
.desambig-choice--chip:hover,
.desambig-choice--chip:focus,
.desambig-choice--chip.selected {
	background-color: #222222;
	color: white;
}

.desambig-choice--chip[data-type="line"] p {
	font-size: 14px;
	padding: 0;
	margin: 0;
	vertical-align: middle;
}

.desambig-choice--chip.line--red img {
	float: none;
	margin: 0 4px 0 0;
}

.desambig-choice--button {
	flex: 1;
	/*font-size: 10px;*/
}

.desambig-choice--button:not(:last-child) p {
	border-right: 1px solid #eeeeee;
}

/**
 * SELECT LINE
 */
.line--red img {
	float: left;
	width: 16px;
	height: 16px;
	margin: 11px 0 0 17px;
}

.line--red p {
	display: inline-block;
	clear: both;
	margin-left: -39px;
}

.message-desambig #ask-new {
	margin-top: 16px;
}

#ask-new span {
	color: #081a3e;
}

/**
 * FAQ
 */
.faq h1 {
	margin: 0 0 1px 0;
	font-weight: bold;
	font-size: 11px;
}

.faq p {
	font-size: 10px;
}

.bubble_content hr {
	background-color: #e3e3e4;
}

.faq-link {
	display: block;
	position: relative;
	margin-top: 9px;
	padding: 0;
	background: none;
	border-radius: 0;
}

.faq-link img {
	display: none;
}

.faq-link span::after {
	display: inline-block;
	position: absolute;
	bottom: 4px;
	margin-left: 5px;
	content: "";
	width: 8px;
	height: 12px;
	background-image: url("data:image/svg+xml;charset=UTF-8, %3Csvg%20width%3D%228%22%20height%3D%2212%22%20viewBox%3D%220%200%208%2012%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M0.910317%200.903368C1.23518%200.587793%201.76188%200.587793%202.08674%200.903368L7.33334%206.00002L2.08674%2011.0967C1.76188%2011.4122%201.23518%2011.4122%200.910317%2011.0967C0.585457%2010.7811%200.585457%2010.2694%200.910317%209.95387L4.9805%206.00002L0.910317%202.04617C0.585457%201.73059%200.585457%201.21894%200.910317%200.903368Z%22%20fill%3D%22%23081a3e%22%2F%3E%3C%2Fsvg%3E ");
}

.faq-link:last-child {
	margin-bottom: 5px;
}

.faq-link:hover span::after,
.faq-link:focus span::after,
.faq-link:active span::after {
	margin-left: 9px;
}

.faq-link a,
.faq-link .component_action,
.faq-link .component_not_action {
	display: inline-block;
	padding-right: 4px;
	color: #081a3e;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
}

.faq-link a img {
	vertical-align: text-top;
}

.faq-link a span,
.faq-link button span {
	display: inline-block;
	text-align: left;
}

/**
 * FORMS
 */

.form {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
	border-radius: 8px;
	background-color: white;
	box-shadow: 0px 8px 16px rgba(24, 24, 24, 0.08);
	overflow: hidden;
}

.form input[type="submit"] {
	margin: 8px auto 16px auto;
}

.form .error {
	font-size: 12px;
	margin-bottom: 5px;
}

.form_input--radio:not(:first-of-type) {
	margin-left: 10px;
}

.form_input_container {
	position: relative;
}

.form_input ~ svg[data-state="valid"],
.form_input ~ svg[data-state="invalid"] {
	display: none;
}

.form_content--multi .form_input:valid:not(.empty):not(.form_input--date) {
	border-color: #02c39a;
	color: #02c39a;
}

.form_content--multi .form_input:invalid:not(.empty):not(.form_input--date) {
	border-color: #081a3e;
	color: #081a3e;
}

.form_input:valid ~ svg[data-state="valid"] {
	display: block;
	position: absolute;
	top: 12px;
	right: 8px;
}

.form_input:invalid ~ svg[data-state="invalid"] {
	display: block;
	position: absolute;
	top: 12px;
	right: 8px;
}

.form_input ~ span {
	display: none;
	color: #081a3e;
}

.form_input:invalid ~ span {
	display: block;
}

.form_input.empty ~ svg[data-state="valid"],
.form_input.empty ~ svg[data-state="invalid"] {
	display: none;
}

.form input:disabled {
	color: #d2d2d2;
}

.form_actions {
	border-top: 1px solid #eeeeee;
	padding: 4px 0;
}

.form_actions_button {
	flex: 1;
	/*max-width: 50%;*/
	border: none;
	border-right: 1px solid #eeeeee;
	min-height: 36px;
	background: none;
	color: #081a3e;
}

.form_actions_button:last-child {
	border-right: none;
}

.form_actions_button--misc {
	border: none;
	background: none;
	font-size: 14px;
	font-weight: 700;
	padding: 8px 0;
}

.form_actions_button:hover,
.form_actions_button:active,
.form_actions_button:focus,
.form_actions_button--misc:hover,
.form_actions_button--misc:active,
.form_actions_button--misc:focus {
	outline: none;
}

.form_actions_button:hover svg,
.form_actions_button:active svg,
.form_actions_button:focus svg,
.form_actions_button--misc:hover svg,
.form_actions_button--misc:active svg,
.form_actions_button--misc:focus svg {
	margin-left: 4px;
}

.form_content .form_input {
	padding: 0 14px;
	height: 39px;
}

.form_content .form_input--radio {
	height: auto;
}

.radio__input {
	position: absolute;
	visibility: hidden;
}

.radio__input ~ .radio__control {
	display: inline-block;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 1px solid #d2d2d2;
}

.radio__input:checked ~ .radio__control {
	background: radial-gradient(#181818 50%, white 55%);
	border: 1px solid #181818;
}

.form_content--multi {
	padding: 16px 16px 10px 16px;
}

.form_content--multi fieldset {
	position: relative;
}

.form_content--multi fieldset:not(:last-child):not(.no-mb) {
	margin-bottom: 18px;
}

.form_content--multi .form_input {
	height: 39px;
	font-size: 12px;
	background: white;
	border-radius: 6px;
	border: 1px solid #d2d2d2;
}

.form_content--multi .form_input--radio {
	height: auto;
}

.form_content--multi input:focus,
.form_content--multi input:active {
	border-color: black;
}

.form_content--multi input[type="date"]:focus,
.form_content--multi input[type="date"]:active {
	padding-top: 0;
}

.form_content--multi .form_input_label {
	color: #181818;
	font-size: 14px;
	font-weight: 700;
}

/**
 * RESET PASSWORD
 */
.form_content--multi fieldset.form--resetpass__medias {
	margin-bottom: 9px;
}

.form--resetpass__medias label {
	font-weight: normal;
	font-size: 14px;
}

.form--resetpass__medias label:not(:last-child) {
	margin-bottom: 16px;
}

.form--resetpass__medias label span:not(.radio__control) strong {
	display: block;
	font-weight: 400;
	margin-bottom: 10px;
}

.form--resetpass__medias input:checked ~ span:not(.radio__control) strong {
	font-weight: 700;
}

.form--resetpass__medias span:not(.radio__control) {
	display: inline-block;
	width: calc(100% - 24px);
	line-height: 1.5;
}

.form--resetpass__medias .radio__control {
	vertical-align: top;
	margin-top: 2px;
	margin-right: 4px;
}

.form--resetpass__medias input {
	vertical-align: top;
}

#resetpass-captcha-container {
	padding-top: 16px;
}

#resetpass-button-cancel {
	margin-right: 12px;
}

/**
 * CALLBACK
 */
.ctc-frame {
	/*position: relative;
    left: -10px;*/
	max-height: 425px;
	min-height: 425px;
}

/**
 * FILE UPLOAD
 */
.form-upload_file {
	display: flex;
	justify-content: center;
	margin-bottom: 20px;
}

.form-upload_file--status span {
	font-size: 11px;
	color: #787777;
}

.form-upload_file_icon:not(.disabled) {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 5px;
}

.form-upload_file_icon img {
	max-width: 100%;
	max-height: 100%;
}

.form-upload_file .loading {
	display: inline-block;
	width: 20px;
	height: 20px;
	padding: 0 2px;
}

.form-upload_file .loading .point {
	display: inline-block;
	animation: 1s load infinite;
	transform-origin: center center;
	margin-bottom: 2px;
	width: 2px;
	height: 2px;
	border-radius: 50%;
	background: #081a3e;
}

.form-upload_file .loading .point:nth-child(2) {
	animation-delay: 250ms;
}

.form-upload_file .loading .point:last-child {
	animation-delay: 500ms;
}

/**
 * TRANSFER
 */
.transfer-infos {
	background-color: white;
	border-radius: 8px;
}

/**
 * ERROR PAGE
 */
.page {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: calc(100% - 56px);
	background: white;
}

body.mobile.minimized .page {
	height: 0;
}

.page .header__title {
	margin: 0 48px;
}

.page-error {
	height: 100%;
	z-index: 998;
}

.page-error .content_page_error {
	position: absolute;
	width: 100%;
	padding: 0 16px;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
}

.page-error .content_page_error img {
	margin: 46px auto 33px auto;
}

.page-error .content_page_error .title {
	font-size: 13px;
	font-weight: normal;
	padding: 0 10px;
}

.page-error .content_page_error small {
	font-weight: 300;
	font-size: 11px;
	color: #b0b0b0;
	padding: 4px 10px;
}

.page-error .cta-button {
	margin-top: 16px;
}

/**
 *   CHAT-FOOTER
 */
footer {
	flex: 0;
	width: 100%;
	padding: 8px;
	background-color: white;
	border-top: 2px solid #eeeeee;
}

body[data-input="disabled"] footer {
	display: none !important;
}

#chat-writing-box {
	font-size: 14px;
}

#textarea-chat-input {
	height: 40px;
	width: 100%;
	overflow-y: hidden;
	vertical-align: bottom;
	padding: 10px 42px 10px 56px;
	gap: 16px;
	resize: none;
	line-height: 1.5;
	background: #e4e4e7;
	border-radius: 8px;
}
#textarea-chat-input:focus {
	outline: 2px inset #51525c !important;
}

#chat-upload-btn {
	position: absolute;
	bottom: 0;
	width: 40px;
	height: 40px;
	margin: 0 8px;
	padding: 10px 12px 9px 11px;
	cursor: pointer;
}

#chat-upload-btn.disabled ~ #textarea-chat-input {
	padding-left: 16px;
}

#textarea-chat-container {
	position: relative;
	min-height: 40px;
}

.chat-input {
	margin: 0;
	flex: 1;
	position: relative;
}

.chat-input input {
	height: 100%;
	background: transparent;
}

.chat-input-actions {
	display: inline-flex;
	flex-direction: column;
	justify-content: end;
	flex-grow: 0;
}

.chat-input-actions--upload {
	display: block;
	position: absolute;
	z-index: -1;
	width: 24px;
	height: 24px;
	opacity: 0;
	cursor: pointer;
	font-size: 0;
}

.chat-input_counter {
	position: absolute;
	bottom: 12px;
	right: 4px;
}

.chat-input_counter,
.chat-input_btn_container {
	display: inline-block;
}

.chat-input_counter p {
	padding: 2px 8px;
	/* margin-bottom: 0;
    margin-left: 8px; */
	font-size: 10px;
	color: black;
	background-color: white;
	border-radius: 8px;
	text-align: center;
}

.chat-input_btn_container_action {
	display: inline-block;
	padding-left: 8px;
}

::placeholder {
	font-size: inherit;
	color: #51525c !important;
	opacity: 1;
}

:-ms-input-placeholder {
	font-size: inherit;
	color: #51525c !important;
}

::-ms-input-placeholder {
	font-size: inherit;
	color: #51525c !important;
}

::-webkit-input-placeholder {
	font-size: inherit;
	color: #51525c !important;
}

:-moz-placeholder {
	font-size: inherit;
	color: #51525c !important;
}

::-moz-placeholder {
	font-size: inherit;
	color: #51525c !important;
}

/* DISABLED STATE */

#chat-writing-box.disabled #chat-input-btn svg {
	cursor: default !important;
}

#chat-writing-box.disabled #chat-input-btn svg #bkg,
#chat-input-btn.disabled svg #bkg {
	fill: #d2d2d2;
}

#chat-input-btn.disabled svg #fig,
#chat-writing-box.disabled #chat-input-btn svg #fig {
	fill: #8a8a8a;
}

#chat-writing-box.disabled .chat-input textarea {
	background-color: #d2d2d2;
}

#chat-writing-box.disabled .chat-input textarea::placeholder {
	color: #d2d2d2 !important;
	opacity: 1;
}

#chat-writing-box.disabled .chat-input input:-ms-input-placeholder {
	color: #d2d2d2 !important;
}

#chat-writing-box.disabled .chat-input input::-ms-input-placeholder {
	color: #d2d2d2 !important;
}

#chat-writing-box.disabled .chat-input input::-webkit-input-placeholder {
	color: #d2d2d2 !important;
}

#chat-writing-box.disabled .chat-input input:-moz-placeholder {
	color: #d2d2d2 !important;
}

#chat-writing-box.disabled .chat-input input::-moz-placeholder {
	color: #d2d2d2;
}

/*
============================
    for container style
============================
*/
body.embedded footer {
	display: flex;
	flex-direction: row;
	padding: 0;
}

body.embedded footer #textarea-chat-container {
	flex: 1;
}

body.embedded footer .chat-input-actions {
	flex: 0;
}

body.embedded footer .chat-input-actions,
body.embedded footer .chat-input_btn_container,
body.embedded footer #chat-input-btn,
body.embedded footer #chat-input-btn button {
	height: 100%;
}

body.embedded #textarea-chat-input,
body.embedded #chat-writing-box.disabled .chat-input textarea {
	background: none;
	margin: 8px;
}

body.embedded footer #chat-input-btn button {
	width: 107px;
	border: none;
	background-color: #081a3e;
	font-weight: 700;
	font-size: 14px;
	color: white;
}

body.embedded footer.disabled #chat-input-btn button {
	color: #181818;
	background-color: #d2d2d2;
	cursor: default;
}

body.embedded .chat-input_counter {
	bottom: 20px;
}

body.embedded .chat-input_counter p {
	background-color: #f2f2f2;
}

body.embedded #chat-upload-btn {
	right: 0;
	margin: 0;
	bottom: 10px;
}

body.embedded #chat-upload-btn:not(.disabled) ~ .chat-input_counter {
	right: 40px;
}

body.embedded #chat-upload-btn:not(.disabled) ~ #textarea-chat-input {
	padding: 10px 82px 10px 16px;
}

@media only screen and (max-width: 768px) {
	body.embedded:not(.app) footer #textarea-chat-container {
		display: flex;
		flex-direction: column;
	}

	body.embedded:not(.app) footer .chat-input_btn_container,
	body.embedded:not(.app) footer #chat-input-btn,
	body.embedded:not(.app) footer #chat-input-btn button {
		height: 40px;
		width: 100%;
	}

	body.embedded:not(.app) footer .chat-input_btn_container_action {
		padding: 0;
	}
}

/**
 * Notification bubble
 */
.notification {
	position: relative;
	float: left;
	height: 58px;
	width: calc(100% - 94px);
	margin: 10px 10px 0 20px;
	padding: 10px 20px;
	border-radius: 8px;
	background: #eeeeee;
	opacity: 1;
	transition: 0.35s opacity ease-out;
}

.notification.hidden {
	opacity: 0;
}

.notification .arrow {
	position: absolute;
	left: 100%;
	height: 24px;
	width: 24px;
	border: 12px solid #eeeeee;
	border-bottom-color: transparent;
	border-left-color: transparent;
	border-right-color: transparent;
	transform: rotate(45deg) translate(-9px, 9px);
}

/**
 * RATING
 */

#rating-modal {
	display: block;
}

#survey-container {
	margin: 0 -14px;
}

#survey-frame {
	min-width: 350px;
	width: 100%;
	min-height: 590px;
}

.survey-frame_container {
	z-index: 999;
	display: flex;
	flex-direction: column;
	top: 47px !important;
}

.survey-frame_container img {
	flex: 0;
}

.survey-frame_container iframe {
	flex: 1;
}

.rating-container {
	max-width: 240px;
}

.rating-list-row {
	display: flex;
	flex-flow: row;
	justify-content: center;
	list-style: none;
	margin: 0 auto;
	padding: 0;
}

.rating-list .rating-list_choice {
	width: 36px;
	height: 35px;
	padding-left: 1px;
}

.rating-list .rating-list_choice:not(:last-child) {
	margin-right: 14px;
}

.rating-list .rating-list_choice input {
	opacity: 0;
	position: absolute;
	z-index: -1;
}

.rating-list .rating-list_choice label {
	display: block;
	width: 33px;
	height: 33px;
	margin: 0;
	border-radius: 50%;
	border: 1px solid #081a3e;
	line-height: 33px;
	text-align: center;
	font-weight: 300;
	color: #081a3e;
}

.rating-list .rating-list_choice input:checked + label,
.rating-list .rating-list_choice:hover input + label,
.rating-list .rating-list_choice:active input + label,
.rating-list .rating-list_choice:focus input + label {
	background-color: #081a3e;
	color: white;
}

.rating-hints {
	padding: 5px 9px;
}

.rating-hints p {
	flex: 1;
	font-size: 10px;
	color: #9a9cac;
}

/**
 * COMMENTS
 */
.message-comment_input {
	width: 100%;
	height: 74px;
	padding: 13px 30px;
	background: transparent;
	resize: none;
	color: #4a4a4a;
}

textarea.message-comment_input:invalid {
	border: 1px solid;
	border-color: red;
}

textarea.message-comment_input:invalid + div#satcli-comm-error-zone {
	display: block !important;
}

/**
 * date picker for arbeo
 */

#carousel-rdv-datepicker,
#carousel-rdv-schedulepicker {
	width: 100%;
}

#carousel-rdv-dates {
	text-align: center;
}

.carousel-rdv-date {
	margin-top: 2px;
	margin-bottom: 2px;
	border: 1px solid black;
	border-radius: 8px;
	padding-top: 16px;
	padding-bottom: 16px;
	cursor: pointer;
}

#carousel-separator {
	height: 10px;
	display: none;
}

#carousel-chosen-date {
	text-align: center;
	display: block;
	font-size: 15px;
	font-weight: 600;
	line-height: 22.5px;
}

#carousel-rdv-options {
	width: 100%;
	margin-top: 10px;
}

#carousel-rdv-previous {
	float: left;
	padding: 5px 16px 5px 10px;
	justify-content: left;
	max-width: 155px;
}

#carousel-rdv-next {
	float: right;
	padding: 5px 10px 5px 16px;
	justify-content: right;

	/* the right button can have a slightly bigger text for the last element */
	max-width: 166px;
}

#carousel-rdv-previous svg,
#carousel-rdv-next svg {
	height: 100%;
}

#carousel-rdv-previous,
#carousel-rdv-next {
	display: flex;
	align-items: center;
	position: relative;
	background-color: white;
	color: black;
	cursor: pointer;
	min-width: 110px;
	height: 36px;
	border: 1px solid black;
	border-radius: 20px;
}

#carousel-rdv-previous:hover,
#carousel-rdv-next:hover,
#carousel-rdv-previous:active,
#carousel-rdv-next:active,
#carousel-rdv-previous:focus,
#carousel-rdv-next:focus {
	background-color: black;
	color: white;
}

.rdv-date-date {
	padding-top: 5px;
	padding-bottom: 5px;
}

#rdv-date-schedules {
	text-align: center;
}

.rdv-date-schedule {
	display: inline-block;
	font-size: 10px;
	font-weight: 600;
	line-height: 15px;
	padding-left: 4px;
}

.rdv-date-schedule:not(:first-of-type) {
	border-left: 1px solid black;
}

#carousel-rdv-schedules {
	text-align: center;
}

.carousel-rdv-schedule {
	display: inline-block;
	width: calc(33% - 4px);
	background-color: white;
	color: black;
	border: 1px solid;
	border-radius: 20px;
	padding: 5px;
	margin-right: 4px;
	margin-top: 4px;
	margin-bottom: 4px;
}

.carousel-rdv-schedule:hover,
.carousel-rdv-schedule:active,
.carousel-rdv-schedule:focus {
	color: white;
	background-color: black;
}

.carousel-rdv-schedule:nth-of-type(4n + 1) {
	margin-left: 0px;
}

/**
 * TYPING ANIMATION
 */

.typing {
	display: inline-flex;
	padding: 0 16px;
	border-radius: 8px;
	border-bottom-left-radius: 0;
	background-color: white;
}

body.embedded .typing {
	background-color: #f2f2f2;
}

.typing > .typing_animation-container {
	position: relative;
	display: block;
	height: 36px;
	width: 24px;
}

.typing > .typing_animation-container > .point {
	position: absolute;
	display: inline-block;
	width: 4px;
	height: 4px;
	top: 16px;
	border-radius: 50%;
	background: #181818;

	transform-origin: center center;
	animation-name: load;
	animation-duration: 2s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.typing > .typing_animation-container > .point:nth-child(2) {
	animation-delay: 0.4s;
	left: 10px;
}

.typing > .typing_animation-container > .point:last-child {
	left: 20px;
	animation-delay: 0.8s;
}

@keyframes load {
	0% {
		transform: scale(1);
	}

	1% {
		transform: scale(1.1);
	}

	9% {
		transform: scale(1.375);
	}

	14% {
		transform: scale(1.5);
	}

	20% {
		transform: scale(1.425);
	}

	28% {
		transform: scale(1.175);
	}

	33% {
		transform: scale(1.1);
	}

	50% {
		transform: scale(1);
	}

	100% {
		transform: scale(1);
	}
}

@media print {
	html,
	body {
		height: auto !important;
		overflow-y: scroll;
	}

	body {
		height: auto !important;
		position: static !important;
		overflow: auto !important;
	}

	header,
	footer,
	.menu-page,
	.bubble--debug {
		display: none !important;
	}

	#mainframe {
		position: static !important;
		overflow: auto !important;
		margin: 0 !important;
		box-shadow: none !important;
		height: auto !important;
		width: auto !important;
	}

	#content,
	#div-chat,
	.clearfix,
	#chat-message-container2,
	#chat-message-list {
		height: auto !important;
	}

	#chat-message-list {
		overflow-y: auto !important;
	}

	.message-container:not([data-author="prospect"]) .bubble {
		border: 1px solid #eeeeee;
	}

	.message-container[data-author="prospect"] .bubble {
		border: 1px solid #081a3e;
	}

	.faq-link a,
	.faq-link .component_action,
	.faq-link .component_not_action,
	.faq-link span {
		text-decoration: underline !important;
	}
}

.image-arbeo-container img,
.image-arbeo-slideshow img {
	max-width: 100%;
	user-select: none;
}

.group_arrows {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	column-gap: 15%;
	width: 100%;
}

.slideshow button {
	display: block;
	margin: 0 auto;
}

.slideshow-image {
	display: none;
}

.slideshow-image.selected {
	display: block;
}

.slideshow-image p {
	text-align: center;
}