marketplaces/src/app/components/footer/footer.component.html

<!-- novo VERSION - Modern Clean Footer -->
@if (isMarketplaceNovo) {

  <footer class="novo-footer">
    <div class="novo-footer-container">
      <div class="novo-footer-top">
        <div class="novo-footer-col">
          <h4>{{ brandName }}</h4>
          <p class="novo-footer-desc">{{ 'footer.description' | translate }}</p>
        </div>

        @for (group of footerGroups(); track group.id) {
          <div class="novo-footer-col">
            @if (group.title) {
              <h4>{{ group.title }}</h4>
            }
            <ul class="novo-footer-links">
              @for (item of group.items; track item.id) {
                <li>
                  <a [routerLink]="item.route | langRoute">{{ item.label | translate }}</a>
                </li>
              }
            </ul>
          </div>
        }
      </div>

      <div class="novo-footer-bottom">
        <div class="novo-copyright">
          <p>© {{ currentYear }} {{ brandName }}</p>
        </div>
        <div class="novo-payment-icons">
          <img src="/assets/images/mir-logo.svg" alt="МИР" loading="lazy" width="40" height="28" />
          <img src="/assets/images/visa-logo.svg" alt="Visa" loading="lazy" width="40" height="28" />
          <img src="/assets/images/mastercard-logo.svg" alt="Mastercard" loading="lazy" width="40" height="28" />
        </div>
      </div>
    </div>
  </footer>
} @else if (isMarketplaceLavero) {
  <!-- LAVERO VERSION -->
  <footer class="lavero-footer">
    <div class="lavero-footer-container">
      <div class="lavero-footer-top">
        <div class="lavero-footer-col lavero-footer-brand">
          <div class="lavero-footer-logo">
            <app-logo />
          </div>
          <p class="lavero-footer-desc">{{ 'footer.description' | translate }}</p>
        </div>

        @for (group of footerGroups(); track group.id) {
          <div class="lavero-footer-col">
            @if (group.title) {
              <h4>{{ group.title }}</h4>
            }
            <ul class="lavero-footer-links">
              @for (item of group.items; track item.id) {
                <li>
                  <a [routerLink]="item.route | langRoute">{{ item.label | translate }}</a>
                </li>
              }
            </ul>
          </div>
        }
      </div>

      <div class="lavero-footer-bottom">
        <div class="lavero-copyright">
          <p>© {{ currentYear }} {{ brandName }}</p>
        </div>
        <div class="lavero-payment-icons">
          <img src="/assets/images/mir-logo.svg" alt="МИР" loading="lazy" width="40" height="28" />
          <img src="/assets/images/visa-logo.svg" alt="Visa" loading="lazy" width="40" height="28" />
          <img src="/assets/images/mastercard-logo.svg" alt="Mastercard" loading="lazy" width="40" height="28" />
        </div>
      </div>
    </div>
  </footer>
} @else {
  <!-- DEXAR VERSION - Redesigned -->
  <footer class="dexar-footer">
    <div class="dexar-footer-bg">
      <div class="dexar-footer-container">
        <div class="dexar-footer-top">
          <div class="dexar-footer-logo">
            <app-logo />
          </div>
          
          <div class="dexar-footer-columns">
            @for (group of footerGroups(); track group.id) {
              <div class="dexar-footer-col">
                @if (group.title) {
                  <h4>{{ group.title }}</h4>
                }
                <ul>
                  @for (item of group.items; track item.id) {
                    <li>
                      <a [routerLink]="item.route | langRoute">{{ item.label | translate }}</a>
                    </li>
                  }
                </ul>
              </div>
            }

            <div class="dexar-footer-col">
              <h4>{{ 'footer.payment' | translate }}</h4>
              <div class="dexar-payment-logos">
                <img src="/assets/images/mir-logo.svg" alt="МИР" loading="lazy" width="48" height="32" />
                <img src="/assets/images/visa-logo.svg" alt="Visa" loading="lazy" width="48" height="32" />
                <img src="/assets/images/mastercard-logo.svg" alt="Mastercard" loading="lazy" width="48" height="32" />
              </div>
            </div>
          </div>
        </div>

        <div class="dexar-footer-bottom">
          <p>&copy; {{ currentYear }} {{ brandName }}. {{ 'footer.allRightsReserved' | translate }}</p>
        </div>
      </div>
    </div>
  </footer>
}