/* Commerce canvas
   Product, cart, checkout and order pages share one quiet retail foundation.
   Texture remains in the brand chrome; it no longer competes with the content. */
.sg-commerce-body {
    --commerce-canvas: #eef1f4;
    --commerce-surface: #ffffff;
    --commerce-subtle: #f6f8fa;
    --commerce-ink: #10233f;
    --commerce-muted: #5d6b7b;
    --commerce-line: #d6dde4;
    --commerce-line-strong: #aeb9c4;
    --commerce-accent: #173c63;
    --commerce-positive: #23764d;
    --commerce-shadow: 0 14px 38px rgba(9, 29, 54, .09);
    /* illustrated-analytics.css applies the legacy wallpaper with !important.
       These declarations deliberately match that priority so storefront pages
       actually become a clean canvas instead of merely tinting beadboard. */
    background-color: var(--commerce-canvas) !important;
    background-image: linear-gradient(180deg, #ffffff 0, #eef1f4 100%) !important;
    background-size: auto !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    color: var(--commerce-ink);
}
[data-theme="dark"] .sg-commerce-body {
    --commerce-canvas: #091428;
    --commerce-surface: #101f38;
    --commerce-subtle: #142743;
    --commerce-ink: #f3f6f8;
    --commerce-muted: #a9b5c4;
    --commerce-line: #2d4260;
    --commerce-line-strong: #59708e;
    --commerce-accent: #dce5ed;
    --commerce-positive: #72d6a2;
    --commerce-shadow: 0 16px 42px rgba(0,0,0,.24);
    background-image: linear-gradient(180deg, #0a1426 0, #101f38 100%) !important;
}
.sg-commerce-body .store-main { flex: 1; }
.sg-commerce-body .shop,
.sg-commerce-body .carddetail,
.sg-commerce-body .cart-shell,
.sg-commerce-body .checkout-shell,
.sg-commerce-body .info-shell {
    color: var(--commerce-ink);
}
.sg-commerce-body .isl-topbar { margin-bottom: 24px; }
.sg-commerce-body .isl-page-title { letter-spacing: .08em; }

/* Home and shared shopper pages use the same quiet canvas as checkout.
   The beadboard remains a brand texture in the header instead of filling every gap. */
.sg-home-body.sg-commerce-body .sg-home { color: var(--commerce-ink); }
.sg-home-body.sg-commerce-body .sg-home-hero {
    min-height: 560px;
    border-color: var(--commerce-line);
    background: transparent;
}
.sg-home-body.sg-commerce-body .sg-home-hero-glow {
    background:
        radial-gradient(circle at 75% 30%, color-mix(in srgb, var(--commerce-accent) 10%, transparent), transparent 34%),
        radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--commerce-positive) 7%, transparent), transparent 30%);
}
.sg-home-body.sg-commerce-body :is(.sg-home-kicker,.sg-home-welcome>p:not(.sg-home-kicker),.sg-home-quick>p,.sg-home-quick-links small,.sg-home-promise-grid p,.sg-home-review-layout>div>p:last-child,.sg-home-review footer span) {
    color: var(--commerce-muted);
}
.sg-home-body.sg-commerce-body .sg-home-button { color: var(--commerce-ink); border-color: var(--commerce-line-strong); }
.sg-home-body.sg-commerce-body .sg-home-button.primary {
    color: var(--commerce-surface);
    border-color: var(--commerce-ink);
    background: var(--commerce-ink);
    box-shadow: none;
}
.sg-home-body.sg-commerce-body :is(.sg-home-quick,.sg-home-promise-grid article,.sg-home-review) {
    border-color: var(--commerce-line);
    background: var(--commerce-surface);
    color: var(--commerce-ink);
    box-shadow: var(--commerce-shadow);
}
.sg-home-body.sg-commerce-body .sg-home-window-bar { border-color: var(--commerce-line); color: var(--commerce-muted); }
.sg-home-body.sg-commerce-body .sg-home-quick-header>span { border-color: var(--commerce-line-strong); color: var(--commerce-ink); }
.sg-home-body.sg-commerce-body .sg-home-quick-links a {
    border-color: var(--commerce-line);
    background: var(--commerce-subtle);
    color: var(--commerce-ink);
}
.sg-home-body.sg-commerce-body .sg-home-quick-links a:hover { border-color: var(--commerce-line-strong); }
.sg-home-body.sg-commerce-body .sg-home-promises { padding-top: 34px; }
.sg-home-body.sg-commerce-body .sg-home-promise-grid article { min-height: 176px; }
.sg-home-body.sg-commerce-body .sg-home-promise-grid article>span { border-color: var(--commerce-line); color: var(--commerce-accent); }
.sg-home-body.sg-commerce-body .sg-home-reviews { border-top: 1px solid var(--commerce-line); }
.sg-home-body.sg-commerce-body .sg-home-review blockquote { color: var(--commerce-ink); }
.sg-home-body.sg-commerce-body .sg-home-review-stars { color: var(--commerce-accent); }
.sg-home-body.sg-commerce-body .ia-review-rotator-topline,
.sg-home-body.sg-commerce-body .ia-review-instructions { color: var(--commerce-muted); }
.sg-home-body.sg-commerce-body .ia-review-arrow { border-color: var(--commerce-line-strong); color: var(--commerce-ink); }
.sg-home-body.sg-commerce-body .ia-review-arrow:hover { border-color: var(--commerce-ink); background: var(--commerce-subtle); }
.sg-home-body.sg-commerce-body .ia-review-dot { background: var(--commerce-line-strong); }
.sg-home-body.sg-commerce-body .ia-review-dot.is-active { background: var(--commerce-accent); }

