.registrations {
  @apply com-bg-white com-m-0;
  nb-card-body {
    @apply com-flex com-flex-col com-items-center com-w-full md:com-p-4 com-p-3;
  }
}

.container {
  @apply com-w-full  com-rounded-xl;
}

.event-registrations {
  @apply com-w-full com-flex md:com-flex-row com-flex-col com-items-center;
}

.event-registration-heading {
  @apply com-text-xl com-font-semibold com-text-black com-m-0 md:com-px-0 com-px-2 com-flex com-justify-center;
}

.event-title {
  @apply com-text-sm com-font-medium com-text-Dark-Jungle-Green com-flex com-items-start com-m-0 com-cursor-pointer;

  fa-icon {
    @apply com-mr-1 com-text-primary-500 com-text-xs;
  }

  .name {
    @apply com-line-clamp-1;
  }
}

.individual-status {
  @apply com-text-gray-500 com-text-10px com-font-medium;
}

.table-heading {
  @apply com-text-xs com-font-normal com-text-gray-500;
}

.date-desktop {
  @apply md:com-flex com-hidden com-text-xs com-font-normal com-text-gray-500;
}

.date-mobile {
  @apply com-flex md:com-hidden com-text-xs com-font-normal com-text-gray-500;
}

.event-title-date {
  @apply com-flex com-flex-col md:com-col-span-2;
}

.table-type {
  @apply com-text-xs com-font-medium com-text-gray-500 com-m-0 md:com-text-start com-text-end;
}

.table-type-form-type {
  @apply com-flex com-flex-col  md:com-justify-self-start com-justify-self-end;

  .form-type {
    @apply com-text-gray-500 com-text-10px com-font-medium com-m-0 com-text-end md:com-text-start;
  }
}

.table-status {
  @apply com-text-xs com-font-medium md:com-justify-self-start com-justify-self-end com-flex com-flex-col com-text-end md:com-text-start;
}

.confirmed {
  @apply com-text-green-600;
}

.registered {
  @apply com-text-black;
}

.waiting {
  @apply com-text-yellow-700;
}

.shortlisted {
  @apply com-text-Azure;
}

.cancelled {
  @apply com-text-red-500;
}

.qr-code {
  @apply md:com-w-[152px] com-w-full md:com-h-[152px] com-h-[180px] md:com-pl-4 com-pl-0 com-bg-white md:com-pt-0 com-pt-2 com-border-0 md:com-border-l com-border-l-0 com-border-solid com-border-Bright-Gray com-cursor-pointer;
  nb-card {
    @apply com-m-0 com-w-full com-h-full;

    nb-card-body {
      @apply com-rounded-lg com-border com-border-solid com-border-Bright-Gray com-bg-tWhite;
    }
  }
}

.registration-grid {
  @apply com-grid com-gap-2 com-w-full;
}

.registration-header {
  @apply md:com-grid com-grid-cols-5 com-gap-3 com-hidden com-px-2 com-mr-2;
}

.registration-row {
  @apply com-grid md:com-grid-cols-5 com-grid-cols-2 md:com-gap-3 com-gap-x-6px com-gap-y-6px com-py-1 com-px-2 hover:com-bg-gray-100 com-rounded-lg com-mr-2 com-items-center;
}

.highlighted-row {
  @apply com-bg-gray-100;
}

.registration {
  @apply com-flex com-flex-row;
}

.back-btn {
  @apply com-p-4;
}

.pagination {
  @apply com-mt-5 com-w-full;
}

app-loading-spinner {
  @apply com-flex com-justify-center com-my-8;
}

.desktop-qr,
.action-btn-desktop {
  @apply md:com-flex com-hidden;
}

.mobile-qr,
.action-btn-mobile {
  @apply com-flex md:com-hidden;

  button {
    @apply com-w-full;
  }
}

#qr-code-desktop,
#qr-code-mobile {
  @apply md:com-w-full com-w-auto com-h-full com-object-cover;
  image-rendering: pixelated;
}

.qr-code-display {
  @apply com-m-0 com-text-xs com-font-medium com-text-tblack;
}

.template {
  @apply com-h-[60dvh] md:com-w-[40dvw] com-w-[90dvw];
  nb-card-header {
    @apply com-flex com-flex-row com-justify-between com-items-center;
    p {
      @apply com-text-2xl com-font-semibold com-m-0;
    }

    nb-icon {
      @apply com-h-4 com-w-4;
    }
  }

  .qr-code-template {
    @apply com-m-0 com-w-full com-h-full;

    nb-card-body {
      @apply com-rounded-lg com-bg-tWhite com-flex com-flex-col com-items-center com-p-0;
    }
    .qr-unique-code-template {
      @apply com-text-2xl com-font-medium com-my-2 com-text-tblack;
    }
    #template-qr {
      @apply com-w-auto com-h-full;
      image-rendering: pixelated;
    }
  }
}
