/*
 * Collector Briques 0.4.7 - largeur éditoriale unifiée.
 * Concerne les contenus uniquement : ne touche ni à l'en-tête, ni au pied,
 * ni aux overlays / boutons fixes.
 * Ce fichier doit être chargé après les feuilles historiques du thème.
 */
body.cb-wp {
  --cb-editorial-max-width: 1240px;
  --cb-editorial-gutter: 24px;
}

/* Même enveloppe pour l'ensemble des pages, articles et fiches LEGO.
 * Sélecteur volontairement plus précis que les anciens body.cb26 main.
 * Conserver les paddings propres aux gabarits et les sections internes.
 */
body.cb-wp .cb30-original-content > main,
body.cb-wp .cb30-original-content > main[class],
body.cb-wp main#primary:not(.cb30-original-content),
body.cb-wp .cb30-original-content > .site-main {
  box-sizing: border-box !important;
  width: min(var(--cb-editorial-max-width), calc(100% - 48px)) !important;
  max-width: var(--cb-editorial-max-width) !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Pour les gabarits dont le conteneur HTML principal n'est pas un <main>. */
body.cb-wp .cb30-original-content > :is(article, .cb-production-page, .cb-compare, .cb-fit, .cb-guides) {
  box-sizing: border-box !important;
  max-width: min(var(--cb-editorial-max-width), calc(100% - 48px)) !important;
  margin-inline: auto !important;
}

/* Une section ne doit pas outrepasser la largeur du main parent.
 * Les sections directes constituent la grille extérieure commune ;
 * les blocs internes gardent leur propre composition (texte, image, colonnes).
 */
body.cb-wp .cb30-original-content > main > :is(section, .cb4-section, .cb6-section),
body.cb-wp main#primary > :is(section, .cb4-section, .cb6-section) {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Certaines pages historiques sont construites avec un grand <div> directement
 * sous <main>. Leur largeur maximale est limitée sans changer leurs colonnes.
 */
body.cb-wp .cb30-original-content > main > div,
body.cb-wp main#primary > div {
  box-sizing: border-box;
  max-width: 100% !important;
  min-width: 0;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Anciennes sections étendues, CTA et grilles ajoutées après la migration. */
body.cb-wp .cb30-original-content :is(
  .cb-v8-decision,
  .cb-decision-nav,
  .cb-toc,
  .cb-trust,
  .cb-about-revolution,
  .cb-v10-feature,
  .cb-related-next,
  .cb-hub-fresh-link,
  .cb-conversion-decision,
  .cb-production-method,
  .cb-production-grid,
  .cb-hub-live,
  .cb44-hub-live,
  .cb43-hub-live
) {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

/* Sécurité pour les mises en page CSS Grid et les médias embarqués. */
body.cb-wp .cb30-original-content :is(main, article, section, aside, figure, .wp-block-columns, .wp-block-column) {
  min-width: 0;
}
body.cb-wp .cb30-original-content :is(img, picture, video, iframe, svg) {
  max-width: 100%;
}
body.cb-wp .cb30-original-content :is(.wp-block-table, .cb-table, .cb-table-scroll, .cb26-table-scroll) {
  max-width: 100%;
  overflow-x: auto;
}

/* Alignement des cartes d'articles liés sur la largeur des pages. */
body.cb-wp .cb-related {
  box-sizing: border-box;
  width: min(var(--cb-editorial-max-width), calc(100% - 48px));
  max-width: var(--cb-editorial-max-width);
  margin-inline: auto;
}

@media (max-width: 767px) {
  body.cb-wp { --cb-editorial-gutter: 14px; }
  body.cb-wp .cb30-original-content > main,
  body.cb-wp .cb30-original-content > main[class],
  body.cb-wp main#primary:not(.cb30-original-content),
  body.cb-wp .cb30-original-content > .site-main {
    width: calc(100% - 28px) !important;
    max-width: calc(100% - 28px) !important;
  }
  body.cb-wp .cb30-original-content > :is(article, .cb-production-page, .cb-compare, .cb-fit, .cb-guides) {
    max-width: calc(100% - 28px) !important;
  }
  body.cb-wp .cb-related {
    width: calc(100% - 28px);
    max-width: calc(100% - 28px);
  }
}
