/* SpaCart storefront design system - content layer (docs/design/storefront.md).
 * Auth (login, register, password, email verification), help and contact,
 * CMS pages, blog, news, testimonials, brands, seller storefront, status
 * pages, store closure and session alerts. Builds on sf-base.css tokens. */

/* Shared page frame for content surfaces */
:is(.content-surface, .static-page, .seller-profile-page, .extension-page, .status-page, .auth-page) { display: block; padding-block: var(--sf-s4) var(--sf-s7); }
@media (min-width: 900px) { :is(.content-surface, .static-page, .seller-profile-page, .extension-page) { padding-block: var(--sf-s5) var(--sf-s8); } }

.content-list-header {
	display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--sf-s3) var(--sf-s4); margin-bottom: var(--sf-s5);
}
:is(.sf-content-head, .content-list-header, .content-page-header) h1 { margin: 0; }
.sf-content-head, .content-page-header { margin-bottom: var(--sf-s5); }
:is(.sf-content-head, .content-page-header) > p { max-width: 62ch; margin: var(--sf-s2) 0 0; color: var(--sf-muted); font-size: var(--sf-fs-md); }
.content-kicker { margin: 0 0 var(--sf-s2); font-size: var(--sf-fs-sm); font-weight: 600; color: var(--sf-muted); }
.content-kicker a { color: inherit; text-decoration: none; }
.content-kicker a:hover { color: var(--sf-ink); text-decoration: underline; }
.content-empty:not(.sf-empty) { color: var(--sf-muted); }
.content-empty.sf-empty { padding-block: var(--sf-s7); }
.content-empty.sf-empty p { max-width: 46ch; }
.content-empty.sf-empty .sf-btn { margin-top: var(--sf-s3); }

