#dhc-chat-root,
#dhc-chat-root * {
	box-sizing:border-box;
}

#dhc-chat-root [hidden] {
	display:none !important;
}

#dhc-chat-root {
	--dhc-chat-blue:#30559c;
	--dhc-chat-blue-dark:#20458c;
	--dhc-chat-green:#6ea82f;
	--dhc-chat-ink:#223142;
	--dhc-chat-muted:#718092;
	--dhc-chat-line:#dfe5eb;
	color:var(--dhc-chat-ink);
	/*font-family:Arial, Helvetica, sans-serif;*/
	font-size:15px;
	line-height:20px;
}

#dhc-chat-root button,
#dhc-chat-root input,
#dhc-chat-root textarea {
	font:inherit;
}

#dhc-chat-root button {
	cursor:pointer;
}

#dhc-chat-root .dhc-chat-sr-only {
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	white-space:nowrap;
	border:0;
}

#dhc-chat-root .dhc-chat-launcher {
	position:fixed;
	right:0;
	bottom:25px;
	z-index:2147483000;
	min-width:270px;
	min-height:65px;
	display:flex;
	align-items:center;
	gap:15px;
	padding:10px 15px;
	border:0;
	border-radius:35px 0 0 35px;
	background:var(--blue-darkest);
	box-shadow:0 10px 30px rgba(20,35,50,.25);
	color:#fff;
	text-align:left;
	transition:transform .2s ease, box-shadow .2s ease;
}

#dhc-chat-root .dhc-chat-launcher:hover,
#dhc-chat-root .dhc-chat-launcher:focus-visible {
	transform:translateY(-5px);
	box-shadow:0 15px 35px rgba(20,35,50,.3);
}

#dhc-chat-root .dhc-chat-launcher__icon {
	width:45px;
	height:45px;
	display:grid;
	flex:none;
	place-items:center;
	border-radius:50%;
	background:#fff;
}

#dhc-chat-root .dhc-chat-launcher__icon svg {
	width:25px;
	fill:none;
	stroke:var(--dhc-chat-blue);
	stroke-width:2;
	stroke-linecap:round;
	stroke-linejoin:round;
}

#dhc-chat-root .dhc-chat-launcher__copy {
	flex:1;
}

#dhc-chat-root .dhc-chat-launcher__copy strong,
#dhc-chat-root .dhc-chat-launcher__copy small {
	display:block;
}

#dhc-chat-root .dhc-chat-launcher__copy strong {
	font-size:15px;
	line-height:20px;
}

#dhc-chat-root .dhc-chat-launcher__copy small {
	opacity:.85;
	font-size:15px;
	line-height:20px;
}

#dhc-chat-root .dhc-chat-presence-dot {
	width:10px;
	height:10px;
	flex:none;
	border-radius:50%;
	background:#7bd336;
}

#dhc-chat-root.is-offline .dhc-chat-presence-dot {
	background:#aab2bb;
}

#dhc-chat-root .dhc-chat-window {
	position:fixed;
	right:25px;
	bottom:105px;
	z-index:2147483001;
	width:380px;
	height:600px;
	display:none;
	flex-direction:column;
	overflow:hidden;
	border-radius:15px;
	box-shadow:0 20px 50px rgba(20,35,50,.3);
}

#dhc-chat-root.is-open .dhc-chat-window {
	display:flex;
	animation:dhc-chat-in .2s ease both;
}

@keyframes dhc-chat-in {
	from { opacity:0; transform:translateY(15px) scale(.98); }
	to { opacity:1; transform:none; }
}

#dhc-chat-root .dhc-chat-header {
	min-height:75px;
	display:grid;
	grid-template-columns:45px 1fr 35px 35px;
	align-items:center;
	gap:10px;
	padding:10px 15px;
	background:var(--blue-darkest);
	color:#fff;
}

#dhc-chat-root .dhc-chat-avatar {
	width:45px;
	height:45px;
	display:flex;
	align-items:center;
	justify-content:center;
	border:2px solid rgba(255,255,255,.2);
	border-radius:50%;
	background:#193d78;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:700;
	line-height:20px;
	text-align:center;
}

#dhc-chat-root .dhc-chat-header strong,
#dhc-chat-root .dhc-chat-header .dhc-chat-presence {
	display:block;
}

#dhc-chat-root .dhc-chat-header strong {
	font-size:2rem;
	line-height:20px;
}

