/* HOBBYTEC Core — Sociálne siete widget [hbtc_socials] */

.hbtc-socials {
	display: inline-flex; list-style: none; margin: 0; padding: 0; gap: 4px;
}
.hbtc-socials--center { justify-content: center; width: 100%; }
.hbtc-socials--right { justify-content: flex-end; width: 100%; }

.hbtc-socials__icon {
	position: relative; margin: 10px;
}
.hbtc-socials__icon > a {
	position: relative; display: flex; align-items: center; justify-content: center;
	width: 52px; height: 52px; border-radius: 50%;
	background: #ffffff; color: #221f20;
	box-shadow: 0 10px 20px rgba(34, 31, 32, .12);
	text-decoration: none;
	transition: all .25s cubic-bezier(.68, -0.55, .265, 1.55);
}
.hbtc-socials__svg { display: inline-flex; }
.hbtc-socials__svg svg { width: 20px; height: 20px; display: block; }

/* tooltip */
.hbtc-socials__tip {
	position: absolute; top: 0; left: 50%; transform: translateX(-50%);
	font-family: "Gilroy-Medium", system-ui, sans-serif; font-size: 13px; white-space: nowrap;
	background: #221f20; color: #fff; padding: 6px 10px; border-radius: 8px;
	box-shadow: 0 10px 20px rgba(34, 31, 32, .14);
	opacity: 0; pointer-events: none;
	transition: all .3s cubic-bezier(.68, -0.55, .265, 1.55);
}
.hbtc-socials__tip::before {
	content: ""; position: absolute; left: 50%; bottom: -3px;
	width: 8px; height: 8px; background: #221f20;
	transform: translateX(-50%) rotate(45deg); transition: all .3s cubic-bezier(.68, -0.55, .265, 1.55);
}
.hbtc-socials__icon:hover .hbtc-socials__tip { top: -46px; opacity: 1; }
.hbtc-socials__icon:hover > a { transform: translateY(-4px); color: #fff; }

/* brand hover */
.hbtc-socials__icon.is-facebook:hover > a { background: #1877f2; }
.hbtc-socials__icon.is-facebook:hover .hbtc-socials__tip,
.hbtc-socials__icon.is-facebook:hover .hbtc-socials__tip::before { background: #1877f2; }

.hbtc-socials__icon.is-instagram:hover > a { background: radial-gradient(circle at 30% 110%, #fdf497, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.hbtc-socials__icon.is-instagram:hover .hbtc-socials__tip,
.hbtc-socials__icon.is-instagram:hover .hbtc-socials__tip::before { background: #e4405f; }

.hbtc-socials__icon.is-youtube:hover > a { background: #cd201f; }
.hbtc-socials__icon.is-youtube:hover .hbtc-socials__tip,
.hbtc-socials__icon.is-youtube:hover .hbtc-socials__tip::before { background: #cd201f; }