/**
 * EurekAI Social Share
 */

.ess-share {
	--ess-bg: #272626;
	--ess-fg: #ffffff;
	--ess-size: 40px;
	--ess-icon: 18px;
	--ess-gap: 8px;
	--ess-radius: 6px;

	margin: 1.75em 0;
	line-height: 1;
}

.ess-share__label {
	display: block;
	margin: 0 0 .6em;
	font-size: .8125rem;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
	opacity: .75;
}

.ess-share__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ess-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ess-share__item {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ess-share__item::before,
.ess-share__item::marker {
	content: none;
}

/* Buttons
   ------------------------------------------------------------------ */

.ess-share__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--ess-size);
	height: var(--ess-size);
	border-radius: var(--ess-radius);
	background-color: var(--ess-bg);
	color: var(--ess-fg);
	text-decoration: none;
	box-shadow: none;
	transition: background-color .2s ease, transform .2s ease;
	-webkit-tap-highlight-color: transparent;
}

.ess-share__btn svg {
	display: block;
	width: var(--ess-icon);
	height: var(--ess-icon);
	fill: currentColor;
}

.ess-share__btn:hover,
.ess-share__btn:focus-visible {
	background-color: var(--ess-brand, var(--ess-bg));
	color: var(--ess-fg);
	transform: translateY(-2px);
}

.ess-share__btn:focus-visible {
	outline: 2px solid var(--ess-brand, var(--ess-bg));
	outline-offset: 2px;
}

/* Screen reader text (in case the theme doesn't define it)
   ------------------------------------------------------------------ */

.ess-share .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Alignment
   ------------------------------------------------------------------ */

.ess-share--align-center .ess-share__list,
.ess-share--align-center .ess-share__label {
	justify-content: center;
	text-align: center;
}

.ess-share--align-right .ess-share__list,
.ess-share--align-right .ess-share__label {
	justify-content: flex-end;
	text-align: right;
}

/* Vertical
   ------------------------------------------------------------------ */

.ess-share--vertical .ess-share__list {
	flex-direction: column;
	align-items: flex-start;
}

.ess-share--align-center.ess-share--vertical .ess-share__list {
	align-items: center;
}

.ess-share--align-right.ess-share--vertical .ess-share__list {
	align-items: flex-end;
}

/* Sticky left (desktop) — pinned to the left edge of the viewport.
   The markup lives at the end of the post, so when the fixed positioning
   is dropped below 1024px it naturally lands at the bottom of the post.
   ------------------------------------------------------------------ */

@media (min-width: 1025px) {

	.ess-share--sticky {
		position: fixed;
		top: 50%;
		left: 24px;
		z-index: 9999;
		margin: 0;
		transform: translateY(-50%);
	}

	.ess-share--sticky .ess-share__list {
		flex-direction: column;
		align-items: center;
	}

	.ess-share--sticky .ess-share__label {
		writing-mode: vertical-rl;
		margin: 0 0 .75em;
	}

	.ess-share--sticky .ess-share__btn:hover,
	.ess-share--sticky .ess-share__btn:focus-visible {
		transform: translateX(2px);
	}
}

/* Sticky left (tablet + mobile) — sits at the bottom of the post. */

@media (max-width: 1024px) {

	.ess-share--sticky {
		position: static;
		transform: none;
		margin: 1.75em 0;
	}

	.ess-share--sticky .ess-share__list {
		flex-direction: row;
	}
}

@media (prefers-reduced-motion: reduce) {

	.ess-share__btn {
		transition: none;
	}

	.ess-share__btn:hover,
	.ess-share__btn:focus-visible {
		transform: none;
	}
}