/* Genesal · Botones laterales — front.
   Tokens del DS con fallback (el plugin puede correr sin el tema). */

.gen-lt {
	position: fixed;
	right: 0;
	top: 38%;
	z-index: 90;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 8px;
	margin: 0;
	padding: 0;
	pointer-events: none; /* el wrapper no captura; los tabs sí */
}

.gen-lt__tab {
	pointer-events: auto;
	writing-mode: vertical-rl;
	text-orientation: mixed;
	background: var(--gen-bg-fill-primary, #cf0540);
	color: #fff;
	padding: 24px 8px;
	border-radius: 4px 0 0 4px;
	font-family: var(--gen-font-helvetica, "Helvetica Neue", Arial, sans-serif);
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.3px;
	text-transform: uppercase;
	text-decoration: none;
	transition: background 0.15s ease;
}

.gen-lt__tab:hover,
.gen-lt__tab:focus {
	background: var(--gen-bg-fill-hover, #bc053a);
	color: #fff;
}

.gen-lt__tab:active {
	background: var(--gen-bg-fill-pressed, #93042d);
	color: #fff;
}

/* Móvil: abajo, centrado, mordiendo el borde inferior; texto horizontal. */
@media (max-width: 767px) {
	.gen-lt {
		top: auto;
		bottom: 0;
		right: 50%;
		transform: translateX(50%);
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		align-items: flex-end;
	}

	.gen-lt__tab {
		writing-mode: horizontal-tb;
		text-orientation: initial;
		border-radius: 4px 4px 0 0;
		padding: 10px 16px;
	}
}
