/* Churup Traductor
 *
 * Para cambiar el color o el tamaño desde Elementor (CSS personalizado):
 *   .churup-tr { --churup-tr-color: #ffffff; --churup-tr-size: 18px; }
 */

.churup-tr {
	--churup-tr-color: #3a3a3a;
	--churup-tr-size: 17px;

	display: inline-block;
	line-height: 1;
}

/* "all: unset" elimina los estilos de botón del tema (borde, fondo, relleno, colores al pasar el mouse) */
.churup-tr .churup-tr__btn {
	all: unset;
	box-sizing: border-box;
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	color: var(--churup-tr-color);
	font-family: inherit;
	font-size: var(--churup-tr-size);
	font-weight: 400;
	line-height: 1;
	cursor: pointer;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
	transition: opacity 0.2s ease;
}

/* Zona de toque más grande sin cambiar el espacio visible */
.churup-tr .churup-tr__btn::after {
	content: "";
	position: absolute;
	inset: -12px -8px;
}

.churup-tr .churup-tr__btn:hover,
.churup-tr .churup-tr__btn:focus,
.churup-tr .churup-tr__btn:active {
	background: none;
	border: 0;
	box-shadow: none;
	color: var(--churup-tr-color);
	text-decoration: none;
}

.churup-tr .churup-tr__btn:hover {
	opacity: 0.7;
}

.churup-tr .churup-tr__btn:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 4px;
	border-radius: 4px;
}

.churup-tr__icon {
	flex: none;
	width: 1.5em;
	height: 1.5em;
}

/* Las dos palabras ocupan el mismo lugar; la activa se ve y la otra espera arriba o abajo */
.churup-tr__text {
	display: inline-grid;
	overflow: hidden;
	padding-block: 0.15em;
	margin-block: -0.15em;
}

.churup-tr__word {
	grid-area: 1 / 1;
	white-space: nowrap;
	line-height: 1.3;
	opacity: 0;
}

.churup-tr__word[data-role="src"] {
	transform: translateY(-80%);
}

.churup-tr__word[data-role="tgt"] {
	transform: translateY(80%);
}

.churup-tr__word.is-active {
	opacity: 1;
	transform: none;
}

.churup-tr.is-ready .churup-tr__word {
	transition: transform 0.35s cubic-bezier(0.22, 0.8, 0.24, 1), opacity 0.3s ease;
}

@media (prefers-reduced-motion: reduce) {
	.churup-tr.is-ready .churup-tr__word,
	.churup-tr .churup-tr__btn {
		transition: none;
	}
}

/* Botón flotante */
.churup-tr--floating {
	position: fixed;
	z-index: 99999;
}
.churup-tr--bottom-left {
	left: 20px;
	bottom: calc(20px + env(safe-area-inset-bottom, 0px));
}
.churup-tr--bottom-right {
	right: 20px;
	bottom: calc(20px + env(safe-area-inset-bottom, 0px));
}
.churup-tr--top-left {
	left: 20px;
	top: calc(20px + env(safe-area-inset-top, 0px));
}
.churup-tr--top-right {
	right: 20px;
	top: calc(20px + env(safe-area-inset-top, 0px));
}

/* Ocultar la barra y los globos de Google Translate */
body {
	top: 0 !important;
}
body > .skiptranslate,
.goog-te-banner-frame,
iframe.skiptranslate,
#goog-gt-tt,
.goog-te-balloon-frame {
	display: none !important;
}
.goog-text-highlight {
	background: none !important;
	box-shadow: none !important;
}
#churup-tr-holder {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}