@use 'sass:list';
@use 'sass:map';
@use '../../base/variable' as v;
@use '../../abstract';
@use '../../sprite';

$logos: (
  'commerce': (
    sprite.$logo-commerce,
  ),
  'commerce-white': (
    sprite.$logo-commerce-white,
  ),
);

.cds-logo {
  $this: &;

  display: inline-block;
  vertical-align: top;
  @include abstract.bg2x-sprite();

  // commerce home으로 가는 로고
  // m, commerce sprite data를 가져옴
  // black: header, sitemap에서 사용
  // ============================================
  &__ci-black {
    $ci-sprite: map.get($logos, 'commerce');
    @include abstract.sprite2x(nth($ci-sprite, 1));
  }

  // white: footer에 사용
  &__ci-white {
    @include abstract.sprite2x(nth(map.get($logos, 'commerce-white'), 1));
  }

  &__ci-favicon {
    @include abstract.sprite2x(sprite.$ico-ci-favicon);
  }

  a {
    display: block;
    height: 100%;
  }
}