.Icon {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  overflow: hidden;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: var(--icon-size);
  height: var(--icon-size);
  line-height: 0;
  vertical-align: sub;
}

.Icon_size_xs {
   --icon-size: var(--graphics-size-s);
 }

.Icon_size_s {
   --icon-size: var(--graphics-size-m);
 }

.Icon_size_m {
   --icon-size: var(--graphics-size-l);
 }

.Icon_size_l {
   --icon-size: var(--graphics-size-xl);
 }

.Icon_view_error {
   color: var(--color-typo-error);
 }

.Icon_view_brand {
   color: var(--color-typo-brand);
 }

.Icon_view_ghost {
   color: var(--color-typo-ghost);
 }

.Icon_view_link {
   color: var(--color-typo-link);
 }

.Icon_view_primary {
   color: var(--color-typo-primary);
 }

.Icon_view_secondary {
   color: var(--color-typo-secondary);
 }

.Icon_view_success {
   color: var(--color-typo-success);
 }

.Icon_view_warning {
   color: var(--color-typo-warning);
 }

.Icon_view_disabled {
   color: var(--color-control-typo-disable);
 }

.Icon_view_white {
   color: var(--color-typo-white);
 }

.Icon-Svg {
   display: block;
   width: 100%;
   height: 100%;
   fill: currentcolor;
 }
