/*
 * Dallol Care Amharic
 *
 * Independent styling for the English / Amharic language switcher.
 */


/* =========================================================
   LANGUAGE SWITCHER
   ========================================================= */

#dallol-care-app .dc-language-switcher {
	display: inline-flex !important;

	align-items: center !important;
	justify-content: center !important;

	gap: 7px !important;

	width: auto !important;
	max-width: max-content !important;

	margin: 0 auto 20px !important;

	padding: 5px !important;

	border: 1px solid rgba(11, 95, 196, 0.16) !important;
	border-radius: 999px !important;

	background: rgba(255, 255, 255, 0.96) !important;

	box-shadow:
		0 8px 24px rgba(3, 21, 47, 0.10) !important;

	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);

	box-sizing: border-box !important;

	white-space: nowrap !important;

	position: relative !important;

	z-index: 1000 !important;
}


/* =========================================================
   LANGUAGE BUTTONS
   ========================================================= */

#dallol-care-app .dc-language-option {
	appearance: none !important;
	-webkit-appearance: none !important;

	display: inline-flex !important;

	align-items: center !important;
	justify-content: center !important;

	width: auto !important;
	min-width: 0 !important;

	border: 0 !important;

	background: transparent !important;

	color: #45627f !important;

	font-family:
		"Noto Sans Ethiopic",
		"Noto Sans",
		"Segoe UI",
		Arial,
		sans-serif !important;

	font-size: 14px !important;
	font-weight: 700 !important;

	line-height: 1 !important;

	padding: 9px 13px !important;

	margin: 0 !important;

	border-radius: 999px !important;

	cursor: pointer !important;

	box-sizing: border-box !important;

	white-space: nowrap !important;

	transition:
		background-color 0.18s ease,
		color 0.18s ease,
		box-shadow 0.18s ease,
		transform 0.18s ease;
}


/* =========================================================
   HOVER
   ========================================================= */

#dallol-care-app .dc-language-option:hover {
	color: #0b5fc4 !important;

	background:
		rgba(11, 95, 196, 0.06) !important;
}


#dallol-care-app .dc-language-option:focus {
	outline: none !important;
}


#dallol-care-app .dc-language-option:focus-visible {
	outline: 2px solid #318cff !important;
	outline-offset: 2px !important;
}


/* =========================================================
   ACTIVE LANGUAGE
   ========================================================= */

#dallol-care-app .dc-language-option.is-active {
	background: #0b5fc4 !important;

	color: #ffffff !important;

	box-shadow:
		0 5px 14px rgba(11, 95, 196, 0.22) !important;
}


#dallol-care-app .dc-language-option.is-active:hover {
	background: #0b5fc4 !important;

	color: #ffffff !important;

	transform: translateY(-1px);
}


/* =========================================================
   DIVIDER
   ========================================================= */

#dallol-care-app .dc-language-divider {
	display: inline-block !important;

	margin: 0 1px !important;

	padding: 0 !important;

	color: #9bb1c8 !important;

	font-size: 13px !important;
	font-weight: 500 !important;

	line-height: 1 !important;

	user-select: none !important;

	pointer-events: none !important;
}


/* =========================================================
   AMHARIC TYPOGRAPHY
   ========================================================= */

html.dc-language-amharic #dallol-care-app {
	font-family:
		"Noto Sans Ethiopic",
		"Noto Sans",
		"Segoe UI",
		Arial,
		sans-serif;
}


html.dc-language-amharic #dallol-care-app button,
html.dc-language-amharic #dallol-care-app input,
html.dc-language-amharic #dallol-care-app textarea,
html.dc-language-amharic #dallol-care-app select {
	font-family:
		"Noto Sans Ethiopic",
		"Noto Sans",
		"Segoe UI",
		Arial,
		sans-serif;
}


/* =========================================================
   PROTECT SWITCHER
   ========================================================= */

#dallol-care-app .dc-language-switcher,
#dallol-care-app .dc-language-switcher * {
	-webkit-user-select: none !important;
	user-select: none !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

	#dallol-care-app .dc-language-switcher {
		gap: 5px !important;

		margin:
			0 auto 16px !important;

		padding: 4px !important;
	}

	#dallol-care-app .dc-language-option {
		font-size: 13px !important;

		padding:
			9px 11px !important;
	}

	#dallol-care-app .dc-language-divider {
		font-size: 12px !important;
	}
}