/**
 * @file
 * Shared max-width tokens for pb_content nodes (theme-agnostic).
 *
 * Applied on `<body class="page-node-type-pb-content pb-nmw-*">` via
 * PbcHtmlHook. Consumed by Solo and APEX layout stylesheets.
 */
.page-node-type-pb-content .pb-content__full .pb-content__full:not(.pb-width-own) {
  --pb-content-width: initial;
}

.page-node-type-pb-content.pb-nmw-2560 {
  --pb-content-width: 160rem;
}

.page-node-type-pb-content.pb-nmw-1920 {
  --pb-content-width: 120rem;
}

.page-node-type-pb-content.pb-nmw-1600 {
  --pb-content-width: 100rem;
}

.page-node-type-pb-content.pb-nmw-1440 {
  --pb-content-width: 90rem;
}

.page-node-type-pb-content.pb-nmw-1280 {
  --pb-content-width: 80rem;
}

.page-node-type-pb-content.pb-nmw-1024 {
  --pb-content-width: 64rem;
}

.page-node-type-pb-content.pb-nmw-800 {
  --pb-content-width: 50rem;
}

.page-node-type-pb-content.pb-nmw-100 {
  --pb-content-width: 100%;
}

/* LAYER 2 -- the bundle max-width -- defeated in ONE place.
 *
 * A bundle's max-width works in two halves: one rule sets `--pb-width`, another
 * consumes it as `max-width: var(--pb-width)`. Previously every consumer had to
 * carry `:not(.page-node-type-pb-content .paragraphs-bundles)` itself -- 19
 * selectors, each a chance to forget. `paragraph-bundle-parallax.css` did
 * forget, and its `.pb-parallax__text` kept the bundle width on pb_content
 * nodes where the node width should have won. One module out of forty.
 *
 * Blanking the TOKEN instead of negating every consumer fixes that class of bug
 * outright: any consumer of `var(--pb-width)`, in any stylesheet, present or
 * future, resolves to `none` here without knowing this rule exists.
 *
 * `.pb-width-own` opts an element out -- see the four templates that emit it. */
.page-node-type-pb-content .paragraphs-bundles [class*="pb-u-mw--"]:not(.pb-width-own) {
  --pb-width: none;
}

.page-node-type-pb-content .paragraphs-bundles.pb-carousel .pb-carousel__slide > div {
  max-width: calc(var(--pb-content-width) - 100px);
}

@media (prefers-reduced-motion: reduce) {
  /* Width tokens only; no motion. */
}

@media (prefers-contrast: more) {
  /* Width tokens only. */
}

@media (forced-colors: active) {
  /* Width tokens only. */
}

@media print {
  .page-node-type-pb-content.pb-nmw-100,
  .page-node-type-pb-content.pb-nmw-800,
  .page-node-type-pb-content.pb-nmw-1024,
  .page-node-type-pb-content.pb-nmw-1280,
  .page-node-type-pb-content.pb-nmw-1440,
  .page-node-type-pb-content.pb-nmw-1600,
  .page-node-type-pb-content.pb-nmw-1920,
  .page-node-type-pb-content.pb-nmw-2560 {
    --pb-content-width: 100%;
  }
}
