/* Inherits the current cooperation/questionnaire grid and established type scale. */
.commerce-page { --commerce-line:var(--line,var(--theme-line,#e5e5e5)); --commerce-muted:var(--muted,var(--theme-muted,#666)); --commerce-ink:var(--ink,var(--theme-ink,#171717)); --commerce-paper:var(--paper,var(--theme-bg,#fff)); width:min(1040px,calc(100% - 2 * var(--gutter,24px))); margin:40px auto 96px; color:var(--commerce-ink); font-family:var(--theme-font,Arial,'Microsoft YaHei',sans-serif); font-size:var(--theme-body-size,16px); line-height:1.8; }
.commerce-page :is(h1,h2,h3,p,ul,fieldset,dl) { margin:0; }
.commerce-page :is(button,input,textarea,select) { font:inherit; color:inherit; }
.commerce-page :is(input,textarea,select) { box-sizing:border-box; }
.commerce-page :is(a,button,input,textarea,select):focus-visible { outline:2px solid var(--commerce-ink); outline-offset:4px; }
.commerce-page a { color:inherit; text-decoration:none; }
.commerce-page a:hover { text-decoration:underline; text-underline-offset:4px; }
.commerce-page .commerce-back { display:inline-flex; align-items:center; min-height:44px; gap:12px; font-size:14px; }
.commerce-page .commerce-flow-nav { display:flex; flex-wrap:wrap; gap:8px 28px; padding:16px 0; margin-bottom:32px; border-bottom:1px solid var(--commerce-line); font-size:14px; }
.commerce-page .commerce-flow-nav a { display:flex; align-items:center; min-height:44px; }
.commerce-page .commerce-flow-nav [aria-current] { text-decoration:underline; text-underline-offset:6px; }
.commerce-page .commerce-layout { display:grid; grid-template-columns:200px minmax(0,1fr); gap:80px; align-items:start; }
.commerce-page .commerce-rail { position:sticky; top:112px; min-width:0; }
.commerce-page .commerce-rail h1 { font-size:24px; font-weight:500; line-height:36px; margin-bottom:28px; }
.commerce-page .commerce-products { display:flex; flex-direction:column; gap:4px; padding-right:24px; border-right:1px solid var(--commerce-line); }
.commerce-page .commerce-products a { display:flex; align-items:center; box-sizing:border-box; min-height:44px; padding:10px 14px; border-radius:6px; color:var(--commerce-muted); font-size:15px; line-height:24px; overflow-wrap:anywhere; }
.commerce-page .commerce-products a:is(:hover,[aria-current]) { background:var(--surface,var(--theme-surface,#f5f5f5)); }
.commerce-page .commerce-products [aria-current] { color:var(--commerce-ink); font-weight:500; }
.commerce-page .commerce-body { min-width:0; }
.commerce-page :is(.commerce-heading,.commerce-notice) h2 { margin-bottom:16px; font-size:28px; font-weight:500; line-height:36px; }
.commerce-page :is(.commerce-heading,.commerce-notice) p { color:var(--commerce-muted); font-size:14px; line-height:1.8; }
.commerce-page .commerce-field { display:block; margin-top:32px; font-size:15px; line-height:1.6; }
.commerce-page small { color:var(--commerce-muted); font-size:12px; font-weight:400; }
.commerce-page :is(.commerce-field,.commerce-question) small { margin-left:8px; }
.commerce-page :is(.commerce-field,.commerce-question) :is(input:not([type="checkbox"]),textarea,select) { display:block; width:100%; min-height:44px; margin-top:10px; padding:12px 14px; border:1px solid var(--commerce-line); border-radius:6px; background:var(--commerce-paper); font-size:14px; line-height:1.5; }
.commerce-page textarea { resize:vertical; }
.commerce-page .commerce-question { min-width:0; padding:28px 0 0; margin-top:32px; border:0; border-top:1px solid var(--commerce-line); }
.commerce-page .commerce-question legend { padding:0 0 12px; font-size:17px; line-height:1.6; font-weight:500; }
.commerce-page .commerce-options { display:grid; gap:4px; }
.commerce-page .commerce-options label { display:flex; align-items:center; min-height:44px; gap:10px; font-size:14px; cursor:pointer; }
.commerce-page input:is([type="checkbox"],[type="radio"]) { width:18px; height:18px; flex-shrink:0; margin:0; accent-color:var(--commerce-ink); }
.commerce-page .commerce-field-error { display:block; font-size:13px; color:var(--commerce-ink); }
.commerce-page [aria-invalid] { outline:1px solid var(--commerce-ink); }
.commerce-page .commerce-button { display:inline-flex; align-items:center; justify-content:center; gap:20px; box-sizing:border-box; min-height:44px; padding:10px 20px; border:1px solid var(--commerce-line); border-radius:var(--theme-button-radius,40px); background:var(--commerce-paper); color:var(--commerce-ink); font-size:14px; font-weight:400; line-height:1.5; cursor:pointer; text-decoration:none; }
.commerce-page .commerce-button:not(:disabled):hover { background:var(--commerce-ink); color:var(--commerce-paper); text-decoration:none; }
.commerce-page .commerce-button:disabled { opacity:.5; cursor:wait; }
.commerce-page .ps-support-symbol { display:none; }
.commerce-page .commerce-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px 24px; margin-top:28px; font-size:14px; }
.commerce-page :is(.commerce-status,.commerce-muted,.commerce-reference) { color:var(--commerce-muted); font-size:14px; overflow-wrap:anywhere; }
.commerce-page .commerce-status { margin-top:16px; min-height:24px; }
.commerce-page .commerce-status[role="alert"] { color:var(--commerce-ink); }
.commerce-page .commerce-reference { margin-top:24px; }
.commerce-page .commerce-support { margin-top:48px; padding-top:24px; border-top:1px solid var(--commerce-line); font-size:13px; color:var(--commerce-muted); overflow-wrap:anywhere; }
.commerce-page .commerce-offers { padding:0; border:0; margin-top:32px; }
.commerce-page .commerce-offers legend { font-size:17px; font-weight:500; padding-bottom:16px; }
.commerce-page .commerce-offer { display:flex; align-items:flex-start; gap:14px; border-top:1px solid var(--commerce-line); padding:24px 0; cursor:pointer; }
.commerce-page .commerce-offer input { margin-top:5px; }
.commerce-page .commerce-offer > span { flex:1; min-width:0; }
.commerce-page .commerce-offer :is(strong,span span,small) { display:block; }
.commerce-page .commerce-offer strong { font-size:17px; font-weight:500; }
.commerce-page .commerce-price { font-size:24px; line-height:36px; margin:4px 0; }
.commerce-page .commerce-offer span span:not(.commerce-price) { color:var(--commerce-muted); font-size:14px; }
.commerce-page .commerce-facts { display:grid; gap:16px; margin-top:28px; font-size:14px; }
.commerce-page .commerce-facts > div { display:grid; grid-template-columns:120px minmax(0,1fr); gap:16px; }
.commerce-page .commerce-facts dt { color:var(--commerce-muted); }
.commerce-page .commerce-facts dd { margin:0; overflow-wrap:anywhere; }
.commerce-page .commerce-payment { padding-top:24px; margin-top:32px; border-top:1px solid var(--commerce-line); }
.commerce-page h3 { font-size:18px; font-weight:500; line-height:28px; }
.commerce-page .commerce-payment p { font-size:13px; color:var(--commerce-muted); margin-top:16px; }
.commerce-page .commerce-qr { max-width:224px; margin:16px 0; background:white; }
.commerce-page .commerce-qr svg { display:block; width:100%; height:auto; }
.commerce-page .commerce-deliveries { padding:0; list-style:none; margin-top:32px; }
.commerce-page .commerce-deliveries li { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:20px; padding:24px 0; border-top:1px solid var(--commerce-line); }
.commerce-page .commerce-deliveries li > div { min-width:0; flex:1 1 220px; overflow-wrap:anywhere; }
.commerce-page .commerce-deliveries p { font-size:14px; color:var(--commerce-muted); margin-top:4px; }
.commerce-page .commerce-original { padding-top:32px; margin-top:32px; border-top:1px solid var(--commerce-line); }
.commerce-page .commerce-original > p { margin-top:16px; }
@media(max-width:1023px) { .commerce-page .commerce-layout { grid-template-columns:160px minmax(0,1fr); gap:32px; } }
@media(max-width:767px) {
  .commerce-page { margin-top:32px; }
  .commerce-page .commerce-layout { grid-template-columns:minmax(0,1fr); gap:32px; }
  .commerce-page .commerce-rail { position:static; }
  .commerce-page .commerce-rail h1 { margin-bottom:20px; }
  .commerce-page .commerce-products { flex-direction:row; flex-wrap:wrap; gap:8px; padding:0; border:0; }
  .commerce-page .commerce-products a { flex:1 1 auto; justify-content:center; font-size:14px; }
  .commerce-page .commerce-products a[aria-current] { color:var(--theme-button-text,#fff); background:var(--theme-button,#171717); }
  .commerce-page :is(.commerce-heading,.commerce-notice) h2 { font-size:24px; line-height:32px; }
  .commerce-page .commerce-facts > div { grid-template-columns:minmax(0,1fr); gap:2px; }
}