/* V48 BUYER (agent "buyer") -- the buyer task surfaces: /custom/new (061), the print request form (011 / 016), the modeling
   request details with the embedded offer comparison (062 + 063 + 085), the modeling checkout (064) and the print / product
   order checkout (013 / 010). Uses the shared layout primitives of pb-v48-layout.css (.pb48-page / -cols / -aside / -compare /
   -actionbar / -errsum); this file only adds what those screens need on top. Every rule is scoped under .pb48-buyer.
   Container queries on the page content only (never the viewport), logical properties only (RTL / LTR mirror), existing
   tokens only (no new palette), no fixed height on anything that holds text. */

/* the custom-modeling pages are narrow documents (760px); a page with a side column / a comparison gets the content width */
.pb-cm.pb48-buyer.pb48-buyer--wide { max-inline-size: var(--pb44-content-max, 1280px); }

/* the main column of a .pb48-cols form: the cards stack with the shared gap */
.pb48-buyer .pb48-buyer-main { display: flex; flex-direction: column; gap: 16px; min-inline-size: 0; }
.pb48-buyer .pb48-buyer-main > .pb-cm-card,
.pb48-buyer .pb48-buyer-main > .pb-card,
.pb48-buyer .pb48-aside > .pb-cm-card,
.pb48-buyer .pb48-aside > .pb-card { margin-block: 0; }

/* J01: the optional "what is this service" link right under the short explanation of the form */
.pb48-buyer .pb48-buyer-learn { margin-block: 0 12px; }
.pb48-buyer .pb48-buyer-learn a { display: inline-flex; align-items: center; min-block-size: var(--pb44-target, 48px); color: var(--pb-action-text, var(--pb-color-link)); text-decoration: underline; }

/* J02 / J14: a summary / review label is a link to its field (in-place change) */
.pb48-buyer dt > a[data-pb48-field] { color: inherit; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; }
.pb48-buyer dt > a[data-pb48-field]:hover { text-decoration-style: solid; }
.pb48-buyer .pb48-buyer-carried { margin-block: 0 8px; padding: 8px 12px; border-radius: 8px; background: var(--pb-action-soft-bg, transparent); color: var(--pb-text-primary, inherit); }

/* J05: in the narrow side column the terms + payment-method pair is one column (it was two columns from 720px) */
.pb48-buyer .pb48-aside .pb-checkout-two { grid-template-columns: minmax(0, 1fr); }
.pb48-buyer .pb48-aside .pb-checkout-actions { margin-block-start: 0; }

/* J04: the offer comparison -- one card per row, two from 600, up to three from 1024 (only when readable) */
.pb48-buyer .pb-cm-offers.pb48-compare { grid-template-columns: minmax(0, 1fr); }
@container (min-width: 600px) {
    .pb48-buyer .pb-cm-offers.pb48-compare { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container (min-width: 1024px) {
    .pb48-buyer .pb-cm-offers.pb48-compare { grid-template-columns: repeat(auto-fit, minmax(max(280px, calc((100% - 32px) / 3)), 1fr)); }
}
/* the in-context offer detail (085) inside its comparison card */
.pb48-buyer .pb48-buyer-offer-more { border-block-start: 1px solid var(--pb-divider, var(--border-color)); padding-block-start: 8px; }
.pb48-buyer .pb48-buyer-offer-more > summary {
    display: flex; align-items: center; min-block-size: var(--pb44-target, 48px); cursor: pointer;
    color: var(--pb-action-text, var(--pb-color-link)); font-weight: 600;
}
.pb48-buyer .pb48-buyer-offer-more > summary:focus-visible { outline: 3px solid var(--pb-focus, #f59e0b); outline-offset: 2px; border-radius: 8px; }
.pb48-buyer .pb48-buyer-offer-more[open] > summary { margin-block-end: 8px; }
.pb48-buyer .pb-cm-offer:target { border-color: var(--pb-selection-border, var(--border-color)); box-shadow: inset 0 0 0 1px var(--pb-selection-border, transparent); }