/* ==========================================================================
   Essaïon TT5 — habillage du site (maquette validée le 30/10/2026)
   Fond beige, sections pierre, cartes blanches ; noir pour « Aujourd'hui » et le pied.
   L'affichage des spectacles (cartes, Aujourd'hui, fiche…) est stylé par essaion-addon.
   ========================================================================== */

:root {
	--ess-fond: var(--wp--preset--color--fond, #f7f5f2);
	--ess-pierre: var(--wp--preset--color--pierre, #ece6dc);
	--ess-trait: var(--wp--preset--color--trait, #d8cfc2);
	--ess-blanc: var(--wp--preset--color--blanc, #fff);
	--ess-nuit: var(--wp--preset--color--nuit, #1a1614);
	--ess-encre: var(--wp--preset--color--encre, #1f1b18);
	--ess-gris: var(--wp--preset--color--gris, #6a625b);
	--ess-rouge: var(--wp--preset--color--rouge, #b81c1a);
	--ess-rouge-vif: var(--wp--preset--color--rouge-vif, #d42320);
	--ess-titres: var(--wp--preset--font-family--titres, "Bricolage Grotesque", sans-serif);
	--ess-texte: var(--wp--preset--font-family--texte, Inter, system-ui, sans-serif);
	--ess-rayon: 10px;
	--ess-marge: clamp(16px, 4vw, 48px);
}

/* Pas d'espace TT5 entre en-tête, contenu et pied de page */
.wp-site-blocks > main,
.wp-site-blocks > footer,
.wp-site-blocks > .ess-main { margin-block-start: 0; }
.wp-site-blocks > header { position: sticky; top: 0; z-index: 30; }
.admin-bar .wp-site-blocks > header { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > header { top: 0; } }

h1, h2, h3, h4 { text-wrap: balance; font-variation-settings: "wdth" 85; }

/* --------------------------------------------------------------------------
   Focus clavier : anneau seulement au clavier (:focus-visible)
   -------------------------------------------------------------------------- */
a, button, summary, input, textarea, select, .wp-block-button__link { outline: none; }
a:focus-visible, button:focus-visible, summary:focus-visible,
input:focus-visible, textarea:focus-visible, select:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--ess-rouge);
	outline-offset: 2px;
}
.ess-sombre a:focus-visible, .ess-sombre button:focus-visible, .ess-sombre select:focus-visible,
.ess-pied a:focus-visible, .ess-panneau a:focus-visible, .ess-panneau button:focus-visible {
	outline-color: #fff;
}

/* --------------------------------------------------------------------------
   Boutons : plein et contour, même bordure 1px, même padding
   -------------------------------------------------------------------------- */
.ess-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	font: 600 .92rem/1 var(--ess-texte); padding: .78em 1.2em;
	border: 1px solid var(--ess-rouge); border-radius: 999px;
	text-decoration: none; cursor: pointer; white-space: nowrap;
	transition: background .15s, color .15s, border-color .15s;
}
.ess-btn-plein { background: var(--ess-rouge); color: #fff; }
.ess-btn-plein:hover { background: var(--ess-rouge-vif); border-color: var(--ess-rouge-vif); color: #fff; }
.ess-btn-contour { background: transparent; color: var(--ess-rouge); }
.ess-btn-contour:hover { background: var(--ess-rouge); color: #fff; }
.ess-btn-blanc { background: #fff; color: var(--ess-nuit); border-color: #fff; }
.ess-btn-blanc:hover { background: var(--ess-rouge-vif); border-color: var(--ess-rouge-vif); color: #fff; }
.ess-btn-petit { font-size: .84rem; padding: .6em 1em; }
.ess-sombre .ess-btn-contour { color: #fff; border-color: rgba(255,255,255,.5); }
.ess-sombre .ess-btn-contour:hover { background: var(--ess-rouge-vif); border-color: var(--ess-rouge-vif); }

/* Boutons de l'éditeur (bloc Boutons) : style contour aligné sur le plein */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; color: var(--ess-rouge); border: 1px solid var(--ess-rouge);
	padding: .78em 1.2em;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--ess-rouge); color: #fff; }

.ess-icone {
	width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%;
	border: 1px solid var(--ess-trait); background: var(--ess-blanc); color: var(--ess-encre); cursor: pointer; padding: 0;
}
.ess-icone svg { width: 18px; height: 18px; }
.ess-icone:disabled { opacity: .35; cursor: default; }
.ess-icone[hidden] { display: none; }

/* --------------------------------------------------------------------------
   En-tête collant, réduit au défilement
   -------------------------------------------------------------------------- */
.ess-entete {
	background: rgba(247,245,242,.96); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	border-bottom: 1px solid var(--ess-trait);
	display: flex; flex-wrap: wrap; align-items: center; gap: 0 28px;
	padding: 18px var(--ess-marge); transition: padding .2s;
}
.ess-entete.reduit { padding-top: 9px; padding-bottom: 9px; }
.ess-logo { color: var(--ess-encre); display: block; line-height: 0; }
.ess-logo svg { display: block; height: auto; }
.ess-logo svg path:not([style*="fill"]) { fill: currentColor; }
.ess-entete .ess-logo svg { width: 200px; transition: width .2s; }
.ess-entete.reduit .ess-logo svg { width: 150px; }
.ess-menu { display: flex; gap: 26px; margin-left: auto; font-weight: 550; font-size: .97rem; }
.ess-menu a { color: var(--ess-encre); text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; }
.ess-menu a:hover, .ess-menu a[aria-current="page"] { border-color: var(--ess-rouge); color: var(--ess-encre); }
.ess-outils { display: flex; gap: 10px; align-items: center; }
.ess-burger { display: none; }
.ess-recherche { flex-basis: 100%; display: flex; gap: 8px; padding-top: 14px; max-width: 640px; margin-left: auto; }
.ess-recherche[hidden] { display: none; }
.ess-recherche input {
	flex: 1; min-width: 0; width: 0; font: inherit; padding: .7em 1em;
	border: 1px solid var(--ess-trait); border-radius: 999px; background: var(--ess-blanc);
}

/* Menu burger plein écran */
body.ess-menu-ouvert { overflow: hidden; }
.ess-panneau {
	position: fixed; inset: 0; z-index: 100; background: var(--ess-nuit); color: #fff;
	padding: 16px var(--ess-marge) 32px; display: flex; flex-direction: column; gap: 28px; overflow-y: auto;
}
.ess-panneau[hidden] { display: none; }
.ess-panneau-tete { display: flex; justify-content: flex-end; }
.ess-panneau .ess-icone { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.ess-panneau-menu { display: grid; }
.ess-panneau-menu a {
	color: #fff; font: 700 1.9rem/1.1 var(--ess-titres); font-variation-settings: "wdth" 85;
	text-decoration: none; padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.13);
}
.ess-panneau-actions { display: grid; gap: 12px; }

@media (max-width: 1000px) {
	.ess-menu, .ess-btn-abonne { display: none; }
	.ess-burger { display: grid; }
	.ess-outils { margin-left: auto; }
}
@media (max-width: 760px) {
	.ess-entete .ess-logo svg { width: 150px; }
	.ess-entete.reduit .ess-logo svg { width: 120px; }
}

/* --------------------------------------------------------------------------
   Pages ordinaires : bandeau pierre avec le titre, contenu aligné à gauche sur la grille du site
   (1280 px + marges) ; texte courant limité à 860 px ; cartes blanches et colonnes sur toute la largeur.
   -------------------------------------------------------------------------- */
.ess-page { padding: 0; }
.ess-page-tete { background: var(--ess-pierre); padding: clamp(36px, 5vw, 56px) var(--ess-marge) clamp(28px, 4vw, 40px); }
.ess-page-tete .wp-block-post-title {
	max-width: 1280px; margin: 0 auto; font-size: clamp(2.4rem, 5vw, 3.6rem); font-weight: 780;
	font-variation-settings: "wdth" 82; letter-spacing: -.01em;
}
.ess-page-contenu { max-width: calc(1280px + 2 * var(--ess-marge)); margin: 0 auto !important; padding: clamp(36px, 5vw, 56px) var(--ess-marge) clamp(48px, 6vw, 80px); }
.ess-page-contenu > * { max-width: 860px; }
.ess-page-contenu > .alignwide, .ess-page-contenu > .alignfull, .ess-page-contenu > .wp-block-columns,
.ess-page-contenu > .ess-cartes, .ess-page-contenu > .ess-large { max-width: none; }
.ess-page-contenu > h2.wp-block-heading { margin-block-start: var(--wp--preset--spacing--60); }
.ess-page-contenu > h2.wp-block-heading:first-child { margin-block-start: 0; }
.ess-page-contenu h2.wp-block-heading { font-size: clamp(1.6rem, 3vw, 2.1rem); }
.ess-page-contenu .wp-block-columns { gap: clamp(22px, 3vw, 40px); }
.ess-page-contenu .wp-block-image img { border-radius: 8px; }
.ess-page-contenu iframe { max-width: 100%; width: 100%; border: 0; border-radius: var(--ess-rayon); display: block; }

/* Cartes blanches (bloc Groupe « ess-carte ») et grille de cartes (« ess-cartes ») */
.ess-cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 22px; }
.ess-carte { background: var(--ess-blanc); border-radius: var(--ess-rayon); padding: clamp(20px, 2.4vw, 30px); box-shadow: 0 1px 2px rgba(31,27,24,.06); }
.ess-carte > :first-child { margin-top: 0; }
.ess-carte > :last-child { margin-bottom: 0; }
.ess-carte h2.wp-block-heading, .ess-carte h3.wp-block-heading { font-size: 1.35rem; margin-block-start: 0; }
.ess-carte-titre { font: 600 .74rem var(--ess-texte) !important; letter-spacing: .12em; text-transform: uppercase; color: var(--ess-gris); margin: 0 0 .4em !important; font-variation-settings: normal !important; }
.ess-encadre { background: var(--ess-pierre); border-left: 4px solid var(--ess-rouge); border-radius: 8px; padding: 16px 20px; }
.ess-carte .wp-block-buttons { margin-top: 1.2em; }
/* Équipe : photo à gauche, texte à droite, dans une carte */
.ess-personne.wp-block-media-text { background: var(--ess-blanc); border-radius: var(--ess-rayon); overflow: hidden; box-shadow: 0 1px 2px rgba(31,27,24,.06); }
.ess-personne .wp-block-media-text__media img { aspect-ratio: 1; object-fit: cover; height: 100%; border-radius: 0; }
.ess-personne .wp-block-media-text__content { padding: clamp(18px, 2.4vw, 30px) !important; }
.ess-personne h3 { font-size: 1.35rem; margin: 0 0 .4em; }
.ess-personne p { margin: 0 0 .5em; }
/* Logo Pass Culture dans une carte */
.ess-logo-carte img { max-width: 180px; height: auto; }

/* Formulaires des anciens codes courts (abonnés…) */
.ess-page-contenu form label { display: block; font-weight: 600; font-size: .92rem; margin-bottom: 14px; }
.ess-page-contenu form input[type="text"], .ess-page-contenu form input[type="email"], .ess-page-contenu form input[type="tel"],
.ess-page-contenu form input[type="number"], .ess-page-contenu form input[type="password"], .ess-page-contenu form select, .ess-page-contenu form textarea {
	display: block; width: 100%; max-width: 480px; margin-top: 6px; font: 400 1rem var(--ess-texte); color: var(--ess-encre);
	padding: .65em .85em; border: 1px solid var(--ess-trait); border-radius: 8px; background: var(--ess-blanc);
}
.ess-page-contenu form input[type="number"] { max-width: 120px; }
.ess-page-contenu form select { appearance: none; -webkit-appearance: none; padding-right: 2.4em;
	background: var(--ess-blanc) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231f1b18' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right .7em center / 16px; }
.ess-page-contenu form input:focus-visible, .ess-page-contenu form select:focus-visible, .ess-page-contenu form textarea:focus-visible { border-color: var(--ess-encre); }
.ess-page-contenu form button[type="submit"], .ess-page-contenu form input[type="submit"] {
	font: 600 .92rem/1 var(--ess-texte); padding: .85em 1.4em; border: 1px solid var(--ess-rouge); border-radius: 999px;
	background: var(--ess-rouge); color: #fff; cursor: pointer; margin-top: 6px;
}
.ess-page-contenu form button[type="submit"]:hover, .ess-page-contenu form input[type="submit"]:hover { background: var(--ess-rouge-vif); border-color: var(--ess-rouge-vif); }
.ess-page-contenu .resa-message { padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; font-weight: 600; }
.ess-page-contenu .resa-message.success { background: #e4ede7; color: #2b5a42; }
.ess-page-contenu .resa-message.error { background: #f6e1df; color: var(--ess-rouge); }

/* Contenu des groupes scolaires (saisi dans l'ancien admin) : on remet la typo du site */
.groupes-scolaires-content, .groupes-scolaires-content * { font-family: var(--ess-texte) !important; letter-spacing: normal !important; }
.groupes-scolaires-content p, .groupes-scolaires-content strong { font-size: 1rem !important; font-weight: 400 !important; line-height: 1.55 !important; }
.groupes-scolaires-content h3, .groupes-scolaires-content h4 { font-family: var(--ess-titres) !important; font-weight: 700 !important; font-size: 1.2rem !important; margin: 1.2em 0 .4em; }
.groupes-scolaires-content ul { padding-left: 1.2em; margin: 0 0 .6em; }

/* Comment venir : pictogrammes RATP alignés */
.ess-page-contenu .arret { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; }
.ess-page-contenu .arret img { width: 22px; height: 22px; }

/* 404 « Relâche. » */
.ess-404 { padding-top: var(--wp--preset--spacing--70); padding-bottom: var(--wp--preset--spacing--70); }
.ess-404-code { font: 650 .8rem var(--ess-texte); letter-spacing: .16em; color: var(--ess-rouge); }

/* --------------------------------------------------------------------------
   Pied de page (grand, avec les logos)
   -------------------------------------------------------------------------- */
.ess-pied {
	background: var(--ess-nuit); color: #fff;
	padding: 56px var(--ess-marge) 26px; display: grid; gap: 36px;
}
.ess-pied a { color: #fff; }
.ess-pied-cols { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 32px; }
.ess-pied .ess-logo { color: #fff; }
.ess-pied .ess-logo svg { width: 210px; }
.ess-pied address { font-style: normal; margin-top: 18px; display: grid; gap: 3px; color: #ddd4cc; font-size: .95rem; }
.ess-pied .ess-tel { display: inline-block; margin-top: 10px; color: #ddd4cc; text-decoration: none; }
.ess-pied-titre {
	font: 600 .74rem var(--ess-texte); letter-spacing: .14em; text-transform: uppercase;
	color: #a89e96; margin: 0 0 12px; font-variation-settings: normal;
}
.ess-pied ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; font-size: .92rem; }
.ess-pied ul a { text-decoration: none; }
.ess-pied ul a:hover { text-decoration: underline; }
.ess-reseaux { display: flex; gap: 12px; margin-top: 20px; }
.ess-reseaux a { width: 40px; height: 40px; border-radius: 50%; background: #fff; color: var(--ess-nuit); display: grid; place-items: center; }
.ess-reseaux a:hover { background: var(--ess-rouge-vif); color: #fff; }
.ess-reseaux svg { width: 19px; height: 19px; }
.ess-pro p { color: #ddd4cc; font-size: .92rem; margin: 0 0 14px; max-width: 26ch; }
.ess-pro .ess-btn-blanc { color: var(--ess-nuit); }
.ess-pro .ess-btn-blanc:hover { color: #fff; }
.ess-partenaires {
	display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 28px 64px;
	border-top: 1px solid rgba(255,255,255,.13); padding-top: 36px;
}
.ess-avignon { display: grid; gap: 10px; text-decoration: none; line-height: 1.2; }
.ess-avignon span { font: 600 .74rem var(--ess-texte); letter-spacing: .14em; text-transform: uppercase; color: #a89e96; }
.ess-pied .ess-avignon svg { width: 180px; }
.ess-pass { width: 170px; height: auto; }
.ess-tpa svg { width: 110px; height: auto; display: block; }
.ess-anrat { text-align: center; color: #ddd4cc; font-size: .92rem; margin: 0; }
.ess-mentions { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 28px; font-size: .86rem; }
.ess-pied .ess-mentions a { color: #a89e96; text-decoration: none; }
.ess-pied .ess-mentions a:hover { color: #fff; }
.ess-pied-bas {
	border-top: 1px solid rgba(255,255,255,.13); padding-top: 18px;
	display: flex; flex-wrap: wrap; gap: 8px 20px; justify-content: space-between; font-size: .8rem; color: #a89e96;
}
.ess-pied .ess-pied-bas a { color: #a89e96; text-decoration: none; }
.ess-pied .ess-pied-bas a:hover { color: #fff; }
@media (max-width: 1000px) { .ess-pied-cols { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .ess-pied-cols { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
	.ess-entete, .ess-entete .ess-logo svg, .ess-btn { transition: none; }
}

/* --------------------------------------------------------------------------
   Lettre d'information (formulaire Sarbacane de l'accueil)
   -------------------------------------------------------------------------- */
.ess-lettre {
	padding: 40px var(--ess-marge); display: flex; flex-wrap: wrap; gap: 16px 40px;
	align-items: center; justify-content: space-between; border-top: 1px solid var(--ess-trait); background: var(--ess-fond);
}
.ess-lettre h2 { font-size: 1.6rem; margin: 0; }
.ess-lettre-form { display: flex; gap: 8px; flex: 1 1 280px; max-width: 520px; margin: 0; }
.ess-lettre-form input {
	flex: 1; min-width: 0; width: 0; font: inherit; padding: .7em 1em;
	border: 1px solid var(--ess-trait); border-radius: 999px; background: var(--ess-blanc);
}
.ess-lettre-form #div-submitInput { display: flex; align-items: center; gap: 8px; }
.ess-page-large > .wp-block-html, .ess-accueil > .wp-block-html { margin: 0; }
/* Sections de couleur collées les unes aux autres (accueil, pages larges, fiche) */
.ess-accueil .wp-block-post-content > *,
.ess-page-large .wp-block-post-content > *,
.ess-fiche-zone > * { margin-block-start: 0; margin-block-end: 0; }

/* --------------------------------------------------------------------------
   Galeries des salles : grande photo, vignettes en dessous ; clic = agrandissement (lightbox de WordPress)
   -------------------------------------------------------------------------- */
.wp-block-gallery.ess-galerie-salle { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.wp-block-gallery.ess-galerie-salle > .wp-block-image { width: auto !important; margin: 0 !important; }
.wp-block-gallery.ess-galerie-salle > .wp-block-image:first-child { grid-column: 1 / -1; }
.wp-block-gallery.ess-galerie-salle img { width: 100%; height: 100% !important; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 8px; }
.wp-block-gallery.ess-galerie-salle > .wp-block-image:not(:first-child) img { aspect-ratio: 1; border-radius: 6px; }

.ess-cartes > * { margin: 0 !important; }
/* Blocs de la vitrine posés dans une page ordinaire (ex. Calendrier) : toute la largeur, sans fond */
.ess-page-contenu > .essv-bloc { max-width: none; padding: 0; background: none; }

/* Carte d'abonnement (la vraie carte papier) : taille et forme d'une carte, liseré, légère ombre */
.wp-block-image.ess-carte-abo { margin-top: 1.6em; }
.wp-block-image.ess-carte-abo img {
	width: 100%; max-width: 340px; aspect-ratio: 85.6 / 54; object-fit: cover; display: block;
	border: 1px solid var(--ess-trait); border-radius: 12px !important;
	box-shadow: 0 10px 24px -14px rgba(31,27,24,.45); transform: rotate(-2deg);
}
@media (prefers-reduced-motion: reduce) { .wp-block-image.ess-carte-abo img { transform: none; } }

/* Groupes scolaires : les h5 / h6 saisis dans l'ancien admin s'affichent comme du texte */
.groupes-scolaires-content h5, .groupes-scolaires-content h6 {
	font-family: var(--ess-texte) !important; font-size: 1rem !important; font-weight: 400 !important;
	line-height: 1.55 !important; margin: 0 0 1em !important; text-transform: none !important;
}

/* --------------------------------------------------------------------------
   Espace Pro (compagnies) : forme seulement, le fond reste l'ancien plugin (theatre-paris)
   -------------------------------------------------------------------------- */
.ess-contenu-large > * { max-width: none; }
.ess-page-contenu > .ess-pro-connexion { max-width: 980px; }
/* Boutons de l'ancien plugin (classe Divi et_pb_button) aux couleurs du site */
.ess-page-contenu .et_pb_button, .ess-page-contenu a.et_pb_button {
	display: inline-flex; align-items: center; justify-content: center;
	font: 600 .92rem/1 var(--ess-texte) !important; padding: .85em 1.4em !important; border: 1px solid var(--ess-rouge) !important;
	border-radius: 999px !important; background: var(--ess-rouge) !important; color: #fff !important; text-decoration: none; cursor: pointer;
}
.ess-page-contenu .et_pb_button:hover { background: var(--ess-rouge-vif) !important; border-color: var(--ess-rouge-vif) !important; }
.ess-page-contenu .et_pb_button::after { display: none !important; }
/* Connexion par spectacle */
.mp-spectacle-login p { margin: 0 0 16px; }
.mp-spectacle-login label { display: block; font-weight: 600; font-size: .92rem; }
/* Champs des formulaires : jamais plus larges que leur carte ; focus doux */
.ess-page-contenu form input, .ess-page-contenu form select, .ess-page-contenu form textarea { box-sizing: border-box; }
.ess-page-contenu form input:not([type="submit"]):focus-visible, .ess-page-contenu form select:focus-visible, .ess-page-contenu form textarea:focus-visible {
	outline: none; border-color: var(--ess-rouge); box-shadow: 0 0 0 3px var(--ess-halo, rgba(184,28,26,.15));
}
/* « Se déconnecter » (style en ligne de l'ancien plugin) : texte blanc aussi au survol */
.ess-page-contenu .deconnexion-locale:hover, .ess-page-contenu .deconnexion-locale:focus-visible { color: #fff !important; background: var(--ess-rouge-vif) !important; border-color: var(--ess-rouge-vif) !important; }

/* --------------------------------------------------------------------------
   Réservations des compagnies (tableaux de l'ancien plugin) dans le ton du site.
   Blanc : ce que la compagnie peut modifier ; le reste sur le fond beige.
   -------------------------------------------------------------------------- */
.te-reservations-front-container { font-family: var(--ess-texte); }
.ess-page-outil .te-front-header {
	background: var(--ess-blanc); border: 0 !important; border-radius: var(--ess-rayon); box-shadow: 0 1px 2px rgba(31,27,24,.06);
	padding: 16px 22px !important; margin-bottom: 22px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px;
}
.ess-page-outil .te-front-titre-spectacle { font: 720 1.5rem/1.15 var(--ess-titres) !important; font-variation-settings: "wdth" 85; margin: 0 !important; flex-basis: 100%; }
.ess-page-outil .te-front-header p { margin: 0 !important; font-size: .95rem !important; font-weight: 500 !important; color: var(--ess-gris) !important; }
/* Jour choisi et horaire */
.ess-page-outil .te-resa-date-jour { font: 760 clamp(1.5rem, 3vw, 2rem)/1.1 var(--ess-titres) !important; font-variation-settings: "wdth" 85; margin: 32px 0 14px !important; }
.ess-page-outil .te-resa-horaire {
	font: 700 1.3rem/1 var(--ess-titres) !important; border-bottom: 1px solid var(--ess-trait) !important;
	padding-bottom: 14px !important; margin-bottom: 16px !important; align-items: center !important;
}
.ess-page-outil .te-resa-horaire .separateur { color: var(--ess-trait); }
.ess-page-outil .te-total-general {
	background: var(--ess-encre) !important; color: #fff; font: 600 .85rem/1 var(--ess-texte) !important;
	padding: .5em .9em !important; border-radius: 999px;
}
/* Jauge de la salle : petite carte blanche */
.ess-page-outil .te-jauge-wrapper {
	background: var(--ess-blanc) !important; border: 0 !important; border-radius: var(--ess-rayon) !important;
	box-shadow: 0 1px 2px rgba(31,27,24,.06); padding: 16px 20px !important; max-width: 760px; width: 100% !important;
}
.ess-page-outil .te-jauge-wrapper.te-jauge-surbook { background: #fff5f5 !important; }
.ess-page-outil .te-jauge-barre-outer { background: var(--ess-pierre) !important; }
.ess-page-outil .te-jauge-chiffres { border-bottom-color: var(--ess-pierre) !important; }
/* Titres des tableaux (Compagnie, Théâtre, Billet Réduc) : plus de pavé noir */
.ess-page-outil .te-titre-tableau { background: transparent !important; padding: 26px 0 10px !important; }
.ess-page-outil .te-titre-tableau h4 {
	background: transparent !important; color: var(--ess-encre) !important; padding: 0 0 0 12px !important; margin: 0 !important;
	border-left: 4px solid var(--ess-rouge); font: 700 1.2rem/1.2 var(--ess-titres) !important; font-variation-settings: "wdth" 85;
}
.ess-page-outil .te-liste-reservations { border-collapse: collapse; width: 100%; font-size: .92rem; }
.ess-page-outil .te-liste-reservations th, .ess-page-outil .te-liste-reservations td { padding: 9px 12px; border-bottom: 1px solid rgba(31,27,24,.08); text-align: left; }
.ess-page-outil .te-en-tete th, .ess-page-outil .te-en-tete td { font-weight: 600; font-size: .82rem; color: var(--ess-gris); background: transparent !important; }
.ess-page-outil .te-resa-section-compagnie .te-liste-reservations { background: var(--ess-blanc); border-radius: var(--ess-rayon); overflow: hidden; box-shadow: 0 1px 2px rgba(31,27,24,.06); }
.ess-page-outil .te-resa-section-theatre .te-liste-reservations, .ess-page-outil .te-resa-section-br .te-liste-reservations { background: transparent; }

/* Réservations, retouches : titre du tableau aligné sur les cellules, vrai bouton « Ajouter », liens discrets */
.ess-page-outil .te-titre-tableau, .ess-page-outil .titre-tableau { padding: 24px 12px 12px !important; }
.ess-page-outil .te-resa-section-compagnie .te-titre-tableau, .ess-page-outil .te-resa-section-compagnie .titre-tableau { padding: 22px 20px 14px !important; }
.ess-page-outil .titre-tableau h4 {
	background: transparent !important; color: var(--ess-encre) !important; padding: 0 0 0 12px !important; margin: 0 !important;
	border-left: 4px solid var(--ess-rouge); font: 700 1.2rem/1.2 var(--ess-titres) !important; font-variation-settings: "wdth" 85;
}
.ess-page-outil .ajouter-reservation { margin: 16px 0 0 !important; }
.ess-page-outil .ajouter-reservation a, .ess-page-outil a.toggle-form-link, .ess-page-outil a.te-toggle-form-link {
	display: inline-flex; align-items: center; gap: 8px; font: 600 .92rem/1 var(--ess-texte) !important;
	padding: .8em 1.3em !important; border: 1px solid var(--ess-rouge) !important; border-radius: 999px !important;
	background: var(--ess-rouge) !important; color: #fff !important; text-decoration: none !important;
}
.ess-page-outil .ajouter-reservation a:hover { background: var(--ess-rouge-vif) !important; border-color: var(--ess-rouge-vif) !important; color: #fff !important; }
.ess-page-outil .reservation-complete span { display: inline-block; font: 600 .85rem var(--ess-texte); padding: .5em .9em; border-radius: 999px; background: var(--ess-pierre); color: var(--ess-gris); }
/* Liens dans les cellules (ex. « Metteur en scène ») : texte noir souligné, pas de rouge ; icônes d'action en rouge */
.ess-page-outil .te-liste-reservations td a, .ess-page-outil .liste-reservations td a {
	color: var(--ess-encre) !important; text-decoration: underline !important; text-underline-offset: 3px;
	text-decoration-color: rgba(31,27,24,.3) !important; text-decoration-thickness: 1px; transition: text-decoration-color .15s;
}
.ess-page-outil .te-liste-reservations td a:hover, .ess-page-outil .liste-reservations td a:hover { text-decoration-color: var(--ess-encre) !important; text-decoration-thickness: 2px; }
.ess-page-outil .te-actions-icones a, .ess-page-outil td .te-actions-icones a { color: var(--ess-rouge) !important; text-decoration: none !important; }

/* « Ajouter une réservation » : même survol que les autres boutons (quelle que soit sa classe) */
.ess-page-outil a.toggle-form-link:hover, .ess-page-outil a.te-toggle-form-link:hover, .ess-page-outil .ajouter-reservation a:hover {
	background: var(--ess-rouge-vif) !important; border-color: var(--ess-rouge-vif) !important; color: #fff !important;
}

/* Jauge de la salle (côté site seulement ; l'admin garde ses couleurs) : titre, couleurs du site, pas de débordement */
.ess-page-outil .te-jauge-wrapper { box-sizing: border-box; max-width: 100% !important; }
.ess-page-outil .te-jauge-wrapper::before {
	content: "Remplissage de la salle"; font: 600 .72rem var(--ess-texte); letter-spacing: .12em; text-transform: uppercase; color: var(--ess-gris);
}
.ess-page-outil .te-jauge-chiffres, .ess-page-outil .te-jauge-sources { flex-wrap: wrap; row-gap: 6px; }
.ess-page-outil .te-jauge-barre-inner { background-color: var(--ess-encre) !important; }
.ess-page-outil .te-jauge-surbook .te-jauge-barre-inner { background-color: var(--ess-rouge) !important; }
.ess-page-outil .te-jauge-pct { color: var(--ess-encre) !important; font-family: var(--ess-titres); font-weight: 760; }
.ess-page-outil .te-jauge-source-br         { color: #2f6b7a !important; }
.ess-page-outil .te-jauge-source-revendeurs { color: #4d7f8b !important; }
.ess-page-outil .te-jauge-source-starter    { color: #7a9ea6 !important; }
.ess-page-outil .te-jauge-source-theatre    { color: #6b3a5b !important; }
.ess-page-outil .te-jauge-source-abonnes    { color: #8a6d2f !important; }
.ess-page-outil .te-jauge-source-compagnie  { color: #3f7a5d !important; }
.ess-page-outil .te-jauge-source-invites    { color: var(--ess-gris) !important; }

/* Moins d'espace sous le dernier tableau */
.ess-page-outil .te-liste-reservations, .ess-page-outil .liste-reservations { margin-bottom: 0 !important; }
.ess-page-outil .te-resa-bloc-horaire:last-child, .ess-page-outil .te-tab-pane > :last-child { margin-bottom: 0 !important; }
.ess-page-outil .ess-page-contenu { padding-bottom: clamp(28px, 4vw, 44px); }
/* Plusieurs horaires le même jour : séparation nette entre les blocs */
.ess-page-outil .te-resa-bloc-horaire + .te-resa-bloc-horaire { margin-top: 44px !important; padding-top: 28px; border-top: 1px solid var(--ess-trait); }

/* --------------------------------------------------------------------------
   Recherche de l'en-tête : suggestions en direct
   -------------------------------------------------------------------------- */
.ess-recherche-champ { position: relative; flex: 1; min-width: 0; display: flex; }
.ess-recherche-champ input { flex: 1; min-width: 0; width: 0; font: inherit; padding: .7em 2.8em .7em 1em; border: 1px solid var(--ess-trait); border-radius: 999px; background: var(--ess-blanc); }
.ess-suggestions {
	position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 60; list-style: none; margin: 0; padding: 6px;
	background: var(--ess-blanc); border-radius: var(--ess-rayon); box-shadow: 0 18px 40px -16px rgba(31,27,24,.4); max-height: min(70vh, 520px); overflow-y: auto;
}
.ess-suggestions[hidden] { display: none; }
.ess-suggestions li a {
	display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center; padding: 8px; border-radius: 8px;
	color: var(--ess-encre); text-decoration: none;
}
.ess-suggestions li a:hover, .ess-suggestions li[aria-selected="true"] a { background: var(--ess-fond); }
.ess-suggestions img, .ess-suggestions .ess-sugg-vide { width: 64px; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 5px; background: var(--ess-pierre); display: block; }
.ess-sugg-texte { display: grid; gap: 2px; min-width: 0; }
.ess-sugg-titre { font: 680 1rem/1.15 var(--ess-titres); font-variation-settings: "wdth" 85; }
.ess-sugg-titre mark { background: none; color: var(--ess-rouge); }
.ess-sugg-info { font-size: .78rem; color: var(--ess-gris); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ess-sugg-groupe { font: 600 .68rem var(--ess-texte); letter-spacing: .12em; text-transform: uppercase; color: var(--ess-gris); padding: 10px 8px 4px; }
.ess-sugg-tout a { display: block !important; text-align: center; font-weight: 600; color: var(--ess-rouge) !important; padding: 10px !important; }
.ess-sugg-aucun { padding: 12px; color: var(--ess-gris); font-size: .9rem; }
@media (max-width: 760px) { .ess-recherche { max-width: none; } }
/* Filet de sécurité : fenêtres de l'ancienne lightbox jamais visibles */
.te-lightbox-overlay { display: none !important; }
/* Téléphone : suggestions sur toute la largeur du bandeau de recherche */
@media (max-width: 760px) {
	.ess-recherche { position: relative; }
	.ess-recherche-champ { position: static; }
	.ess-suggestions { top: calc(100% + 4px); left: 0; right: 0; }
}

/* Croix « Effacer » de la recherche (celle du navigateur est masquée pour ne pas en avoir deux) */
.ess-champ-cadre { position: relative; flex: 1; min-width: 0; display: flex; }
.ess-recherche-champ input::-webkit-search-cancel-button,
.ess-recherche-champ input::-webkit-search-decoration { -webkit-appearance: none; appearance: none; display: none; }
.ess-effacer {
	position: absolute; right: 6px; top: 50%; transform: translateY(-50%); z-index: 2;
	width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; display: grid; place-items: center;
	background: var(--ess-pierre); color: var(--ess-encre); cursor: pointer;
}
.ess-effacer[hidden] { display: none; }
.ess-effacer:hover { background: var(--ess-encre); color: #fff; }
.ess-effacer svg { width: 16px; height: 16px; }

/* Avignon : vignettes de la recherche en affiche (portrait) */
.ess-site-avignon .ess-suggestions img, .ess-site-avignon .ess-suggestions .ess-sugg-vide { width: 44px; aspect-ratio: 2 / 3; }