/* === V&K Floating Contact Button === */
#vk-fab{
	--vk-orange:#E68A2E;
	--vk-orange-dark:rgba(0,0,0,.06);
	--vk-gold:#c9a45c;
	--vk-dark:#1a1a1a;
	--vk-dark-2:#262626;
	--vk-text-muted:#9a9a9a;
	--vk-online:#22c55e;
	--vk-wa:#25D366;
	--vk-shadow:0 16px 40px rgba(0,0,0,.18), 0 4px 12px rgba(0,0,0,.10);
	--vk-radius-lg:22px;
	--vk-radius-pill:999px;

	position:fixed;
	bottom:24px;
	z-index:99999;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
	color:#111;
	line-height:1.4;
}
#vk-fab.vk-pos-right{ right:24px; }
#vk-fab.vk-pos-left { left:24px;  }
#vk-fab *{box-sizing:border-box}

/* ===== INGEKLAPTE STAAT ===== */
.vk-fab-collapsed{
	display:flex;
	align-items:center;
	gap:12px;
	transition:opacity .25s ease, transform .25s ease;
}
#vk-fab.vk-pos-left .vk-fab-collapsed{ flex-direction:row-reverse; }

#vk-fab.is-open .vk-fab-collapsed{ opacity:1;transform:none;pointer-events:auto;position:absolute;bottom:0; }
#vk-fab.vk-pos-right.is-open .vk-fab-collapsed{ right:0; }
#vk-fab.vk-pos-left.is-open  .vk-fab-collapsed{ left:0;  }
#vk-fab.is-open .vk-tooltip{ display:none; }

.vk-tooltip{
	display:flex;
	align-items:center;
	gap:12px;
	background:#fff;
	border-radius:var(--vk-radius-pill);
	padding:8px 18px 8px 8px;
	box-shadow:var(--vk-shadow);
	cursor:pointer;
	user-select:none;
	animation:vk-bob 2.4s ease-in-out infinite;
	max-width:260px;
}
.vk-tooltip:hover{ filter:brightness(1.02); }
.vk-tooltip-photo{
	width:40px;height:40px;border-radius:50%;
	object-fit:cover;display:block;background:#eee;
	flex:0 0 auto;
}
.vk-tooltip-text{
	font-size:15px;font-weight:600;color:#1a1a1a;white-space:nowrap;
}
@keyframes vk-bob{
	0%,100%{ transform:translateY(0); }
	50%    { transform:translateY(-3px); }
}

.vk-fab-btn{
	position:relative;
	width:60px;height:60px;
	border-radius:50%;
	border:none;
	background:var(--vk-orange);
	color:#fff;
	cursor:pointer;
	display:inline-flex;align-items:center;justify-content:center;
	box-shadow:var(--vk-shadow);
	transition:filter .25s ease, transform .25s ease;
	padding:0;
}
.vk-fab-btn:hover{ filter:brightness(.94); transform:translateY(-2px); }
.vk-fab-btn:focus-visible{ outline:3px solid color-mix(in srgb, var(--vk-orange) 45%, transparent); outline-offset:3px; }
.vk-fab-btn::before{
	content:"";
	position:absolute;inset:0;border-radius:50%;
	box-shadow:0 0 0 0 var(--vk-orange);
	animation:vk-pulse 2.2s infinite;
	pointer-events:none;
	opacity:.55;
}
#vk-fab.vk-no-pulse .vk-fab-btn::before{ animation:none; opacity:0; }
@keyframes vk-pulse{
	0%   { box-shadow:0 0 0 0 var(--vk-orange); opacity:.55; }
	70%  { box-shadow:0 0 0 18px var(--vk-orange); opacity:0; }
	100% { box-shadow:0 0 0 0 var(--vk-orange); opacity:0; }
}
.vk-fab-btn .vk-icn-close{ display:none; }
#vk-fab.is-open .vk-fab-btn .vk-icn-chat { display:none; }
#vk-fab.is-open .vk-fab-btn .vk-icn-close{ display:block; }
#vk-fab.is-open .vk-fab-btn::before{ animation:none; opacity:0; }

