/* UK Party Bus Contact Buttons v1.1 – matches the UK Party Bus Hire website palette */
.uklcb{
	--uklcb-ink:#111213;
	--uklcb-gold:#B8975F;
	--uklcb-gold-dark:#8A6D3F;
	--uklcb-gold-hover:#C7A770;
	--uklcb-green:#1F8F4E;
	--uklcb-green-hover:#187A41;
	--uklcb-size:58px;
	position:fixed;
	bottom:calc(20px + env(safe-area-inset-bottom, 0px));
	z-index:9980;
	display:flex;
	flex-direction:column;
	gap:14px;
	font-family:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
	-webkit-font-smoothing:antialiased;
	pointer-events:none;
}
.uklcb--left{left:calc(20px + env(safe-area-inset-left, 0px));align-items:flex-start}
.uklcb--right{right:calc(20px + env(safe-area-inset-right, 0px));align-items:flex-end}

/* Button = round icon + small text label */
.uklcb .uklcb__btn{
	position:relative;
	display:flex;
	align-items:center;
	gap:10px;
	margin:0;
	padding:0;
	text-decoration:none!important;
	pointer-events:auto;
	-webkit-tap-highlight-color:transparent;
}
.uklcb--right .uklcb__btn{flex-direction:row-reverse}
.uklcb .uklcb__btn svg{
	box-sizing:content-box;
	display:block;
	flex-shrink:0;
	width:28px;
	height:28px;
	padding:calc((var(--uklcb-size) - 28px) / 2 - 2px);
	border-radius:50%;
	border:2px solid rgba(255,255,255,.95);
	box-shadow:0 6px 18px rgba(17,18,19,.28),0 2px 4px rgba(17,18,19,.18);
	transition:background-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.uklcb .uklcb__btn--wa svg{background:var(--uklcb-green);color:#fff;fill:currentColor;stroke:none}
.uklcb .uklcb__btn--call svg{background:var(--uklcb-gold);color:var(--uklcb-ink);fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;width:26px;height:26px;padding:calc((var(--uklcb-size) - 26px) / 2 - 2px)}
.uklcb .uklcb__btn--wa:hover svg{background:var(--uklcb-green-hover)}
.uklcb .uklcb__btn--call:hover svg{background:var(--uklcb-gold-hover)}
.uklcb .uklcb__btn:hover svg{transform:translateY(-2px);box-shadow:0 10px 24px rgba(17,18,19,.32),0 2px 4px rgba(17,18,19,.18)}
.uklcb .uklcb__btn:focus-visible{outline:none}
.uklcb .uklcb__btn:focus-visible svg{outline:3px solid var(--uklcb-gold);outline-offset:3px}

/* Small text label, always visible */
.uklcb .uklcb__label{
	display:flex;
	flex-direction:column;
	justify-content:center;
	padding:7px 12px 7px 12px;
	border-radius:8px;
	background:#fff;
	border:1px solid #E3E2DE;
	box-shadow:0 6px 16px rgba(17,18,19,.14);
	line-height:1.2;
	white-space:nowrap;
	transition:background-color .2s ease,border-color .2s ease;
}
.uklcb .uklcb__label strong{font-size:14px;font-weight:700;color:var(--uklcb-ink)}
.uklcb .uklcb__label small{margin-top:1px;font-size:12px;font-weight:600;color:#5C5D62;font-variant-numeric:tabular-nums}
.uklcb .uklcb__btn--call .uklcb__label small{color:var(--uklcb-gold-dark)}
.uklcb .uklcb__btn--wa .uklcb__label small{color:var(--uklcb-green)}
.uklcb .uklcb__btn:hover .uklcb__label{border-color:var(--uklcb-gold)}
.uklcb--no-labels .uklcb__label{display:none}

/* Gentle attention animation: float + soft ring every 6 seconds */
.uklcb .uklcb__btn--attn svg{animation:uklcb-float 6s ease-in-out 2s infinite}
.uklcb .uklcb__btn--attn::before{
	content:"";
	position:absolute;
	top:0;
	width:var(--uklcb-size);
	height:var(--uklcb-size);
	border-radius:50%;
	pointer-events:none;
	box-shadow:0 0 0 0 rgba(184,151,95,.55);
	animation:uklcb-ring 6s ease-out 2s infinite;
}
.uklcb--left .uklcb__btn--attn::before{left:0}
.uklcb--right .uklcb__btn--attn::before{right:0}
.uklcb .uklcb__btn--wa.uklcb__btn--attn::before{box-shadow:0 0 0 0 rgba(31,143,78,.5);animation-name:uklcb-ring-wa}
.uklcb .uklcb__btn--attn:hover svg,.uklcb .uklcb__btn--attn:hover::before{animation-play-state:paused}
@keyframes uklcb-float{
	0%,16%,100%{transform:translateY(0)}
	4%{transform:translateY(-7px)}
	8%{transform:translateY(0)}
	12%{transform:translateY(-4px)}
}
@keyframes uklcb-ring{
	0%{box-shadow:0 0 0 0 rgba(184,151,95,.55)}
	18%{box-shadow:0 0 0 16px rgba(184,151,95,0)}
	100%{box-shadow:0 0 0 0 rgba(184,151,95,0)}
}
@keyframes uklcb-ring-wa{
	0%{box-shadow:0 0 0 0 rgba(31,143,78,.5)}
	18%{box-shadow:0 0 0 16px rgba(31,143,78,0)}
	100%{box-shadow:0 0 0 0 rgba(31,143,78,0)}
}

/* Devices */
@media (max-width:980px){
	.uklcb{--uklcb-size:52px;gap:12px;bottom:calc(16px + env(safe-area-inset-bottom, 0px))}
	.uklcb--left{left:calc(14px + env(safe-area-inset-left, 0px))}
	.uklcb--right{right:calc(14px + env(safe-area-inset-right, 0px))}
	.uklcb .uklcb__btn{gap:8px}
	.uklcb .uklcb__btn svg{width:24px;height:24px;padding:calc((var(--uklcb-size) - 24px) / 2 - 2px)}
	.uklcb .uklcb__btn--call svg{width:23px;height:23px;padding:calc((var(--uklcb-size) - 23px) / 2 - 2px)}
	.uklcb .uklcb__label{padding:5px 9px}
	.uklcb .uklcb__label strong{font-size:13px}
	.uklcb .uklcb__label small{display:none}
	.uklcb--no-mobile{display:none!important}
}
@media (min-width:981px){
	.uklcb--no-desktop{display:none!important}
}

@media print{.uklcb{display:none!important}}

@media (prefers-reduced-motion:reduce){
	.uklcb .uklcb__btn svg,.uklcb .uklcb__label{transition:none}
	.uklcb .uklcb__btn--attn svg,.uklcb .uklcb__btn--attn::before{animation:none}
	.uklcb .uklcb__btn:hover svg{transform:none}
}