.speech-wrapper {
	padding: 30px 40px;
	background: url('../img/whatsapp-background-light.webp');
	height: 100%;;

	.bubble{
		width: 240px;
		height: auto;
		display: block;
		background: #f5f5f5;
		border-radius: 4px;
		box-shadow: 1px 1px 5px #000;
		position: relative;
		margin: 0 0 25px;

		.txt{
			padding: 8px 55px 8px 14px;

			.name{
				font-weight: 600;
				font-size: 12px;
				margin: 0 0 4px;
				color: #1D74AF !important;

				span{
					font-weight: normal;
					color: #b3b3b3;
				}
			}

			.message{
				font-size: 12px;
				margin: 0;
				color: #2b2b2b !important;
			}

			.timestamp{
				font-size: 11px;
				position: absolute;
				bottom: 8px;
				right: 10px;
				text-transform: uppercase;
				color: #707070 !important;
			}
		}

		.bubble-arrow {
			position: absolute;
			width: 0;
			bottom:42px;
			left: -16px;
			height: 0;
		}

		.bubble-arrow:after {
			content: "";
			position: absolute;
			border: 0 solid transparent;
			border-top: 9px solid #f5f5f5;
			border-radius: 0 20px 0;
			width: 15px;
			height: 30px;
			transform: rotate(145deg);
		}
	}
}

[data-theme=dark], .theme-dark {
	.speech-wrapper {
		background: url('../img/whatsapp-background-dark.webp');
		background-color: #000;

		.bubble {
			background: #3D3C3F;
			box-shadow: 1px 1px 5px #fff;

			.txt {

				.message {
					color: #D4DDE6 !important;
				}
			}

			.bubble-arrow:after {
				border-top: 9px solid #3D3C3F;
			}
		}
	}
}