/* Annuaire des pizzerias — couleurs reprises du template Pipirima */

/* ⚠ Tout nouveau bloc racine doit etre ajoute ici, sinon var(--ap-*) ne resout
   pas et les couleurs disparaissent sans erreur visible. */
.ap-page,
.ap-annuaire,
.ap-zones,
.ap-barre-accueil,
.ap-blocs-zone,
.ap-themes {
	--ap-rouge:  #B90020;
	--ap-orange: #FFA609;
	--ap-jaune:  #FFCA09;
	--ap-noir:   #0B0A07;
	--ap-texte:  #595959;
	--ap-creme:  #F9F5F2;
	--ap-bord:   #ECE5DE;
	color: var(--ap-texte);
}

.ap-page {
	max-width: 1200px;
	margin: 0 auto;
	padding: 48px 20px 72px;
}

.ap-entete { margin-bottom: 28px; }

.ap-titre {
	font-family: "Barlow Semi Condensed", "Barlow", Impact, sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: var(--ap-noir);
	font-size: clamp(28px, 4vw, 46px);
	line-height: 1.1;
	margin: 0 0 12px;
}

.ap-intro { max-width: 780px; }

.ap-retour a {
	color: var(--ap-rouge);
	text-decoration: none;
	font-weight: 600;
}
.ap-retour a:hover { text-decoration: underline; }

/* le theme souligne les liens par defaut */
.ap-page a,
.ap-annuaire a,
.ap-zones a,
.ap-page a:hover,
.ap-annuaire a:hover,
.ap-zones a:hover { text-decoration: none !important; }
.ap-btn,
.ap-btn:hover,
.ap-carte-titre a,
.ap-carte-titre a:hover,
.ap-badge,
.ap-badge:hover { text-decoration: none !important; }
.ap-retour a:hover,
.ap-intro a { text-decoration: underline; }

/* ---- barre de filtres ---- */

.ap-filtres {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 14px;
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 14px;
	padding: 18px;
	margin-bottom: 26px;
}

.ap-champ {
	display: flex;
	flex-direction: column;
	gap: 6px;
	flex: 1 1 220px;
}

.ap-champ > span {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .4px;
	color: var(--ap-noir);
}

.ap-champ select,
.ap-champ input[type="text"] {
	width: 100%;
	padding: 11px 13px;
	border: 1px solid var(--ap-bord);
	border-radius: 8px;
	background: #fff;
	color: var(--ap-noir);
	font-size: 15px;
	line-height: 1.3;
	max-width: 100%;
}

.ap-champ select:focus,
.ap-champ input[type="text"]:focus {
	outline: none;
	border-color: var(--ap-orange);
	box-shadow: 0 0 0 3px rgba(255, 166, 9, .2);
}

.ap-resultat {
	font-weight: 600;
	color: var(--ap-noir);
	margin: 0 0 18px;
}

/* ---- boutons ---- */

.ap-btn {
	display: inline-block;
	padding: 11px 20px;
	border-radius: 999px;
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .4px;
	text-transform: uppercase;
	text-decoration: none;
	border: 2px solid transparent;
	cursor: pointer;
	transition: all .18s ease;
	white-space: nowrap;
}

.ap-btn-plein {
	background: var(--ap-rouge);
	color: #fff;
}
.ap-btn-plein:hover {
	background: var(--ap-orange);
	color: var(--ap-noir);
}

.ap-btn-vide {
	background: #fff;
	color: var(--ap-noir);
	border-color: var(--ap-bord);
}
.ap-btn-vide:hover {
	border-color: var(--ap-orange);
	color: var(--ap-rouge);
}

/* ---- grille de cartes ---- */

.ap-grille {
	display: grid;
	gap: 26px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}
.ap-col-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ap-col-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.ap-carte {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid var(--ap-bord);
	border-radius: 16px;
	overflow: hidden;
	transition: transform .18s ease, box-shadow .18s ease;
}
.ap-carte:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(11, 10, 7, .12);
}

.ap-carte-img {
	display: block;
	aspect-ratio: 16 / 10;
	background: var(--ap-creme);
	overflow: hidden;
	position: relative;
}
.ap-carte-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.ap-img-vide {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 54px;
	opacity: .35;
}

.ap-carte-corps {
	padding: 18px 20px 20px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	flex: 1;
}

.ap-carte-titre {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 21px;
	line-height: 1.2;
	margin: 0;
}
.ap-carte-titre a {
	color: var(--ap-noir);
	text-decoration: none;
}
.ap-carte-titre a:hover { color: var(--ap-rouge); }

.ap-adresse { margin: 0; font-size: 14px; }

.ap-infos {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	font-size: 14px;
}
.ap-infos li { margin: 0; }
.ap-infos strong {
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: #9a9a9a;
	font-weight: 700;
}

