.scta{
	--scta-accent:#17a5cc;
	--scta-text:#fff;
	--scta-top:55%;
	position:fixed;
	top:var(--scta-top);
	transform:translateY(-50%);
	z-index:99998;
	display:flex;
	align-items:center;
	box-sizing:border-box;
	/* Kontener nie łapie kliknięć — tylko realne elementy (zakładka / otwarty panel).
	   Zapobiega zasłanianiu np. przycisku usuwania w koszyku przez pusty obszar
	   zarezerwowany pod ukryty panel (visibility:hidden nadal zajmuje layout). */
	pointer-events:none;
}
.scta *{box-sizing:border-box;}
.scta .scta-tab{pointer-events:auto;}
.scta{--scta-gap:28px;}
.scta--left{left:var(--scta-gap);flex-direction:row;}
.scta--right{right:var(--scta-gap);flex-direction:row-reverse;}

/* Pionowa zakładka — zaokrąglona pigułka odsunięta od krawędzi */
.scta .scta-tab{
	appearance:none;-webkit-appearance:none;
	border:0;margin:0;cursor:pointer;
	display:flex;flex-direction:column;align-items:center;gap:14px;
	padding:15px 14px 25px;
	color:#fff;
	background:linear-gradient(180deg,
		color-mix(in srgb, var(--scta-accent) 78%, #fff),
		var(--scta-accent));
	border-radius:999px;
	box-shadow:0 10px 30px rgba(10,40,70,.28);
	font-family:inherit;
	transition:filter .15s ease, box-shadow .15s ease;
}
.scta .scta-tab:hover{filter:brightness(1.04);box-shadow:0 14px 36px rgba(10,40,70,.34);}
.scta .scta-tab-icon{display:inline-flex;color:#fff;}
.scta .scta-tab-text{
	writing-mode:vertical-rl;
	transform:none;
	font-size:14px;font-weight:700;
	letter-spacing:.16em;text-transform:uppercase;
	line-height:1;
	color:#fff;
}

/* Panel z kanałami */
.scta-panel{
	width:270px;
	max-width:calc(100vw - 90px);
	background:#fff;
	border-radius:14px;
	box-shadow:0 18px 50px rgba(10,30,60,.28);
	padding:14px;
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:opacity .18s ease, transform .18s ease, visibility .18s;
}
.scta--left .scta-panel{margin-left:12px;transform:translateX(-12px);}
.scta--right .scta-panel{margin-right:12px;transform:translateX(12px);}
.scta.is-open .scta-panel{opacity:1;visibility:visible;pointer-events:auto;transform:none;}

.scta-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:2px 2px 12px;}
.scta-panel-title{font-size:15px;font-weight:700;color:#1f2b3a;}
.scta-close{
	appearance:none;-webkit-appearance:none;border:0;background:none;margin:0;padding:2px;
	color:#9aa7b4;cursor:pointer;display:inline-flex;border-radius:6px;flex:0 0 auto;
	transition:color .15s ease,background .15s ease;
}
.scta-close:hover{color:#33414f;background:rgba(0,0,0,.05);}

.scta-channels{display:flex;flex-direction:column;gap:10px;}
.scta-channel{
	display:flex;align-items:center;gap:12px;
	padding:11px 12px;
	border-radius:10px;
	background:#f4f7fa;
	text-decoration:none;
	transition:background .15s ease,transform .05s ease;
}
.scta-channel:hover{background:#e9eff5;}
.scta-channel:active{transform:translateY(1px);}
.scta-ch-icon{
	width:40px;height:40px;border-radius:50%;
	background:var(--scta-accent);color:#fff;
	display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;
}
.scta-channel--whatsapp .scta-ch-icon{background:#25d366;}
.scta-ch-meta{display:flex;flex-direction:column;line-height:1.3;min-width:0;}
.scta-ch-label{font-size:15px;font-weight:700;color:#1f2b3a;}
.scta-ch-sub{font-size:12px;color:#8a97a5;}

/* Mobile */
@media (max-width:600px){
	.scta{--scta-gap:16px;}
	.scta .scta-tab{padding:26px 12px;gap:12px;}
	.scta .scta-tab-text{font-size:13px;letter-spacing:.12em;}
	.scta-panel{width:240px;}
}

@media (prefers-reduced-motion:reduce){
	.scta-panel{transition:none;}
}