/* ===== PANEL ===== */
.vk-fab-panel{
	position:absolute;
	bottom:74px;
	width:340px;
	max-width:calc(100vw - 32px);
	background:#fff;
	border-radius:var(--vk-radius-lg);
	box-shadow:var(--vk-shadow);
	overflow:hidden;
	opacity:0;
	transform:translateY(12px) scale(.98);
	transform-origin:bottom right;
	pointer-events:none;
	transition:opacity .25s ease, transform .25s ease;
}
#vk-fab.vk-pos-right .vk-fab-panel{ right:0; transform-origin:bottom right; }
#vk-fab.vk-pos-left  .vk-fab-panel{ left:0;  transform-origin:bottom left;  }
#vk-fab.is-open .vk-fab-panel{
	opacity:1;
	transform:translateY(0) scale(1);
	pointer-events:auto;
}

/* Header */
.vk-panel-header{
	position:relative;
	background:var(--vk-dark);
	color:#fff;
	padding:20px 20px 22px;
}
.vk-panel-close{
	position:absolute;top:12px;right:12px;
	width:32px;height:32px;border-radius:50%;
	background:transparent;border:none;color:#fff;
	cursor:pointer;display:inline-flex;align-items:center;justify-content:center;
	opacity:.8;transition:opacity .2s ease, background .2s ease;
	padding:0;
}
.vk-panel-close:hover{ opacity:1;background:rgba(255,255,255,.08); }

.vk-profile{ display:flex;align-items:center;gap:14px;margin-bottom:14px; }
.vk-profile-photo{
	position:relative;width:56px;height:56px;border-radius:50%;
	border:2px solid var(--vk-gold);
	padding:2px;
	flex:0 0 auto;
	background:var(--vk-dark);
}
.vk-profile-img{
	width:100%;height:100%;border-radius:50%;object-fit:cover;display:block;background:#eee;
}
.vk-online{
	position:absolute;right:0;bottom:2px;
	width:14px;height:14px;border-radius:50%;
	background:var(--vk-online);
	border:2px solid var(--vk-dark);
}
.vk-profile-name{ font-size:17px;font-weight:700;line-height:1.2; }
.vk-profile-role{ font-size:14px;color:var(--vk-text-muted);margin-top:2px; }

.vk-bubble{
	background:var(--vk-dark-2);
	border-radius:14px;
	padding:14px 16px;
	font-size:14px;
	color:#f3f3f3;
}

/* Body */
.vk-panel-body{ padding:18px 20px 20px; }
.vk-panel-title{
	margin:0 0 12px 0;
	font-family:Georgia,"Times New Roman",serif;
	font-style:italic;
	font-size:18px;
	font-weight:500;
	color:#1a1a1a;
	letter-spacing:.2px;
}
.vk-action{
	display:flex;align-items:center;gap:14px;
	padding:10px 6px;
	border-radius:12px;
	text-decoration:none;color:inherit;
	transition:background .2s ease, transform .2s ease;
}
.vk-action:hover{ background:#f7f7f7;transform:translateX(2px); }
.vk-action + .vk-action{ margin-top:2px; }
.vk-action-icon{
	width:44px;height:44px;border-radius:50%;
	background:#f1f1f1;
	display:inline-flex;align-items:center;justify-content:center;
	flex:0 0 auto;
}
.vk-icon-call { color:var(--vk-gold); }
.vk-icon-wa   { color:var(--vk-wa);   }
.vk-icon-quote{ color:var(--vk-gold); }
.vk-action-text{ display:flex;flex-direction:column;line-height:1.25; }
.vk-action-title{ font-size:16px;font-weight:700;color:#1a1a1a; }
.vk-action-sub{ font-size:13px;color:var(--vk-text-muted);margin-top:2px; }

/* ===== MOBIEL ===== */
@media (max-width:600px){
	#vk-fab.vk-pos-right{ right:16px; }
	#vk-fab.vk-pos-left { left:16px;  }
	#vk-fab{ bottom:16px; }
	.vk-tooltip-text{ font-size:14px; }
	.vk-fab-panel{ width:300px;bottom:70px; }
}
@media (max-width:380px){
	.vk-tooltip{ display:none; }
}

/* Reduce motion */
@media (prefers-reduced-motion:reduce){
	.vk-tooltip,.vk-fab-btn,.vk-fab-btn::before,.vk-fab-panel,.vk-fab-collapsed,.vk-action{
		animation:none!important;transition:none!important;
	}
}
