/**
 * GOUTTIÈRE MOBILE UNIFIÉE — toutes les cartes, même respiration.
 *
 * Constat (mesuré au navigateur à 375px sur /, /logements/, /listing/…, /demandes/,
 * /tarifs/) : la gouttière EXTÉRIEURE est déjà homogène — 15px, imposée par
 * `.container` (style.css) et héritée par `.li-page`, `.hp-page`, `.li-wrap`.
 * Ce qui variait, c'est le padding INTÉRIEUR des cartes : 20 / 22 / 24 / 26 / 28 /
 * 30 / 32px selon la famille. Le texte ne démarrait donc pas à la même distance du
 * bord de l'écran d'une page à l'autre (35px sur /demandes/, 47px sur /tarifs/).
 *
 * On aligne ici le seul padding HORIZONTAL des cartes de premier niveau. Le padding
 * vertical est laissé tel quel (il porte la hiérarchie : .li-plan garde ses 48px en
 * haut). Les blocs imbriqués (puces, pastilles, champs) ne sont pas touchés.
 *
 * Chargé en dernier (priorité 130) pour passer devant pages.css / hivepress.css /
 * home.css / wizard.css sans avoir à éditer six feuilles concurrentes.
 * `!important` : plusieurs sélecteurs cibles sont contextuels et donc plus
 * spécifiques qu'une classe seule (`.hp-page__sidebar .hp-widget`, 0-2-0).
 */

@media (max-width: 560px) {

	:root { --li-card-pad-m: 20px; }

	/* Pages de contenu (Tarifs, Confiance, Aides, Comment ça marche…) */
	.li-plan,
	.li-feature,
	.li-dl__card,
	.li-qp__card,
	.li-qp-welcome,
	.li-vstep,
	.li-ladder__step,
	.li-demandes__empty,
	.li-dcard,
	.li-boost-card,
	.li-othercities,
	.li-founder-banner,
	.li-note,
	.li-page .li-note,

	/* Accueil */
	.li-tier,

	/* HivePress : fiche annonce, catalogue, compte, messagerie */
	.hp-page__sidebar .hp-widget,
	.hp-listing--view-page .hp-listing__attributes--secondary,
	.hp-form--listing-filter,
	.widget_hivepress_listing_filter,
	.hp-vendor__summary,
	.li-review,
	.li-res,
	.li-empty,
	.li-onb,
	.li-catbanner,
	.li-verif-cta,
	.li-trust-cta,
	.li-avail,
	.li-lock-notice,
	.li-arch-row,
	.li-msgctx,
	.li-shared-coords,
	.li-alert-create,
	.li-alert-item,
	#li-cal,

	/* Publication (wizard) */
	.li-wz-card,
	.li-wz-opt,
	.li-wz-attest,
	.li-wz-draft,

	/* Notifications */
	.li-nc__push,
	.li-nc__freq,

	/* Catalogue et fiche annonce : corps des cartes-annonces et carte hôte */
	.hp-listing__content,
	.hp-listing__footer,
	.hp-vendor__content,
	.li-lcard__body,

	/* Barre de recherche (panneau verre) : aligne les champs sur les cartes */
	.li-search,

	/* Divers */
	.li-legend {
		padding-left: var(--li-card-pad-m) !important;
		padding-right: var(--li-card-pad-m) !important;
	}

	/* Grilles qui ajoutaient leur propre gouttière PAR-DESSUS celle du conteneur
	   (.li-pricing porte 32px de padding-inline, hérité du desktop où il sert à
	   loger la pastille « Populaire »). Sur mobile la pastille tient dans la
	   carte : on rend ces 32px au contenu. */
	.li-pricing {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	/* Sections pleine largeur de l'accueil : leur contenu démarrait à 20px alors
	   que tout le reste de la page démarre à 15px (gouttière du .container). */
	.li-hero,
	.li-final {
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
}

/* /demandes/ (page 139) portait `padding: 32px 16px` sur .li-page, écrit à une
   époque où .li-page n'avait pas de gouttière propre. Cette règle s'ajoutait aux
   15px du .container → 31px d'un côté, contre 15px sur les autres pages. On garde
   le padding vertical, on annule l'horizontal (même valeur que le .li-page générique). */
@media (max-width: 768px) {
	.page-id-139 .li-page { padding-left: 8px !important; padding-right: 8px !important; }
}
@media (max-width: 560px) {
	.page-id-139 .li-page { padding-left: 0 !important; padding-right: 0 !important; }
}

/* Très petits écrans (≤400px) : on récupère 8px de largeur utile par carte
   en resserrant le padding intérieur, la gouttière extérieure restant à 15px. */
@media (max-width: 400px) {
	:root { --li-card-pad-m: 16px; }
}