#dhc-chat-root .dhc-chat-presence {
	font-size:1.2rem;
	line-height:normal;
}

#dhc-chat-root .dhc-chat-presence i {
	width:10px;
	height:10px;
	display:inline-block;
	margin-right:5px;
	border-radius:50%;
	background:#8edc4f;
}

#dhc-chat-root.is-offline .dhc-chat-presence i {
	background:#bbc3cc;
}

#dhc-chat-root .dhc-chat-header-button {
	width:35px;
	height:35px;
	padding:0;
	border:0;
	border-radius:50%;
	background:transparent;
	color:#fff;
	font-size:25px;
	line-height:35px;
}

#dhc-chat-root .dhc-chat-header-button:hover,
#dhc-chat-root .dhc-chat-header-button:focus-visible {
	background:rgba(255,255,255,.15);
}

#dhc-chat-root .dhc-chat-product {
	min-height:80px;
	display:grid;
	grid-template-columns:55px minmax(0,1fr) auto;
	align-items:center;
	gap:10px;
	padding:10px 15px;
	border-bottom:1px solid var(--dhc-chat-line);
	background:#f8fafc;
}

#dhc-chat-root .dhc-chat-product img {
	width:55px;
	height:55px;
	border:1px solid #e0e5ea;
	border-radius:5px;
	background:#fff;
	object-fit:contain;
}

#dhc-chat-root .dhc-chat-product div {
	min-width:0;
}

#dhc-chat-root .dhc-chat-product span,
#dhc-chat-root .dhc-chat-product strong,
#dhc-chat-root .dhc-chat-product small {
	display:block;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

#dhc-chat-root .dhc-chat-product span,
#dhc-chat-root .dhc-chat-product small {
	color:var(--dhc-chat-muted);
	font-size:10px;
	line-height:15px;
}

#dhc-chat-root .dhc-chat-product strong {
	font-size:15px;
	line-height:20px;
}

#dhc-chat-root .dhc-chat-product b {
	align-self:start;
	padding:5px 10px;
	border-radius:15px;
	background:#e7f0fa;
	color:var(--dhc-chat-blue);
	font-size:10px;
	font-weight:700;
	line-height:15px;
	text-transform:uppercase;
}

#dhc-chat-root .dhc-chat-loading {
	min-height:0;
	flex:1;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:5px;
	padding:30px;
	color:var(--dhc-chat-muted);
}

#dhc-chat-root .dhc-chat-loading span {
	width:10px;
	height:10px;
	border-radius:50%;
	background:#9ba7b4;
	animation:dhc-chat-pulse 1s ease infinite alternate;
}

#dhc-chat-root .dhc-chat-loading span:nth-child(2) { animation-delay:.2s; }
#dhc-chat-root .dhc-chat-loading span:nth-child(3) { animation-delay:.4s; }

#dhc-chat-root .dhc-chat-loading p {
	margin:0 0 0 10px;
}

@keyframes dhc-chat-pulse {
	to { opacity:.3; transform:translateY(-5px); }
}

#dhc-chat-root .dhc-chat-start {
	background-color: var(--white);
	min-height:0;
	flex:1;
	overflow-y:auto;
	padding:20px;
}

#dhc-chat-root .dhc-chat-intro {
	margin-bottom:15px;
	text-align:center;
}

#dhc-chat-root .dhc-chat-intro h2 {
	margin:0 0 5px;
	color:var(--dhc-chat-ink);
	font-size:20px;
	line-height:25px;
}

#dhc-chat-root .dhc-chat-intro p {
	max-width:300px;
	margin:0 auto;
	color:var(--dhc-chat-muted);
}

#dhc-chat-root .dhc-chat-field {
	position:relative;
	margin-bottom:15px;
}

#dhc-chat-root .dhc-chat-field label {
	position:absolute;
	top:15px;
	left:10px;
	z-index:1;
	padding:0 5px;
	background:#fff;
	color:#4d5967;
	font-size:15px;
	font-weight:400;
	line-height:20px;
	pointer-events:none;
	transition:top .2s ease, transform .2s ease, font-size .2s ease, color .2s ease;
}

#dhc-chat-root .dhc-chat-start input,
#dhc-chat-root .dhc-chat-start textarea {
	width:100%;
	margin:0;
	padding:20px 15px 5px;
	border:1px solid #cfd7df;
	border-radius:5px;
	background:#fff;
	color:var(--dhc-chat-ink);
	font-weight:400;
	line-height:20px;
	outline:0;
}

#dhc-chat-root .dhc-chat-start input {
	height:50px;
}

#dhc-chat-root .dhc-chat-field input:focus + label,
#dhc-chat-root .dhc-chat-field input:not(:placeholder-shown) + label,
#dhc-chat-root .dhc-chat-field textarea:focus + label,
#dhc-chat-root .dhc-chat-field textarea:not(:placeholder-shown) + label {
	top:0;
	color:var(--dhc-chat-blue);
	font-size:10px;
	font-weight:700;
	line-height:15px;
	transform:translateY(-50%);
}

#dhc-chat-root .dhc-chat-start input:focus,
#dhc-chat-root .dhc-chat-start textarea:focus,
#dhc-chat-root .dhc-chat-compose textarea:focus {
	border-color:#7c9fcf;
	box-shadow:0 0 0 5px #edf3fb;
}

#dhc-chat-root .dhc-chat-start textarea {
	min-height:100px;
	resize:vertical;
}

#dhc-chat-root .dhc-chat-primary {
	width:100%;
	height:45px;
	border:0;
	border-radius:5px;
	background:var(--blue-darkest);
	color:#fff;
	font-weight:700;
}

#dhc-chat-root .dhc-chat-primary:hover,
#dhc-chat-root .dhc-chat-primary:focus-visible {
	background:var(--blue-darkest);
}

#dhc-chat-root .dhc-chat-start > small {
	display:block;
	margin-top:10px;
	color:#818b96;
	font-size:10px;
	text-align:center;
}

#dhc-chat-root .dhc-chat-form-state {
	min-height:20px;
	margin:5px 0 0;
	color:#a13f3f;
	font-size:10px;
}

#dhc-chat-root .dhc-chat-conversation {
	background-color: var(--white);
	min-height:0;
	flex:1;
	display:flex;
	flex-direction:column;
}

#dhc-chat-root .dhc-chat-feed {
	min-height:0;
	flex:1;
	overflow-y:auto;
	padding:20px 15px;
	background:#fff;
	scrollbar-width:thin;
}

#dhc-chat-root .dhc-chat-date {
	margin:0 0 15px;
	color:#8a94a0;
	font-size:10px;
	text-align:center;
	text-transform:uppercase;
}

#dhc-chat-root .dhc-chat-row {
	display:flex;
	align-items:flex-end;
	gap:10px;
	margin-bottom:15px;
}

#dhc-chat-root .dhc-chat-row.is-visitor {
	justify-content:flex-end;
}

#dhc-chat-root .dhc-chat-mini-avatar {
	width:30px;
	height:30px;
	display:grid;
	flex:none;
	place-items:center;
	border-radius:50%;
	background:#e6edf4;
	color:var(--dhc-chat-blue);
	font-size:10px;
	font-weight:700;
}

#dhc-chat-root .dhc-chat-bubble {
	max-width:75%;
}

#dhc-chat-root .dhc-chat-bubble p {
	margin:0;
	padding:10px 15px;
	border-radius:5px 15px 15px 15px;
	background:#edf0f4;
	color:#263444;
	line-height:20px;
	white-space:pre-wrap;
	word-break:break-word;
}

#dhc-chat-root .dhc-chat-row.is-visitor .dhc-chat-bubble p {
	border-radius:15px 5px 15px 15px;
	background:var(--dhc-chat-blue);
	color:#fff;
}

#dhc-chat-root .dhc-chat-message-meta {
	display:flex;
	align-items:center;
	gap:5px;
	margin-top:5px;
	color:#8a94a0;
	font-size:10px;
	line-height:15px;
}

#dhc-chat-root .dhc-chat-row.is-visitor .dhc-chat-message-meta {
	justify-content:flex-end;
}

#dhc-chat-root .dhc-chat-message-meta time {
	display:block;
}

#dhc-chat-root .dhc-chat-message-status {
	width:20px;
	height:15px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	color:#8a94a0;
}

#dhc-chat-root .dhc-chat-message-status svg {
	width:30px;
	height:25px;
	fill:none;
	stroke:currentColor;
	stroke-width:2;
	stroke-linecap:round;
	stroke-linejoin:round;
}

#dhc-chat-root .dhc-chat-message-status.read {
	color:var(--blue-highlight);
}