/* Existing public information and account views inherit the retail canvas immediately,
   without changing staff/operations screens that share this layout. */
.sg-commerce-body :is(.info-card,.account-card,.dashboard-card,.login-card,.registration-card) {
    border-color: var(--commerce-line);
    background: var(--commerce-surface);
    color: var(--commerce-ink);
    box-shadow: var(--commerce-shadow);
}

/* Shared retail surfaces */
.sg-commerce-body :is(.cart-item,.cart-summary,.ck-panel,.ck-summary,.oc-summary,.order-history-card,.order-state-card,.order-detail-panel,.cd-buy,.cd-facts,.cd-subs) {
    border-color: var(--commerce-line);
    background: var(--commerce-surface);
    color: var(--commerce-ink);
    box-shadow: var(--commerce-shadow);
}
.sg-commerce-body :is(.cart-item,.cart-summary,.ck-panel,.ck-summary,.oc-summary,.order-history-card,.order-state-card,.order-detail-panel,.cd-buy) {
    border-radius: 16px;
}
.sg-commerce-body :is(.cart-lede,.ck-panel-note,.ck-secure-line,.oc-secure,.orders-eyebrow,.order-details-heading p,.order-state-copy p,.order-facts dt,.cd-kicker,.cd-subtitle,.cd-price small) {
    color: var(--commerce-muted);
}

/* Catalog: quiet rail and consistent merchandise cards. */
.sg-catalog-body .shop { width: min(1320px, calc(100% - 40px)); }
.sg-catalog-body .shop-rail {
    border: 1px solid var(--commerce-line);
    border-radius: 16px;
    background: var(--commerce-surface);
    box-shadow: none;
}
.sg-catalog-body :is(.shop-card,.shop-list-card) {
    border-color: var(--commerce-line);
    background: var(--commerce-surface);
    box-shadow: 0 8px 24px rgba(9,29,54,.07);
}
.sg-catalog-body :is(.shop-card,.shop-list-card):hover {
    border-color: var(--commerce-line-strong);
    box-shadow: 0 14px 32px rgba(9,29,54,.12);
}

/* Product page: one strong gallery, one clean information column. */
.sg-product-body .cd-grid { gap: clamp(28px,5vw,64px); }
.sg-product-body .cd-stage .cp-trigger {
    padding: 18px;
    border-color: var(--commerce-line);
    background: var(--commerce-surface);
    box-shadow: var(--commerce-shadow);
}
.sg-product-body .cd-thumb { border-color: var(--commerce-line); background: var(--commerce-surface); }
.sg-product-body .cd-copy { padding-top: 18px; }
.sg-product-body .cd-title { color: var(--commerce-ink); font-size: clamp(2rem,4vw,3.4rem); }
.sg-product-body .cd-subtitle { margin-bottom: 26px; }
.sg-product-body .cd-subs { gap: 0; box-shadow: none; overflow: hidden; }
.sg-product-body .cd-subs > div { background: var(--commerce-surface); }
.sg-product-body .cd-facts { box-shadow: none; }
.sg-product-body .cd-facts dt { color: var(--commerce-muted); background: var(--commerce-subtle); }
.sg-product-body .cd-facts dd { color: var(--commerce-ink); background: var(--commerce-surface); }
.sg-product-body .cd-buy { padding: 20px 22px; }
.sg-product-body .cd-recent { margin-top: 50px; padding-top: 28px; border-color: var(--commerce-line); }
.sg-product-body .cd-recent-rail { grid-auto-columns: 176px; gap: 14px; }
.sg-product-body .cd-recent-card {
    border-color: var(--commerce-line);
    background: var(--commerce-surface);
    box-shadow: 0 6px 18px rgba(9,29,54,.06);
}
.sg-product-body .cd-recent-media { height: 178px; background: var(--commerce-subtle); }
.sg-product-body .cd-recent-media img { object-fit: contain; }

/* Cart: receipt-like rows and a stable summary. */
.sg-cart-body .cart-lede { margin-top: -8px; font-size: .82rem; }
.sg-cart-body .cart-item { background: var(--commerce-surface); }
.sg-cart-body .cart-item-photo { background: var(--commerce-subtle); }
.sg-cart-body .cart-item-side { border-color: var(--commerce-line); background: var(--commerce-subtle); }
.sg-cart-body .cart-summary { box-shadow: var(--commerce-shadow); }
.sg-cart-body .cart-assurances { border-color: var(--commerce-line); }

