/* JEC Translate — front-end language switcher.
 * Intentionally tiny: loaded only on pages that render the switcher. */

.ject-switch {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 6px;
	align-items: center;
	font-size: 14px;
	line-height: 1;
}
.ject-switch--dropdown {
	flex-direction: column;
	align-items: stretch;
}
.ject-switch__item a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 10px;
	border-radius: 8px;
	color: inherit;
	text-decoration: none;
	transition: background .15s, color .15s, opacity .15s;
}
.ject-switch__item a:hover {
	background: rgba(21, 179, 164, .12);
}
.ject-switch__item.is-current a {
	background: #15B3A4;
	color: #fff;
	font-weight: 600;
}
.ject-switch__item.is-unavailable a {
	opacity: .6;
}

/* Globe dropdown (JS-free, via <details>/<summary>) */
.ject-globe {
	position: relative;
	display: inline-block;
	font-size: 14px;
}
.ject-globe > summary {
	list-style: none;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 15px;
	/* Solid, self-contained pill (white + navy text): its colours are explicit
	 * and !important so no theme menu style can wash it out — it reads clearly
	 * on a dark or a light header, at rest as well as on hover. */
	background: #fff !important;
	color: #14224C !important;
	border: 0;
	border-radius: 999px;
	box-shadow: 0 2px 12px rgba(20, 34, 76, .25);
	opacity: 1 !important;
	font-weight: 700;
	letter-spacing: .02em;
	user-select: none;
	transition: background .15s, color .15s, box-shadow .15s;
}
.ject-globe > summary::-webkit-details-marker { display: none; }
.ject-globe > summary::marker { content: ''; }
.ject-globe > summary:hover,
.ject-globe[open] > summary {
	background: #15B3A4 !important;
	color: #fff !important;
	box-shadow: 0 4px 14px rgba(21, 179, 164, .4);
}
.ject-globe__cur { font-weight: 700; font-size: 13px; text-transform: uppercase; }
.ject-globe-icon { flex: none; }
.ject-globe__menu {
	display: none; /* hidden by default; JS + [open] selector reveal it */
	position: absolute;
	right: 0;
	margin: 8px 0 0;
	padding: 6px;
	min-width: 170px;
	list-style: none;
	background: #fff;
	color: #14224C;
	border: 1px solid rgba(20, 34, 76, .12);
	border-radius: 12px;
	box-shadow: 0 12px 32px rgba(20, 34, 76, .16);
	z-index: 9999;
}
.ject-globe[open] > .ject-globe__menu { display: block; }
.ject-globe[open] > summary { border-color: #15B3A4; }
.ject-globe__menu .ject-switch__item { display: block; }
.ject-globe__menu .ject-switch__item a {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border-radius: 8px;
	color: #14224C;
}
.ject-globe__menu .ject-switch__item.is-current a { background: #15B3A4; color: #fff; }
.ject-globe__menu .ject-switch__item a:hover { background: rgba(21, 179, 164, .12); }

/* Floating site-wide switcher */
.ject-floating {
	position: fixed;
	bottom: 20px;
	z-index: 99990;
}
.ject-floating--br { right: 20px; }
/* Default bottom-left so it doesn't collide with common scroll-to-top buttons. */
.ject-floating--bl { left: 20px; }
.ject-floating .ject-globe > summary {
	box-shadow: 0 8px 24px rgba(20, 34, 76, .28);
}
.ject-floating .ject-globe__menu { bottom: 100%; margin: 0 0 8px; }
.ject-floating--br .ject-globe__menu { right: 0; left: auto; }
.ject-floating--bl .ject-globe__menu { left: 0; right: auto; }

@media (prefers-color-scheme: dark) {
	.ject-globe__menu { background: #111C3D; color: #EAF0F8; border-color: #243366; }
	.ject-globe__menu .ject-switch__item a { color: #EAF0F8; }
}
