/* AW Combobox — typeahead-enhanced select. The native <select> is hidden and a
 * text input + filterable list stand in for it. Styling mirrors the surrounding
 * selects so it looks native in both the diagram viewer nav and the home widget. */

.aw-cb { position: relative; width: 100%; min-width: 0; }
/* While open, lift the whole combo above sibling fields / neighbouring layers so the
 * dropdown is never painted behind the next input or an Avada container. */
.aw-cb:focus-within { z-index: 9999; }
.aw-cb-native {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0);
	white-space: nowrap; border: 0;
}
.aw-cb-input {
	width: 100%;
	box-sizing: border-box;
	padding: 6px 30px 6px 10px;
	font: inherit;
	font-size: 0.9rem;
	border: 1px solid #ccc;
	border-radius: 4px;
	background: #fff
		url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23666' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E" )
		right 10px center / 10px 6px no-repeat;
	cursor: text;
}
.aw-cb-input:focus { outline: 2px solid #006eff; outline-offset: 1px; }
.aw-cb-input:disabled { background-color: #f2f2f2; color: #999; cursor: not-allowed; }
.aw-cb-input::placeholder { color: #777; opacity: 1; }

/* Rendered at <body> level and anchored by JS (left/top/width/max-height set inline),
 * so no ancestor overflow:hidden or z-index stacking context can clip or bury it. */
.aw-cb-list {
	position: fixed;
	z-index: 2147483000;
	margin: 0; padding: 4px;
	list-style: none;
	max-height: 280px;
	overflow-y: auto;
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	box-shadow: 0 8px 24px rgba( 0, 0, 0, 0.14 );
}
.aw-cb-opt {
	padding: 7px 9px;
	font-size: 0.88rem;
	line-height: 1.25;
	border-radius: 4px;
	cursor: pointer;
	color: #222;
}
.aw-cb-opt mark { background: #fff2ac; color: inherit; padding: 0; border-radius: 2px; }
.aw-cb-opt:hover,
.aw-cb-opt.aw-cb-active { background: #eaf3ff; }
.aw-cb-opt.aw-cb-sel { font-weight: 600; }
.aw-cb-opt.aw-cb-sel::after { content: '✓'; float: right; color: #006eff; }
.aw-cb-empty { padding: 8px 9px; font-size: 0.85rem; color: #999; font-style: italic; }
