@import "tools.mixins";
@import "../settings.vars";

@mixin stock-scroll-short {
  height: $c-header-height + rem(20);
}

@mixin stock-scroll-small {
  height: rem(50);

  .c-scroll-menu__nav {
    &::before {
      @include gradient-layer(left, $color-white, rem(20));
    }

    &::after {
      @include gradient-layer(right, $color-white, rem(20));
    }
  }

  .c-markets-card {
    height: rem(44);
    min-height: inherit;
    border: none;
    padding: rem(15) rem(10);
  }

  .c-markets-card__row {
    margin: 0;
  }

  .c-markets-card__row-name {
    margin: 0;
    padding: 0 rem(8) 0 0;
  }

  .c-markets-card__arrow,
  .c-markets-card__row-time,
  .c-markets-card__row-price {
    display: none;
  }

  .c-markets-card__content {
    display: flex;
    flex-direction: row;
    align-items: center;
    white-space: nowrap;
  }

  .c-scroll-menu__nav--markets {
    border: none;

    .c-scroll-menu__item {
      border-right: none;
    }
  }
}
