/*
 * Version imprimable des articles et des pages.
 *
 * Chargée en media="print" par mediatech-blog-impression.php : rien de ce fichier
 * n'agit à l'écran.
 *
 * Deux portées, et la distinction compte :
 *   — ce qui se retire partout, articles et pages : l'habillage du site,
 *   — ce qui ne se retire que sur un article, sous .single-post : les blocs que le
 *     gabarit « Article unique » ajoute autour du texte.
 *
 * Posée le 25/09/2026, étendue aux pages le 28/09/2026, resserrée le 09/10/2026
 * après le premier aperçu avant impression, puis un peu desserrée le même jour —
 * le zéro absolu entre blocs les faisait se toucher. L'interligne du texte, lui,
 * n'a pas bougé : c'est l'air *entre* les blocs qui manquait, pas dans les
 * paragraphes.
 */

@page {
	margin: 15mm 14mm;
}

/* ---------------------------------------------------------------------------
 * 1. Les couleurs, qu'il faut remettre.
 *
 * Le thème impose `*, ::before, ::after { color: #000 !important }` dans le bloc
 * @media print de son reset.css. Tout ressortait donc en noir. On ne peut pas
 * retirer un !important, mais on peut le battre : ces sélecteurs ont une
 * spécificité supérieure à `*`, et les couleurs viennent des variables du kit
 * Elementor, qui survivent à l'écrasement — une variable n'est pas une couleur
 * tant qu'on ne s'en sert pas.
 *
 * print-color-adjust demande au navigateur de ne pas désaturer ce qu'on a choisi.
 * Les FONDS, eux, restent coupés par le thème, et c'est très bien : un aplat bleu
 * nuit pleine page coûte une cartouche. Si on les voulait, ce serait ici.
 * ------------------------------------------------------------------------ */

body {
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
}

