/* Laruba Topbar — messages in the theme's top bar (centre group). */

#top-bar .laruba-topbar-text {
	max-width: 100%;
	min-width: 0;
	margin: 0;
	text-align: center;
	font-size: var(--lt-size, inherit);
	font-weight: var(--lt-weight, inherit);
	text-transform: var(--lt-transform, none);
	letter-spacing: var(--lt-spacing, 0.02em);
}

#top-bar .laruba-topbar-text a {
	color: var(--lt-link, inherit);
	text-decoration: underline;
	text-underline-offset: 2px;
}

#top-bar .laruba-topbar-text strong,
#top-bar .laruba-topbar-text b {
	font-weight: 600;
}

/* Rotation: slides share one grid cell, so the bar never changes size. */
#top-bar .laruba-topbar-slides {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	max-width: 100%;
}

#top-bar .laruba-topbar-slide {
	grid-area: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 0;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.45s ease, visibility 0s linear 0.45s;
}

#top-bar .laruba-topbar-slide.is-active {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.45s ease;
}

#top-bar .laruba-topbar-msg {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#top-bar .laruba-topbar-icon {
	flex: 0 0 auto;
	width: 1.15em;
	height: 1.15em;
	margin-right: 0.5em;
}

/* Separate phone text: desktop version above 991px, phone version below. */
#top-bar .lt-m {
	display: none;
}

@media (prefers-reduced-motion: reduce) {
	#top-bar .laruba-topbar-slide,
	#top-bar .laruba-topbar-slide.is-active {
		transition: none;
	}
}

/* Phones: Goya hides its top bar below 992px. Show it, centre group only (the
   language flags are already in the mobile header), one compact line. */
@media only screen and (max-width: 991px) {
	body.laruba-topbar-active #top-bar.et-top-bar {
		display: flex;
		min-height: 30px;
		height: 30px;
	}

	body.laruba-topbar-active #top-bar .topbar-left,
	body.laruba-topbar-active #top-bar .topbar-right {
		display: none !important;
	}

	body.laruba-topbar-active #top-bar .topbar-center {
		display: flex;
		justify-content: center;
		min-width: 0;
		flex: 1 1 auto;
	}

	body.laruba-topbar-active #top-bar .laruba-topbar-text {
		font-size: var(--lt-size-m, 12px);
		line-height: 30px;
	}

	#top-bar .lt-d {
		display: none;
	}

	#top-bar .lt-m {
		display: inline;
	}

	/* Pinned on scroll, mirroring the desktop rules in the site's custom CSS
	   ("laruba-fixed-topbar"): bar at the top, header right under it. */
	body.laruba-topbar-active.header_on_scroll #top-bar.et-top-bar {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		width: 100% !important;
		z-index: 1001 !important;
		opacity: 0.75 !important;
	}

	body.laruba-topbar-active.header_on_scroll #header.site-header {
		top: 30px !important;
	}

	/* Once pinned, the bar leaves the page flow; hold its place so the
	   content does not jump up by its height. */
	body.laruba-topbar-active.header_on_scroll #wrapper {
		padding-top: 30px;
	}
}
