/* =====================================================================================
   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: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; /* avant : celle de la page (souvent un serif par défaut) */
}
/* MYCP en mode sombre (php/functions.php, data-theme) */
:root[data-theme="dark"] { --ac-fond: #1b1e22; --ac-texte: #e3e6e8; --ac-doux: #9aa3ab; }

.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: 4px !important;
	border: 1px solid rgba(127, 127, 127, .22) !important;
	border-radius: 12px;
	background: var(--ac-fond) !important;
	color: var(--ac-texte) !important;
	box-shadow: 0 12px 34px rgba(0, 0, 0, .25);
	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 12px !important;
	border: 0 !important;
	border-radius: 8px;
	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: color-mix(in srgb, var(--ac-accent) 14%, var(--ac-fond)) !important;
	color: var(--ac-texte) !important;
	box-shadow: inset 3px 0 0 var(--ac-accent);
}

/* 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: 600;
	letter-spacing: .02em;
	text-transform: uppercase !important; /* noms d'artistes, d'organisations, de lieux */
	color: inherit !important;
	width: auto;
}
.ui-autocomplete [class^="AutoCompleteUnderline"],
.ui-autocomplete [class*=" AutoCompleteUnderline"] {
	font-family: inherit !important;
	font-size: inherit !important;
	font-weight: 800 !important;
	text-transform: inherit !important;
	text-decoration: none;
	color: var(--ac-accent) !important;
}
.ui-autocomplete .ui-state-active [class^="AutoCompleteUnderline"],
.ui-autocomplete .ui-state-active [class*=" AutoCompleteUnderline"] {
	color: var(--ac-accent) !important;
	text-decoration: none;
}
.ui-autocomplete [class^="AutoCompletePetit"],
.ui-autocomplete [class*=" AutoCompletePetit"] {
	display: block;
	margin-top: 1px;
	font-family: inherit !important;
	font-size: 12px !important;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none !important;
	color: var(--ac-doux) !important;
}
.ui-autocomplete .ui-state-active [class^="AutoCompletePetit"],
.ui-autocomplete .ui-state-active [class*=" AutoCompletePetit"] {
	color: var(--ac-doux) !important;
}

/* 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;
	}
}

/* =====================================================================================
   ARTISTES DU FORMULAIRE D'ÉVÉNEMENT (php/admin_ajax_ccl.js, CCLAutocompleteArtistes) — 2026-11-09
   Sombre comme le panneau, nom en capitales avec la partie tapée en couleur, pays en pastilles, genres en gris,
   « Déjà à l'affiche » grisé, « Créer « … » » en bas.
   ===================================================================================== */
.ui-autocomplete.ac-artistes {
	--ac-fond: #1c1c1e;
	--ac-texte: #fff;
	--ac-doux: #9a9aa0;
	max-width: min(460px, calc(100vw - 24px));
	padding: 6px !important;
	border: 1px solid rgba(255,255,255,.12) !important;
	box-shadow: 0 16px 40px rgba(0,0,0,.55);
}
.ui-autocomplete.ac-artistes .ui-menu-item > .ac-art {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
	padding: 10px 12px !important;
}
.ac-artistes .ac-art-nom { flex: 1 1 auto; min-width: 0; font-family: 'GT Walsheim bold', sans-serif; font-size: 14px; letter-spacing: .02em; text-transform: uppercase; color: #fff; }
.ac-artistes .ac-art-nom mark { padding: 0; background: none; color: var(--ac-accent); }
.ac-artistes .ac-art-infos { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; flex: 1 1 100%; }
.ac-artistes .ac-art-pays { padding: 1px 6px; border: 1px solid rgba(255,255,255,.35); border-radius: 4px; font-family: 'GT Walsheim bold', sans-serif; font-size: 10px; line-height: 14px; color: #fff; }
.ac-artistes .ac-art-genres { font-size: 12px; color: var(--ac-doux); }
.ac-artistes .ac-art-badge { padding: 2px 8px; border-radius: 999px; background: rgba(255,255,255,.1); font-size: 11px; color: var(--ac-doux); white-space: nowrap; }
.ui-autocomplete.ac-artistes .ui-state-disabled { opacity: 1; cursor: default; }
.ui-autocomplete.ac-artistes .ui-state-disabled .ac-art { cursor: default; }
.ac-artistes .ac-art-deja .ac-art-nom { color: var(--ac-doux); }
/* « Créer « … » » : séparé des résultats */
.ui-autocomplete.ac-artistes .ui-menu-item:has(.ac-art-creer):not(:first-child) { margin-top: 4px; padding-top: 4px; border-top: 1px solid rgba(255,255,255,.1); }
.ac-artistes .ac-art-creer .ac-art-nom { text-transform: none; letter-spacing: 0; color: var(--ac-accent); }
.ac-artistes .ac-art-plus { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; border-radius: 50%; background: var(--ac-accent); color: var(--ac-sur-accent); font-family: 'GT Walsheim bold', sans-serif; font-size: 16px; line-height: 1; }