.sbn-whatsapp {
	--sbn-wa-green: #2db742;
	--sbn-wa-right: 18px;
	--sbn-wa-bottom: 78px;
	font-family: Arial, Helvetica, sans-serif;
}

.sbn-whatsapp *,
.sbn-whatsapp *::before,
.sbn-whatsapp *::after {
	box-sizing: border-box;
}

.sbn-whatsapp .sbn-whatsapp__toggle,
.sbn-whatsapp .sbn-whatsapp__toggle:is(:hover, :focus, :active) {
	appearance: none;
	position: fixed;
	right: var(--sbn-wa-right);
	bottom: var(--sbn-wa-bottom);
	z-index: 999999999;
	display: block;
	width: 56px;
	height: 56px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--sbn-wa-green) url("whatsapp.svg") center / 30px no-repeat;
	box-shadow: 0 6px 8px 2px rgb(0 0 0 / 14%);
	cursor: pointer;
	font: inherit;
	text-align: left;
	text-transform: none;
}

.sbn-whatsapp .sbn-whatsapp__toggle[aria-expanded="true"] {
	background-image: url("close.svg");
	background-size: 14px;
}

.sbn-whatsapp__label {
	position: absolute;
	right: calc(100% + 7px);
	top: 50%;
	transform: translateY(-50%);
	width: 156px;
	padding: 8px 12px;
	border-radius: 4px;
	background: #f5f7f9;
	color: #43474e;
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: -.03em;
}

.sbn-whatsapp__toggle[aria-expanded="true"] .sbn-whatsapp__label,
.sbn-whatsapp__panel[hidden] {
	display: none;
}

.sbn-whatsapp__panel {
	position: fixed;
	right: var(--sbn-wa-right);
	bottom: calc(var(--sbn-wa-bottom) + 72px);
	z-index: 999999998;
	width: 351px;
	max-width: calc(100% - 50px);
	max-height: max(100px, calc(100dvh - 166px));
	overflow: auto;
	border-radius: 5px 5px 8px 8px;
	box-shadow: 0 10px 10px 4px rgb(0 0 0 / 4%);
	text-align: left;
}

.sbn-whatsapp__panel:hover,
.sbn-whatsapp__panel:focus-within {
	box-shadow: 0 10px 10px 4px rgb(32 32 37 / 23%);
}

.sbn-whatsapp__heading {
	padding: 15px 43px 17px 74px;
	background: var(--sbn-wa-green) url("whatsapp.svg") left 23px top 20px / 33px no-repeat;
	color: #d9ebc6;
}

.sbn-whatsapp__title {
	min-height: 24px;
	padding-top: 2px;
	color: #fff;
	font-size: 18px;
	line-height: 24px;
}

.sbn-whatsapp__intro {
	padding-top: 4px;
	font-size: 12px;
	line-height: 20px;
}

.sbn-whatsapp__content {
	padding: 13px 20px 21px 19px;
	background: #fff;
}

.sbn-whatsapp__notice {
	padding: 0 3px;
	color: #a5abb7;
	font-size: 11px;
	font-weight: 500;
}

.sbn-whatsapp .sbn-whatsapp__account {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 73px;
	margin-top: 14px;
	padding: 13px 40px 12px 74px;
	border-left: 2px solid var(--sbn-wa-green);
	border-radius: 2px 4px 2px 4px;
	background: #f5f7f9 url("whatsapp-green.svg") right 14px top 26px / 20px no-repeat;
	color: #363c47;
	font-size: 14px;
	line-height: 1.188;
	text-decoration: none;
}

.sbn-whatsapp .sbn-whatsapp__account:hover,
.sbn-whatsapp .sbn-whatsapp__account:focus {
	background-color: #fff;
	box-shadow: 0 7px 15px 1px rgb(55 62 70 / 7%);
}

.sbn-whatsapp__avatar {
	position: absolute;
	top: 12px;
	left: 12px;
	width: 48px;
	height: 48px;
}

.sbn-whatsapp .sbn-whatsapp__toggle:focus-visible,
.sbn-whatsapp .sbn-whatsapp__account:focus-visible {
	outline: 2px solid #0f1f40;
	outline-offset: 3px;
}
