:host {
  @apply box-border flex flex-col p-card bg-white text-black rounded-card shadow-card text-regular;
}

.header {
  @apply flex justify-between items-center;

  .heading {
    @apply text-card-heading font-bold p-0 m-0;
  }

  .date {
    @apply text-ucla-blue;
  }
}

.content {
  @apply mt-px-20;

  .data {
    @apply flex flex-row mt-px-5;

    &:first-child {
      @apply mt-0;
    }

    .name {
      min-width: 150px;
    }

    .value {
      @apply font-bold flex-grow;
    }
  }
}

.features {
  @apply mt-px-15 flex-row;

  .feature {
    @apply inline-flex flex-row gap-2 items-center text-ucla-blue font-bold;

    &:not(:first-of-type) {
      @apply ml-px-25;
    }
  }
}
