/* Package-18: reusable Storefront foundation only. Page design remains page-owned. */
:root {
    --sf-primary: var(--storefront-primary, #4f46e5);
    --sf-secondary: var(--storefront-secondary, #111827);
    --sf-accent: var(--storefront-accent, #16a34a);
    --sf-surface: #ffffff;
    --sf-background: #f8fafc;
    --sf-text: #0f172a;
    --sf-muted: #64748b;
    --sf-border: #e2e8f0;
    --sf-radius-sm: 10px;
    --sf-radius-md: 16px;
    --sf-radius-lg: 22px;
}

.storefront-main-content { min-height: 50vh; }
.storefront-breadcrumb a { color: var(--sf-primary); text-decoration: none; }
.storefront-price { display: inline-flex; align-items: baseline; gap: 8px; }
.storefront-price strong { color: var(--sf-primary); }
.storefront-price del { color: var(--sf-muted); font-size: .88em; }
.storefront-status-badge { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 999px; background: #f1f5f9; color: #475569; font-size: 11px; font-weight: 800; }
.storefront-status-badge.is-success { background: #dcfce7; color: #15803d; }
.storefront-status-badge.is-warning { background: #fff7ed; color: #c2410c; }
.storefront-status-badge.is-danger { background: #fee2e2; color: #b91c1c; }
.storefront-status-badge.is-primary { background: #eef2ff; color: var(--sf-primary); }
.storefront-empty-state { padding: 48px 20px; text-align: center; color: var(--sf-muted); }
.storefront-empty-state > i { display: block; margin-bottom: 12px; color: #94a3b8; font-size: 42px; }
.storefront-empty-state h3 { margin-bottom: 7px; color: var(--sf-text); font-size: 20px; font-weight: 900; }
.storefront-empty-state p { margin: 0; }

/* Package-19 Final: shared two-colour storefront contract. */
:root {
    --sf-primary: var(--storefront-primary, #4f46e5);
    --sf-secondary: var(--storefront-secondary, #06b6d4);
    --sf-action: var(--sf-secondary);
    --sf-action-hover: color-mix(in srgb, var(--sf-secondary) 86%, #000);
}

/* Main platform and Vendor storefront both inherit their own resolved colours. */
.mc-storefront-shell,
.mc-storefront-home {
    --mc-primary: var(--storefront-primary, var(--mc-primary, #4f46e5));
    --mc-secondary: var(--storefront-secondary, var(--mc-secondary, #06b6d4));
}