@layer components {
  table {
    @apply w-full;
  }

  table thead tr {
    @apply text-left;
  }

  table thead th {
    @apply pb-3.5 text-sm font-normal uppercase text-gray-500;
  }

  table tbody th {
    @apply text-left font-normal text-gray-500;
  }

  table th:not(:last-of-type),
  table td:not(:last-of-type) {
    @apply pr-2;
  }

  table td, tbody th {
    @apply py-2;
  }

  table.divided {
    @apply divide-y divide-gray-300;
  }
  table.divided tbody {
    @apply divide-y divide-gray-200;
  }
  table.divided td, table.divided tbody th {
    @apply py-3;
  }
}
