fix(storefront): composition audit fixes for cart, catalog, product, compare, wishlist, static pages

- Replace hand-rolled loading/error/empty markup with shared app-skeleton,
  app-empty-state, and app-button across catalog, product details, cart,
  compare, wishlist, and the public static-page renderer
- Fix hardcoded hex colors that bypassed theme CSS variables (catalog,
  product details), restoring multi-tenant theme correctness
- Remove ~1100 lines of dead "alt" cart theme CSS (never applied by the
  template) from cart.component.scss, bringing it back under the 40kB
  build budget (89.49kB -> 59.39kB cart-component chunk)
- Swap legacy global .btn/.btn-ghost/.btn-primary classes for app-button
  in compare and wishlist empty/toolbar actions

src/app/pages/static-page/static-page.component.html

@@ -1,11 +1,18 @@
 <main class="static-page page-container" [attr.dir]="dir()">
   @if (loading()) {
-    <section class="static-page__state" role="status" aria-live="polite">{{ 'app.connecting' | translate }}</section>
+    <section class="static-page__state" role="status" aria-live="polite" aria-busy="true">
+      <app-skeleton shape="text" width="40%" height="28px" />
+      <app-skeleton shape="text" height="16px" />
+      <app-skeleton shape="text" height="16px" />
+      <app-skeleton shape="text" width="70%" height="16px" />
+    </section>
   } @else if (notFound()) {
     <section class="static-page__state">
-      <h1>404</h1>
-      <p>{{ 'staticPages.notFound' | translate }}</p>
-      <a [routerLink]="homeRoute()">{{ 'staticPages.backHome' | translate }}</a>
+      <app-empty-state title="404" [description]="'staticPages.notFound' | translate">
+        <div slot="actions">
+          <app-button variant="primary" [routerLink]="homeRoute()">{{ 'staticPages.backHome' | translate }}</app-button>
+        </div>
+      </app-empty-state>
     </section>
   } @else {
     <article class="static-page__content">

src/app/pages/static-page/static-page.component.scss

@@ -3,24 +3,9 @@
 }
 
 .static-page__state {
-  text-align: center;
   padding: 2rem 0;
-  color: var(--text-secondary, #667a77);
-
-  h1 {
-    margin-bottom: 0.5rem;
-    color: var(--text-primary, #1e3c38);
-  }
-
-  a {
-    color: var(--primary-color, #497671);
-    text-decoration: none;
-
-    &:focus-visible {
-      outline: 2px solid var(--primary-color, #497671);
-      outline-offset: 2px;
-    }
-  }
+  display: grid;
+  gap: 0.75rem;
 }
 
 .static-page__content {

src/app/pages/static-page/static-page.component.ts

@@ -6,11 +6,14 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { StaticPageResolverService } from '../../core/config/static-page-resolver.service';
 import { LanguageService } from '../../services/language.service';
 import { TranslatePipe } from '../../i18n/translate.pipe';
+import { EmptyStateComponent } from '../../shared/ui/empty-state/empty-state.component';
+import { SkeletonComponent } from '../../shared/ui/skeleton/skeleton.component';
+import { ButtonComponent } from '../../shared/ui/button/button.component';
 
 @Component({
   selector: 'app-static-page',
   standalone: true,
-  imports: [CommonModule, RouterLink, TranslatePipe],
+  imports: [CommonModule, RouterLink, TranslatePipe, EmptyStateComponent, SkeletonComponent, ButtonComponent],
   templateUrl: './static-page.component.html',
   styleUrls: ['./static-page.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush