/* Post Enhancer — front-end styles. All selectors scoped under .wcpe-* */

.wcpe-post {
	--wcpe-accent: #e11d2a;
	--wcpe-radius: 14px;
	--wcpe-ink: #1a1a1a;
	--wcpe-muted: #6b7280;
	--wcpe-line: rgba(0, 0, 0, .08);
	--wcpe-card: rgba(0, 0, 0, .03);
}

/* ---------- Promo banner ---------- */
.wcpe-banner {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin: 0 0 1.8em;
	padding: 16px 20px;
	border-radius: var(--wcpe-radius);
	background: linear-gradient(135deg, var(--wcpe-accent), color-mix(in srgb, var(--wcpe-accent) 60%, #000));
	color: #fff;
	text-decoration: none;
	box-shadow: 0 10px 30px -12px color-mix(in srgb, var(--wcpe-accent) 70%, transparent);
	transition: transform .18s ease, box-shadow .18s ease;
}
.wcpe-banner:hover {
	transform: translateY(-2px);
	box-shadow: 0 16px 36px -12px color-mix(in srgb, var(--wcpe-accent) 80%, transparent);
}
.wcpe-banner__live {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .12em;
	padding: 5px 10px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .18);
	white-space: nowrap;
}
.wcpe-banner__dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 0 0 rgba(255, 255, 255, .7);
	animation: wcpe-pulse 1.6s infinite;
}
@keyframes wcpe-pulse {
	0%   { box-shadow: 0 0 0 0 rgba(255,255,255,.6); }
	70%  { box-shadow: 0 0 0 8px rgba(255,255,255,0); }
	100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}
.wcpe-banner__text {
	flex: 1 1 auto;
	font-weight: 700;
	font-size: 1.05rem;
	line-height: 1.3;
}
.wcpe-banner__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 800;
	padding: 10px 18px;
	border-radius: 999px;
	background: #fff;
	color: var(--wcpe-accent);
	white-space: nowrap;
}
.wcpe-banner__arrow { transition: transform .18s ease; }
.wcpe-banner:hover .wcpe-banner__arrow { transform: translateX(4px); }

/* ---------- Featured image ---------- */
.wcpe-featured {
	margin: 0 0 1.6em;
}
.wcpe-featured__img {
	width: 100%;
	height: auto;
	border-radius: var(--wcpe-radius);
	display: block;
}
.wcpe-featured__caption {
	margin-top: 8px;
	font-size: .85rem;
	color: var(--wcpe-muted);
	text-align: center;
}

/* ---------- Table of contents ---------- */
.wcpe-toc {
	margin: 0 0 1.8em;
	border: 1px solid var(--wcpe-line);
	border-radius: var(--wcpe-radius);
	background: var(--wcpe-card);
	overflow: hidden;
}
.wcpe-toc__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 14px 18px;
	background: none;
	border: 0;
	cursor: pointer;
	font: inherit;
	color: inherit;
	text-align: left;
}
.wcpe-toc__title {
	font-weight: 800;
	font-size: 1rem;
	letter-spacing: .01em;
}
.wcpe-toc__toggle {
	width: 11px;
	height: 11px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	transition: transform .2s ease;
	opacity: .6;
}
.wcpe-toc__head[aria-expanded="false"] .wcpe-toc__toggle {
	transform: rotate(-45deg);
}
.wcpe-toc__list {
	margin: 0;
	padding: 4px 18px 16px 18px;
	list-style: none;
	counter-reset: wcpe-toc;
}
.wcpe-toc__list[hidden] { display: none; }
.wcpe-toc__item { margin: 6px 0; line-height: 1.4; }
.wcpe-toc__item--h2 { counter-increment: wcpe-toc; }
.wcpe-toc__item--h2 > a::before {
	content: counter(wcpe-toc) ".";
	color: var(--wcpe-accent);
	font-weight: 800;
	margin-right: 8px;
}
.wcpe-toc__item--h3 { padding-left: 26px; font-size: .95em; }
.wcpe-toc__list a {
	text-decoration: none;
	color: inherit;
	border-bottom: 1px solid transparent;
}
.wcpe-toc__list a:hover {
	color: var(--wcpe-accent);
	border-bottom-color: currentColor;
}

/* offset anchor jumps so headings aren't hidden under sticky bars */
.wcpe-content :is(h2, h3)[id] { scroll-margin-top: 90px; }

/* ---------- Social share ---------- */
.wcpe-share {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin: 2em 0 .5em;
	padding-top: 1.4em;
	border-top: 1px solid var(--wcpe-line);
}
.wcpe-share__label {
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .08em;
	font-size: .8rem;
	color: var(--wcpe-muted);
}
.wcpe-share__buttons { display: flex; gap: 10px; flex-wrap: wrap; }
.wcpe-share__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: 1px solid var(--wcpe-line);
	background: var(--wcpe-card);
	color: var(--wcpe-ink);
	cursor: pointer;
	transition: transform .15s ease, background .15s ease, color .15s ease;
}
.wcpe-share__btn:hover { transform: translateY(-3px); color: #fff; }
.wcpe-share__btn--facebook:hover { background: #1877f2; border-color: #1877f2; }
.wcpe-share__btn--x:hover        { background: #000;     border-color: #000; }
.wcpe-share__btn--whatsapp:hover { background: #25d366; border-color: #25d366; }
.wcpe-share__btn--linkedin:hover { background: #0a66c2; border-color: #0a66c2; }
.wcpe-share__btn--telegram:hover { background: #229ed9; border-color: #229ed9; }
.wcpe-share__btn--email:hover    { background: #555;    border-color: #555; }
.wcpe-share__btn--copy:hover     { background: var(--wcpe-accent); border-color: var(--wcpe-accent); }
.wcpe-share__btn.is-copied {
	background: #16a34a;
	border-color: #16a34a;
	color: #fff;
}

/* ---------- Responsive ---------- */
@media (max-width: 600px) {
	.wcpe-banner { padding: 14px; }
	.wcpe-banner__text { flex-basis: 100%; order: 3; }
	.wcpe-banner__cta { flex: 1 1 auto; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.wcpe-banner, .wcpe-banner__arrow, .wcpe-share__btn,
	.wcpe-toc__toggle, .wcpe-banner__dot { transition: none; animation: none; }
}