/* Language Search — frontend styles */

.ls-search{
	--ls-line:      #2b2b2b;   /* underline colour            */
	--ls-icon:      #3a3a3a;   /* magnifier colour            */
	--ls-text:      #1f2a24;   /* typed text colour           */
	--ls-placeholder:#9a9880;  /* placeholder colour          */
	--ls-accent:    #0b5d3b;   /* focus / hover accent        */
	--ls-panel-bg:  #ffffff;   /* dropdown background         */
	--ls-panel-brd: #e4dfcf;   /* dropdown border             */
	--ls-sub:       #8c8a72;   /* result sub-label            */

	position:relative;
	max-width:640px;
	font-family:inherit;
	color:var(--ls-text);
}

.ls-field{
	display:flex;
	align-items:center;
	gap:12px;
	border-bottom:1px solid var(--ls-line);
	padding:6px 2px 12px;
	transition:border-color .15s ease;
}
.ls-search.is-focused .ls-field{ border-bottom-color:var(--ls-accent); }

.ls-icon{ color:var(--ls-icon); flex:0 0 auto; }

.ls-input{
	flex:1 1 auto;
	border:0;
	outline:0;
	background:transparent;
	font:inherit;
	font-size:18px;
	color:var(--ls-text);
	padding:0;
	min-width:0;
}
.ls-input::placeholder{ color:var(--ls-placeholder); opacity:1; }

/* ---- Dropdown ---- */
.ls-results{
	list-style:none;
	margin:6px 0 0;
	padding:6px 0;
	position:absolute;
	left:0;
	right:0;
	z-index:50;
	background:var(--ls-panel-bg);
	border:1px solid var(--ls-panel-brd);
	border-radius:8px;
	box-shadow:0 12px 30px rgba(0,0,0,.10);
	max-height:340px;
	overflow:auto;
}
.ls-results[hidden]{ display:none; }

.ls-result{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:14px;
	padding:10px 16px;
	cursor:pointer;
	text-decoration:none;
	color:inherit;
}
.ls-result:hover,
.ls-result.is-active{ background:rgba(11,93,59,.07); }

.ls-result-title{ font-size:16px; font-weight:600; }
.ls-result-sub{
	font-size:11px;
	font-weight:600;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--ls-sub);
	white-space:nowrap;
}

.ls-empty{
	padding:12px 16px;
	color:var(--ls-sub);
	font-size:14px;
}

@media (max-width:560px){
	.ls-input{ font-size:16px; }
}