/* Emmcee Zimmer-Schnellwahl */

.emmcee-room-nav {
	--emmcee-nav-edge-offset: 20px;
	position: fixed;
	display: flex;
	align-items: center;
	z-index: 9000;
	box-sizing: border-box;
}

.emmcee-room-nav * {
	box-sizing: border-box;
}

/* ---------- Positionen ---------- */
.emmcee-room-nav--pos-top-left {
	top: var(--emmcee-nav-edge-offset);
	left: var(--emmcee-nav-edge-offset);
	flex-direction: column;
}

.emmcee-room-nav--pos-top-center {
	top: var(--emmcee-nav-edge-offset);
	left: 50%;
	transform: translateX(-50%);
	flex-direction: row;
}

.emmcee-room-nav--pos-top-right {
	top: var(--emmcee-nav-edge-offset);
	right: var(--emmcee-nav-edge-offset);
	flex-direction: column;
}

.emmcee-room-nav--pos-left-center {
	top: 50%;
	left: var(--emmcee-nav-edge-offset);
	transform: translateY(-50%);
	flex-direction: column;
}

.emmcee-room-nav--pos-right-center {
	top: 50%;
	right: var(--emmcee-nav-edge-offset);
	transform: translateY(-50%);
	flex-direction: column;
}

.emmcee-room-nav--pos-bottom-left {
	bottom: var(--emmcee-nav-edge-offset);
	left: var(--emmcee-nav-edge-offset);
	flex-direction: column;
}

.emmcee-room-nav--pos-bottom-center {
	bottom: var(--emmcee-nav-edge-offset);
	left: 50%;
	transform: translateX(-50%);
	flex-direction: row;
}

.emmcee-room-nav--pos-bottom-right {
	bottom: var(--emmcee-nav-edge-offset);
	right: var(--emmcee-nav-edge-offset);
	flex-direction: column;
}

@media (max-width: 767px) {
	.emmcee-room-nav--hide-mobile {
		display: none;
	}
}

/* ---------- Einträge ---------- */
.emmcee-room-nav-item {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background-color: #fcf4eb;
	color: #a05a3c;
	border: none;
	border-radius: 50%;
	width: 44px;
	height: 44px;
	padding: 0 14px;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.15s ease;
	white-space: nowrap;
	flex-shrink: 0;
}

.emmcee-room-nav--mode-label .emmcee-room-nav-item,
.emmcee-room-nav--mode-both .emmcee-room-nav-item {
	width: auto;
	height: auto;
	padding: 10px 16px;
	border-radius: 999px;
}

.emmcee-room-nav-item:hover {
	transform: scale(1.06);
}

.emmcee-room-nav-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

.emmcee-room-nav-icon i,
.emmcee-room-nav-icon svg {
	font-size: 18px;
	width: 18px;
	height: 18px;
}

.emmcee-room-nav-label {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
}

@media (max-width: 767px) {
	.emmcee-room-nav {
		--emmcee-nav-edge-offset: 12px;
	}
}