/* 右端フローティングバー — 参考: 左角丸タブ（PC）/ 下部固定ナビ（SP） */
.floating-bar {
	position: fixed;
	z-index: 60;
	display: flex;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.5s ease, visibility 0.5s ease;
}

.floating-bar.is-visible {
	opacity: 1;
	visibility: visible;
}

.floating-bar__link {
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}

.floating-bar__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.floating-bar__icon svg {
	width: 1.25rem;
	height: 1.25rem;
}

.floating-bar__label {
	font-weight: 700;
	letter-spacing: 0.12em;
	line-height: 1.35;
}

/* —— PC: 右端タブ —— */
@media (min-width: 768px) {
	.floating-bar {
		top: 55%;
		right: 0;
		flex-direction: column;
		gap: 0.5rem;
		transform: translateY(-50%);
	}

	.floating-bar__items {
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
	}

	.floating-bar__link {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0.5rem;
		width: 7.5rem;
		max-width: 7.5rem;
		padding: 0.875rem 0.5rem;
		background: #ffffff;
		border: 1px solid var(--floating-accent);
		border-right: 0;
		border-radius: 0.75rem 0 0 0.75rem;
		box-shadow: -2px 2px 10px rgba(0, 0, 0, 0.08);
	}

	.floating-bar__link:hover,
	.floating-bar__link:focus-visible {
		background: var(--floating-accent);
	}

	.floating-bar__link:hover .floating-bar__icon,
	.floating-bar__link:hover .floating-bar__label,
	.floating-bar__link:focus-visible .floating-bar__icon,
	.floating-bar__link:focus-visible .floating-bar__label {
		color: #ffffff;
	}

	.floating-bar__icon,
	.floating-bar__label {
		color: var(--floating-accent);
	}

	.floating-bar__icon svg {
		width: 1.5rem;
		height: 1.5rem;
	}

	.floating-bar__icon {
		margin-top: 0;
	}

	.floating-bar__label {
		display: block;
		flex: none;
		width: 100%;
		min-width: 0;
		font-size: 11px;
		line-height: 1.6;
		letter-spacing: 0.08em;
		text-align: center;
	}
}

/* —— SP: 下部固定ナビ —— */
@media (max-width: 767px) {
	body.has-floating-bar.floating-bar-visible {
		padding-bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px));
	}

	.floating-bar {
		left: 0;
		right: 0;
		bottom: 0;
		top: auto;
		flex-direction: row;
		align-items: stretch;
		background: #ffffff;
		border-top: 1px solid #e5e7eb;
		box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.06);
	}

	.floating-bar__items {
		display: flex;
		flex: 1;
		flex-direction: row;
	}

	.floating-bar__link {
		display: flex;
		flex: 1;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0.2rem;
		min-width: 0;
		padding: 0.45rem 0.125rem calc(0.45rem + env(safe-area-inset-bottom, 0px));
		background: #ffffff;
		border: 0;
		border-right: 1px solid #e5e7eb;
		border-radius: 0;
		box-shadow: none;
	}

	.floating-bar__link:last-child {
		border-right: 0;
	}

	.floating-bar__link:active {
		background: #f6fcfe;
	}

	.floating-bar__icon,
	.floating-bar__label {
		color: var(--floating-accent);
	}

	.floating-bar__icon svg {
		width: 1.125rem;
		height: 1.125rem;
	}

	.floating-bar__label {
		font-size: 9px;
		line-height: 1.45;
		letter-spacing: 0.04em;
		text-align: center;
		word-break: keep-all;
		overflow-wrap: normal;
	}
}