/* TXP Announcement Bar
   Colours taken from the theme: coral #FF5C57 (site highlight), black, white.
   Font family is inherited from the theme body so the bar matches automatically. */

.txp-ab {
	--txp-ab-bg: #FF5C57;
	--txp-ab-fg: #FFFFFF;
	--txp-ab-btn-bg: #111111;
	--txp-ab-btn-fg: #FFFFFF;
	--txp-ab-height: 48px;

	position: relative;
	z-index: 99998; /* above fixed theme headers; below the theme's full-screen menu overlay */
	background: var(--txp-ab-bg);
	color: var(--txp-ab-fg);
	font-size: 15px;
	line-height: 1.35;
}

.txp-ab__inner {
	display: flex;
	align-items: center;
	gap: 16px;
	min-height: var(--txp-ab-height);
	max-width: 1400px;
	margin: 0 auto;
	padding: 8px 56px 8px 20px; /* right padding reserves space for the close button */
	box-sizing: border-box;
}

.txp-ab__text {
	flex: 1 1 auto;
	margin: 0;
	color: inherit;
}

.txp-ab__title {
	font-weight: 700;
	margin-right: 6px;
	color: inherit;
}

.txp-ab__body {
	opacity: 0.95;
}

.txp-ab__cta {
	flex: 0 0 auto;
	display: inline-block;
	padding: 7px 18px;
	border-radius: 999px;
	background: var(--txp-ab-btn-bg);
	color: var(--txp-ab-btn-fg);
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.15s ease;
}

.txp-ab__cta:hover,
.txp-ab__cta:focus {
	background: #000000;
	color: var(--txp-ab-btn-fg);
	text-decoration: none;
}

.txp-ab__close {
	position: absolute;
	top: 50%;
	right: 12px;
	transform: translateY(-50%);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--txp-ab-fg);
	cursor: pointer;
	opacity: 0.85;
}

.txp-ab__close:hover,
.txp-ab__close:focus {
	opacity: 1;
	background: rgba(0, 0, 0, 0.15);
}

.txp-ab__cta:focus-visible,
.txp-ab__close:focus-visible {
	outline: 2px solid #FFFFFF;
	outline-offset: 2px;
}

/* Optional: bar stays pinned to the top of the viewport while scrolling.
   Fixed rather than sticky so body padding or margin applied by the theme
   cannot move it; the spacer holds its place in the document flow. */
.txp-ab--sticky {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
}

.txp-ab-spacer {
	height: var(--txp-ab-height, 48px);
}

/* Hidden before first paint when the dismissal cookie is present, and after the close button is used. */
.txp-ab-dismissed .txp-ab,
.txp-ab-dismissed .txp-ab-spacer,
.txp-ab.is-dismissed,
.txp-ab.is-dismissed + .txp-ab-spacer {
	display: none;
}

/* Mobile: stack text above the button, keep it compact. */
@media (max-width: 767px) {
	.txp-ab {
		font-size: 14px;
	}
	.txp-ab__inner {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		padding: 12px 48px 12px 16px;
	}
	.txp-ab__title {
		display: block;
		margin: 0 0 2px;
	}
	.txp-ab__cta {
		padding: 6px 16px;
	}
	.txp-ab__close {
		top: 12px;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.txp-ab__cta {
		transition: none;
	}
}