/* Auth: one focused card */
.auth-page { display: grid; justify-items: center; padding-block: var(--sf-s5) var(--sf-s7); }
@media (min-width: 600px) { .auth-page { padding-block: var(--sf-s7) var(--sf-s8); } }
.sf-auth-card {
	width: min(440px, 100%); padding: var(--sf-s6); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card);
}
.sf-auth-card--wide { width: min(560px, 100%); }
@media (max-width: 599px) {
	.auth-page { padding-block: var(--sf-s3) var(--sf-s6); }
	.sf-auth-card { padding: var(--sf-s5) var(--sf-s4); }
}
.sf-auth-head { margin-bottom: var(--sf-s5); }
.sf-auth-head h1 { margin: 0; font-size: var(--sf-fs-xl); }
@media (min-width: 900px) { .sf-auth-head h1 { font-size: 28px; } }
.sf-auth-store { margin: 0 0 var(--sf-s2); font-family: var(--sf-font-display); font-weight: 700; font-size: var(--sf-fs-sm); color: var(--sf-brand-strong); }
.sf-auth-lead { margin: var(--sf-s2) 0 0; color: var(--sf-muted); }
.sf-auth-card form { margin: 0; }
.sf-auth-card .sf-field label, .sf-auth-label-row label { margin-bottom: 6px; }
.sf-auth-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sf-s3); }
.sf-auth-label-row label { margin-bottom: 6px; }
.sf-auth-forgot { font-size: var(--sf-fs-sm); font-weight: 600; white-space: nowrap; }
.sf-auth-group { margin-bottom: var(--sf-s4); }
.sf-auth-group + .sf-auth-group { margin-top: var(--sf-s5); }
.sf-auth-group legend { font-size: var(--sf-fs-base); }
.sf-auth-group .sf-form-row { gap: 0 var(--sf-s4); }
.sf-auth-card .sf-btn--block { margin-top: var(--sf-s2); }
.sf-auth-loading { margin: 0 0 var(--sf-s3); font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.sf-auth-card noscript .sf-notice { margin-top: 0; }
.sf-auth-switch { margin: var(--sf-s5) 0 0; padding-top: var(--sf-s4); border-top: 1px solid var(--sf-line); text-align: center; color: var(--sf-muted); }
.sf-auth-switch a { font-weight: 650; }
.sf-auth-note { margin: var(--sf-s4) 0 0; padding: var(--sf-s3) var(--sf-s4); border-radius: var(--sf-r-control); background: var(--sf-canvas); color: var(--sf-muted); font-size: var(--sf-fs-sm); }
.password-renewal { margin-top: var(--sf-s5); padding-top: var(--sf-s4); border-top: 1px solid var(--sf-line); font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.password-renewal p { margin-bottom: var(--sf-s2); }
.auth-page [data-registration-next-step] { margin-bottom: var(--sf-s4); }
.sf-auth-card .g-recaptcha { margin-bottom: var(--sf-s4); }

/* Password visibility toggle (common/password_reveal.php) */
.sf-password { position: relative; }
.sf-password input { padding-right: 52px; }
.sf-password-toggle {
	position: absolute; top: 50%; right: 2px; transform: translateY(-50%); width: 44px; height: 40px; display: grid; place-items: center;
	padding: 0; border: 0; border-radius: var(--sf-r-control); background: transparent; color: var(--sf-muted);
}
.sf-password-toggle:hover { color: var(--sf-ink); background: var(--sf-subtle); }
.sf-password-toggle .sf-password-slash { display: none; }
.sf-password-toggle[aria-pressed="true"] { color: var(--sf-ink); }
.sf-password-toggle[aria-pressed="true"] .sf-password-slash { display: inline; }

/* Inline form feedback driven by commerce.js */
.register-email-error, .password-status.is-visible, .contact-form-status:not(:empty) {
	margin: 0 0 var(--sf-s4); padding: var(--sf-s3) var(--sf-s4); border: 1px solid var(--sf-line); border-left-width: 4px; border-radius: var(--sf-r-control);
	font-size: var(--sf-fs-sm); font-weight: 500; color: var(--sf-text);
}
.register-email-error, .password-status.is-error, .contact-form-status.is-error { border-left-color: var(--sf-danger); background: var(--sf-danger-soft); }
.password-status.is-visible:not(.is-error), .contact-form-status.is-success { border-left-color: var(--sf-positive); background: var(--sf-positive-soft); }
.register-email-error a { margin-left: 4px; font-weight: 650; }
.register-email-error:empty { display: none; }
.password-status:not(.is-visible), .password-status:empty { display: none; }

/* Help, contact and CMS pages: content + service navigation */
.service-layout { display: grid; gap: var(--sf-s5); align-items: start; }
@media (min-width: 900px) { .service-layout:has(> .service-navigation) { grid-template-columns: minmax(0, 1fr) 280px; gap: var(--sf-s6); } }
.service-layout:not(:has(> .service-navigation)) > .service-main { max-width: 820px; }
.static-page .service-main { padding: var(--sf-s6); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
@media (max-width: 599px) { .static-page .service-main { padding: var(--sf-s5) var(--sf-s4); } }
.static-page .service-main > h1 { margin-bottom: var(--sf-s5); padding-bottom: var(--sf-s4); border-bottom: 1px solid var(--sf-line); }
.service-navigation { padding: var(--sf-s4); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
@media (min-width: 900px) { .service-navigation { position: sticky; top: var(--sf-s5); } }
.service-navigation h2 { margin: 0 0 var(--sf-s2); padding: 0 var(--sf-s3); font-size: var(--sf-fs-sm); color: var(--sf-muted); font-weight: 650; }
.service-navigation ul { margin: 0; padding: 0; list-style: none; }
.service-navigation a { display: flex; align-items: center; min-height: 40px; padding: 6px var(--sf-s3); border-radius: var(--sf-r-control); color: var(--sf-ink); font-weight: 500; text-decoration: none; }
.service-navigation a:hover { background: var(--sf-subtle); color: var(--sf-ink); }
.service-navigation a[aria-current="page"] { background: var(--sf-brand-soft); color: var(--sf-brand-strong); font-weight: 650; box-shadow: inset 3px 0 0 var(--sf-brand); }
.service-navigation .service-contact-link { margin-top: var(--sf-s2); padding-top: var(--sf-s2); border-top: 1px solid var(--sf-line); border-radius: 0 0 var(--sf-r-control) var(--sf-r-control); }
.contact-page .service-main > * + * { margin-top: var(--sf-s4); }
.contact-product-context { padding: var(--sf-s4); border: 1px solid var(--sf-line); border-left: 4px solid var(--sf-brand); border-radius: var(--sf-r-control); background: var(--sf-surface); }
.contact-product-context .sf-eyebrow { display: block; margin-bottom: 4px; }
.contact-product-name { font-family: var(--sf-font-display); font-weight: 700; font-size: var(--sf-fs-md); text-decoration: none; }
.contact-product-context p { margin: 4px 0 0; font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.contact-page .content-form textarea { min-height: 180px; }

/* Readable prose: CMS, articles, brand descriptions, seller copy */
.static-page .static, .content-rich, .brand-description, .seller-profile-description {
	max-width: 68ch; font-size: 16px; line-height: 1.7; color: var(--sf-text); overflow-wrap: anywhere;
}
:is(.static-page .static, .content-rich, .brand-description) :is(h2, h3, h4) { margin: 1.6em 0 .5em; }
:is(.static-page .static, .content-rich, .brand-description) h2 { font-size: var(--sf-fs-lg); }
:is(.static-page .static, .content-rich, .brand-description) h3 { font-size: var(--sf-fs-md); }
:is(.static-page .static, .content-rich, .brand-description, .seller-profile-description) > :first-child { margin-top: 0; }
:is(.static-page .static, .content-rich, .brand-description, .seller-profile-description) > :last-child { margin-bottom: 0; }
:is(.static-page .static, .content-rich, .brand-description) :is(p, ul, ol) { margin-bottom: 1em; }
:is(.static-page .static, .content-rich, .brand-description) :is(ul, ol) { padding-left: 1.4em; }
:is(.static-page .static, .content-rich, .brand-description) h4 { font-size: var(--sf-fs-base); }
:is(.static-page .static, .content-rich, .brand-description) :is(sup, sub) { font-size: .75em; line-height: 0; }
:is(.static-page .static, .content-rich, .brand-description) li + li { margin-top: .35em; }
:is(.static-page .static, .content-rich, .brand-description) img { max-width: 100%; height: auto; margin-block: var(--sf-s5); border-radius: var(--sf-r-media); }
:is(.static-page .static, .content-rich, .brand-description) figure { margin: var(--sf-s5) 0; }
:is(.static-page .static, .content-rich, .brand-description) figure img { margin-block: 0; }
:is(.static-page .static, .content-rich, .brand-description) figcaption { margin-top: var(--sf-s2); font-size: var(--sf-fs-sm); color: var(--sf-muted); }
:is(.static-page .static, .content-rich, .brand-description) hr { margin-block: var(--sf-s6); border: 0; border-top: 1px solid var(--sf-line); }
:is(.static-page .static, .content-rich, .brand-description) blockquote { margin: var(--sf-s5) 0; padding-left: var(--sf-s4); border-left: 3px solid var(--sf-line-strong); color: var(--sf-muted); }
/* Tables scroll in their own box; words never break mid-word (the prose's overflow-wrap stops at cells). */
:is(.static-page .static, .content-rich, .brand-description) table { display: block; overflow-x: auto; width: max-content; max-width: 100%; margin-block: var(--sf-s5); border-collapse: collapse; font-size: var(--sf-fs-sm); line-height: 1.5; overscroll-behavior-x: contain; }
:is(.static-page .static, .content-rich, .brand-description) :is(th, td) { padding: var(--sf-s2) var(--sf-s3); border: 1px solid var(--sf-line); text-align: left; vertical-align: top; overflow-wrap: normal; word-break: normal; hyphens: manual; }
:is(.static-page .static, .content-rich, .brand-description) th { background: var(--sf-subtle); color: var(--sf-ink); font-weight: 650; white-space: nowrap; }
:is(.static-page .static, .content-rich, .brand-description) a { color: var(--sf-ink); font-weight: 600; }

/* Blog and news */
.content-grid, .spacart-home-story-grid { display: grid; gap: var(--sf-s4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { .content-grid, .spacart-home-story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 900px) { .content-grid, .spacart-home-story-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sf-s5); } }
.content-card { display: flex; flex-direction: column; overflow: hidden; background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
.content-card-media { display: block; aspect-ratio: 16 / 10; background: var(--sf-subtle); overflow: hidden; }
.content-card-media img { width: 100%; height: 100%; object-fit: cover; }
.content-card-media--empty { display: grid; place-items: center; color: var(--sf-line-strong); }
.content-card-body { display: flex; flex: 1; flex-direction: column; gap: var(--sf-s2); padding: var(--sf-s4); }
.content-card-body > * { margin: 0; }
.content-card-body time { font-size: var(--sf-fs-xs); font-weight: 600; color: var(--sf-muted); }
.content-card :is(h2, h3) { font-size: var(--sf-fs-md); line-height: 1.25; }
.content-card :is(h2, h3) a { color: var(--sf-ink); text-decoration: none; }
.content-card :is(h2, h3) a:hover { text-decoration: underline; }
.content-card-body p { color: var(--sf-muted); font-size: var(--sf-fs-sm); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.content-link { margin-top: auto; padding-top: var(--sf-s2); font-size: var(--sf-fs-sm); font-weight: 650; color: var(--sf-ink); text-decoration: underline; text-decoration-color: var(--sf-line-strong); text-underline-offset: 3px; }
.content-link:hover { color: var(--sf-brand-strong); text-decoration-color: currentColor; }
.content-search { display: flex; gap: var(--sf-s2); width: min(360px, 100%); margin: 0; }
.content-search input { min-width: 0; }
.content-surface .navigation { margin-top: var(--sf-s6); }

.content-article, .content-comments { max-width: 760px; margin-inline: auto; }
.content-article-header { margin-bottom: var(--sf-s5); }
.content-article-header h1 { margin-bottom: var(--sf-s3); }
@media (min-width: 900px) { .content-article-header h1 { font-size: var(--sf-fs-3xl); } }
.content-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px var(--sf-s3); font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.content-meta > * + *::before { content: ""; display: inline-block; width: 4px; height: 4px; margin-right: var(--sf-s3); border-radius: 50%; background: var(--sf-line-strong); vertical-align: middle; }
.content-meta strong { color: var(--sf-ink); }
.content-cover { width: 100%; max-height: 460px; object-fit: cover; margin-bottom: var(--sf-s6); border-radius: var(--sf-r-card); background: var(--sf-subtle); }
.content-article .content-rich { max-width: none; }
.content-article-foot { margin-top: var(--sf-s6); }
.content-comments { margin-top: var(--sf-s7); padding-top: var(--sf-s6); border-top: 1px solid var(--sf-line); }
.content-comments > h2 { display: flex; align-items: center; gap: var(--sf-s2); }
.content-count { display: inline-grid; place-items: center; min-width: 28px; height: 28px; padding: 0 8px; border-radius: var(--sf-r-pill); background: var(--sf-subtle); font-size: var(--sf-fs-sm); font-variant-numeric: tabular-nums; }
.comment-list { margin-bottom: var(--sf-s5); }
.comment-item { padding-block: var(--sf-s4); border-bottom: 1px solid var(--sf-line); }
.comment-item p { margin: var(--sf-s2) 0 0; }
.content-comments .content-form { margin-top: var(--sf-s5); }
.content-form h2 { font-size: var(--sf-fs-lg); }
.content-form .sf-form-row { gap: 0 var(--sf-s4); }
.content-form-narrow { max-width: 640px; }
.content-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sf-s3); }
.content-form-actions .contact-form-status:not(:empty) { flex: 1 1 240px; margin: 0; }

/* Testimonials */
.testimonial-grid { display: grid; gap: var(--sf-s4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 600px) { .testimonial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1200px) { .testimonial-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sf-s5); } }
.testimonial-card { display: flex; flex-direction: column; gap: var(--sf-s3); margin: 0; padding: var(--sf-s5); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
.testimonial-rating { display: flex; gap: 2px; font-size: 18px; line-height: 1; color: var(--sf-line-strong); }
.testimonial-rating .is-on { color: var(--sf-warning); }
.testimonial-card blockquote { flex: 1; margin: 0; color: var(--sf-text); font-size: var(--sf-fs-md); line-height: 1.55; }
/* Same caption with or without a title: the footer sits at the bottom and keeps its height. */
.testimonial-card figcaption { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: start; gap: var(--sf-s3); margin-top: auto; padding-top: var(--sf-s3); border-top: 1px solid var(--sf-line); font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.testimonial-avatar { width: 40px; height: 40px; display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: var(--sf-subtle); font-family: var(--sf-font-display); font-weight: 700; font-size: var(--sf-fs-sm); color: var(--sf-ink); }
.testimonial-avatar img { width: 100%; height: 100%; object-fit: cover; }
.testimonial-author { display: grid; gap: 2px; min-width: 0; }
.testimonial-author strong { color: var(--sf-ink); }
.testimonial-author-title { min-height: 1.55em; min-height: 1lh; }
.testimonial-card figcaption time { font-size: var(--sf-fs-xs); }
.content-surface-testimonials .content-list-header .sf-btn { flex: none; }

/* Home editorial sections (home/news.php, blog.php, testimonial.php) */
.spacart-home-section > header a { font-size: var(--sf-fs-sm); font-weight: 600; color: var(--sf-ink); white-space: nowrap; }
.spacart-home-blog { display: grid; overflow: hidden; background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
@media (min-width: 900px) { .spacart-home-blog { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } }
.spacart-home-blog-media { display: block; aspect-ratio: 16 / 10; width: 100%; overflow: hidden; background: var(--sf-subtle); }
.spacart-home-blog-media img { width: 100%; height: 100%; object-fit: cover; }
.spacart-home-blog-body { display: flex; flex-direction: column; gap: var(--sf-s3); padding: var(--sf-s5); }
.spacart-home-blog-body > * { margin: 0; }
.spacart-home-blog h3 { font-size: var(--sf-fs-lg); }
.spacart-home-blog h3 a { text-decoration: none; }
.spacart-home-blog-body p { color: var(--sf-muted); }
.spacart-home-testimonial blockquote { margin: 0; padding: var(--sf-s6); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
.spacart-home-testimonial blockquote p { max-width: 60ch; margin: 0 0 var(--sf-s4); font-family: var(--sf-font-display); font-weight: 600; font-size: var(--sf-fs-lg); line-height: 1.4; color: var(--sf-ink); }
.spacart-home-testimonial footer { display: grid; gap: 2px; font-size: var(--sf-fs-sm); color: var(--sf-muted); }

/* Design Studio rich text block (pages/home.php core.rich-text: width narrow|wide, align left|center) */
.spacart-home-rich { box-sizing: border-box; width: 100%; min-width: 0; margin-block: var(--sf-s6); overflow-wrap: anywhere; }
@media (min-width: 900px) { .spacart-home-rich { margin-block: var(--sf-s7); } }
.spacart-home-rich--narrow { max-width: 68ch; }
.spacart-home-rich--wide { max-width: none; }
.spacart-home-rich--center { margin-inline: auto; text-align: center; }
.spacart-home-rich h2 { margin: 0 0 var(--sf-s3); }
.spacart-home-rich p { max-width: 68ch; margin: 0; color: var(--sf-text); font-size: var(--sf-fs-md); line-height: 1.6; }
.spacart-home-rich--center p { margin-inline: auto; }

/* Brands */
.brand-directory { display: grid; gap: var(--sf-s3); grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); margin: 0; padding: 0; list-style: none; }
.brand-directory a {
	display: flex; align-items: center; gap: var(--sf-s3); min-height: 64px; padding: var(--sf-s3) var(--sf-s4);
	background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); color: var(--sf-ink); font-weight: 600; text-decoration: none;
	transition: border-color var(--sf-fast) var(--sf-ease);
}
.brand-directory a:hover { border-color: var(--sf-ink); color: var(--sf-ink); }
.brand-monogram { flex: none; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: var(--sf-subtle); font-family: var(--sf-font-display); font-weight: 700; color: var(--sf-ink); }
.brand-logo { flex: none; width: 56px; height: 56px; display: grid; place-items: center; padding: 4px; overflow: hidden; background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-control); }
.brand-logo img { width: 100%; height: 100%; object-fit: contain; }
.brand-logo--lg { width: 96px; height: 96px; padding: var(--sf-s2); border-radius: var(--sf-r-card); }
.brand-header { justify-content: flex-start; align-items: center; }
.brand-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brand-description { margin-bottom: var(--sf-s6); }
.brand-products > h2 { margin-bottom: var(--sf-s4); }

/* Seller storefront */
.seller-profile-cover { margin: 0 0 var(--sf-s4); overflow: hidden; aspect-ratio: 3 / 1; border-radius: var(--sf-r-card); background: var(--sf-subtle); }
@media (min-width: 900px) { .seller-profile-cover { aspect-ratio: 5 / 1; } }
.seller-profile-cover img { width: 100%; height: 100%; object-fit: cover; }
.seller-profile-header {
	display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--sf-s4) var(--sf-s5);
	padding: var(--sf-s5); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card);
}
@media (max-width: 599px) { .seller-profile-header { padding: var(--sf-s4); } }
.seller-profile-identity { display: flex; align-items: center; gap: var(--sf-s4); min-width: 0; }
.seller-profile-logo { flex: none; width: 88px; height: 88px; object-fit: contain; padding: 6px; background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
@media (max-width: 599px) { .seller-profile-logo { width: 64px; height: 64px; } }
.seller-profile-titles { display: grid; gap: 2px; min-width: 0; }
.seller-profile-kicker { font-size: var(--sf-fs-sm); font-weight: 600; color: var(--sf-muted); }
.seller-profile-titles h1 { margin: 0; overflow-wrap: anywhere; }
.seller-profile-tagline { margin: 2px 0 0; font-size: var(--sf-fs-md); color: var(--sf-text); }
.seller-profile-legal-name { font-size: var(--sf-fs-xs); color: var(--sf-muted); }
.seller-profile-actions { display: flex; flex-wrap: wrap; gap: var(--sf-s2); }
.seller-profile-header--dark { background: var(--sf-ink); border-color: var(--sf-ink); }
.seller-profile-header--dark :is(h1, .seller-profile-tagline) { color: #fff; }
.seller-profile-header--dark :is(.seller-profile-kicker, .seller-profile-legal-name) { color: #c9cfd6; }
.seller-profile-header--brand { background: var(--sf-brand); border-color: var(--sf-brand); }
.seller-profile-header--brand :is(h1, .seller-profile-tagline, .seller-profile-kicker, .seller-profile-legal-name) { color: var(--sf-on-brand); }
:is(.seller-profile-header--dark, .seller-profile-header--brand) .sf-chip { border-color: transparent; }

.seller-profile-banners { display: grid; gap: var(--sf-s4); margin-top: var(--sf-s4); }
@media (min-width: 900px) { .seller-profile-banners { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.seller-profile-banner { position: relative; overflow: hidden; border-radius: var(--sf-r-card); background: var(--sf-subtle); }
.seller-profile-banner a { display: block; color: inherit; text-decoration: none; }
.seller-profile-banner img { width: 100%; aspect-ratio: 16 / 6; object-fit: cover; }
.seller-profile-banner strong { display: block; padding: var(--sf-s3) var(--sf-s4); background: var(--sf-surface); border: 1px solid var(--sf-line); border-top: 0; border-radius: 0 0 var(--sf-r-card) var(--sf-r-card); }

/* Seller reputation plugin block, aligned on the design system */
.seller-profile-page .spacart-seller-reputation { margin-top: var(--sf-s4); padding: var(--sf-s5); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); color: var(--sf-text); }
@media (max-width: 599px) { .seller-profile-page .spacart-seller-reputation { padding: var(--sf-s4); } }
.seller-profile-page .spacart-seller-reputation-heading { align-items: flex-start; }
.seller-profile-page .spacart-seller-reputation-heading h2 { font-size: var(--sf-fs-md); }
.seller-profile-page .spacart-seller-reputation-heading h2 a { text-decoration: none; color: var(--sf-ink); }
.seller-profile-page .spacart-seller-reputation-kicker { text-transform: none; font-size: var(--sf-fs-sm); font-weight: 600; color: var(--sf-muted); letter-spacing: 0; }
.seller-profile-page .spacart-seller-rating { color: var(--sf-ink); font-family: var(--sf-font-display); font-variant-numeric: tabular-nums; }
.seller-profile-page .spacart-seller-rating span { color: var(--sf-muted); font-weight: 600; }
.seller-profile-page .spacart-seller-reputation-metrics { margin: var(--sf-s3) 0; gap: var(--sf-s2) var(--sf-s5); font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.seller-profile-page .spacart-seller-reputation-metrics strong { font-family: var(--sf-font-display); color: var(--sf-ink); }
.seller-profile-page .spacart-seller-reputation .product-auth-callout { margin: 0; padding: var(--sf-s3) var(--sf-s4); border-radius: var(--sf-r-control); background: var(--sf-canvas); font-size: var(--sf-fs-sm); }
.seller-profile-page .spacart-seller-reputation button { min-height: var(--sf-control-h-sm); border-radius: var(--sf-r-control); border-color: var(--sf-brand); background: var(--sf-brand); color: var(--sf-on-brand); font-weight: 600; }
.seller-profile-page .spacart-seller-review-list { margin-top: var(--sf-s4); border-top: 1px solid var(--sf-line); }
.seller-profile-page .spacart-seller-review-list article { padding-block: var(--sf-s4) 0; }
.seller-profile-page .spacart-seller-review-list h3 { margin: 4px 0; font-size: var(--sf-fs-base); }
.seller-profile-page .spacart-seller-review-list p { margin: 0; color: var(--sf-text); }
.seller-profile-page .spacart-seller-review-meta { justify-content: flex-start; font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.seller-profile-page .spacart-seller-review-meta strong { font-family: var(--sf-font-display); color: var(--sf-ink); }

.seller-profile-products { margin-top: var(--sf-s6); scroll-margin-top: var(--sf-s5); }
.seller-profile-section-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sf-s2) var(--sf-s3); margin-bottom: var(--sf-s3); }
.seller-profile-section-heading h2 { margin: 0; }
.seller-profile-section-heading span { font-size: var(--sf-fs-sm); color: var(--sf-muted); }
.seller-catalogue-search { margin: 0 0 var(--sf-s5); }
.seller-catalogue-search-row { display: flex; flex-wrap: wrap; gap: var(--sf-s2); max-width: 560px; }
.seller-catalogue-search-row input { flex: 1 1 220px; min-width: 0; width: auto; }
.seller-catalogue-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--sf-s2) var(--sf-s3); margin-top: var(--sf-s6); font-size: var(--sf-fs-sm); }
.seller-catalogue-pagination > span { color: var(--sf-muted); font-variant-numeric: tabular-nums; }
.seller-profile-info { display: grid; gap: var(--sf-s4); margin-top: var(--sf-s7); }
@media (min-width: 900px) { .seller-profile-info { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sf-s5); } }
.seller-profile-about, .seller-profile-policy { padding: var(--sf-s5); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); scroll-margin-top: var(--sf-s5); }
@media (max-width: 599px) { .seller-profile-about, .seller-profile-policy { padding: var(--sf-s4); } }
:is(.seller-profile-about, .seller-profile-policy) h2 { font-size: var(--sf-fs-lg); }
.seller-profile-description { font-size: var(--sf-fs-base); }
.seller-profile-contact { display: grid; gap: var(--sf-s2); margin-top: var(--sf-s4); padding-top: var(--sf-s4); border-top: 1px solid var(--sf-line); font-size: var(--sf-fs-sm); }
.seller-profile-contact > a { font-weight: 600; width: fit-content; }
.seller-profile-contact > span { color: var(--sf-muted); }
.seller-profile-contact nav { display: flex; flex-wrap: wrap; gap: var(--sf-s2); margin-top: var(--sf-s2); }

/* Status pages: 404, retired routes, extension errors */
.status-page { max-width: 560px; margin-inline: auto; padding-block: var(--sf-s7) var(--sf-s8); text-align: center; }
.status-page h1 { margin-bottom: var(--sf-s3); }
.status-page > p { color: var(--sf-muted); font-size: var(--sf-fs-md); }
.status-page .status-page-code { margin: 0 0 var(--sf-s2); font-family: var(--sf-font-display); font-weight: 700; font-size: var(--sf-fs-sm); color: var(--sf-brand-strong); }
.status-page-search { display: flex; gap: var(--sf-s2); max-width: 440px; margin: var(--sf-s5) auto 0; }
.status-page-search input { flex: 1; min-width: 0; }
.status-page-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sf-s2) var(--sf-s3); margin-top: var(--sf-s5); }

/* Extension pages */
.extension-page-content { min-width: 0; }

/* Store closure (closed.php, closed_header.php) */
.store-service-header { background: var(--sf-surface); border-bottom: 1px solid var(--sf-line); }
.store-service-inner { width: var(--sf-container); margin-inline: auto; }
.store-service-header .store-service-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sf-s2) var(--sf-s4); min-height: 64px; padding-block: var(--sf-s2); }
.store-service-brand { font-family: var(--sf-font-display); font-weight: 800; font-size: 21px; letter-spacing: -.02em; color: var(--sf-ink); text-decoration: none; }
.store-service-header nav { display: flex; flex-wrap: wrap; gap: var(--sf-s1) var(--sf-s4); }
.store-service-header nav a { display: inline-flex; align-items: center; min-height: 44px; font-weight: 600; font-size: var(--sf-fs-sm); color: var(--sf-ink); text-decoration: none; }
.store-service-header nav a:hover { text-decoration: underline; }
.store-service-status { padding-block: var(--sf-s2); background: var(--sf-warning-soft); border-bottom: 1px solid color-mix(in srgb, var(--sf-warning) 25%, #fff); color: var(--sf-ink); font-size: var(--sf-fs-sm); font-weight: 500; }
.store-closure { display: grid; justify-items: center; max-width: 600px; margin: var(--sf-s6) auto var(--sf-s8); padding: var(--sf-s7) var(--sf-s5); text-align: center; background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
@media (max-width: 599px) { .store-closure { margin-top: var(--sf-s4); padding: var(--sf-s6) var(--sf-s4); } }
.store-closure-icon { width: 56px; height: 56px; display: grid; place-items: center; margin-bottom: var(--sf-s4); border-radius: 50%; background: var(--sf-brand-soft); color: var(--sf-brand-strong); }
.store-closure .store-closure-icon svg { width: 28px; height: 28px; }
.store-closure-eyebrow { margin: 0 0 var(--sf-s2); font-size: var(--sf-fs-sm); font-weight: 600; color: var(--sf-muted); }
.store-closure h1 { margin-bottom: var(--sf-s3); }
.store-closure-copy { max-width: 48ch; color: var(--sf-muted); }
.store-closure-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--sf-s3); margin-top: var(--sf-s2); }
.store-closure-guest { margin: var(--sf-s4) 0 0; font-size: var(--sf-fs-sm); }

/* Session alerts (ajax_container.php) */
.alerts { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--sf-s2) var(--sf-s3); margin-block: var(--sf-s4); }
.sf-notice-list { flex: 1 1 320px; margin: 0; padding: 0; list-style: none; }
.sf-notice-list .sf-notice { margin-bottom: var(--sf-s2); }
.sf-notice-list .sf-notice:last-child { margin-bottom: 0; }
.sf-notice-list .sf-notice strong { color: var(--sf-danger); }
.alerts .close_alert[data-alerts-dismiss] { display: inline-flex; flex: none; }