/* Checkout: readable address form, fewer boxes, one clear action. */
.sg-checkout-body .ck-steps { margin-bottom: 26px; }
.sg-checkout-body .ck-steps li { border-color: transparent; background: transparent; }
.sg-checkout-body .ck-steps li.current { border-color: var(--commerce-line-strong); background: var(--commerce-surface); }
.sg-checkout-body .ck-panel-address {
    border-color: var(--commerce-line);
    background: var(--commerce-surface);
    color: var(--commerce-ink);
    box-shadow: var(--commerce-shadow);
}
.sg-checkout-body .ck-panel-address :is(h2,.ck-grid>label>span,.ck-address-search>span) { color: var(--commerce-ink); }
.sg-checkout-body .ck-panel-address :is(.ck-panel-note,.ck-address-search>small,.ck-address-search>strong,.ck-zip-status) { color: var(--commerce-muted); }
.sg-checkout-body .ck-panel-address :is(.ck-grid input,.ck-grid select,.ss-input) {
    border-color: var(--commerce-line-strong);
    background: var(--commerce-subtle);
    color: var(--commerce-ink);
    box-shadow: none;
}
.sg-checkout-body .ck-panel-address :is(.ck-grid input,.ck-grid select,.ss-input):focus {
    border-color: #47739a;
    outline-color: #47739a;
    background: var(--commerce-surface);
}
.sg-checkout-body .ck-fixed { border-color: var(--commerce-line); color: var(--commerce-ink); background: var(--commerce-subtle); }
.sg-checkout-body .ck-fixed small { color: var(--commerce-muted); }
.sg-checkout-body .ck-save-address { border-color: var(--commerce-line); background: var(--commerce-subtle); }
.sg-checkout-body .ck-save-address strong { color: var(--commerce-ink); }
.sg-checkout-body .ck-save-address small { color: var(--commerce-muted); }
.sg-checkout-body .ck-summary { box-shadow: var(--commerce-shadow); }
.sg-checkout-body .ck-disclosure { border-color: var(--commerce-line); }

/* Confirmation and orders: compact, scannable receipts instead of dashboards. */
.sg-confirmation-body .oc-hero { max-width: 760px; margin-inline: auto; }
.sg-confirmation-body .oc-layout { max-width: 980px; margin-inline: auto; }
.sg-orders-body .my-orders-page { max-width: 980px; }
.orders-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin: -4px 0 14px; color:var(--commerce-muted); font-size:.75rem; font-weight:800; }
.sg-orders-body .orders-count { margin: 0; color: var(--commerce-muted); }
.sg-orders-body .order-history-card { overflow: hidden; border-radius: 14px; box-shadow: 0 7px 22px rgba(9,29,54,.07); }
.sg-orders-body .order-history-meta { border-color: var(--commerce-line); background: var(--commerce-subtle); color: var(--commerce-muted); }
.sg-orders-body .order-history-body { gap: 18px; }
.sg-orders-body .order-history-action { border-color: var(--commerce-line); color: var(--commerce-ink); }
.sg-orders-body .order-history-action.primary { background: var(--commerce-ink); color: var(--commerce-surface); }
.sg-order-detail-body .order-details-page { max-width: 980px; }
.sg-order-detail-body .order-details-heading { align-items: flex-start; }
.sg-order-detail-body .order-details-heading h1 { font-size: 1.35rem; }
.sg-order-detail-body .order-state-card { grid-template-columns: auto minmax(0,1fr) auto auto; padding: 18px; box-shadow: none; }
.sg-order-detail-body .order-detail-panel { box-shadow: 0 7px 22px rgba(9,29,54,.07); }
.sg-order-detail-body .order-facts>div { border-color: var(--commerce-line); }

@media (max-width: 900px) {
    .sg-commerce-body { background-image: linear-gradient(180deg,var(--commerce-canvas),var(--commerce-canvas)); }
    .sg-commerce-body .isl-topbar { margin-bottom: 18px; }
    .sg-product-body .cd-copy { padding-top: 0; }
    .sg-order-detail-body .order-state-card { grid-template-columns: auto minmax(0,1fr); }
    .sg-order-detail-body .reservation-countdown,
    .sg-order-detail-body .order-state-action { grid-column: 1 / -1; justify-self: stretch; }
}
@media (max-width: 620px) {
    .sg-catalog-body .shop,
    .sg-commerce-body .carddetail,
    .sg-commerce-body .cart-shell,
    .sg-commerce-body .checkout-shell,
    .sg-commerce-body .info-shell { width: min(100% - 22px, 1100px); }
    .sg-product-body .cd-recent-rail { grid-auto-columns: 142px; }
    .sg-product-body .cd-recent-media { height: 142px; }
    .sg-orders-body .order-history-body { grid-template-columns: minmax(0,1fr) auto; }
    .sg-orders-body .order-history-actions { grid-column: 1 / -1; }
    .sg-orders-body .order-history-action { flex: 1; }
}