.elementor-location-single,
.elementor-location-single *,
body.page .elementor-element,
body.page .elementor-element * {
	color: var(--e-global-color-text, #656975) !important;
}

.elementor-location-single h1, .elementor-location-single h2,
.elementor-location-single h3, .elementor-location-single h4,
.elementor-location-single .elementor-heading-title,
body.page h1, body.page h2, body.page h3, body.page h4,
body.page .elementor-heading-title {
	color: var(--e-global-color-primary, #293C5A) !important;
}

.elementor-location-single a,
body.page .elementor-element a {
	color: var(--e-global-color-secondary, #3B58EE) !important;
}

/* ---------------------------------------------------------------------------
 * 2. L'habillage du site : retiré partout, articles comme pages.
 *
 * Les deux en-têtes sont nommés, et ce n'est pas de la ceinture-bretelles : la
 * recette porte celui du thème, `.site-header`, et les deux sites de production
 * un gabarit Elementor, `.elementor-location-header` — 212 px de méga-menu, logo
 * et formulaire de recherche. Relevé le 26/10/2026 sur www.streamlike.eu, où
 * `.site-header` n'existe pas. Sans la seconde ligne, toute page imprimée de la
 * production sortirait avec son menu.
 *
 * Le formulaire est passé dans ce bloc le 09/10/2026 : il sortait encore à
 * l'impression. Conséquence assumée — la page Contact, qui n'est que son
 * formulaire, s'imprime donc presque vide.
 * ------------------------------------------------------------------------ */

.site-header,
.elementor-location-header,
.elementor-location-footer,
#cmplz-cookiebanner-container,
.cmplz-cookiebanner,
.cmplz-manage-consent,
[data-widget_type^="breadcrumbs"],
[data-widget_type^="share-buttons"],
[data-widget_type^="post-navigation"],
[data-widget_type^="form"],
.mediatech-print-wrap,
iframe,
video {
	display: none !important;
}

/* Ce que le gabarit « Article unique » ajoute après le texte.
 *
 * Les boutons de partage et le formulaire d'abonnement partaient déjà ; leurs
 * intitulés restaient, et c'est ce qu'on voyait encore à l'impression — « Partager
 * ce post », « S'abonner à ce blog », « Saisissez votre e-mail… ». Ce sont des
 * widgets `heading` du gabarit, pas des titres rédigés : le titre de l'article est
 * un `theme-post-title`, et les titres du corps du texte sont de simples <h2> à
 * l'intérieur de `theme-post-content`, sans attribut data-widget_type. On peut donc
 * viser les trois sans toucher à un seul titre du contenu. Relevé dans le DOM le
 * 12/10/2026.
 *
 * Le bouton suit la même logique. Sur une page, un bouton appartient au contenu —
 * Applications et services en porte quatorze — donc il n'est visé que sur un
 * article. */
.single-post [data-widget_type^="heading"],
.single-post [data-widget_type^="button"] {
	display: none !important;
}

/* ---------------------------------------------------------------------------
 * 3. L'espacement. C'est le gros du retravail du 09/10 : Elementor respire pour
 *    un écran, et sur le papier ça fait des pages de blanc.
 *
 *    Trois sources d'air, et il faut les trois : les marges des widgets, les
 *    gouttières des conteneurs, et l'interligne du texte.
 * ------------------------------------------------------------------------ */

body {
	font-size: 10.5pt;
	line-height: 1.32;
}

/* Les marges que Elementor pose entre ses widgets — 20 px par défaut, soit près de
 * deux lignes à 10,5 pt. Mises à zéro le 09/10, c'était trop : les blocs se
 * touchaient. Un demi-cadratin les sépare sans gaspiller de page. */
.elementor-widget:not(:last-child),
.elementor-element:not(:last-child) {
	margin-block-end: .5em !important;
}

/* Et un peu plus entre les grands blocs, pour qu'on voie où l'un finit.
 *
 * Les deux sélecteurs sont là parce que le site mélange les deux générations
 * d'Elementor : le gabarit d'article est bâti en `section` (deux sur un article),
 * les pages en `section` aussi pour l'essentiel (quinze sur Applications et
 * services) avec trois conteneurs `e-con` de la nouvelle syntaxe. Vérifié dans le
 * DOM le 09/10/2026. */
.elementor-section:not(:last-child),
.elementor > .e-con:not(:last-child) {
	margin-block-end: 1em !important;
}

.elementor-widget-container {
	margin-block: 0 !important;
	padding-block: 0 !important;
}

/* Les hauteurs imposées, à plat.
 *
 * C'est la plus grosse source de blanc, et elle ne se voit pas dans les marges :
 * le bloc de titre de /applications-et-services/ porte un `min-height: 300px` sur
 * son conteneur, soit près de 80 mm de vide après le titre. Le site en compte cinq
 * comme celui-là, plus un 730px et un 88vh — à l'impression, 88vh c'est quasiment
 * une page blanche. Elles servent à composer un écran, elles n'ont aucun sens sur
 * du papier. Relevé le 12/10/2026.
 *
 * Seuls les conteneurs sont visés : une image ou un bloc qui tient à sa hauteur la
 * garde. */
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-column-wrap,
.elementor-widget-wrap,
.e-con,
.e-con-inner {
	min-height: 0 !important;
	height: auto !important;
}

/* Les gouttières et les paddings des conteneurs, à plat. */
.e-con,
.e-con-inner,
.elementor-section,
.elementor-container,
.elementor-column,
.elementor-column-wrap,
.elementor-widget-wrap {
	gap: 0 !important;
	row-gap: 0 !important;
	--gap: 0 !important;
	--row-gap: 0 !important;
	padding-block: 0 !important;
	margin-block: 0 !important;
}

/* Les largeurs contraintes pour l'écran n'ont plus de sens : la colonne, c'est la
 * page. */
.elementor-location-single,
.elementor-location-single .e-con,
body.page .e-con,
body.page .elementor-widget-container {
	max-width: none !important;
	width: auto !important;
	margin-inline: 0 !important;
	padding-inline: 0 !important;
}

/* Le texte lui-même. */
p, ul, ol, blockquote, figure, table {
	margin-block: 0 0 .45em !important;
}

li {
	margin-block-end: .12em !important;
}

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
	margin-block: .55em 0.2em !important;
	line-height: 1.18 !important;
}

h1, [data-widget_type^="theme-post-title"] .elementor-heading-title { font-size: 19pt !important; }
h2 { font-size: 14pt !important; }
h3 { font-size: 12pt !important; }

/* ---------------------------------------------------------------------------
 * Les images, centrées systématiquement.
 *
 * `display: block` plus des marges automatiques : c'est ce qui centre une image,
 * `text-align` ne suffit pas sur un élément de bloc. Conséquence à connaître — une
 * image glissée au fil d'un paragraphe passe elle aussi à la ligne et se centre.
 * Demandé le 12/10/2026, et c'est bien ce qui a été demandé : « systématiquement
 * toutes les images ».
 * ------------------------------------------------------------------------ */

.elementor-location-single img,
body.page .elementor-element img {
	display: block !important;
	margin-inline: auto !important;
	max-width: 100% !important;
	height: auto;
}

figure,
.wp-caption,
.elementor-widget-image,
[data-widget_type^="theme-post-featured-image"] {
	text-align: center !important;
}

figcaption,
.wp-caption-text {
	text-align: center !important;
	font-size: .85em;
}

/* L'image mise en avant mange une page entière si on la laisse faire. */
[data-widget_type^="theme-post-featured-image"] img {
	max-height: 75mm;
	width: auto;
	object-fit: contain;
}

/* ---------------------------------------------------------------------------
 * 4. Lisibilité du papier.
 * ------------------------------------------------------------------------ */

/*
 * L'URL derrière les liens, mais seulement ceux du corps du texte.
 *
 * Le thème le fait pour TOUS les liens de la page, et ça se voyait à l'aperçu : la
 * ligne de métadonnées sortait en « 15 mars, 2023 (http://…/blog/2023/03/15/) · Cas
 * d'usage et tutos (http://…) ». Illisible, et sans intérêt sur du papier — ces
 * liens-là mènent à des archives, pas à une source.
 *
 * On coupe donc la règle du thème partout, puis on la remet dans le contenu. Les
 * deux ont la même spécificité, et cette feuille est chargée AVANT celle du thème :
 * sans !important, c'est le thème qui gagnerait. Relevé le 12/10/2026 sur un aperçu
 * d'impression reconstitué.
 */
a[href]::after {
	content: "" !important;
}

[data-widget_type^="theme-post-content"] a[href^="http"]::after,
body.page [data-widget_type^="text-editor"] a[href^="http"]::after {
	content: " (" attr(href) ")" !important;
	font-size: .8em;
	word-break: break-all;
}

/* Une adresse de courriel n'a pas besoin de son mailto: entre parenthèses. */
a[href^="mailto:"]::after,
a[href^="tel:"]::after {
	content: "" !important;
}

/* ---------------------------------------------------------------------------
 * 5. Les sauts de page.
 * ------------------------------------------------------------------------ */

h1, h2, h3, h4 {
	break-after: avoid;
	page-break-after: avoid;
}

figure,
blockquote,
table,
[data-widget_type^="post-info"] {
	break-inside: avoid;
	page-break-inside: avoid;
}