/* Miracle Translate — switcher styles. Dark mode via html[data-theme="dark"]. */

.mtr-switcher {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	line-height: 1.4;
}

.mtr-switcher .mtr-label {
	opacity: 0.75;
}

/* Dropdown */
.mtr-select {
	appearance: none;
	-webkit-appearance: none;
	background: #fff
		url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E" )
		no-repeat right 10px center;
	border: 1px solid #d4d4d8;
	border-radius: 8px;
	padding: 7px 30px 7px 12px;
	color: #18181b;
	cursor: pointer;
	font: inherit;
	min-width: 130px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mtr-select:hover {
	border-color: #a1a1aa;
}

.mtr-select:focus {
	outline: none;
	border-color: #6366f1;
	box-shadow: 0 0 0 3px rgba( 99, 102, 241, 0.2 );
}

/* Inline / flags buttons */
.mtr-options {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 6px;
}

.mtr-opt {
	border: 1px solid #d4d4d8;
	background: #fff;
	color: #3f3f46;
	border-radius: 999px;
	padding: 5px 12px;
	cursor: pointer;
	font: inherit;
	transition: all 0.15s ease;
}

.mtr-opt:hover {
	border-color: #6366f1;
	color: #4f46e5;
}

.mtr-opt.is-active {
	background: #4f46e5;
	border-color: #4f46e5;
	color: #fff;
}

.mtr-style-inline .mtr-opt {
	border-radius: 6px;
}

/* RTL */
html[data-mtr-dir="rtl"] .mtr-select {
	background-position: left 10px center;
	padding: 7px 12px 7px 30px;
}

/* Dark mode — strictly html[data-theme="dark"] */
html[data-theme="dark"] .mtr-select {
	background-color: #1f2937;
	border-color: #374151;
	color: #f3f4f6;
}

html[data-theme="dark"] .mtr-select:hover {
	border-color: #4b5563;
}

html[data-theme="dark"] .mtr-opt {
	background: #1f2937;
	border-color: #374151;
	color: #d1d5db;
}

html[data-theme="dark"] .mtr-opt:hover {
	border-color: #6366f1;
	color: #a5b4fc;
}

html[data-theme="dark"] .mtr-opt.is-active {
	background: #4f46e5;
	border-color: #4f46e5;
	color: #fff;
}