#dhc-chat-root .dhc-chat-message-status span {
	position:absolute;
	width:1px;
	height:1px;
	padding:0;
	margin:-1px;
	overflow:hidden;
	clip:rect(0,0,0,0);
	white-space:nowrap;
	border:0;
}

#dhc-chat-root .dhc-chat-empty {
	padding:30px 20px;
	color:var(--dhc-chat-muted);
	text-align:center;
}

#dhc-chat-root .dhc-chat-compose {
	position:relative;
	display:grid;
	grid-template-columns:1fr 45px;
	gap:10px;
	padding:10px 15px;
	/*border-top:1px solid var(--dhc-chat-line);*/
}

#dhc-chat-root .dhc-chat-compose textarea {
	min-height:45px;
	max-height:90px;
	resize:none;
	padding:10px 15px;
	border:1px solid #d7dde4;
	border-radius:25px;
	background:#fff;
	color:var(--dhc-chat-ink);
	line-height:20px;
	outline:0;
}

#dhc-chat-root .dhc-chat-compose button {
	width:45px;
	height:45px;
	display:grid;
	place-items:center;
	border:0;
	border-radius:50%;
	background:#97c511;
}

#dhc-chat-root .dhc-chat-compose button svg {
	width:20px;
	fill:none;
	stroke:var(--blue-darkest);
	stroke-width:2;
	stroke-linecap:round;
	stroke-linejoin:round;
}

#dhc-chat-root .dhc-chat-compose .dhc-chat-form-state {
	position:absolute;
	left:30px;
	bottom:5px;
	margin:0;
}

#dhc-chat-root .dhc-chat-window > footer {
	min-height:30px;
	padding:5px 15px;
	border-top:1px solid var(--dhc-chat-line);
	background:#f8fafb;
	color:#8b95a0;
	font-size:10px;
	line-height:20px;
	text-align:center;
}

