/* ==========================================================================
   SVC Resources Languages. The translated pages also carry body.svc-np and
   body.svc-faith (and body.svc-bible on Bible pages), so boxes, colours and
   spacing come from the main plugin. This file adds the language switch,
   the fonts for each script, and the right-to-left layout for Urdu.
   ========================================================================== */

/* ---------- The floating language switcher (Resources pages only) ----------
   Desktop: a tab on the right edge, halfway down. Phones: a round globe button
   above the WhatsApp button (which sits at right:14px, bottom:14px, 56px wide). */
.svc-lang-float {
	position: fixed;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 9991;
	font-family: var(--svc-body, "Inter", sans-serif);
}
.svc-lang-float__toggle {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 12px 10px;
	border: 1px solid #ab815a;
	border-right: 0;
	border-radius: 12px 0 0 12px;
	background: #1e232b;
	color: #ffffff;
	font: inherit;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	line-height: 1.2;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .25);
	transition: background-color .2s ease;
}
.svc-lang-float__toggle[lang="ml"],
.svc-lang-float__toggle[lang="hi"],
.svc-lang-float__toggle[lang="ur"],
.svc-lang-float__toggle[lang="ta"] {
	letter-spacing: 0;
	text-transform: none;
	font-size: 13px;
}
.svc-lang-float__globe {
	color: #ab815a;
	transition: color .2s ease;
}
.svc-lang-float__toggle:hover,
.svc-lang-float__toggle:focus-visible,
.svc-lang-float.is-open .svc-lang-float__toggle {
	background: #ab815a;
}
.svc-lang-float__toggle:hover .svc-lang-float__globe,
.svc-lang-float__toggle:focus-visible .svc-lang-float__globe,
.svc-lang-float.is-open .svc-lang-float__globe {
	color: #ffffff;
}
.svc-lang-float__toggle:focus-visible,
.svc-lang-float__panel a:focus-visible {
	outline: 3px solid #f16923;
	outline-offset: 2px;
}
.svc-lang-float__panel {
	position: absolute;
	right: calc(100% + 10px);
	top: 50%;
	transform: translateY(-50%);
	min-width: 170px;
	padding: 8px;
	border: 1px solid #ab815a;
	border-radius: 12px;
	background: #1e232b;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .3);
}
.svc-lang-float__panel[hidden] {
	display: none;
}
.svc-lang-float__panel ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.svc-lang-float__panel li {
	margin: 0;
	padding: 0;
}
.svc-lang-float__panel li::before {
	display: none;
}
.svc-lang-float__panel a {
	display: block;
	padding: 9px 14px;
	border-radius: 8px;
	color: #ffffff !important;
	font-size: 15px;
	line-height: 1.4;
	text-decoration: none !important;
	transition: background-color .2s ease;
}
.svc-lang-float__panel a:hover {
	background: rgba(171, 129, 90, .25);
}
.svc-lang-float__panel a[aria-current="page"] {
	background: #ab815a;
}
.svc-lang-float__panel a[lang="ml"] { font-family: "Noto Sans Malayalam", "Kartika", sans-serif; }
.svc-lang-float__panel a[lang="hi"] { font-family: "Noto Sans Devanagari", "Mangal", sans-serif; }
.svc-lang-float__panel a[lang="ur"] { font-family: "Noto Nastaliq Urdu", "Jameel Noori Nastaleeq", serif; line-height: 1.9; padding-top: 4px; padding-bottom: 4px; }
.svc-lang-float__panel a[lang="ta"] { font-family: "Noto Sans Tamil", "Latha", sans-serif; }

@media (max-width: 767px) {
	.svc-lang-float {
		top: auto;
		right: 14px;
		bottom: 84px;                       /* 14px edge + 56px WhatsApp button + 14px gap */
		transform: none;
	}
	.svc-lang-float__toggle {
		width: 56px;
		height: 56px;
		padding: 0;
		justify-content: center;
		border: 1px solid #ab815a;
		border-radius: 50%;
	}
	.svc-lang-float__globe {
		width: 24px;
		height: 24px;
	}
	.svc-lang-float__label {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}
	.svc-lang-float__panel {
		right: 0;
		top: auto;
		bottom: calc(100% + 10px);
		transform: none;
	}
	/* The theme's "back to top" button moves up so it clears the globe button. */
	body.svc-np #back_to_top,
	body.svc-faith #back_to_top {
		bottom: 154px !important;
	}
}
@media (prefers-reduced-motion: reduce) {
	.svc-lang-float__toggle,
	.svc-lang-float__globe,
	.svc-lang-float__panel a {
		transition: none;
	}
}

