/* Floating Contact Widget - frontend styles
 * Dynamic values (position offsets, colors, font sizes, per-item hover tint)
 * are injected via wp_add_inline_style() as CSS custom properties / small rules.
 */

#fcw-widget{
	position:fixed;
	z-index:999999;
	font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
	right:var(--fcw-side,24px);
	bottom:var(--fcw-bottom,24px);
}
#fcw-widget.fcw-pos-left{
	left:var(--fcw-side,24px);
	right:auto;
}

#fcw-card{
	position:relative;
	width:64px;
	height:64px;
	cursor:pointer;
}
#fcw-card.open{
	width:220px;
	height:var(--fcw-open-height,300px);
	max-height:calc(100vh - 48px);
	cursor:default;
}

.fcw-face{
	position:absolute; inset:0;
	border-radius:20px;
	box-shadow:0 10px 30px rgba(22,26,35,.18);
	overflow:hidden;
}

.fcw-front{
	width:64px; height:64px; border-radius:50%;
	background:linear-gradient(145deg, var(--fcw-bg-start,#2fd66b), var(--fcw-bg-end,#1da851));
	display:flex; align-items:center; justify-content:center;
}
#fcw-card.open .fcw-front{ opacity:0; pointer-events:none; }

.fcw-icon-slide{
	position:relative; width:48px; height:48px; border-radius:50%;
	background:#fff; display:flex; align-items:center; justify-content:center;
	overflow:hidden; box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.fcw-icon-slide img{
	position:absolute; width:34px; height:34px; object-fit:contain;
	transition:transform .4s cubic-bezier(.4,0,.2,1), opacity .35s ease;
}
.fcw-icon-slide img.enter{ transform:translateX(0); opacity:1; }
.fcw-icon-slide img.leave{ transform:translateX(56px); opacity:0; }
.fcw-icon-slide img.incoming{ transform:translateX(-56px); opacity:0; }

.fcw-pulse{
	position:absolute; inset:0; border-radius:50%;
	border:2px solid rgba(255,255,255,.35);
	animation:fcwPulse 2.4s ease-out infinite;
}
@keyframes fcwPulse{ 0%{transform:scale(1);opacity:.8;} 100%{transform:scale(1.5);opacity:0;} }

.fcw-back{
	background:#fff;
	padding:16px 14px; display:flex; flex-direction:column; gap:8px;
	opacity:0;
	overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;
}
.fcw-back::-webkit-scrollbar{ width:5px; }
.fcw-back::-webkit-scrollbar-thumb{ background:#dcdfe8; border-radius:10px; }
#fcw-card.open .fcw-back{ opacity:1; }
#fcw-card:not(.open) .fcw-back{ pointer-events:none; }

.fcw-back-header{
	display:flex; align-items:center; justify-content:space-between;
	padding:0 2px 6px 2px; border-bottom:1px solid #eceef3;
}
.fcw-back-header span{
	font-size:var(--fcw-title-fs,13.5px);
	font-weight:var(--fcw-title-fw,700);
	color:#161a23; letter-spacing:.2px;
}

.fcw-close{
	-webkit-appearance:none;
	appearance:none;
	box-sizing:border-box;
	width:26px; height:26px; min-width:26px; min-height:26px;
	padding:0; margin:0;
	border-radius:50%; border:none;
	background:#f1f2f6; color:#666f8d; font-size:14px; line-height:1;
	cursor:pointer; display:flex; align-items:center; justify-content:center;
	flex-shrink:0;
	transition:background .2s ease;
}
.fcw-close:hover{ background:#e6e8ef; }

.fcw-option{
	display:flex; align-items:center; gap:12px; padding:9px 10px; border-radius:12px;
	text-decoration:none; color:#161a23;
	font-size:var(--fcw-label-fs,13.5px);
	font-weight:var(--fcw-label-fw,600);
	transition:background .2s ease;
}

.fcw-icon{
	position:relative; width:36px; height:36px; border-radius:10px;
	display:flex; align-items:center; justify-content:center; flex-shrink:0;
	background:#f4f5f8; border:1px solid #eceef3;
}
.fcw-icon img{ width:20px; height:20px; object-fit:contain; }
.fcw-sub{ display:block; font-size:11px; font-weight:500; color:#9096ab; margin-top:1px; }

@media (max-width:480px){
	#fcw-widget{
		right:var(--fcw-side-m,16px);
		bottom:var(--fcw-bottom-m,16px);
	}
	#fcw-widget.fcw-pos-left{
		left:var(--fcw-side-m,16px);
		right:auto;
	}
	#fcw-card.open{ width:calc(100vw - 32px); max-width:260px; }
}