/* =============================================================
   theme.css — RÉSIDUS WordPress uniquement.
   Règle : AUCUNE classe DS réinventée ici — le visuel vit dans
   assets/ds/ (Design System tel quel) + assets/css/ds-overrides.css
   (registre D-OV1→9). Ce fichier ne porte que les utilitaires
   imposés par WordPress (a11y screen-reader-text, skip-link)
   et des neutralisations d'artefacts WP.
   ============================================================= */

/* Utilitaire a11y standard WordPress (requis par les thèmes classiques). */
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
}

.screen-reader-text:focus {
	position: fixed;
	top: 8px;
	left: 8px;
	z-index: 100000;
	width: auto;
	height: auto;
	clip: auto;
	clip-path: none;
	padding: 10px 14px;
	background: var(--noir-950);
	color: var(--cream-100);
	outline: 2px solid var(--accent-500);
	outline-offset: 2px;
}

/* Neutralise les marges d'admin-bar sur le header sticky en recette. */
body.admin-bar header.site {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar header.site {
		top: 46px;
	}
}

/* Résidu WooCommerce : les notices (erreurs de validation checkout, messages panier)
   n'existent pas dans le DS — habillage minimal aux tokens de la marque. */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
	list-style: none;
	margin: 0 0 20px;
	padding: 14px 18px;
	border: 1px solid var(--gray-300);
	border-left: 3px solid var(--accent-500);
	border-radius: 2px;
	background: var(--cream-50);
	font: 500 13.5px var(--font-body);
	color: var(--gray-800);
}

.woocommerce-error li + li,
.woocommerce-message li + li {
	margin-top: 8px;
}

.woocommerce-message,
.woocommerce-info {
	border-left-color: var(--brand-600);
}

/* Résidu gabarit Recherche (G1) : hover des chips de requêtes types — la maquette
   le gérait en JS inline ; transposé en CSS (mêmes valeurs). */
a.lp-chip:hover {
	border-color: var(--accent-500) !important;
	color: var(--accent-600) !important;
}

/* =============================================================
   Layouts partagés — repli responsive.
   Les gabarits posent la grille DESKTOP en style inline (comme la
   maquette) ; la maquette portait le repli mobile dans le <style>
   de chaque shell. On le rétablit ici, une fois, pour tous :
   .legal-layout (legal, faq) · .cart-layout (contact, suivi, panier,
   checkout, quiz, calculateur) · .acc-layout / .stat-grid (compte) ·
   .mt-latex (îlot latex MT-Sling — SANS grille inline, définie ici).
   ============================================================= */
.mt-latex { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }

@media (max-width: 980px) {
	.cart-layout { grid-template-columns: 1fr !important; gap: 28px !important; }
}

@media (max-width: 860px) {
	.legal-layout { grid-template-columns: 1fr !important; gap: 28px !important; }
	.legal-toc { display: none !important; }
	.acc-layout { grid-template-columns: 1fr !important; gap: 28px !important; }
	.stat-grid { grid-template-columns: 1fr 1fr !important; }
	.mt-latex { grid-template-columns: 1fr !important; gap: 32px !important; }
}

/* Jeu « Le banc du tireur » — repli des grilles pédagogiques (porté du shell Jeu.html). */
@media (max-width: 700px) {
	.jeu-tips { grid-template-columns: 1fr !important; }
	.jeu-scale { grid-template-columns: repeat(2, 1fr) !important; }
}