/* ---------- Fonts for each script (Latin letters fall back to the site's fonts) ---------- */
body.svc-lang-ml { --lang-body: "Noto Sans Malayalam", "Inter", sans-serif; --lang-display: "Noto Serif Malayalam", "Gilda Display", serif; }
body.svc-lang-hi { --lang-body: "Noto Sans Devanagari", "Inter", sans-serif; --lang-display: "Noto Serif Devanagari", "Gilda Display", serif; }
body.svc-lang-ta { --lang-body: "Noto Sans Tamil", "Inter", sans-serif; --lang-display: "Noto Serif Tamil", "Gilda Display", serif; }
body.svc-lang-ur { --lang-body: "Noto Nastaliq Urdu", "Inter", serif; --lang-display: "Noto Nastaliq Urdu", "Gilda Display", serif; }

body.svc-lang #Content .the_content_wrapper,
body.svc-lang #Content .the_content_wrapper p,
body.svc-lang #Content .the_content_wrapper li,
body.svc-lang #Content .the_content_wrapper dd,
body.svc-lang #Content .the_content_wrapper span,
body.svc-lang #Content .the_content_wrapper a {
	font-family: var(--lang-body);
}
body.svc-lang #Content .the_content_wrapper h1,
body.svc-lang #Content .the_content_wrapper h2,
body.svc-lang #Content .the_content_wrapper h3,
body.svc-lang #Content .svc-faith-tile__title,
body.svc-lang #Content .svc-bible-shelf-info__name,
body.svc-lang #Subheader .title {
	font-family: var(--lang-display);
}
/* Letter-spacing and capitals break Indian and Urdu scripts: the labels stay as written. */
body.svc-lang #Content .svc-np-eyebrow,
body.svc-lang #Content .svc-bible-card__kind,
body.svc-lang #Content dl.svc-bible-facts dt,
body.svc-lang #Content .svc-bible-shelf-labels,
body.svc-lang #Content .the_content_wrapper h2,
body.svc-lang #Subheader .title,
body.svc-lang #Content .svc-faith-cta__btn {
	letter-spacing: 0 !important;
	text-transform: none !important;
	font-family: var(--lang-body);
}
body.svc-lang #Content .svc-np-eyebrow {
	font-size: .9375rem;
	font-weight: 600;
}
body.svc-lang #Subheader .title {
	font-family: var(--lang-display) !important;
	line-height: 1.35;
}
/* Indian scripts need a little more line height than Latin. */
body.svc-lang-ml #Content .the_content_wrapper p,
body.svc-lang-ta #Content .the_content_wrapper p,
body.svc-lang-hi #Content .the_content_wrapper p {
	line-height: 1.8;
}

/* ---------- Urdu: right to left, Nastaliq needs tall lines ---------- */
body.svc-lang-rtl #Content .the_content_wrapper,
body.svc-lang-rtl #Subheader .title {
	direction: rtl;
	text-align: right;
}
body.svc-lang-rtl #Subheader .title {
	text-align: center;
}
body.svc-lang-ur #Content .the_content_wrapper p,
body.svc-lang-ur #Content .the_content_wrapper li,
body.svc-lang-ur #Content .the_content_wrapper dd {
	line-height: 2.25;
}
body.svc-lang-ur #Content .the_content_wrapper h2,
body.svc-lang-ur #Content .svc-faith-tile__title {
	line-height: 1.9;
}
body.svc-lang-rtl #Content .svc-faith-answer {
	border-left: 0;
	border-right: 4px solid var(--f-bronze, #ab815a);
}
body.svc-lang-rtl #Content ul,
body.svc-lang-rtl #Content ol {
	padding-left: 0;
	padding-right: 1.4em;
}
body.svc-lang-rtl #Content .svc-bible-nav > span:last-child { text-align: left; }
body.svc-lang-rtl #Content .svc-bible-shelf-labels { direction: ltr; }
body.svc-lang-rtl #Content dl.svc-bible-facts > div { padding: .9rem 0 .9rem 1rem; }

/* ---------- Home page cards and the invitation band ---------- */
body.svc-lang #Content .svc-lang-home-cards .svc-faith-tile__head {
	display: flex;
	align-items: center;
	gap: .75rem;
}
body.svc-lang #Content .svc-lang-home-cards a.svc-bible-card {
	text-decoration: none !important;
	color: inherit;
}
body.svc-lang #Content .svc-faith-verse-band p.svc-lang-invite {
	font-family: var(--lang-display);
	font-size: 1.2rem;
	text-align: center;
	color: var(--f-ink, #1e232b);
	max-width: 40rem;
	margin-inline: auto;
}