/* ---------- Promotions (plugins/promotions-ui) ---------- */
.spacart-promo-bar { position: relative; display: flex; align-items: center; justify-content: center; min-height: 38px; padding: 6px 48px 6px var(--sf-s4); background: var(--spacart-promo-bg, var(--sf-ink)); color: var(--spacart-promo-text, #fff); font-size: var(--sf-fs-sm); }
.spacart-promo-bar > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--sf-s2) var(--sf-s4); }
.spacart-promo-bar a, .spacart-promo-custom-alert a { color: inherit; font-weight: 700; }
:is(.spacart-promo-bar, .spacart-promo-popup, .spacart-promo-custom-alert, .spacart-promo-sale-alert, .spacart-promo-smartbar) [data-spacart-promotion-dismiss] { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 50%; background: transparent; color: inherit; font-size: 22px; line-height: 1; cursor: pointer; }
.spacart-promo-bar [data-spacart-promotion-dismiss] { position: absolute; right: var(--sf-s2); top: 50%; transform: translateY(-50%); }
.spacart-promo-popup { position: fixed; inset: 0; z-index: 1350; padding: var(--sf-s5); background: rgba(20, 23, 28, .55); }
.spacart-promo-popup:not([hidden]) { display: flex; align-items: center; justify-content: center; }
body.spacart-promo-modal-open { overflow: hidden; }
.spacart-promo-popup__panel { position: relative; width: min(100%, 560px); max-height: calc(100vh - 48px); overflow: auto; padding: var(--sf-s6); background: var(--spacart-promo-panel-bg, var(--sf-surface)); color: var(--spacart-promo-panel-text, var(--sf-ink)); border-radius: var(--sf-r-card); box-shadow: var(--sf-shadow-pop); }
.spacart-promo-popup__panel > picture { display: block; margin: calc(-1 * var(--sf-s6)) calc(-1 * var(--sf-s6)) var(--sf-s5); }
.spacart-promo-popup__panel > picture img { width: 100%; height: auto; object-fit: cover; border-radius: var(--sf-r-card) var(--sf-r-card) 0 0; }
.spacart-promo-popup__panel > [data-spacart-promotion-dismiss] { position: absolute; right: var(--sf-s2); top: var(--sf-s2); z-index: 1; background: var(--sf-surface); }
.spacart-promo-subscribe { display: flex; flex-wrap: wrap; gap: var(--sf-s2); margin-top: var(--sf-s4); }
.spacart-promo-subscribe input { flex: 1; min-width: 0; }
.spacart-promo-subscribe__status { flex-basis: 100%; font-size: var(--sf-fs-sm); }
.spacart-promo-smartbar { position: fixed; z-index: 1000; left: 0; right: 0; bottom: 0; display: flex; align-items: center; justify-content: center; gap: var(--sf-s4); padding: var(--sf-s3) var(--sf-s4) calc(var(--sf-s3) + env(safe-area-inset-bottom)); background: var(--sf-surface); border-top: 1px solid var(--sf-line); box-shadow: var(--sf-shadow-sticky); }
.spacart-promo-smartbar > div { display: grid; gap: 2px; min-width: 0; }
.spacart-promo-smartbar strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spacart-promo-sale-alert, .spacart-promo-custom-alert { position: fixed; z-index: 990; bottom: 88px; display: grid; gap: 4px; max-width: min(380px, calc(100vw - 32px)); padding: var(--sf-s4) 48px var(--sf-s4) var(--sf-s4); border-radius: var(--sf-r-card); box-shadow: var(--sf-shadow-pop); font-size: var(--sf-fs-sm); }
.spacart-promo-sale-alert { left: var(--sf-s4); background: var(--sf-surface); border: 1px solid var(--sf-line); color: var(--sf-ink); }
.spacart-promo-custom-alert { right: var(--sf-s4); background: var(--spacart-promo-bg, var(--sf-ink)); color: var(--spacart-promo-text, #fff); }
:is(.spacart-promo-custom-alert, .spacart-promo-sale-alert) [data-spacart-promotion-dismiss] { position: absolute; right: 4px; top: 4px; }
@media (max-width: 759px) {
	.spacart-promo-smartbar { justify-content: space-between; }
	.spacart-promo-smartbar > div { max-width: 50%; }
	.spacart-promo-custom-alert, .spacart-promo-sale-alert { bottom: calc(96px + env(safe-area-inset-bottom)); }
}
[data-spacart-promotion="flash-deals"] .spacart-home-section > header h2::after { content: ""; display: block; width: 40px; height: 3px; margin-top: 8px; border-radius: 2px; background: var(--sf-danger); }

/* ---------- Extension panels (challenge, account/checkout/login blocks) ---------- */
.spacart-extension-panel { margin: var(--sf-s5) 0 0; padding: var(--sf-s5); background: var(--sf-surface); border: 1px solid var(--sf-line); border-radius: var(--sf-r-card); }
.spacart-extension-panel :is(h2, h3) { margin: 0 0 var(--sf-s2); font-size: var(--sf-fs-lg); }
.spacart-extension-panel p { color: var(--sf-muted); }
.spacart-extension-panel label { display: grid; gap: 6px; margin: var(--sf-s3) 0; }
.spacart-extension-panel input { max-width: 440px; }
.spacart-challenge-actions { display: grid; gap: var(--sf-s3); justify-items: start; }
.spacart-challenge-actions [data-challenge-verify] { width: 100%; }
.spacart-challenge-status { min-height: 24px; margin-top: var(--sf-s3); font-weight: 600; }

/* ---------- jQuery UI tooltip (widgets) ---------- */
.ui-tooltip { position: absolute; z-index: 1400; max-width: 300px; padding: 6px 10px; background: var(--sf-ink); color: #fff; border-radius: 6px; font-size: var(--sf-fs-xs); box-shadow: var(--sf-shadow-pop); }
.ui-helper-hidden-accessible { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }