/* =====================================================================================
   AUTOCOMPLÉTIONS (jQuery UI) — apparence commune MYCP / CCB / CCL
   Chargé après les feuilles du site. Les couleurs viennent des variables posées par index.php selon le site :
   --ac-accent (surbrillance, élément actif) et --ac-sur-accent (texte sur l'élément actif).
   Les libellés gardent leurs anciennes classes (AutoCompleteNormal*, AutoCompleteUnderline*, AutoCompletePetit*),
   simplement remises au même style.
   ===================================================================================== */

:root {
	--ac-accent: #0f9eda;
	--ac-sur-accent: #fff;
	--ac-fond: #fff;
	--ac-texte: #1a1a1a;
	--ac-doux: #6b6b6b;
	--ac-police: inherit;
}

.ui-autocomplete.ui-widget-content,
.ui-autocomplete.ui-menu {
	z-index: 3000 !important;
	box-sizing: border-box;
	max-width: min(520px, calc(100vw - 16px));
	max-height: min(360px, 55vh);
	overflow-x: hidden;
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: 6px 0 !important;
	border: 1px solid rgba(0, 0, 0, .08) !important;
	border-radius: 10px;
	background: var(--ac-fond) !important;
	color: var(--ac-texte) !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
	font-family: var(--ac-police);
	font-size: 14px !important;
	list-style: none;
}

.ui-autocomplete .ui-menu-item {
	margin: 0;
	padding: 0;
	list-style: none;
	background: none !important;
}
.ui-autocomplete .ui-menu-item-wrapper,
.ui-autocomplete .ui-menu-item > a,
.ui-autocomplete .ui-menu-item > div {
	display: block;
	margin: 0 !important;
	padding: 9px 14px !important;
	border: 0 !important;
	border-radius: 0;
	color: var(--ac-texte) !important;
	background: none;
	line-height: 1.3;
	white-space: normal;
	overflow-wrap: anywhere;
	cursor: pointer;
}

/* élément survolé / choisi au clavier */
.ui-autocomplete .ui-state-active,
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .ui-menu-item > a.ui-state-active {
	margin: 0 !important;
	border: 0 !important;
	background: var(--ac-accent) !important;
	color: var(--ac-sur-accent) !important;
}

/* anciens libellés : plus de capitales forcées, une seule taille, couleurs héritées */
.ui-autocomplete [class^="AutoCompleteNormal"],
.ui-autocomplete [class*=" AutoCompleteNormal"] {
	display: inline;
	font-family: inherit !important;
	font-size: 14px !important;
	font-weight: normal;
	text-transform: none !important;
	color: inherit !important;
	width: auto;
}
.ui-autocomplete [class^="AutoCompleteUnderline"],
.ui-autocomplete [class*=" AutoCompleteUnderline"] {
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: 700 !important;
	text-transform: none !important;
	color: var(--ac-accent) !important;
}
.ui-autocomplete .ui-state-active [class^="AutoCompleteUnderline"],
.ui-autocomplete .ui-state-active [class*=" AutoCompleteUnderline"] {
	color: inherit !important;
	text-decoration: underline;
}
.ui-autocomplete [class^="AutoCompletePetit"],
.ui-autocomplete [class*=" AutoCompletePetit"] {
	display: block;
	font-family: inherit !important;
	font-size: 12px !important;
	text-transform: none !important;
	color: var(--ac-doux) !important;
}
.ui-autocomplete .ui-state-active [class^="AutoCompletePetit"],
.ui-autocomplete .ui-state-active [class*=" AutoCompletePetit"] {
	color: inherit !important;
	opacity: .85;
}

/* en-têtes de catégories (« Artistes », « Lieux »…) quand une liste en a */
.ui-autocomplete .ui-autocomplete-category {
	padding: 10px 14px 4px;
	font-size: 11px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ac-doux);
}

/* message d'accessibilité de jQuery UI : invisible mais lu par les lecteurs d'écran */
.ui-helper-hidden-accessible {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	border: 0 !important;
}

/* au doigt : des lignes assez hautes pour viser */
@media (pointer: coarse) {
	.ui-autocomplete .ui-menu-item-wrapper,
	.ui-autocomplete .ui-menu-item > a,
	.ui-autocomplete .ui-menu-item > div {
		min-height: 44px;
		padding-top: 12px !important;
		padding-bottom: 12px !important;
	}
}