/**
 * ⚠️ Raleway n’est chargée qu’en 400 et 700 sur ce site : toute autre
 * graisse est synthétisée par le navigateur (fausse graisse). N’employer
 * que 400 et 700. (mesuré le 01/09/2026.)
 *
 * Moteur de recherche du site Tixeo — trois zones, toutes scopées :
 *   1. l’entrée de recherche du header (icône Divi + champ déplié) ;
 *   2. le champ de la page de résultats (module Recherche du gabarit) ;
 *   3. les résultats groupés (sortie du moteur, préfixe « tixeo-search- »).
 * Tokens : spec visuelle v1.1.0 §1.1 — navy #2f374b, orange #ee861f,
 * appui #d97516, encre #1a202c, sourdine #4a5568, surface #eef2f9,
 * filet rgba(75,90,117,.2).
 */

/* =====================================================================
 * 1. HEADER — icône et champ de recherche (présents sur tout le site)
 * =================================================================== */

/* La fonte d'icônes de Divi, re-déclarée depuis l'hôte de la page.
 * Sans elle, la loupe s'affiche « U » et la croix « M » quand le thème
 * est servi depuis un autre hôte (fonte bloquée en croisé) ; en
 * production même-hôte, cette déclaration est un doublon sans effet. */
@font-face {
	font-family: 'ETmodules';
	font-style: normal;
	font-weight: normal;
	src: url('/wp-content/themes/Divi/core/admin/fonts/modules/all/modules.woff') format('woff'),
		url('/wp-content/themes/Divi/core/admin/fonts/modules/all/modules.ttf') format('truetype');
}

#et_top_search {
	margin-top: 26px;
}

#et_search_icon:before {
	color: #2f374b;
	font-size: 18px;
}

#et_top_search:hover #et_search_icon:before,
#et_top_search:focus-within #et_search_icon:before {
	color: #ee861f;
}

/* Champ déplié quand l’icône est activée */
.et_search_form_container input.et-search-field {
	font-family: Raleway, sans-serif !important;
	font-size: 16px !important;
	font-weight: 400;
	color: #1a202c !important;
}

.et_search_form_container input.et-search-field::placeholder {
	color: #4a5568;
}

.et_close_search_field:after {
	color: #2f374b;
	font-size: 24px;
}

.et_close_search_field:hover:after {
	color: #ee861f;
}

/* État ouvert : le menu s'efface en fondu, le champ apparaît en fondu
 * léger — on remplace les keyframes brusques de Divi par des transitions. */
.et_menu_container {
	transition: opacity 0.35s ease, visibility 0s linear 0s;
}

.et_menu_container.et_pb_menu_hidden {
	visibility: hidden !important;
	opacity: 0 !important;
	transition: opacity 0.35s ease, visibility 0s linear 0.35s;
}

.container.et_search_form_container {
	transition: opacity 0.35s ease 0.15s;
}

.container.et_search_form_container.et_pb_search_visible {
	animation: none !important;
	opacity: 1;
}

.container.et_search_form_container.et_pb_search_form_hidden {
	animation: none !important;
	opacity: 0;
	transition: opacity 0.25s ease;
}

.et_search_form_container .et-search-form input.et-search-field {
	font-size: 20px !important;
	caret-color: #ee861f;
}

.et_search_form_container .et-search-form input.et-search-field:focus {
	outline: none;
}

/* =====================================================================
 * 2. PAGE DE RÉSULTATS — hero et champ du gabarit
 * Le hero reprend le bandeau du centre d'assistance (même visuel de
 * fond, décision du 04/09) : image bleue, titre blanc à gauche, champ
 * blanc arrondi avec bouton orange. spec §3.1 (champ) et §3.2 (bouton).
 * =================================================================== */

body.search .et_pb_section_0_tb_body {
	background-image: url('https://www.tixeo.com/wp-content/uploads/2026/02/banner-faq-v18.png');
	background-size: cover;
	background-position: center;
	padding: 56px 0 60px;
}

/* même colonne que la liste de résultats (.tixeo-search : 900px) —
 * bords gauches alignés entre le bandeau et les réponses. */
body.search .et_pb_section_0_tb_body .et_pb_row,
body.search .et_pb_section_1_tb_body .et_pb_row {
	max-width: 900px;
	margin: 0 auto;
}

body.search .et_pb_text_0_tb_body .et_pb_text_inner {
	color: #ffffff;
	text-align: left;
}

body.search .et_pb_section_0_tb_body .et_pb_search {
	margin-left: 0 !important;
	margin-right: auto !important;
}

/* resserrer le rythme titre → champ, comme sur le bandeau du hub */
body.search .et_pb_row_0_tb_body {
	padding-bottom: 0;
}

body.search .et_pb_row_1_tb_body {
	padding-top: 10px;
}

/* Le module Recherche de Divi encadre le champ ET le bouton d'un filet
 * (`.et_pb_search { border: 1px solid #ddd }`, recoloré #EBEDF1 par le
 * gabarit). Sur le bandeau bleu il ne sert à rien : la pilule blanche et
 * le bouton orange portent déjà leur forme. On le retire ; le focus reste
 * signalé par l'outline orange ci-dessous. */
body.search .et_pb_search {
	border: 0;
}

body.search .et_pb_search input.et_pb_s {
	font-family: Raleway, sans-serif;
	font-size: 16px;
	line-height: 1.4;
	color: #1a202c;
	/* 11 px haut/bas (le module en pose 15 en !important) → champ de 41 px,
	 * exactement la hauteur du bouton : les deux pilules sont à ras. */
	padding-top: 11px !important;
	padding-bottom: 11px !important;
}

