/*
 * Final standard Post content grid.
 *
 * Every article section, custom block and reusable iSPH pattern uses one shared
 * horizontal text gutter. This is the last alignment layer so component-level
 * legacy widths and paddings cannot create visible left/right text jumps.
 */

:root {
  --isp-post-text-gutter: 24px;
}

.single-post-layout .entry-content {
  --isp-post-content-inset: var(--isp-post-text-gutter);
  --isp-post-box-inset: var(--isp-post-text-gutter);
}

/* Free-flowing Gutenberg editorial content uses equal left and right gutters. */
.single-post-layout .entry-content > p,
.single-post-layout .entry-content > ul,
.single-post-layout .entry-content > ol,
.single-post-layout .entry-content > h2,
.single-post-layout .entry-content > h3,
.single-post-layout .entry-content > h4,
.single-post-layout .entry-content > h5,
.single-post-layout .entry-content > h6,
.single-post-layout .entry-content > pre,
.single-post-layout .entry-content > table,
.single-post-layout .entry-content > .wp-block-list,
.single-post-layout .entry-content > .wp-block-table,
.single-post-layout .entry-content > .wp-block-code,
.single-post-layout .entry-content > .wp-block-details,
.single-post-layout .entry-content > .wp-block-buttons,
.single-post-layout .entry-content > .wp-block-embed {
  box-sizing: border-box;
  width: calc(100% - (2 * var(--isp-post-text-gutter)));
  max-width: none;
  margin-left: var(--isp-post-text-gutter);
  margin-right: var(--isp-post-text-gutter);
}

/* Intro text starts on the exact same axis as the rest of the article. */
.single-post-layout .entry-content > .isp-post-intro,
.single-post-layout .entry-content > .wp-block-quote:first-child,
.single-post-layout .entry-content > blockquote:first-child {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-left: calc(var(--isp-post-text-gutter) - 4px);
  padding-right: var(--isp-post-text-gutter);
}

/* Shared bordered editorial components all place text 24px from the shell edge. */
.single-post-layout .entry-content .isp-quick-action,
.single-post-layout .entry-content .isp-safety {
  padding-left: calc(var(--isp-post-text-gutter) - 4px);
  padding-right: var(--isp-post-text-gutter);
}

.single-post-layout .entry-content .isp-callout,
.single-post-layout .entry-content .isp-structured-section,
.single-post-layout .isp-post-component--at-a-glance .isp-glance,
.single-post-layout .isp-post-component--conclusion .isp-article-conclusion,
.single-post-layout .entry-content .isp-faq,
.single-post-layout .isp-post-end .isp-resource-cta,
.single-post-layout .isp-post-end .isp-author-trust {
  box-sizing: border-box;
  padding-left: calc(var(--isp-post-text-gutter) - 1px);
  padding-right: calc(var(--isp-post-text-gutter) - 1px);
}

.single-post-layout .entry-content .isp-quick-action > *,
.single-post-layout .entry-content .isp-safety > *,
.single-post-layout .entry-content .isp-callout > *,
.single-post-layout .entry-content .isp-structured-section__header,
.single-post-layout .entry-content .isp-structured-section__eyebrow,
.single-post-layout .entry-content .isp-structured-section__heading,
.single-post-layout .entry-content .isp-structured-section__intro,
.single-post-layout .entry-content .isp-structured-section__facts,
.single-post-layout .entry-content .isp-structured-section__content,
.single-post-layout .entry-content .isp-structured-section__content > *,
.single-post-layout .entry-content .isp-section-group,
.single-post-layout .isp-glance__best-for,
.single-post-layout .isp-glance__summary,
.single-post-layout .isp-post-component--conclusion .isp-article-conclusion h2,
.single-post-layout .isp-post-component--conclusion .isp-article-conclusion__text,
.single-post-layout .isp-post-component--conclusion .isp-article-conclusion__text > * {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Activity is an editorial section rather than a card, so align its text groups
 * without narrowing the media itself. */
.single-post-layout .entry-content .isp-activity__header,
.single-post-layout .entry-content .isp-activity__meta,
.single-post-layout .entry-content .isp-activity__instructions {
  box-sizing: border-box;
  width: calc(100% - (2 * var(--isp-post-text-gutter)));
  max-width: none;
  margin-left: var(--isp-post-text-gutter);
  margin-right: var(--isp-post-text-gutter);
}

/* Rank Math TOC follows the same interior text gutter as native iSPH blocks. */
.single-post-layout .entry-content .wp-block-rank-math-toc-block,
.single-post-layout .entry-content .wp-block-rank-math-toc,
.single-post-layout .entry-content .rank-math-block {
  box-sizing: border-box;
  padding-left: var(--isp-post-text-gutter);
  padding-right: var(--isp-post-text-gutter);
}

/* Reusable Gutenberg iSPH patterns use the same grid instead of their older
 * clamp-based horizontal padding. */
.single-post-layout .entry-content > .isp-pattern-box,
.single-post-layout .entry-content > .isp-pattern-stack,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-pink,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-soft-blue,
.single-post-layout .entry-content > .wp-block-group.is-style-isp-warm-note {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

.single-post-layout .isp-pattern-box,
.single-post-layout .isp-pattern-card {
  padding-left: calc(var(--isp-post-text-gutter) - 1px);
  padding-right: calc(var(--isp-post-text-gutter) - 1px);
}

.single-post-layout .wp-block-group.is-style-isp-soft-pink,
.single-post-layout .wp-block-group.is-style-isp-soft-blue,
.single-post-layout .wp-block-group.is-style-isp-warm-note {
  padding-left: calc(var(--isp-post-text-gutter) - 5px);
  padding-right: calc(var(--isp-post-text-gutter) - 1px);
}

@media (max-width: 700px) {
  :root {
    --isp-post-text-gutter: 18px;
  }
}