.cfp-card {
  .cfp-card-link {
    @apply com-flex com-w-full com-no-underline md:com-flex-row com-flex-col;

    .cfp-card-image {
      @apply com-border-r-gray-200 com-flex com-justify-center com-overflow-hidden md:com-w-[250px] md:com-h-[140px] com-w-full com-h-full;
    }

    .no-image-header {
      @apply md:com-w-[250px] md:com-h-[126px] com-w-full com-h-[145px] com-flex com-items-center com-justify-center com-overflow-hidden com-rounded-lg;
    }

    .cfp-card-details {
      @apply md:com-px-3 md:com-pt-0 com-px-4 com-py-2 com-overflow-hidden com-h-full;
      flex: 1;
      .first-row {
        @apply com-flex com-flex-col;

        .badge-and-time {
          @apply com-flex com-flex-row com-justify-between com-items-center com-mb-2;

          .event-time {
            @apply com-text-xs md:com-font-medium com-font-normal com-m-0 com-text-gray-500 com-flex com-mr-2;
            text-wrap: nowrap;
          }
          .community-badge {
            @apply com-m-0;
          }
        }

        .form-title {
          @apply md:com-text-sm com-text-xs com-font-semibold com-text-Dark-Jungle-Green com-m-0 com-line-clamp-2 md:com-mb-2 com-mb-3;
        }

        .event-title {
          @apply com-text-xs md:com-font-medium com-font-normal com-m-0 com-text-gray-500 com-flex md:com-mb-4 com-mb-3;
        }
      }

      .second-row {
        @apply com-flex com-flex-row com-justify-between com-items-end;

        .interested-members,
        .location {
          @apply com-flex com-flex-row com-justify-center com-text-gray-500 com-mb-1 com-flex-shrink-0;

          fa-icon {
            @apply com-text-xs com-mr-2 com-flex-shrink-0;
          }
          span {
            @apply com-text-xs com-font-medium com-text-gray-500;
          }
        }

        .location-mobile-view {
          @apply com-flex com-flex-row com-justify-center com-text-gray-500 com-mb-1  com-flex-shrink-0;

          fa-icon {
            @apply com-text-xs com-mr-2 com-flex-shrink-0;
          }
          span {
            @apply com-text-xs com-font-medium com-text-gray-500;
          }
        }

        .interested-and-location {
          @apply com-flex com-flex-row com-justify-between md:com-gap-6 com-gap-3 md:com-mr-5;

          .left-col,
          .right-col {
            @apply com-flex com-flex-col com-items-start;

            .interested-members-count,
            .location-text {
              @apply com-text-xs com-font-semibold com-text-primary-500 com-line-clamp-1;
            }
          }
        }
      }
    }
  }
}