.ap-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: auto;
	padding-top: 6px;
}
.ap-actions .ap-btn { padding: 9px 15px; font-size: 13px; }
.ap-actions-colonne { flex-direction: column; }
/* en colonne les libelles peuvent etre longs : nowrap les ferait deborder de l'encart */
.ap-actions-colonne .ap-btn { text-align: center; white-space: normal; }

/* ---- notes et badges ---- */

.ap-note { display: inline-flex; align-items: center; gap: 3px; }
.ap-etoile { color: #DCD6CF; font-size: 16px; line-height: 1; }
.ap-etoile.ap-on { color: var(--ap-jaune); }
.ap-note-txt { margin-left: 6px; font-size: 13px; font-weight: 700; color: var(--ap-noir); }

.ap-badges { display: flex; flex-wrap: wrap; gap: 6px; }

.ap-badge {
	display: inline-block;
	padding: 4px 11px;
	border-radius: 999px;
	background: var(--ap-rouge);
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	letter-spacing: .3px;
}
.ap-badge:hover { background: var(--ap-orange); color: var(--ap-noir); }
.ap-badge-clair { background: var(--ap-creme); color: var(--ap-noir); }

/* ---- fiche ---- */

.ap-fiche-corps {
	display: grid;
	grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
	gap: 34px;
	align-items: start;
	margin-top: 26px;
}

.ap-fiche-img img {
	width: 100%;
	height: auto;
	max-height: 430px;
	object-fit: cover;
	border-radius: 16px;
	display: block;
	background: var(--ap-creme);
}
.ap-fiche-texte { margin-top: 20px; line-height: 1.7; }
.ap-specialites { margin-top: 26px; }

/* pas de position: sticky ici — l'encart passerait par-dessus le plan qui le suit */
.ap-encart {
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 16px;
	padding: 24px;
}
.ap-encart h2 {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 20px;
	margin: 0 0 16px;
	color: var(--ap-noir);
}

.ap-details { list-style: none; margin: 0 0 20px; padding: 0; }
.ap-details li {
	padding: 10px 0;
	border-bottom: 1px solid var(--ap-bord);
	margin: 0;
}
.ap-details li:last-child { border-bottom: 0; }
.ap-details span {
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: #9a9a9a;
	font-weight: 700;
	margin-bottom: 3px;
}
.ap-details strong { color: var(--ap-noir); font-weight: 600; }

.ap-similaires { margin-top: 56px; }
.ap-similaires h2,
.ap-specialites h2,
.ap-autres h2,
.ap-zones-titre {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 28px;
	color: var(--ap-noir);
	margin: 0 0 20px;
}

/* ---- secteurs ---- */

.ap-zones { margin-top: 56px; }
.ap-zones-grille {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 22px;
}
.ap-zone-bloc {
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 14px;
	padding: 20px;
}
.ap-zone-bloc h3 {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 19px;
	margin: 0 0 12px;
}
.ap-zone-bloc h3 a { color: var(--ap-noir); text-decoration: none; }
.ap-zone-bloc h3 a:hover { color: var(--ap-rouge); }

.ap-zone-liste { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 14px; }
.ap-zone-liste li { margin: 0 0 6px; font-size: 14px; break-inside: avoid; }
.ap-zone-liste a { color: var(--ap-texte); text-decoration: none; }
.ap-zone-liste a:hover { color: var(--ap-rouge); }

.ap-compte {
	display: inline-block;
	vertical-align: middle;
	line-height: 1.5;
	min-width: 20px;
	padding: 1px 6px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid var(--ap-bord);
	font-size: 11px;
	font-weight: 700;
	color: #9a9a9a;
	text-align: center;
}

.ap-autres { margin-top: 48px; }
.ap-autres-liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.ap-autres-liste a {
	display: inline-block;
	padding: 8px 16px;
	border-radius: 999px;
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	color: var(--ap-noir);
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
}
.ap-autres-liste a:hover { border-color: var(--ap-orange); color: var(--ap-rouge); }

/* ---- pagination et vide ---- */

.ap-pagination {
	display: flex;
	justify-content: center;
	gap: 8px;
	margin-top: 38px;
	flex-wrap: wrap;
}
.ap-pagination .page-numbers {
	display: inline-block;
	min-width: 42px;
	padding: 9px 13px;
	text-align: center;
	border-radius: 999px;
	border: 1px solid var(--ap-bord);
	color: var(--ap-noir);
	text-decoration: none;
	font-weight: 700;
}
.ap-pagination .page-numbers.current,
.ap-pagination .page-numbers:hover {
	background: var(--ap-rouge);
	border-color: var(--ap-rouge);
	color: #fff;
}

.ap-vide {
	background: var(--ap-creme);
	border: 1px dashed var(--ap-bord);
	border-radius: 14px;
	padding: 34px;
	text-align: center;
	font-size: 17px;
}

/* ---- responsive ---- */

@media (max-width: 1024px) {
	.ap-grille,
	.ap-col-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ap-fiche-corps { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
	.ap-page { padding: 30px 16px 50px; }
	.ap-grille,
	.ap-col-2,
	.ap-col-4 { grid-template-columns: 1fr; }
	.ap-filtres { flex-direction: column; align-items: stretch; }
	.ap-zone-liste { columns: 1; }
}

/* ---- champs de recherche ---- */

.ap-champ-large { flex: 2 1 300px; }
.ap-champ-court { flex: 0 1 170px; }
.ap-btn-recherche { flex: 0 0 auto; padding: 12px 26px; }

.ap-champ select:disabled {
	background: #F3EFEB;
	color: #A9A29B;
	cursor: not-allowed;
}

/* ---- carte Google ---- */

.ap-carte-geo {
	margin-top: 22px;
	border: 1px solid var(--ap-bord);
	border-radius: 14px;
	overflow: hidden;
	background: #fff;
}
.ap-carte-geo-plan { line-height: 0; background: var(--ap-creme); }
.ap-carte-geo-plan iframe { display: block; width: 100%; border: 0; }

.ap-carte-geo-pied {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 10px;
	padding: 14px 16px;
}
.ap-pin { font-size: 18px; line-height: 1; }
.ap-carte-geo-lieu { font-weight: 600; color: var(--ap-noir); font-size: 14px; }
.ap-carte-geo-lien {
	width: 100%;
	color: var(--ap-rouge);
	font-weight: 700;
	text-transform: uppercase;
	font-size: 13px;
	letter-spacing: .4px;
}
.ap-carte-geo-lien:hover { color: var(--ap-orange); }

.ap-plan-zone { margin-top: 48px; }
.ap-plan-zone h2 {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 28px;
	color: var(--ap-noir);
	margin: 0 0 20px;
}
.ap-plan-zone .ap-carte-geo { margin-top: 0; }
.ap-plan-zone .ap-carte-geo-plan iframe { height: 380px; }
.ap-vide-btn { margin-top: 14px; }

/* ---- barre de recherche sur une seule ligne ---- */

.ap-filtres { flex-wrap: nowrap; }
.ap-filtres .ap-champ { min-width: 0; flex: 1 1 180px; }
.ap-filtres .ap-champ-large { flex: 1.4 1 200px; }
.ap-filtres .ap-champ-court { flex: 0 1 130px; }

.ap-filtres .ap-btn-recherche {
	align-self: flex-end;
	flex: 0 0 auto;
	background: var(--ap-orange);
	border-color: var(--ap-orange);
	color: var(--ap-noir);
	text-transform: uppercase;
	font-weight: 800;
	letter-spacing: .6px;
	padding: 12px 30px;
}

.ap-filtres .ap-btn-recherche:hover,
.ap-filtres .ap-btn-recherche:focus {
	background: var(--ap-jaune);
	border-color: var(--ap-jaune);
	color: var(--ap-noir);
}

@media (max-width: 1100px) {
	.ap-filtres { flex-wrap: wrap; }
	.ap-filtres .ap-champ { flex: 1 1 240px; }
	.ap-filtres .ap-btn-recherche { width: 100%; }
}

/* en colonne, flex-basis vaut une hauteur : on la neutralise */
@media (max-width: 768px) {
	.ap-filtres .ap-champ,
	.ap-filtres .ap-champ-large,
	.ap-filtres .ap-champ-court { flex: 0 0 auto; }
}

/* ---- pages de contenu (Comment ca marche, Villes couvertes) ---- */

.ap-contenu { max-width: 860px; }

.ap-contenu h2 {
	font-size: 30px;
	line-height: 1.2;
	margin: 36px 0 10px;
	color: var(--ap-noir);
}

.ap-contenu p {
	color: var(--ap-texte);
	line-height: 1.75;
	margin: 0 0 14px;
	font-size: 17px;
}

.ap-chapo {
	font-size: 19px !important;
	color: var(--ap-noir) !important;
	border-left: 4px solid var(--ap-orange);
	padding-left: 16px;
}

/* ---- recherche sans resultat ---- */

.ap-vide {
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 14px;
	padding: 26px;
	margin: 0 0 26px;
	text-align: left;
}

.ap-vide-titre {
	font-size: 20px;
	font-weight: 700;
	color: var(--ap-noir);
	margin: 0 0 6px;
}

.ap-vide-note { color: var(--ap-texte); margin: 0 0 16px; }

.ap-vide .ap-actions { display: flex; flex-wrap: wrap; gap: 10px; }

.ap-proches-titre {
	font-size: 22px;
	margin: 28px 0 16px;
	color: var(--ap-noir);
}

.ap-vide .ap-grille { margin: 0; }

/* le theme cible .entry-content h2 : il faut passer devant */
.ap-contenu h2 { font-size: 30px !important; line-height: 1.2 !important; }
.ap-proches-titre { font-size: 24px !important; line-height: 1.25 !important; margin-top: 30px !important; }

/* --- logo dans l'en-tete ---------------------------------------------------
   Le fichier fait 788 px de large : sans plafond, le theme l'affiche
   en taille reelle et l'en-tete double de hauteur. */
.site-header .custom-logo-link,
.site-header .site-branding a,
.site-footer .custom-logo-link { display: inline-block; line-height: 0; }

.site-header .custom-logo,
.site-header .custom-logo-link img,
.site-footer .custom-logo,
.site-footer .custom-logo-link img {
	height: auto;
	max-height: 56px;
	width: auto;
	max-width: 100%;
}

/* le pied de page aussi : sans plafond il affiche le PNG en 788 px de large */
.site-footer .custom-logo,
.site-footer .custom-logo-link img { max-height: 46px; }

@media (max-width: 600px) {
	.site-header .custom-logo,
	.site-header .custom-logo-link img { max-height: 42px; }
	.site-footer .custom-logo,
	.site-footer .custom-logo-link img { max-height: 38px; }
}

/* le slogan repete ce que le logo dit deja : on le garde pour les lecteurs d'ecran */
.site-header .site-description {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* --- bandeau de recherche en haut de l'accueil ---------------------------- */
.ap-barre-accueil {
	background: var(--ap-creme, #fdf6ef);
	border-bottom: 1px solid rgba(0, 0, 0, .06);
}

.ap-barre-accueil-inner {
	max-width: 1600px;
	margin: 0 auto;
	padding: 20px clamp(16px, 5vw, 90px);
}

/* le bandeau porte deja le fond : la barre elle-meme redevient neutre */
.ap-barre-accueil .ap-filtres {
	background: none;
	border: 0;
	box-shadow: none;
	margin: 0;
	padding: 0;
}

/* Trois champs au lieu de quatre : on redistribue la largeur.
   ⚠ a garder sous @media : en colonne, flex-basis vaut une HAUTEUR et cette
   regle, placee apres la neutralisation plus haut, rouvrirait un trou de 260px. */
@media (min-width: 769px) {
	.ap-filtres .ap-champ-large { flex: 1.6 1 260px; }
}

/* --- sections d'annuaire sous la page d'accueil --------------------------- */
.ap-accueil { padding-top: 8px; }
.ap-accueil-tout { text-align: center; margin: 32px 0 0; }
.ap-accueil-texte { margin-top: 56px; }
.ap-accueil-texte p { margin: 0 0 14px; line-height: 1.7; }

/* --- debordement horizontal du kit ----------------------------------------
   Les images decoratives du theme (pizza, rondelles d'oignon, basilic) sont en
   position absolue et depassent a droite. Au-dela de ~1500 px elles retombent
   dans l'ecran, mais entre 1024 et 1440 px elles poussent la page et le
   navigateur affiche une barre de defilement horizontale.
   On decoupe au bord de chaque bande : c'est exactement l'effet voulu.
   overflow-x: clip et non hidden — hidden forcerait overflow-y a auto et
   couperait verticalement les elements en position absolue. */
.elementor-top-section { overflow-x: clip; }

@supports not (overflow-x: clip) {
	.elementor-top-section { overflow-x: hidden; }
}

/* --- mention tarifaire a cote du numero ----------------------------------- */
.ap-tel-mention {
	display: block;
	width: 100%;
	font-size: 12px;
	line-height: 1.35;
	color: var(--ap-texte);
	margin-top: -2px;
}

/* --- encart "creez votre site" -------------------------------------------- */
.ap-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-top: 56px;
	padding: 28px 32px;
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 16px;
}

.ap-cta-texte { flex: 1 1 340px; }

.ap-cta-titre {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 24px !important;
	line-height: 1.2 !important;
	color: var(--ap-noir);
	margin: 0 0 8px !important;
}

.ap-cta p { margin: 0; line-height: 1.6; }
.ap-cta-btn { flex: 0 0 auto; }

@media (max-width: 600px) {
	.ap-cta { padding: 22px; }
	.ap-cta-btn { width: 100%; text-align: center; }
}

/* --- filtres rapides ------------------------------------------------------ */
.ap-rapides {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: -12px 0 24px;
}

.ap-rapides-titre {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .5px;
	color: #9a9a9a;
	margin-right: 4px;
}

.ap-puce {
	display: inline-block;
	padding: 6px 14px;
	border-radius: 999px;
	border: 1px solid var(--ap-bord);
	background: #fff;
	color: var(--ap-noir);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.3;
}
.ap-puce:hover { border-color: var(--ap-orange); color: var(--ap-rouge); }
.ap-puce-on {
	background: var(--ap-noir);
	border-color: var(--ap-noir);
	color: #fff;
}
.ap-puce-on:hover { background: var(--ap-rouge); border-color: var(--ap-rouge); color: #fff; }

.ap-barre-accueil .ap-rapides { margin: 12px 0 0; }

/* --- formulaire public ---------------------------------------------------- */
.ap-formulaire { max-width: 760px; }

.ap-form-ligne { margin-bottom: 18px; }
.ap-form-ligne label,
.ap-form-cases legend {
	display: block;
	font-weight: 700;
	font-size: 14px;
	color: var(--ap-noir);
	margin-bottom: 6px;
}
.ap-form input[type="text"],
.ap-form input[type="email"],
.ap-form textarea {
	width: 100%;
	padding: 11px 13px;
	border: 1px solid var(--ap-bord);
	border-radius: 8px;
	background: #fff;
	color: var(--ap-noir);
	font-size: 15px;
	font-family: inherit;
}
.ap-form input:focus,
.ap-form textarea:focus {
	outline: none;
	border-color: var(--ap-orange);
	box-shadow: 0 0 0 3px rgba(255, 166, 9, .2);
}
.ap-form-aide { display: block; font-size: 12px; color: #9a9a9a; margin-top: 4px; }
.ap-requis { color: var(--ap-rouge); }

.ap-form-cases { border: 0; padding: 0; margin-bottom: 22px; }
.ap-cases { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.ap-cases label {
	display: flex;
	align-items: center;
	gap: 7px;
	font-weight: 500;
	margin: 0;
	font-size: 15px;
}

.ap-form-titre {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 22px !important;
	margin: 34px 0 18px !important;
	color: var(--ap-noir);
}

.ap-form-envoi { margin: 26px 0 10px; }
.ap-form-note { font-size: 13px; color: #9a9a9a; margin: 0; }

/* le champ leurre ne doit jamais etre vu ni atteint au clavier */
.ap-leurre {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ap-message {
	padding: 16px 20px;
	border-radius: 12px;
	font-weight: 600;
	margin: 0 0 26px;
}
.ap-message-ok     { background: #E9F7EE; color: #1C6B36; border: 1px solid #BFE3CC; }
.ap-message-erreur { background: #FDECEE; color: #A11228; border: 1px solid #F3C4CB; }

/* --- blocs de menu (accueil) ---------------------------------------------- */
.ap-blocs-zone {
	max-width: 1200px;
	margin: 0 auto;
	padding: 48px 20px 8px;
}

.ap-blocs-titre {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	font-size: 30px !important;
	line-height: 1.15 !important;
	color: var(--ap-noir);
	margin: 0 0 26px !important;
	text-align: center;
}

.ap-blocs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 18px;
}

.ap-bloc {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 18px 12px 16px;
	background: #fff;
	border: 1px solid var(--ap-bord);
	border-radius: 16px;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.ap-bloc:hover {
	transform: translateY(-4px);
	border-color: var(--ap-orange);
	box-shadow: 0 14px 28px rgba(11, 10, 7, .10);
}

/* le disque creme derriere la vignette, comme sur le dessin du client */
.ap-bloc-vignette {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 118px;
	height: 118px;
	border-radius: 50%;
	background: var(--ap-creme);
}

.ap-bloc-img {
	width: 104px;
	height: 104px;
	object-fit: contain;
	display: block;
}

.ap-bloc-nom {
	font-family: "Barlow Semi Condensed", "Barlow", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .5px;
	font-size: 15px;
	line-height: 1.2;
	text-align: center;
	color: var(--ap-orange);
}
.ap-bloc:hover .ap-bloc-nom { color: var(--ap-rouge); }

@media (max-width: 600px) {
	.ap-blocs { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 12px; }
	.ap-bloc-vignette { width: 92px; height: 92px; }
	.ap-bloc-img { width: 80px; height: 80px; }
	.ap-bloc-nom { font-size: 13px; }
	.ap-blocs-titre { font-size: 24px !important; }
}


/* -------------------------------------------------------------------------
   Parcourir par secteur — complement de communes
   ---------------------------------------------------------------------- */

.ap-zone-plus { margin: 10px 0 0; }
.ap-zone-plus a {
	font-size: 13px;
	font-weight: 700;
	color: var(--ap-rouge);
	text-decoration: none;
}
.ap-zone-plus a:hover { color: var(--ap-orange); }

.ap-zones-chapo { margin: 0 0 18px; font-size: 15px; }

.ap-zones-detail .ap-retour { margin: 0 0 10px; font-size: 14px; }
.ap-zones-detail .ap-retour a { color: var(--ap-texte); text-decoration: none; }
.ap-zones-detail .ap-retour a:hover { color: var(--ap-rouge); }

/* la liste complete d'un departement peut faire 500 communes : en colonnes */
.ap-communes-colonnes .ap-zone-liste {
	columns: 4;
	column-gap: 24px;
	margin-top: 18px;
}
@media (max-width: 1024px) { .ap-communes-colonnes .ap-zone-liste { columns: 3; } }
@media (max-width: 768px)  { .ap-communes-colonnes .ap-zone-liste { columns: 2; } }
@media (max-width: 480px)  { .ap-communes-colonnes .ap-zone-liste { columns: 1; } }

/* -------------------------------------------------------------------------
   Pizzas par theme
   ---------------------------------------------------------------------- */

.ap-lien-themes { margin: 10px 0 0; }
.ap-lien-themes a {
	font-size: 14px;
	font-weight: 700;
	color: var(--ap-rouge);
	text-decoration: none;
}
.ap-lien-themes a:hover { color: var(--ap-orange); }
.ap-barre-accueil .ap-lien-themes a { color: var(--ap-orange); }
.ap-barre-accueil .ap-lien-themes a:hover { color: var(--ap-rouge); }

.ap-themes { max-width: 1200px; margin: 0 auto; padding: 0 20px 40px; }
.ap-themes-titre {
	font-family: 'Barlow Semi Condensed', Impact, sans-serif;
	font-size: 38px !important;
	text-transform: uppercase;
	color: var(--ap-noir);
	margin: 0 0 12px;
}
.ap-themes-chapo { max-width: 760px; margin: 0 0 30px; font-size: 16px; }
.ap-themes-section {
	font-family: 'Barlow Semi Condensed', Impact, sans-serif;
	font-size: 26px !important;
	text-transform: uppercase;
	color: var(--ap-noir);
	margin: 34px 0 18px;
}

.ap-familles-grille {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 20px;
}
.ap-famille {
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 14px;
	padding: 20px 20px 18px;
	display: flex;
	flex-direction: column;
}
.ap-famille-titre {
	font-family: 'Barlow Semi Condensed', Impact, sans-serif;
	font-size: 21px !important;
	text-transform: uppercase;
	margin: 0 0 12px !important;
	color: var(--ap-noir);
}
.ap-famille-titre a { color: var(--ap-noir); text-decoration: none; }
.ap-famille-titre a:hover { color: var(--ap-rouge); }
.ap-famille-soustitre {
	margin: 10px 0 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ap-rouge);
}
.ap-famille-ing, .ap-famille-ex { list-style: none; margin: 0; padding: 0; }
.ap-famille-ing li {
	font-size: 14px;
	margin: 0 0 4px;
	padding-left: 14px;
	position: relative;
}
.ap-famille-ing li::before {
	content: '';
	position: absolute;
	left: 0; top: 8px;
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--ap-orange);
}
.ap-famille-ex li { font-size: 14px; margin: 0 0 6px; }
.ap-famille-ex strong { color: var(--ap-noir); }
.ap-famille-ex span { color: var(--ap-texte); }
.ap-famille-lien {
	margin-top: auto;
	padding-top: 14px;
	font-size: 13px;
	font-weight: 700;
	color: var(--ap-rouge);
	text-decoration: none;
}
.ap-famille-lien:hover { color: var(--ap-orange); }

.ap-themes-filtre { margin: 0 0 16px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ap-themes-filtre .ap-label { margin: 0; }
.ap-filtre-theme {
	min-width: 260px;
	padding: 10px 14px;
	border: 1px solid var(--ap-bord);
	border-radius: 8px;
	font-size: 15px;
	background: #fff;
}
.ap-filtre-theme:focus { outline: 2px solid var(--ap-orange); outline-offset: 1px; }
.ap-filtre-compte { font-size: 13px; color: var(--ap-texte); }

.ap-themes-liste {
	list-style: none;
	margin: 0;
	padding: 0;
	columns: 4;
	column-gap: 24px;
}
.ap-themes-liste li { margin: 0 0 7px; font-size: 14px; break-inside: avoid; }
.ap-themes-liste a { color: var(--ap-texte); text-decoration: none; }
.ap-themes-liste a:hover { color: var(--ap-rouge); }
.ap-themes-liste li[hidden] { display: none; }
.ap-themes-vide { font-size: 15px; }
@media (max-width: 1024px) { .ap-themes-liste { columns: 3; } }
@media (max-width: 768px)  { .ap-themes-liste { columns: 2; } .ap-themes-titre { font-size: 30px !important; } }
@media (max-width: 480px)  { .ap-themes-liste { columns: 1; } .ap-filtre-theme { min-width: 0; width: 100%; } }

.ap-theme-intro {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 20px;
	margin: 0 0 28px;
}
.ap-theme-bloc {
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 14px;
	padding: 18px 20px;
}
.ap-theme-bloc h2 {
	font-family: 'Barlow Semi Condensed', Impact, sans-serif;
	font-size: 19px !important;
	text-transform: uppercase;
	margin: 0 0 10px !important;
	color: var(--ap-noir);
}
.ap-liste-themes { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 10px; }
.ap-liste-themes a {
	display: inline-block;
	padding: 7px 13px;
	background: #fff;
	border: 1px solid var(--ap-bord);
	border-radius: 999px;
	font-size: 13px;
	color: var(--ap-texte);
	text-decoration: none;
}
.ap-liste-themes a:hover { border-color: var(--ap-orange); color: var(--ap-rouge); }
.ap-themes-tous { margin: 16px 0 0; }


/* -------------------------------------------------------------------------
   Recherche de ville : champ global + filtre de liste + index A-Z
   ---------------------------------------------------------------------- */

.ap-villes-recherche { margin: 0 0 28px; }
.ap-villes-recherche .ap-label { display: block; margin: 0 0 6px; }
.ap-filtre-ville, .ap-filtre-liste {
	width: 100%;
	max-width: 560px;
	padding: 13px 16px;
	border: 1px solid var(--ap-bord);
	border-radius: 10px;
	font-size: 16px;
	background: #fff;
}
.ap-filtre-ville:focus, .ap-filtre-liste:focus { outline: 2px solid var(--ap-orange); outline-offset: 1px; }
.ap-villes-aide { margin: 8px 0 0; font-size: 13px; color: var(--ap-texte); }
.ap-villes-vide { margin: 14px 0 0; font-size: 15px; }

.ap-villes-resultats {
	list-style: none;
	margin: 18px 0 0;
	padding: 0;
	columns: 3;
	column-gap: 24px;
}
.ap-villes-resultats li { margin: 0 0 8px; font-size: 15px; break-inside: avoid; }
.ap-villes-resultats a { color: var(--ap-noir); text-decoration: none; font-weight: 600; }
.ap-villes-resultats a:hover { color: var(--ap-rouge); }
.ap-villes-dep { display: block; font-size: 12px; color: var(--ap-texte); }
@media (max-width: 1024px) { .ap-villes-resultats { columns: 2; } }
@media (max-width: 600px)  { .ap-villes-resultats { columns: 1; } }

.ap-villes-recherche-locale { margin: 18px 0 10px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ap-villes-recherche-locale .ap-label { margin: 0; }
.ap-villes-recherche-locale .ap-filtre-liste { max-width: 320px; }

.ap-alphabet { margin: 16px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.ap-alphabet a {
	display: inline-block;
	min-width: 30px;
	padding: 5px 0;
	text-align: center;
	background: #fff;
	border: 1px solid var(--ap-bord);
	border-radius: 6px;
	font-size: 13px;
	font-weight: 700;
	color: var(--ap-texte);
	text-decoration: none;
}
.ap-alphabet a:hover { border-color: var(--ap-orange); color: var(--ap-rouge); }
.ap-zone-liste li[hidden] { display: none; }
/* l'ancre ne doit pas se retrouver collee sous l'en-tete */
.ap-zone-liste-filtrable li[id^="lettre-"] { scroll-margin-top: 90px; }


/* -------------------------------------------------------------------------
   La carte d'une pizzeria (les plats)
   ---------------------------------------------------------------------- */

.ap-carte-plats { margin: 0 0 34px; }
/* ⚠ PAS de !important sur la taille : les h2 voisins de la fiche (« Spécialités »,
   « Pizzas proposées ») sont rendus par Hello Elementor via .entry-content h2, a
   specificite egale. Forcer 28 px ici ferait un titre plus petit que ses voisins —
   ca ressemble a un bug. On garde la taille du theme, seule la marge est reprise. */
.ap-carte-plats-titre {
	font-family: 'Barlow Semi Condensed', Impact, sans-serif;
	text-transform: uppercase;
	color: var(--ap-noir);
	margin: 0 0 6px !important;
}
.ap-carte-plats-note { margin: 0 0 20px; font-size: 14px; color: var(--ap-texte); }

.ap-carte-rubriques {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 20px;
}
.ap-carte-rubrique {
	background: var(--ap-creme);
	border: 1px solid var(--ap-bord);
	border-radius: 14px;
	padding: 18px 20px;
}
.ap-carte-rubrique-titre {
	font-family: 'Barlow Semi Condensed', Impact, sans-serif;
	font-size: 19px !important;
	text-transform: uppercase;
	margin: 0 0 12px !important;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--ap-orange);
	color: var(--ap-noir);
}
.ap-carte-liste { list-style: none; margin: 0; padding: 0; }
.ap-plat {
	margin: 0 0 12px;
	display: grid;
	grid-template-columns: 1fr auto;
	column-gap: 12px;
}
.ap-plat:last-child { margin-bottom: 0; }
.ap-plat-nom { font-weight: 700; color: var(--ap-noir); font-size: 15px; }
.ap-plat-prix {
	font-weight: 700;
	color: var(--ap-rouge);
	font-size: 15px;
	white-space: nowrap;
}
.ap-plat-desc {
	/* display:block OBLIGATOIRE : sans prix la ligne repasse en display:block et deux
	   <span> cote a cote se collent — « Margheritasauce tomate ». */
	display: block;
	grid-column: 1 / -1;
	font-size: 13.5px;
	color: var(--ap-texte);
	margin-top: 2px;
}
.ap-plat-nom { display: block; }
/* sans prix il n'y a qu'une colonne : on evite la grille inutile */
.ap-carte-sans-prix .ap-plat { display: block; }

/* -------------------------------------------------------------------------
 *  Photos : galerie de la fiche, mention « illustration », visionneuse
 * ---------------------------------------------------------------------- */

.ap-photos { margin: 0 0 24px; }

.ap-photos-grande {
	display: block;
	border-radius: 16px;
	overflow: hidden;
	background: var(--ap-creme);
	aspect-ratio: 16 / 10;
	cursor: zoom-in;
}
.ap-photos-grande img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.ap-photos-vignettes {
	display: flex;
	gap: 10px;
	margin-top: 10px;
	overflow-x: auto;
	padding-bottom: 4px;
	/* ⚠ sans min-width:0, la bande de vignettes ne defile pas : elle pousse la
	   colonne (min-width:auto sur un element de grille) et la page deborde sur mobile. */
	min-width: 0;
}
.ap-fiche-principal { min-width: 0; }
/* ⚠ !important indispensable : le kit Pipirima habille TOUS les <button> en noir
   et remet les images en width:auto. Sans cela les vignettes sortent sur fond noir,
   la photo flottant au milieu. Constate a l'ecran, l'HTML etait pourtant correct. */
.ap-photos .ap-photos-vignette {
	flex: 0 0 auto;
	width: 96px;
	height: 68px;
	padding: 0 !important;
	margin: 0;
	border: 2px solid transparent;
	border-radius: 10px;
	overflow: hidden;
	background: var(--ap-creme) !important;
	box-shadow: none;
	cursor: pointer;
}
.ap-photos .ap-photos-vignette img {
	width: 100% !important;
	height: 100% !important;
	max-width: none;
	object-fit: cover;
	display: block;
	border-radius: 0;
}
.ap-photos .ap-photos-vignette.est-active { border-color: var(--ap-orange); }
.ap-photos-vignette:focus-visible { outline: 2px solid var(--ap-rouge); outline-offset: 2px; }

/* Image generique : on l'assume, on ne la fait pas passer pour la leur */
.ap-fiche-img-illustration { margin: 0 0 24px; }
.ap-fiche-img-illustration figcaption {
	margin-top: 8px;
	font-size: 13px;
	font-style: italic;
	color: var(--ap-texte);
	opacity: .85;
}

/* la pastille est posee sur la vignette de l'annuaire, qui est en position:relative */
.ap-img-mention {
	position: absolute;
	left: 8px;
	bottom: 8px;
	background: rgba(11, 10, 7, .62);
	color: #fff;
	font-size: 11px;
	letter-spacing: .04em;
	padding: 2px 8px;
	border-radius: 20px;
	pointer-events: none;
}

/* La visionneuse. z-index eleve : les entetes Elementor montent haut. */
.ap-visio {
	position: fixed;
	inset: 0;
	z-index: 99999;
	background: rgba(11, 10, 7, .9);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}
.ap-visio img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	border-radius: 10px;
	display: block;
}
/* meme raison que les vignettes : le kit repeint tous les <button> en orange */
.ap-visio .ap-visio-fermer {
	position: absolute;
	top: 14px;
	right: 18px;
	width: 42px !important;
	height: 42px !important;
	min-width: 0;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: rgba(255, 255, 255, .18) !important;
	color: #fff !important;
	font-size: 26px !important;
	line-height: 40px !important;
	letter-spacing: 0;
	box-shadow: none;
	cursor: pointer;
}
.ap-visio .ap-visio-fermer:hover { background: rgba(255, 255, 255, .3) !important; }