/*
  Elementor / the Hello theme apply their own default appearance to plain
  <button> elements site-wide (a filled background plus a border, in
  whatever this theme's own global colors happen to be) — that's the
  actual reason the icon showed up as a solid coloured box instead of a
  bare glyph, and the same reason the modal's close and save buttons
  looked wrong too: none of that was ever written here, it was always the
  theme's own base button style winning because these resets weren't
  strong enough to beat it. Every property below that removes some part
  of that unwanted default (background, border, border-radius, box-shadow,
  font inheritance) now carries !important specifically for that reason —
  a plain <button> on this theme apparently needs it to actually come out
  bare.
*/

.pc-lang-switch__toggle {
	all: unset;
	-webkit-appearance: none !important;
	appearance: none !important;
	box-sizing: border-box !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	background-color: transparent !important;
	box-shadow: none !important;
	color: #35C8F9 !important;
	cursor: pointer !important;
	opacity: 0.9;
	transition: opacity 0.2s ease;
}

.pc-lang-switch__toggle:hover {
	opacity: 1;
}

.pc-lang-switch__toggle svg {
	display: block;
	width: 20px;
	height: 20px;
	stroke: #35C8F9 !important;
	fill: none !important;
}

/* The popup itself — a centred dialog over a dimmed backdrop, appended to
   <body> rather than nested in the header, so it always sits above
   everything regardless of the header's own stacking context. */
.pc-lang-modal {
	all: initial;
	position: fixed !important;
	inset: 0 !important;
	z-index: 99999 !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 20px !important;
	background: rgba(0, 0, 48, 0.55) !important;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s ease, visibility 0.2s;
}

.pc-lang-modal.is-open {
	opacity: 1;
	visibility: visible;
}

.pc-lang-modal * {
	box-sizing: border-box;
}

body.pc-lang-modal-open {
	overflow: hidden;
}

.pc-lang-modal__card {
	position: relative;
	width: 100%;
	max-width: 420px;
	background: #ffffff !important;
	border: 0 !important;
	border-radius: 16px !important;
	padding: 36px 32px 32px !important;
	box-shadow: 0 30px 60px rgba(0, 0, 0, 0.3) !important;
	transform: translateY(10px);
	transition: transform 0.2s ease;
}

.pc-lang-modal.is-open .pc-lang-modal__card {
	transform: translateY(0);
}

.pc-lang-modal__close {
	all: unset;
	-webkit-appearance: none !important;
	appearance: none !important;
	box-sizing: border-box !important;
	position: absolute !important;
	top: 16px !important;
	right: 16px !important;
	width: 32px !important;
	height: 32px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: none !important;
	box-shadow: none !important;
	color: #6b7385 !important;
	font-family: Arial, sans-serif !important;
	font-size: 22px !important;
	line-height: 1 !important;
	cursor: pointer !important;
}

.pc-lang-modal__close:hover {
	color: #000030 !important;
	background: #f0f0f1 !important;
}

.pc-lang-modal__title {
	all: unset;
	display: block;
	font-family: 'Fraunces', Georgia, serif !important;
	font-size: 24px !important;
	font-weight: 600 !important;
	line-height: 1.25 !important;
	color: #000030 !important;
	margin: 0 0 8px !important;
}

.pc-lang-modal__subtitle {
	all: unset;
	display: block;
	font-family: 'Nunito Sans', system-ui, sans-serif !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	color: #6b7385 !important;
	margin: 0 0 24px !important;
}

.pc-lang-modal__field {
	border-top: 1px solid #e3e7ef;
	padding-top: 18px;
	margin-bottom: 28px;
}

.pc-lang-modal__label {
	all: unset;
	display: block;
	font-family: 'Nunito Sans', system-ui, sans-serif !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em !important;
	color: #6b7385 !important;
	margin-bottom: 10px !important;
}

.pc-lang-modal__select {
	all: unset;
	-webkit-appearance: none !important;
	appearance: none !important;
	box-sizing: border-box !important;
	display: block !important;
	width: 100% !important;
	border-bottom: 1px solid #e3e7ef !important;
	border-radius: 0 !important;
	background: transparent
		url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%236b7385" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>')
		right center / 18px no-repeat !important;
	padding: 6px 26px 10px 0 !important;
	font-family: 'Nunito Sans', system-ui, sans-serif !important;
	font-size: 16px !important;
	color: #000030 !important;
	cursor: pointer !important;
}

.pc-lang-modal__save {
	all: unset;
	-webkit-appearance: none !important;
	appearance: none !important;
	box-sizing: border-box !important;
	display: block !important;
	width: 100% !important;
	text-align: center !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: #000030 !important;
	color: #ffffff !important;
	font-family: 'Nunito Sans', system-ui, sans-serif !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	padding: 16px !important;
	cursor: pointer !important;
	transition: background 0.2s ease, color 0.2s ease;
}

.pc-lang-modal__save:hover {
	background: #35C8F9 !important;
	color: #000030 !important;
}
