.row-card {
  position: relative;
  display: grid;
  grid-template-columns: auto 21rem auto 12rem 1fr;
  gap: 1.6rem;
  background-color: #fff;
  padding: 1.6rem;
  border-radius: 0.8rem; }
  @media (max-width: 1023px) {
    .row-card {
      grid-template-columns: 70px auto 110px 110px 160px;
      gap: 0 20px; } }
  @media (max-width: 767px) {
    .row-card {
      grid-template-columns: 70px auto;
      grid-template-rows: repeat(3, auto);
      grid-template-areas: 'image content' 'image price' 'image control';
      align-items: start; } }
  .row-card__image {
    height: 6.4rem;
    width: 6.4rem; }
    .row-card__image img {
      width: 100%;
      height: 100%;
      object-fit: contain; }
    @media (max-width: 1023px) {
      .row-card__image {
        margin-right: 0;
        height: 70px; } }
    @media (max-width: 767px) {
      .row-card__image {
        grid-area: image; } }
  .row-card__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .8rem; }
    @media (max-width: 1023px) {
      .row-card__content {
        margin-right: 0; } }
    @media (max-width: 767px) {
      .row-card__content {
        grid-area: content;
        gap: 0;
        margin-bottom: 12px; } }
  .row-card__title {
    transition: all ease .3s;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    -webkit-box-align: center; }
    @media (min-width: 1024px) {
      .row-card__title {
        cursor: pointer; }
        .row-card__title:hover {
          color: #00A19B; } }
    .row-card__title:active {
      color: #00A19B;
      transform: translateY(2px); }
    @media (max-width: 767px) {
      .row-card__title {
        margin-bottom: 5px; } }
  .row-card__row {
    display: flex;
    justify-content: space-between; }
    @media (max-width: 767px) {
      .row-card__row {
        gap: 40px;
        margin-bottom: 8px; } }
  .row-card__labels {
    display: flex;
    pointer-events: none;
    gap: 6px;
    color: #ffffff; }
    @media (min-width: 768px) {
      .row-card__labels {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        position: absolute;
        left: 0;
        top: 0; }
        .row-card__labels .product-card__label {
          font-size: 10px;
          font-weight: 600; } }
    .row-card__labels .product-card__label {
      padding: 0 .4rem; }
      @media (max-width: 1023px) {
        .row-card__labels .product-card__label {
          padding: 0 4px; } }
  .row-card__code {
    color: #6F7682;
    display: flex;
    gap: 2.4rem;
    font-weight: 400; }
  .row-card__price-wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    gap: .6rem; }
    @media (max-width: 1023px) {
      .row-card__price-wrap {
        margin-right: 0; } }
    @media (max-width: 767px) {
      .row-card__price-wrap {
        grid-area: price;
        margin-bottom: 8px;
        flex-direction: row;
        justify-content: flex-start;
        align-items: baseline;
        gap: 10px; } }
  .row-card__price--discount {
    color: #6F7682; }
  .row-card__price-sale {
    height: 2rem;
    background-color: #E74829;
    color: #ffffff;
    padding: 0 .5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .2rem; }
    @media (max-width: 1023px) {
      .row-card__price-sale {
        height: 18px;
        padding: 0 5px;
        border-radius: 2px; } }
  .row-card__status {
    white-space: nowrap; }
    @media (max-width: 1023px) {
      .row-card__status {
        margin-right: 0; } }
    .row-card__status span {
      display: flex;
      align-items: center;
      position: relative;
      gap: .6rem; }
      @media (max-width: 767px) {
        .row-card__status span {
          gap: 6px; } }
  .row-card__sku {
    display: flex;
    gap: .8rem;
    margin-bottom: .8rem; }
    @media (max-width: 1023px) {
      .row-card__sku {
        gap: 8px;
        margin-bottom: 6px; } }
    .row-card__sku-item {
      width: 2rem;
      height: 2rem;
      border-radius: .2rem;
      position: relative; }
      @media (max-width: 1023px) {
        .row-card__sku-item {
          width: 24px;
          height: 24px;
          border-radius: 2px; } }
      .row-card__sku-item:before {
        content: '';
        position: absolute;
        inset: -0.3rem;
        border: 1px solid #00A19B;
        border-radius: .4rem;
        opacity: 0;
        transition: all ease .3s; }
      @media (min-width: 1024px) {
        .row-card__sku-item {
          cursor: pointer; }
          .row-card__sku-item:hover:before {
            opacity: 1;
            border-color: #6AB4B9; } }
      .row-card__sku-item.active {
        pointer-events: none; }
        .row-card__sku-item.active:before {
          opacity: 1; }
      .row-card__sku-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: .2rem; }
        @media (max-width: 1023px) {
          .row-card__sku-item img {
            border-radius: 2px; } }
      .row-card__sku-item--all {
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #D8D8D8;
        font-size: 10px;
        font-weight: 500;
        transition: all ease .3s; }
        @media (min-width: 1024px) {
          .row-card__sku-item--all {
            cursor: pointer;
            font-size: .9rem; }
            .row-card__sku-item--all:hover {
              border-color: #353535; } }
  .row-card__control {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1rem; }
    .row-card__control .btn {
      flex-grow: 1; }
    @media (max-width: 767px) {
      .row-card__control {
        grid-area: control; } }
  .row-card__counter {
    display: flex;
    flex-direction: column;
    position: relative;
    max-width: 12rem; }
    .row-card__counter .counter-input {
      min-width: 2rem; }
    @media (max-width: 424px) {
      .row-card__counter {
        width: 100%; } }
    .row-card__counter .basketData-msg-wrap {
      position: absolute;
      left: 0;
      right: 0;
      top: calc(100%);
      text-align: center;
      white-space: nowrap; }
  .row-card__delete {
    flex-shrink: 0;
    margin-left: 2rem;
    fill: #424242;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all ease .3s; }
    .row-card__delete .icon {
      transition: all ease .3s; }
    @media (min-width: 1024px) {
      .row-card__delete {
        cursor: pointer; }
        .row-card__delete:hover {
          fill: #6AB4B9; }
          .row-card__delete:hover .icon {
            transform: rotate(180deg); } }
    .row-card__delete:active {
      fill: #00A19B; }
    @media (max-width: 767px) {
      .row-card__delete {
        display: none; } }
  .row-card__remove {
    display: none;
    transition: all ease .3s; }
    @media (max-width: 767px) {
      .row-card__remove {
        position: absolute;
        z-index: 2;
        display: flex;
        align-items: center;
        justify-content: center;
        right: 0;
        top: -32px; } }
    .row-card__remove:active {
      fill: #00A19B; }
  .row-card--basket:not(:last-child) {
    margin-bottom: 0.6rem; }
  .row-card--basket .row-card__counter {
    max-width: 12.8rem; }
  .row-card--search {
    border-radius: 0;
    padding: 1.2rem 0;
    grid-template-columns: auto 1fr 13rem 24rem;
    gap: 4rem; }
    @media (max-width: 1023px) {
      .row-card--search {
        grid-template-columns: auto 1fr 130px 200px; } }
    @media (max-width: 767px) {
      .row-card--search {
        padding: 12px 0;
        gap: 0;
        grid-template-columns: auto 1fr 30px;
        grid-template-areas: 'image content content' 'image price control';
        align-items: start; } }
    .row-card--search .row-card__image {
      width: 12rem;
      height: 8rem; }
      @media (max-width: 767px) {
        .row-card--search .row-card__image {
          width: 86px;
          height: 86px;
          margin-right: 10px; } }
    .row-card--search .row-card__content {
      gap: 1rem;
      align-items: normal; }
      @media (max-width: 767px) {
        .row-card--search .row-card__content {
          gap: 0;
          margin-bottom: 0;
          margin-right: 0;
          max-width: 300px; } }
    .row-card--search .row-card__row {
      justify-content: space-between;
      flex-wrap: wrap; }
    .row-card--search .row-card__labels {
      margin-top: .8rem;
      position: static;
      flex-direction: row;
      gap: .6rem;
      flex-wrap: wrap; }
      .row-card--search .row-card__labels .product-card__label {
        border: 1px solid transparent;
        border-radius: .2rem;
        height: 2.2rem;
        padding: 0 0.5rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background-color: #fff; }
        @media (max-width: 1023px) {
          .row-card--search .row-card__labels .product-card__label {
            height: 18px;
            padding: 0 4px; } }
      @media (min-width: 768px) {
        .row-card--search .row-card__labels {
          display: none; } }
      @media (max-width: 767px) {
        .row-card--search .row-card__labels {
          margin-top: 0; } }
    @media (max-width: 767px) {
      .row-card--search .row-card__status {
        display: none; } }
    .row-card--search .row-card__price-wrap {
      justify-content: normal; }
      @media (max-width: 767px) {
        .row-card--search .row-card__price-wrap {
          margin-top: 14px;
          margin-bottom: 6px;
          flex-direction: row;
          justify-content: flex-start; }
          .row-card--search .row-card__price-wrap .row-card__price-sale {
            display: none; } }
    @media (max-width: 767px) {
      .row-card--search .row-card__control {
        align-self: center; } }
    @media (min-width: 768px) {
      .row-card--search .row-card__control .btn .icon {
        display: none; } }
    @media (max-width: 767px) {
      .row-card--search .row-card__control .btn {
        width: 30px;
        height: 30px;
        padding: 0; }
        .row-card--search .row-card__control .btn .icon {
          margin: 0; }
        .row-card--search .row-card__control .btn span {
          display: none; } }