/* Barra superior encima del header. */
.dodox-topbar {
	position: relative;
	z-index: 101;
	background: #cf0545;
	color: #ffffff;
	font-family: var(--wp--preset--font-family--body, inherit);
	font-size: 0.8125rem;
	line-height: 1.3;
}

.dodox-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	max-width: 1280px;
	min-height: 38px;
	margin: 0 auto;
	padding: 6px clamp(16px, 4vw, 40px);
}

.dodox-topbar__text {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
	font-weight: 500;
	letter-spacing: 0.01em;
}

.dodox-topbar__item + .dodox-topbar__item::before {
	content: "·";
	margin: 0 10px;
	opacity: 0.7;
}

.dodox-topbar__item.is-last {
	font-weight: 700;
}

.dodox-topbar__contact {
	display: inline-flex;
	flex: 0 0 auto;
	align-items: center;
	gap: 7px;
	padding: 4px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.16);
	color: #ffffff;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.dodox-topbar__contact:hover,
.dodox-topbar__contact:focus-visible {
	background: #ffffff;
	color: #cf0545;
}

.dodox-topbar__contact:focus-visible {
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

.dodox-topbar__contact svg {
	width: 14px;
	height: 14px;
}

/* Movil: solo el ultimo mensaje y el contacto. */
@media (max-width: 760px) {
	.dodox-topbar__item:not(.is-last) {
		display: none;
	}

	.dodox-topbar__item.is-last::before {
		content: none;
	}
}

@media (max-width: 380px) {
	.dodox-topbar {
		font-size: 0.75rem;
	}

	.dodox-topbar__contact {
		padding: 4px 10px;
	}
}

/* El selector de idioma (pastilla EN/ES de GTranslate, estilos en dodox-header.css) se coloca
   a la derecha de la barra, en todos los anchos: el email le deja su hueco (110px + margen). */
.dodox-topbar__contact {
	margin-right: 136px;
}

@media (max-width: 760px) {
	.dodox-topbar__contact {
		margin-right: 64px;
	}
}