body.search .et_pb_search input.et_pb_s::placeholder {
	color: #4a5568;
}

body.search .et_pb_search:focus-within {
	outline: 2px solid #ee861f;
	outline-offset: 2px;
}

body.search .et_pb_search input.et_pb_searchsubmit {
	font-family: Raleway, sans-serif;
	font-weight: 700;
	font-size: 15px;
	line-height: 1;
	color: #ffffff !important;
	background: #ee861f !important;
	border: 0;
	border-radius: 100px;
	padding: 10px 22px !important;
	/* plus de marge verticale : le bouton et le champ font la même hauteur
	 * et s'alignent haut et bas ; les 4 px latéraux gardent leur respiration. */
	margin: 0 4px;
	cursor: pointer;
}

body.search .et_pb_search input.et_pb_searchsubmit:hover,
body.search .et_pb_search input.et_pb_searchsubmit:active {
	background: #d97516 !important;
}

body.search .et_pb_search input.et_pb_searchsubmit:focus-visible {
	outline: 2px solid #2f374b;
	outline-offset: 2px;
}

/* Titre du gabarit « Résultats pour … » aligné sur la spec §1.2
 * (la couleur vient du bloc hero ci-dessus : blanc sur le bandeau). */
body.search .et_pb_text_0_tb_body .et_pb_text_inner {
	font-family: Raleway, sans-serif;
	font-weight: 700;
	font-size: 26px;
	line-height: 1.3;
}

/* =====================================================================
 * 3. RÉSULTATS GROUPÉS — sortie du moteur
 * Sélecteurs préfixés « tixeo-search- » : le style du thème ne doit pas
 * les atteindre, et ils ne doivent atteindre aucun autre élément.
 * =================================================================== */

.tixeo-search {
	max-width: 900px;
	margin: 0 auto;
	font-family: Raleway, sans-serif;
}

/* ------------------------------------------------------- compteur global */

.tixeo-search__summary {
	margin: 0 0 34px;
	font-size: 13px;
	line-height: 1.4;
	color: #4a5568;
}

.tixeo-search__summary-total {
	font-weight: 700;
	color: #2f374b;
}

.tixeo-search__summary-sep {
	margin: 0 8px;
	color: rgba(75, 90, 117, 0.4);
}

.tixeo-search__back {
	margin: 0 0 26px;
	font-size: 15px;
}

.tixeo-search__back a,
.tixeo-search-group__more a {
	color: #ee861f;
	font-weight: 700;
	text-decoration: none;
}

.tixeo-search__back a:hover,
.tixeo-search-group__more a:hover {
	color: #d97516;
	text-decoration: underline;
}

.tixeo-search__back a:focus-visible,
.tixeo-search-group__more a:focus-visible {
	outline: 2px solid #ee861f;
	outline-offset: 2px;
}

/* --------------------------------------------------------------- section */

.tixeo-search-group {
	margin: 0 0 44px;
}

.tixeo-search-group__header {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding-bottom: 10px;
	margin-bottom: 6px;
	border-bottom: 2px solid rgba(75, 90, 117, 0.2);
}

.tixeo-search-group__title {
	margin: 0;
	font-family: Raleway, sans-serif;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.35;
	color: #2f374b;
}

.tixeo-search-group__count {
	margin-left: auto;
	padding: 0;
	font-size: 13px;
	font-weight: 400;
	color: #4a5568;
	background: none;
	border-radius: 0;
	white-space: nowrap;
}

.tixeo-search-group__list {
	margin: 0;
	padding: 0 !important;
	list-style: none !important;
}

.tixeo-search-group__list > li {
	list-style: none !important;
}

.tixeo-search-group__more {
	margin: 14px 0 0;
	font-size: 15px;
}

/* -------------------------------------------------------------- résultat */

.tixeo-search-result {
	padding: 16px 12px;
	margin: 0 -12px;
	border-bottom: 1px solid rgba(75, 90, 117, 0.2);
}

.tixeo-search-result:last-child {
	border-bottom: 0;
}

.tixeo-search-result:hover {
	background: #eef2f9;
}

.tixeo-search-result__link {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
	color: #2f374b !important;
	text-decoration: none;
}

.tixeo-search-result:hover .tixeo-search-result__link {
	text-decoration: underline;
	text-decoration-thickness: 2px;
}

.tixeo-search-result__link:focus-visible {
	outline: 2px solid #ee861f;
	outline-offset: 2px;
}

.tixeo-search-result__date {
	display: inline-block;
	margin-left: 10px;
	font-size: 13px;
	color: #4a5568;
	white-space: nowrap;
}

.tixeo-search-result__excerpt {
	margin: 6px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: #4a5568;
}

/* ------------------------------------------------------- aucun résultat */

.tixeo-search__empty {
	padding: 32px;
	text-align: center;
	background: #eef2f9;
}

.tixeo-search__empty-title {
	margin: 0 0 8px;
	font-size: 20px;
	font-weight: 700;
	color: #2f374b;
}

.tixeo-search__empty-hint {
	margin: 0;
	font-size: 15px;
	color: #4a5568;
}

.tixeo-search__capped {
	margin: 0 0 8px;
	font-size: 13px;
	color: #4a5568;
}

/* ---------------------------------------------------------- petit écran */

@media (max-width: 600px) {
	.tixeo-search-result {
		padding: 16px 0;
		margin: 0;
	}

	.tixeo-search-result:hover {
		background: none;
	}

	.tixeo-search-result__date {
		display: block;
		margin: 4px 0 0;
	}
}
