.scb-group {
	--scb-gap: 12px;
	box-sizing: border-box;
}
.scb-group * {
	box-sizing: border-box;
}

/* Layout: inline (vertical/horizontal, non floating) */
.scb-layout-vertical:not(.scb-floating) {
	display: flex;
	flex-direction: column;
	gap: var(--scb-gap);
}
.scb-layout-horizontal:not(.scb-floating) {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--scb-gap);
}

/* Floating positioning */
.scb-floating {
	position: fixed;
	z-index: 999999;
	display: flex;
	flex-direction: column;
	gap: var(--scb-gap);
}
.scb-pos-bottom-right { right: var(--scb-offset-x-desktop, 24px); bottom: var(--scb-offset-y-desktop, 24px); }
.scb-pos-bottom-left  { left: var(--scb-offset-x-desktop, 24px); bottom: var(--scb-offset-y-desktop, 24px); }
.scb-pos-top-right    { right: var(--scb-offset-x-desktop, 24px); top: var(--scb-offset-y-desktop, 24px); }
.scb-pos-top-left     { left: var(--scb-offset-x-desktop, 24px); top: var(--scb-offset-y-desktop, 24px); }
.scb-pos-center-right { right: var(--scb-offset-x-desktop, 24px); top: 50%; transform: translateY(-50%); }
.scb-pos-center-left  { left: var(--scb-offset-x-desktop, 24px); top: 50%; transform: translateY(-50%); }

@media (max-width: 782px) {
	.scb-pos-bottom-right { right: var(--scb-offset-x-mobile, 16px); bottom: var(--scb-offset-y-mobile, 16px); }
	.scb-pos-bottom-left  { left: var(--scb-offset-x-mobile, 16px); bottom: var(--scb-offset-y-mobile, 16px); }
	.scb-pos-top-right    { right: var(--scb-offset-x-mobile, 16px); top: var(--scb-offset-y-mobile, 16px); }
	.scb-pos-top-left     { left: var(--scb-offset-x-mobile, 16px); top: var(--scb-offset-y-mobile, 16px); }
	.scb-pos-center-right { right: var(--scb-offset-x-mobile, 16px); }
	.scb-pos-center-left  { left: var(--scb-offset-x-mobile, 16px); }
}

/* The button itself */
.scb-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: var(--scb-height, 56px);
	min-width: var(--scb-height, 56px);
	width: var(--scb-width, auto);
	padding: 0 var(--scb-padding, 10px);
	margin: 0;
	background-color: var(--scb-bg, #25D366);
	color: var(--scb-text, #fff);
	border-radius: var(--scb-radius, 50px);
	border: var(--scb-border-width, 0) var(--scb-border-style, solid) var(--scb-border, transparent);
	text-decoration: none;
	font-size: var(--scb-font-size, 14px);
	font-weight: var(--scb-font-weight, 600);
	line-height: 1;
	white-space: nowrap;
	transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease, color .2s ease;
	position: relative;
}
.scb-btn.scb-icon-only {
	padding: 0;
}
.scb-btn.scb-shape-icon-only {
	background: transparent !important;
	box-shadow: none !important;
}
.scb-btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: var(--scb-icon-size, 24px);
	color: var(--scb-icon, currentColor);
	line-height: 1;
}
.scb-btn-icon img {
	width: var(--scb-icon-size, 24px);
	height: var(--scb-icon-size, 24px);
	object-fit: contain;
}
.scb-btn-text {
	color: var(--scb-text, #fff);
}
.scb-btn.scb-shadow {
	box-shadow: 0 6px 18px rgba(0, 0, 0, .22);
}

/* Hover effects */
.scb-btn:hover {
	background-color: var(--scb-hover-bg, var(--scb-bg));
}
.scb-btn:hover .scb-btn-text,
.scb-btn:hover .scb-btn-icon {
	color: var(--scb-hover-text, var(--scb-text));
}
.scb-hover-scale:hover { transform: scale(1.08); }
.scb-hover-lift:hover { transform: translateY(-4px); }
.scb-hover-glow:hover { box-shadow: 0 0 18px 4px var(--scb-bg); }

/* Tooltip */
.scb-tooltip {
	position: relative;
}
.scb-tooltip::after {
	content: attr(data-tooltip);
	position: absolute;
	right: calc(100% + 10px);
	top: 50%;
	transform: translateY(-50%);
	background: #1d2327;
	color: #fff;
	padding: 6px 10px;
	border-radius: 4px;
	font-size: 12px;
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
	transition: opacity .15s ease;
	pointer-events: none;
}
.scb-tooltip:hover::after {
	opacity: 1;
	visibility: visible;
}
body.scb-force-ltr .scb-tooltip::after,
[dir="ltr"] .scb-tooltip::after {
	right: auto;
	left: calc(100% + 10px);
}

/* Toggle / expand group */
.scb-layout-toggle {
	align-items: flex-end;
}
[dir="rtl"] .scb-layout-toggle,
.scb-pos-bottom-left.scb-layout-toggle,
.scb-pos-top-left.scb-layout-toggle {
	align-items: flex-start;
}
.scb-toggle-panel {
	display: flex;
	flex-direction: column;
	gap: var(--scb-gap);
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transform: translateY(10px);
	transition: max-height .3s ease, opacity .25s ease, transform .25s ease;
}
.scb-group.is-open .scb-toggle-panel {
	max-height: 1000px;
	opacity: 1;
	transform: translateY(0);
}
.scb-toggle-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
	position: relative;
}
.scb-toggle-trigger .scb-icon-close { display: none; }
.scb-group.is-open .scb-toggle-trigger .scb-icon-open { display: none; }
.scb-group.is-open .scb-toggle-trigger .scb-icon-close { display: inline-flex; }
.scb-toggle-trigger i { font-size: 24px; }

/* Animations */
@keyframes scb-pulse {
	0% { box-shadow: 0 0 0 0 rgba(0, 0, 0, .35); }
	70% { box-shadow: 0 0 0 14px rgba(0, 0, 0, 0); }
	100% { box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
}
@keyframes scb-bounce {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-8px); }
}
@keyframes scb-shake {
	0%, 100% { transform: translateX(0); }
	20% { transform: translateX(-3px); }
	40% { transform: translateX(3px); }
	60% { transform: translateX(-3px); }
	80% { transform: translateX(3px); }
}
@keyframes scb-fade {
	0%, 100% { opacity: 1; }
	50% { opacity: .55; }
}
@keyframes scb-slide {
	0% { transform: translateX(0); }
	50% { transform: translateX(-6px); }
	100% { transform: translateX(0); }
}
@keyframes scb-zoom {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.12); }
}

.scb-anim-pulse { animation: scb-pulse 2s infinite; }
.scb-anim-bounce { animation: scb-bounce 1.6s infinite; }
.scb-anim-shake { animation: scb-shake 2.2s infinite; }
.scb-anim-fade { animation: scb-fade 2s infinite; }
.scb-anim-slide { animation: scb-slide 2s infinite; }
.scb-anim-zoom { animation: scb-zoom 1.8s infinite; }

@media (prefers-reduced-motion: reduce) {
	.scb-btn, .scb-toggle-trigger { animation: none !important; }
}