@media (max-width:991px) {
	html.dhc-chat-is-open,
	html.dhc-chat-is-open body {
		overflow:hidden;
		overscroll-behavior:none;
	}

	#dhc-chat-root .dhc-chat-launcher {
		right:0;
		bottom:calc(25px + env(safe-area-inset-bottom, 0px));
		width:80px;
		height:80px;
		min-width:0;
		min-height:0;
		padding:15px;
		border-radius:50% 0 0 50%;
	}

	#dhc-chat-root .dhc-chat-launcher__icon {
		width:50px;
		height:50px;
	}

	#dhc-chat-root .dhc-chat-launcher__copy,
	#dhc-chat-root .dhc-chat-launcher .dhc-chat-presence-dot {
		display:none;
	}

	#dhc-chat-root .dhc-chat-window {
		bottom: 20px;
		height: auto;
		max-height:100dvh;
		right: 20px;
		width:calc(100vw - 40px);
	}

	#dhc-chat-root .dhc-chat-header {
		min-height:calc(75px + env(safe-area-inset-top, 0px));
		grid-template-columns:minmax(0, 1fr) 45px 45px;
		gap:5px;
		padding:calc(15px + env(safe-area-inset-top, 0px)) calc(10px + env(safe-area-inset-right, 0px)) 10px calc(20px + env(safe-area-inset-left, 0px));
	}

	#dhc-chat-root .dhc-chat-header > div {
		min-width:0;
	}

	#dhc-chat-root .dhc-chat-header strong,
	#dhc-chat-root .dhc-chat-presence {
		overflow:hidden;
		text-overflow:ellipsis;
		white-space:nowrap;
	}

	#dhc-chat-root .dhc-chat-header-button {
		height:45px;
		font-size: 45px;
		line-height:45px;
		touch-action:manipulation;
		width:45px;
	}
	
	#dhc-chat-root .dhc-chat-avatar,
	#dhc-chat-root .dhc-chat-intro p,
	#dhc-chat-root .dhc-chat-product b {
		display: none;
	}
	
	#dhc-chat-root .dhc-chat-presence i {
		height: 15px;
		width: 15px;
	}
	
	#dhc-chat-root .dhc-chat-header strong,
	#dhc-chat-root .dhc-chat-product strong {
		font-size: 3rem;
		line-height: normal;
		font-weight: 600;
	}
	
	#dhc-chat-root .dhc-chat-presence,
	#dhc-chat-root .dhc-chat-product span, 
	#dhc-chat-root .dhc-chat-product small,
	#dhc-chat-root .dhc-chat-date {
		font-size: 2rem;
		line-height: normal;
		padding: 8px 0px;
	}

	#dhc-chat-root .dhc-chat-product {
		min-height:70px;
		grid-template-columns:85px minmax(0, 1fr) auto;
		padding:10px calc(15px + env(safe-area-inset-right, 0px)) 10px calc(15px + env(safe-area-inset-left, 0px));
	}

	#dhc-chat-root .dhc-chat-product img {
        height: 100%;
        padding: 10px;
        width: 80px;
	}

	#dhc-chat-root .dhc-chat-start {
		-webkit-overflow-scrolling:touch;
		overscroll-behavior:contain;
		padding:20px calc(15px + env(safe-area-inset-right, 0px)) 20px calc(15px + env(safe-area-inset-left, 0px));
	}
	
	#dhc-chat-root .dhc-chat-field label {
		font-size: 3rem;
		top: 23px;
	}

	#dhc-chat-root .dhc-chat-start input,
	#dhc-chat-root .dhc-chat-start textarea,
	#dhc-chat-root .dhc-chat-compose textarea,
	#dhc-chat-root button {
		font-size: 3rem;
		font-weight: 500;
	}
	
	#dhc-chat-root .dhc-chat-start input {
		height: unset;
		padding: 15px;
	}
	
	#dhc-chat-root .dhc-chat-start textarea {
		line-height: normal;
	}
	
	#dhc-chat-root .dhc-chat-field input:focus + label, 
	#dhc-chat-root .dhc-chat-field input:not(:placeholder-shown) + label, 
	#dhc-chat-root .dhc-chat-field textarea:focus + label, 
	#dhc-chat-root .dhc-chat-field textarea:not(:placeholder-shown) + label {
		font-size: 18px;
	}
	
	#dhc-chat-root .dhc-chat-compose textarea {
		border: none;
		line-height: normal;		
	}
	
	#dhc-chat-root .dhc-chat-primary {
		height: auto;
		line-height: normal;
		padding: 25px;
	}


	#dhc-chat-root .dhc-chat-message-meta {
		margin-top:10px;
		color:var(--black);
		font-size:2rem;
		line-height:normal;
	}

	#dhc-chat-root .dhc-chat-start > small {
		font-size: 1em;
		margin-top: 20px;
	}

	#dhc-chat-root .dhc-chat-feed {
		-webkit-overflow-scrolling:touch;
		overscroll-behavior:contain;
		padding:20px calc(15px + env(safe-area-inset-right, 0px)) 20px calc(15px + env(safe-area-inset-left, 0px));
	}

	#dhc-chat-root .dhc-chat-bubble p {
		font-size: 2.5rem;
		line-height: normal;
		max-width:100%;
	}
	
	#dhc-chat-root .dhc-chat-message-status svg {
		height: 25px;
		width: 40px;
	}

	#dhc-chat-root .dhc-chat-compose {
		grid-template-columns:minmax(0, 1fr) 53px;		
		padding:15px calc(15px + env(safe-area-inset-right, 0px)) 15px calc(15px + env(safe-area-inset-left, 0px));
	}
	
	#dhc-chat-root .dhc-chat-compose button {
		background: #80c84c;
		border-radius: 10px;
		height: 55px;
		width: 55px;
	}
	
	#dhc-chat-root .dhc-chat-compose button svg {
		stroke: var(--blue-darkest);
		width: 35px;
	}
	
	#dhc-chat-root .dhc-chat-compose textarea {
		/*min-height: 65px;*/
	}
	
	#dhc-chat-root .dhc-chat-form-state {
		min-height: unset;
	}

	#dhc-chat-root .dhc-chat-window > footer {
		display: none;
		/*font-size: 1em;
		line-height: normal;
		padding:5px calc(15px + env(safe-area-inset-right, 0px)) calc(5px + env(safe-area-inset-bottom, 0px)) calc(15px + env(safe-area-inset-left, 0px));*/
	}

	#dhc-chat-root .dhc-chat-launcher,
	#dhc-chat-root .dhc-chat-primary,
	#dhc-chat-root .dhc-chat-compose button {
		touch-action:manipulation;
	}
}

@media (max-width:390px) {
	#dhc-chat-root .dhc-chat-product b {
		display:none;
	}
}
