@import '../price/index';
@import '../tag/index';

.nut-theme-dark {
  .nut-card {
    .nut-card__right {
      color: $dark-color;
    }
  }
}

.nut-card {
  display: flex;
  width: 100%;

  .nut-card__left {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
    background-color: $card-left-background-color;
    border-radius: $card-left-border-radius;

    > image {
      display: block;
      width: 100%;
      height: 100%;
    }
  }

  .nut-card__right {
    flex: 1;
    padding: 0 10px 8px;

    .nut-card__right__title {
      display: -webkit-box;
      overflow: hidden;
      font-size: 14px;
      line-height: 1.5;
      -webkit-line-clamp: 2;
      word-break: break-all;
      -webkit-box-orient: vertical;
    }

    .nut-card__right__price {
      display: flex;
      align-items: center;
      height: 18px;
      margin-top: 9px;
      line-height: 18px;

      .nut-price {
        .nut-price--symbol-large {
          font-size: 12px;
        }

        .nut-price--large {
          font-size: 18px;
        }

        .nut-price--decimal-large {
          font-size: 12px;
        }
      }

      .nut-card__right__price__origin {
        :deep(.nut-price) {
          margin-left: 2px;
          color: #d2a448;

          .nut-price--symbol-large {
            font-size: 12px;
          }

          .nut-price--large {
            font-size: 12px;
          }

          .nut-price--decimal-large {
            font-size: 12px;
          }
        }
      }
        
    }

    .nut-card__right__other {
      display: flex;
      align-items: center;
      padding: 5px 0 2px;

      .nut-tag {
        padding: 0 2px;
        margin-right: 5px;
        font-size: $card-font-size-0;
        border: none;
      }
    }

    .nut-card__right__shop {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: 4px;

      .nut-card__right__shop__name {
        font-size: 12px;
        line-height: 1.5;
        color: #999;
      }
    }
  }
}