/* 自動翻訳（src/Translate.php）。左下の言語の切り替えと、Google 翻訳の上のバーを隠す。 */
.geek-lang {
	position: fixed;
	left: 12px;
	bottom: 12px;
	z-index: 90;
}

.geek-lang__label {
	display: flex;
	align-items: center;
	gap: 4px;
	padding: 4px 8px;
	border: 1px solid rgba(79, 70, 229, 0.25);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.95);
	box-shadow: 0 2px 8px rgba(31, 38, 54, 0.12);
	font-size: 14px;
	line-height: 1;
	cursor: pointer;
}

.geek-lang__select {
	border: 0;
	background: transparent;
	color: #1f2636;
	font: inherit;
	font-size: 13px;
	cursor: pointer;
	max-width: 9.5em;
}

.geek-lang__select:focus-visible {
	outline: 2px solid #4f46e5;
	outline-offset: 2px;
}

/* 図（SVG）の文字を訳させるための写し（translate.js）。画面には出さないが、Google 翻訳が訳せるよう display:none にはしない。 */
.geek-svg-i18n {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: pre;
}

/* テーマのダークモードに合わせる（OS の設定と、テーマの切り替え）。 */
@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) .geek-lang__label {
		border-color: rgba(165, 180, 252, 0.3);
		background: rgba(17, 24, 39, 0.92);
	}

	:root:not([data-theme="light"]) .geek-lang__select {
		color: #e5e7eb;
	}
}

:root[data-theme="dark"] .geek-lang__label {
	border-color: rgba(165, 180, 252, 0.3);
	background: rgba(17, 24, 39, 0.92);
}

:root[data-theme="dark"] .geek-lang__select {
	color: #e5e7eb;
}

/* Google 翻訳が出す上のバーと吹き出し。切り替えはサイトのものを使う。 */
.goog-te-banner-frame,
iframe.skiptranslate,
.skiptranslate > iframe,
#goog-gt-tt,
.goog-te-balloon-frame,
.VIpgJd-ZVi9od-ORHb-OEVmcd {
	display: none !important;
}

body {
	top: 0 !important;
}

.goog-text-highlight {
	background: none !important;
	box-shadow: none !important;
}

@media print {
	.geek-lang {
		display: none;
	}
}
