@economic/taco 2.40.0 → 2.40.2

package/dist/index.css

@@ -1,1043 +1,1317 @@
-/* src/css/global.css */
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
 @layer base {
-  *,
-  *::before,
-  *::after {
-    box-sizing: border-box;
-  }
-  html {
-    @apply font-display h-screen;
-    -moz-osx-font-smoothing: grayscale;
-    -webkit-font-smoothing: antialiased;
-  }
-  body {
-    @apply h-screen bg-white text-sm leading-5 text-black;
-  }
-  blockquote,
-  dl,
-  dd,
-  hr,
-  figure,
-  p,
-  pre,
-  ol,
-  ul,
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    max-width: 100ch;
-  }
-  blockquote,
-  dl,
-  dd,
-  hr,
-  figure,
-  p,
-  pre,
-  ol,
-  ul {
-    @apply mb-10;
-  }
-  ol ol,
-  ul ul,
-  ol ul,
-  ul ol {
-    @apply mb-0;
-  }
-  ul.list-disc,
-  ul.list-decimal,
-  ul.list-circle,
-  ol.list-disc,
-  ol.list-decimal,
-  ol.list-circle {
-    @apply pl-4;
-  }
-  dt {
-    @apply font-bold;
-  }
-  blockquote {
-    @apply pl-8;
-  }
-  hr {
-    @apply bg-grey-300 my-5 flex h-px border-none;
-  }
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    @apply font-normal;
-  }
-  h1 {
-    @apply mb-5 text-3xl;
-  }
-  h2 {
-    @apply mb-2 text-2xl;
-  }
-  h3 {
-    @apply mb-2 text-xl;
-  }
-  h4 {
-    @apply mb-1 text-base font-bold;
-  }
-  h5 {
-    @apply mb-1 text-sm font-bold;
-  }
-  h6 {
-    @apply mb-1 text-xs font-bold;
-  }
-  b,
-  strong {
-    @apply font-bold;
-  }
-  a {
-    @apply text-blue-500 no-underline;
-  }
-  a:hover,
-  a:focus {
-    @apply text-blue-300;
-  }
-  a:active {
-    @apply text-blue-700;
-  }
-  button::-moz-focus-inner {
-    @apply border-none;
-  }
-  input[type=search]::-webkit-search-decoration,
-  input[type=search]::-webkit-search-cancel-button,
-  input[type=search]::-webkit-search-results-button,
-  input[type=search]::-webkit-search-results-decoration {
-    @apply block cursor-pointer;
-  }
-  input[type=search]::-webkit-search-cancel-button {
-    -webkit-appearance: none;
-  }
-  table.yt-table {
-    @apply focus:yt-focus flex flex-col focus:rounded-sm;
-  }
-  table.yt-table thead.yt-table__head tr.yt-table__row {
-    @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-b-2 border-t-0 font-bold;
-  }
-  table.yt-table thead.yt-table__head tr.yt-table__row th.yt-table__cell {
-    @apply text-grey-700 flex flex-1 justify-center truncate p-2 text-center align-middle hover:text-black;
-  }
-  table.yt-table tbody.yt-table__body tr.yt-table__row {
-    @apply border-grey-100 hover:bg-grey-100 flex min-h-[2.5rem] border-b;
-  }
-  table.yt-table tbody.yt-table__body tr.yt-table__row td.yt-table__cell {
-    @apply flex-1 truncate p-2 text-center align-middle;
-  }
-  [aria-hidden] > [data-taco=hanger] {
-    @apply invisible;
-  }
-  .wcag-transparent {
-    @apply bg-black/[0.08] text-black;
-  }
-  @keyframes fade-in {
-    from {
-      @apply opacity-0;
+    *,
+    *::before,
+    *::after {
+        box-sizing: border-box;
     }
-    to {
-      @apply opacity-100;
+
+    html {
+        @apply font-display h-screen;
+        -moz-osx-font-smoothing: grayscale;
+        -webkit-font-smoothing: antialiased;
+    }
+
+    body {
+        @apply h-screen bg-white text-sm leading-5 text-black;
+    }
+
+    blockquote,
+    dl,
+    dd,
+    hr,
+    figure,
+    p,
+    pre,
+    ol,
+    ul,
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        max-width: 100ch;
+    }
+
+    blockquote,
+    dl,
+    dd,
+    hr,
+    figure,
+    p,
+    pre,
+    ol,
+    ul {
+        @apply mb-10;
+    }
+
+    ol ol,
+    ul ul,
+    ol ul,
+    ul ol {
+        @apply mb-0;
+    }
+
+    ul.list-disc,
+    ul.list-decimal,
+    ul.list-circle,
+    ol.list-disc,
+    ol.list-decimal,
+    ol.list-circle {
+        @apply pl-4;
+    }
+
+    dt {
+        @apply font-bold;
+    }
+
+    blockquote {
+        @apply pl-8;
+    }
+
+    hr {
+        @apply bg-grey-300 my-5 flex h-px border-none;
+    }
+
+    h1,
+    h2,
+    h3,
+    h4,
+    h5,
+    h6 {
+        @apply font-normal;
+    }
+
+    h1 {
+        @apply mb-5 text-3xl;
+    }
+
+    h2 {
+        @apply mb-2 text-2xl;
+    }
+
+    h3 {
+        @apply mb-2 text-xl;
+    }
+
+    h4 {
+        @apply mb-1 text-base font-bold;
+    }
+
+    h5 {
+        @apply mb-1 text-sm font-bold;
+    }
+
+    h6 {
+        @apply mb-1 text-xs font-bold;
+    }
+
+    b,
+    strong {
+        @apply font-bold;
+    }
+
+    a {
+        @apply text-blue-500 no-underline;
+    }
+
+    a:hover,
+    a:focus {
+        @apply text-blue-300;
+    }
+
+    a:active {
+        @apply text-blue-700;
+    }
+
+    button::-moz-focus-inner {
+        @apply border-none;
+    }
+
+    input[type='search']::-webkit-search-decoration,
+    input[type='search']::-webkit-search-cancel-button,
+    input[type='search']::-webkit-search-results-button,
+    input[type='search']::-webkit-search-results-decoration {
+        @apply block cursor-pointer;
+    }
+
+    input[type='search']::-webkit-search-cancel-button {
+        -webkit-appearance: none;
+    }
+
+    table.yt-table {
+        @apply focus:yt-focus flex flex-col focus:rounded-sm;
+    }
+    table.yt-table thead.yt-table__head tr.yt-table__row {
+        @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-b-2 border-t-0 font-bold;
+    }
+
+    table.yt-table thead.yt-table__head tr.yt-table__row th.yt-table__cell {
+        @apply text-grey-700 flex flex-1 justify-center truncate p-2 text-center align-middle hover:text-black;
+    }
+
+    table.yt-table tbody.yt-table__body tr.yt-table__row {
+        @apply border-grey-100 hover:bg-grey-100 flex min-h-[2.5rem] border-b;
+    }
+
+    table.yt-table tbody.yt-table__body tr.yt-table__row td.yt-table__cell {
+        @apply flex-1 truncate p-2 text-center align-middle;
+    }
+
+    [aria-hidden] > [data-taco='hanger'] {
+        @apply invisible;
+    }
+
+    .wcag-transparent {
+        @apply bg-black/[0.08] text-black;
+    }
+
+    @keyframes fade-in {
+        from {
+            @apply opacity-0;
+        }
+        to {
+            @apply opacity-100;
+        }
     }
-  }
 }
 
-/* src/components/Badge/Badge.css */
-[data-taco=badge] > [data-taco=spinner] {
-  @apply ml-2 h-3 w-3;
+[data-taco='badge'] > [data-taco='spinner'] {
+    @apply ml-2 h-3 w-3;
 }
-[data-taco=badge] > [data-taco=spinner] svg circle {
-  stroke-width: 15px;
+
+[data-taco='badge'] > [data-taco='spinner'] svg circle {
+    stroke-width: 15px;
 }
-[data-taco=badge] > * {
-  @apply max-h-full p-0;
+
+[data-taco='badge'] > * {
+    @apply max-h-full p-0;
 }
 
-/* src/components/Button/Button.css */
-[data-taco=button] > [data-taco=icon] {
-  @apply pointer-events-none -ml-2 -mt-2 -mb-2 inline p-px;
+[data-taco='button'] > [data-taco='icon'] {
+    @apply pointer-events-none -ml-2 -mt-2 -mb-2 inline p-px;
 }
-[data-taco=button] > * + [data-taco=icon] {
-  @apply -mr-2 ml-0;
+
+[data-taco='button'] > * + [data-taco='icon'] {
+    @apply -mr-2 ml-0;
 }
 
-/* src/components/Calendar/Calendar.css */
-[data-taco=calendar] .rdp {
-  @apply select-none;
+[data-taco='calendar'] .rdp {
+    @apply select-none;
 }
-[data-taco=calendar] .rdp-head {
-  @apply h-6;
+[data-taco='calendar'] .rdp-head {
+    @apply h-6;
 }
-[data-taco=calendar] .rdp-head_cell {
-  @apply text-grey-700 flex-grow text-center font-medium uppercase;
+
+[data-taco='calendar'] .rdp-head_cell {
+    @apply text-grey-700 flex-grow text-center font-medium uppercase;
 }
-[data-taco=calendar] .rdp-day {
-  @apply hover:wcag-grey-200 flex h-10 w-10 cursor-pointer items-center justify-center rounded-full;
+
+[data-taco='calendar'] .rdp-day {
+    @apply hover:wcag-grey-200 flex h-10 w-10 cursor-pointer items-center justify-center rounded-full;
 }
-[data-taco=calendar] .rdp-day_today {
-  @apply font-bold text-blue-500;
+
+[data-taco='calendar'] .rdp-day_today {
+    @apply font-bold text-blue-500;
 }
-[data-taco=calendar] .rdp-day_selected {
-  @apply wcag-grey-200;
+
+[data-taco='calendar'] .rdp-day_selected {
+    @apply wcag-grey-200;
 }
-[data-taco=calendar] .DayPicker-Day--outside {
-  @apply text-grey-300 cursor-default;
+
+/* Default modifiers */
+[data-taco='calendar'] .DayPicker-Day--outside {
+    @apply text-grey-300 cursor-default;
 }
-[data-taco=calendar] .rdp-day_disabled {
-  @apply text-grey-300 pointer-events-none cursor-default;
+
+[data-taco='calendar'] .rdp-day_disabled {
+    @apply text-grey-300 pointer-events-none cursor-default;
 }
-[data-taco=calendar] .icon:hover,
-[data-taco=calendar]:not(.DayPicker--interactionDisabled),
+
+[data-taco='calendar'] .icon:hover,
+[data-taco='calendar']:not(.DayPicker--interactionDisabled),
 .DayPicker-Day:not(.DayPicker-Day--disabled):not(.DayPicker-Day--selected):not(.DayPicker-Day--outside):hover,
-[data-taco=calendar] .DayPicker-Day--highlighted,
-[data-taco=calendar] .DayPicker-Day--selected {
-  @apply wcag-grey-200;
+[data-taco='calendar'] .DayPicker-Day--highlighted,
+[data-taco='calendar'] .DayPicker-Day--selected {
+    @apply wcag-grey-200;
 }
-[data-taco=calendar] .calendar-caption {
-  @apply font-semibold;
+
+[data-taco='calendar'] .calendar-caption {
+    @apply font-semibold;
 }
 
-/* src/components/Card/style.css */
-[data-taco=card] [data-taco=report],
-[data-taco=card] [data-taco=table2] {
-  @apply !border-0;
+[data-taco='card'] [data-taco='report'],
+[data-taco='card'] [data-taco='table2'] {
+    @apply !border-0;
 }
 
-/* src/components/Spinner/Spinner.css */
-[data-taco=spinner] svg circle {
-  @apply flex;
-  fill: transparent;
-  stroke-width: 10px;
-  animation: spinnerAnimation 1.5s cubic-bezier(0.46, 0.03, 0.52, 0.96) infinite both;
-  transform-origin: 50% 50%;
-  stroke-linecap: round;
-  stroke-dasharray: 282.743343;
-  stroke-dashoffset: 67.85840232;
-  stroke: theme("colors.blue.500");
+[data-taco='spinner'] svg circle {
+    @apply flex;
+    fill: transparent;
+    stroke-width: 10px;
+    animation: spinnerAnimation 1.5s cubic-bezier(0.46, 0.03, 0.52, 0.96) infinite both;
+    transform-origin: 50% 50%;
+    stroke-linecap: round;
+    stroke-dasharray: 282.743343;
+    stroke-dashoffset: 67.85840232;
+    stroke: theme('colors.blue.500');
 }
+
 @keyframes spinnerAnimation {
-  0% {
-    stroke-dashoffset: 237.50440812;
-    transform: rotate(0);
-  }
-  50% {
-    stroke-dashoffset: 67.85840232;
-    transform: rotate(45deg);
-  }
-  100% {
-    stroke-dashoffset: 237.50440812;
-    transform: rotate(1turn);
-  }
+    0% {
+        stroke-dashoffset: 237.50440812;
+        transform: rotate(0);
+    }
+    50% {
+        stroke-dashoffset: 67.85840232;
+        transform: rotate(45deg);
+    }
+    100% {
+        stroke-dashoffset: 237.50440812;
+        transform: rotate(1turn);
+    }
 }
+
 @keyframes spinnerRotation {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(1turn);
-  }
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(1turn);
+    }
 }
-.yt-grey-solid [data-taco=spinner] svg circle {
-  stroke: theme("colors.grey.700");
+
+.yt-grey-solid [data-taco='spinner'] svg circle {
+    stroke: theme('colors.grey.700');
 }
-.yt-blue-solid [data-taco=spinner] svg circle,
-.yt-green-solid [data-taco=spinner] svg circle,
-.yt-red-solid [data-taco=spinner] svg circle {
-  stroke: theme("colors.white");
+
+.yt-blue-solid [data-taco='spinner'] svg circle,
+.yt-green-solid [data-taco='spinner'] svg circle,
+.yt-red-solid [data-taco='spinner'] svg circle {
+    stroke: theme('colors.white');
 }
+
 .yt-yellow-solid svg circle {
-  stroke: theme("colors.black");
+    stroke: theme('colors.black');
 }
+
 .yt-blue-inverted svg circle {
-  stroke: theme("colors.blue.500");
+    stroke: theme('colors.blue.500');
 }
+
 .yt-yellow-inverted svg circle {
-  stroke: theme("colors.yellow.500");
+    stroke: theme('colors.yellow.500');
 }
+
 .yt-red-inverted svg circle {
-  stroke: theme("colors.red.500");
+    stroke: theme('colors.red.500');
 }
+
 .yt-green-inverted svg circle {
-  stroke: theme("colors.green.500");
+    stroke: theme('colors.green.500');
 }
+
 .yt-grey-inverted svg circle {
-  stroke: theme("colors.grey.700");
+    stroke: theme('colors.grey.700');
 }
-[class*=wcag-] svg circle,
-[class*=text-] svg circle {
-  stroke: currentColor;
+
+[class*='wcag-'] svg circle,
+[class*='text-'] svg circle {
+    stroke: currentColor;
 }
 
-/* src/components/Listbox/ScrollableList.css */
-[data-taco=scrollable-list].yt-list--multiselect li:first-child {
-  @apply border-grey-100 border-b-2 pl-4;
+[data-taco='scrollable-list'].yt-list--multiselect li:first-child {
+    @apply border-grey-100 border-b-2 pl-4; /* Listbox max-height is dependant on this border-bottom-width value! */
 }
-[data-taco=scrollable-list] li > [data-taco=icon] {
-  @apply mr-2;
+
+[data-taco='scrollable-list'] li > [data-taco='icon'] {
+    @apply mr-2;
 }
-[data-taco=scrollable-list]:not([readonly]) li:not([disabled]):hover {
-  @apply wcag-grey-200;
+
+[data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover {
+    @apply wcag-grey-200;
 }
-[data-taco=scrollable-list]:not([readonly]) li:not([disabled]):hover [data-taco=icon] {
-  @apply wcag-grey-200;
+
+[data-taco='scrollable-list']:not([readonly]) li:not([disabled]):hover [data-taco='icon'] {
+    @apply wcag-grey-200;
 }
-[data-taco=scrollable-list] li:focus,
-[data-taco=scrollable-list]:not(.yt-list--multiselect) li[aria-selected=true],
-[data-taco=scrollable-list] li[data-focused=true] {
-  @apply wcag-blue-500;
+
+[data-taco='scrollable-list'] li:focus,
+[data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'],
+[data-taco='scrollable-list'] li[data-focused='true'] {
+    @apply wcag-blue-500;
 }
-[data-taco=scrollable-list] li:focus [data-taco=icon],
-[data-taco=scrollable-list]:not(.yt-list--multiselect) li[aria-selected=true] [data-taco=icon],
-[data-taco=scrollable-list] li[data-focused=true] [data-taco=icon] {
-  @apply wcag-blue-500;
+
+[data-taco='scrollable-list'] li:focus [data-taco='icon'],
+[data-taco='scrollable-list']:not(.yt-list--multiselect) li[aria-selected='true'] [data-taco='icon'],
+[data-taco='scrollable-list'] li[data-focused='true'] [data-taco='icon'] {
+    @apply wcag-blue-500;
 }
-[data-taco=scrollable-list][readonly] li {
-  @apply cursor-not-allowed;
+
+[data-taco='scrollable-list'][readonly] li {
+    @apply cursor-not-allowed;
 }
-[data-taco=scrollable-list] li[disabled],
-[data-taco=scrollable-list][disabled] li[aria-selected=true] {
-  @apply cursor-not-allowed text-black text-opacity-25;
+
+[data-taco='scrollable-list'] li[disabled],
+[data-taco='scrollable-list'][disabled] li[aria-selected='true'] {
+    @apply cursor-not-allowed text-black text-opacity-25;
 }
-[data-taco=scrollable-list] li.yt-list__empty,
-[data-taco=scrollable-list] li.yt-list__empty:hover,
-[data-taco=scrollable-list] li.yt-list__empty:focus {
-  @apply text-grey-700 flex w-full items-center overflow-hidden bg-white px-3 italic;
+
+[data-taco='scrollable-list'] li.yt-list__empty,
+[data-taco='scrollable-list'] li.yt-list__empty:hover,
+[data-taco='scrollable-list'] li.yt-list__empty:focus {
+    @apply text-grey-700 flex w-full items-center overflow-hidden bg-white px-3 italic;
 }
-[data-taco=scrollable-list] li.yt-list__empty [data-taco=spinner] {
-  @apply mr-2 mt-2 h-5 w-5 opacity-75;
+
+[data-taco='scrollable-list'] li.yt-list__empty [data-taco='spinner'] {
+    @apply mr-2 mt-2 h-5 w-5 opacity-75;
 }
 
-/* src/components/Combobox/Combobox.css */
-[data-taco=combobox] > [aria-expanded=true] + [role=dialog] > ul,
-[data-taco=combobox] > [aria-expanded=true] + [role=dialog] > ul:hover {
-  @apply border-blue-500;
+[data-taco='combobox'] > [aria-expanded='true'] + [role='dialog'] > ul,
+[data-taco='combobox'] > [aria-expanded='true'] + [role='dialog'] > ul:hover {
+    @apply border-blue-500;
 }
 
-/* src/components/Dialog/Dialog.css */
 .yt-dialog__drag::before,
 .yt-dialog__drag::after {
-  @apply bg-grey-300 absolute rounded;
-  content: "";
-  left: theme("spacing.1");
-  height: 2px;
-  width: calc(100% - (2 * theme("spacing.1")));
+    @apply bg-grey-300 absolute rounded;
+    content: '';
+    left: theme('spacing.1');
+    height: 2px;
+    width: calc(100% - (2 * theme('spacing.1')));
 }
+
 .yt-dialog__drag::before {
-  top: 3px;
+    top: 3px;
 }
+
 .yt-dialog__drag::after {
-  bottom: 3px;
+    bottom: 3px;
 }
 
-/* src/components/Field/Field.css */
-[data-taco=label] [data-taco=label] {
-  min-height: 0;
+/* label inside label is invalid html, but the client is littered with it */
+[data-taco='label'] [data-taco='label'] {
+    min-height: 0;
 }
 
-/* src/components/Form/Form.css */
 .yt-form.yt-form--horizontal {
-  @apply gap-4;
+    @apply gap-4;
 }
+
 .yt-form.yt-form--horizontal > * {
-  @apply inline-flex;
-}
-.yt-form.yt-form--horizontal > [data-taco=button] {
-  @apply mt-6;
+    @apply inline-flex;
 }
 
-/* src/components/Hanger/Hanger.css */
-[data-taco=hanger] a {
-  @apply text-grey-200 underline;
-}
-[data-taco=hanger] > *:last-child {
-  @apply mb-0;
+.yt-form.yt-form--horizontal > [data-taco='button'] {
+    @apply mt-6;
 }
 
-/* src/components/List/List.css */
-[data-taco=list] {
-  @apply flex flex-col gap-y-2;
-}
-[data-taco=list-item] {
-  @apply border-grey-300 flex w-full items-center gap-x-3 rounded-lg border bg-white p-3 text-left;
-}
-[data-taco=list-item]:focus-visible {
-  @apply yt-focus z-10;
-}
-[data-taco=list-item]:not([aria-disabled]):hover {
-  @apply cursor-pointer bg-black/[0.08];
-}
-[data-taco=list-item][aria-disabled] {
-  @apply pointer-events-none opacity-50;
+[data-taco='hanger'] a {
+    @apply text-grey-200 underline;
 }
-[data-taco=list-item-collapsible]:has([data-taco=list-item]:focus-visible) {
-  @apply z-10;
-}
-[data-taco=list-item-collapsible] > [data-taco=list-item][aria-expanded=true]:not(:focus-visible) {
-  @apply rounded-b-none border-b-transparent;
-}
-[data-taco=list-item-collapsible] > div {
-  @apply border-grey-300 rounded-b-lg border border-t-0 bg-white p-3;
-}
-[data-taco=list-group] {
-  @apply flex flex-col;
+
+[data-taco='hanger'] > *:last-child {
+    @apply mb-0;
 }
-[data-taco=list-group] > [data-taco=list-item]:not(:first-child):not(:focus-visible),
-[data-taco=list-group] > [data-taco=list-item-collapsible]:not(:first-child) [data-taco=list-item]:not(:focus-visible) {
-  @apply !rounded-t-none border-t-transparent;
+
+[data-taco='list'] {
+    @apply flex flex-col gap-y-2;
 }
-[data-taco=list-group] > [data-taco=list-item]:not(:last-child):not(:focus-visible),
-[data-taco=list-group] > [data-taco=list-item-collapsible]:not(:last-child) [data-taco=list-item]:not(:focus-visible) {
-  @apply !rounded-b-none;
+
+[data-taco='list-item'] {
+    @apply border-grey-300 flex w-full items-center gap-x-3 rounded-lg border bg-white p-3 text-left;
 }
-[data-taco=list-group] > [data-taco=list-item-collapsible]:not(:last-child) > div {
-  @apply rounded-b-none;
+
+[data-taco='list-item']:focus-visible {
+        @apply yt-focus z-10;
+    }
+
+[data-taco='list-item']:not([aria-disabled]):hover {
+        @apply cursor-pointer bg-black/[0.08];
+    }
+
+[data-taco='list-item'][aria-disabled] {
+        @apply pointer-events-none opacity-50;
+    }
+
+[data-taco='list-item-collapsible']:has([data-taco='list-item']:focus-visible) {
+        @apply z-10;
+    }
+
+[data-taco='list-item-collapsible'] > [data-taco='list-item'][aria-expanded='true']:not(:focus-visible) {
+        @apply rounded-b-none border-b-transparent;
+    }
+
+[data-taco='list-item-collapsible'] > div {
+        @apply border-grey-300 rounded-b-lg border border-t-0 bg-white p-3;
+    }
+
+[data-taco='list-group'] {
+    @apply flex flex-col;
 }
 
-/* src/components/Navigation/Navigation.css */
+[data-taco='list-group'] > [data-taco='list-item']:not(:first-child):not(:focus-visible),
+    [data-taco='list-group'] > [data-taco='list-item-collapsible']:not(:first-child) [data-taco='list-item']:not(:focus-visible) {
+        @apply !rounded-t-none border-t-transparent;
+    }
+
+[data-taco='list-group'] > [data-taco='list-item']:not(:last-child):not(:focus-visible),
+    [data-taco='list-group'] > [data-taco='list-item-collapsible']:not(:last-child) [data-taco='list-item']:not(:focus-visible) {
+        @apply !rounded-b-none;
+    }
+
+[data-taco='list-group'] > [data-taco='list-item-collapsible']:not(:last-child) > div {
+        @apply rounded-b-none;
+    }
+
 .yt-navigation__item a,
 .yt-navigation__item .yt-navigation__item__postfix {
-  @apply text-black;
+    @apply text-black;
 }
-.yt-navigation__item .yt-navigation__item__prefix [data-taco=icon] {
-  @apply -mt-1 -mb-1 text-xs;
-  margin-left: -0.375rem;
-  margin-right: 0.15rem;
+
+.yt-navigation__item .yt-navigation__item__prefix [data-taco='icon'] {
+    @apply -mt-1 -mb-1 text-xs;
+    margin-left: -0.375rem;
+    margin-right: 0.15rem;
 }
+
 .yt-navigation__item:hover,
 .yt-navigation__item:hover a,
 .yt-navigation__item:hover .yt-navigation__item__postfix,
 .yt-navigation__item--active,
 .yt-navigation__item--active a,
 .yt-navigation__item--active .yt-navigation__item__postfix {
-  @apply text-blue-500;
+    @apply text-blue-500;
 }
+
 .yt-navigation__item--dropping,
 .yt-navigation__item--dropping a,
 .yt-navigation__item--dropping .yt-navigation__item__postfix {
-  @apply text-white;
+    @apply text-white;
 }
-.yt-navigation__item:hover .yt-navigation__item__postfix [data-taco=badge]:not(.h-2),
-.yt-navigation__item--active .yt-navigation__item__postfix [data-taco=badge]:not(.h-2) {
-  @apply yt-blue-inverted;
+
+.yt-navigation__item:hover .yt-navigation__item__postfix [data-taco='badge']:not(.h-2),
+.yt-navigation__item--active .yt-navigation__item__postfix [data-taco='badge']:not(.h-2) {
+    @apply yt-blue-inverted;
 }
+
 .yt-navigation__item--dropping > * {
-  @apply pointer-events-none;
+    @apply pointer-events-none;
 }
-.yt-navigation__item--dropping .yt-navigation__item__postfix [data-taco=badge] {
-  @apply border-white text-white;
+
+.yt-navigation__item--dropping .yt-navigation__item__postfix [data-taco='badge'] {
+    @apply border-white text-white;
 }
 
-/* src/components/Progress/Progress.css */
-.yt-toast:hover [data-taco=progress-bar] {
-  animation-play-state: paused;
+.yt-toast:hover [data-taco='progress-bar'] {
+    animation-play-state: paused;
 }
+
 @keyframes progress {
-  from {
-    width: 100%;
-  }
-  to {
-    width: 0%;
-  }
+    from {
+        width: 100%;
+    }
+    to {
+        width: 0%;
+    }
 }
+
 @keyframes progress-indeterminate {
-  0% {
-    margin-left: 0px;
-    margin-right: 100%;
-  }
-  50% {
-    margin-left: 25%;
-    margin-right: 0%;
-  }
-  100% {
-    margin-left: 100%;
-    margin-right: 0;
-  }
+    0% {
+        margin-left: 0px;
+        margin-right: 100%;
+    }
+    50% {
+        margin-left: 25%;
+        margin-right: 0%;
+    }
+    100% {
+        margin-left: 100%;
+        margin-right: 0;
+    }
 }
 
-/* src/components/Toast/Toast.css */
-[data-taco=toast] > div [data-taco=button] {
-  @apply -mt-px py-0 px-2;
+[data-taco='toast'] > div [data-taco='button'] {
+    @apply -mt-px py-0 px-2;
 }
 
-/* src/primitives/Table/Core/style.css */
-table[data-taco^=table] {
-  @apply border-separate border-spacing-0;
-  @apply relative isolate h-full w-full grow overflow-auto;
-  @apply border-grey-300 rounded border bg-white outline-none;
-  @apply grid;
-  @apply print:float-left print:h-max print:w-full print:overflow-visible print:border-0;
-  overflow-anchor: none;
-}
-table[data-taco^=table] thead {
-  @apply sticky top-0 isolate z-20;
-  @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
-}
-table[data-taco^=table] thead:hover th:not(:last-child):after {
-  @apply bg-grey-300 absolute bottom-2 right-0 top-2 w-px content-[""];
-}
-table[data-taco^=table] thead tr:first-child {
-  @apply rounded-t;
-}
-table[data-taco^=table] thead tr:first-child th:first-child {
-  @apply rounded-tl;
-}
-table[data-taco^=table] thead tr:first-child th:last-child {
-  @apply rounded-tr;
-}
-table[data-taco^=table] thead tr:last-child {
-  @apply border-grey-300 border-b-2;
-}
-table[data-taco^=table] thead tr:not(:last-child) th:before {
-  @apply bg-grey-300 absolute bottom-0 left-2 right-2 h-[2px] content-[""];
-}
-table[data-taco^=table] tfoot {
-  @apply sticky bottom-0 isolate z-20;
-  @apply col-span-full grid grid-cols-[subgrid];
-}
-table[data-taco^=table] tfoot td {
-  @apply items-center;
-}
-table[data-taco^=table] tbody {
-  @apply isolate z-10;
-  @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
-  @apply print:!h-auto;
-}
-table[data-taco^=table] tr {
-  @apply relative bg-white outline-none;
-  @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
-}
-table[data-taco^=table] tr:last-child th:before {
-  @apply left-0 right-0;
-}
-table[data-taco^=table] tr[data-row-group] {
-  @apply bg-grey-100 sticky top-[calc((var(--table-header-group-depth)_-_1)_*_40px_+_42px)] z-30 pt-10 print:pt-0;
-}
-table[data-taco^=table] tr[data-row-group]:first-child {
-  @apply pt-0;
-}
-table[data-taco^=table] tr[data-row-group]:not(:first-child):before {
-  content: "";
-  @apply bg-grey-100 border-grey-300 absolute left-0 right-0 top-0 h-10 border-t print:top-0 print:h-[2px] print:border-t-2;
-}
-table[data-taco^=table] tr[data-row-group] td {
-  @apply -mt-px border-b-2 border-t-0 font-bold;
-}
-table[data-taco^=table] tr:first-child td {
-  @apply !border-t-0;
-}
-table[data-taco^=table] tr[aria-grabbed=true] td {
-  @apply !wcag-blue-500;
-}
-table[data-taco^=table] tr[data-row-dragged-over=true] td {
-  @apply !bg-grey-100;
-}
-table[data-taco^=table] tr:hover > td[data-cell-id=__actions] {
-  @apply sticky;
-}
-table[data-taco^=table] th {
-  @apply relative flex h-10 items-center justify-start px-[var(--table-cell-padding-x)];
-  @apply border-grey-300 bg-white font-bold;
-}
-table[data-taco^=table] th:not([data-cell-placeholder=true]):hover {
-  @apply bg-grey-100;
-}
-table[data-taco^=table] th[aria-sort]:hover {
-  @apply cursor-pointer;
-}
-table[data-taco^=table] td {
-  @apply flex justify-start px-[var(--table-cell-padding-x)] py-[var(--table-cell-padding-y)];
-  @apply border-grey-300 border-b bg-white outline-none;
-  @apply break-word hyphens-auto whitespace-pre-line;
-}
-table[data-taco^=table][data-table-row-height=short] td {
-  @apply min-h-[33px];
-}
-table[data-taco^=table][data-table-row-height=medium] td,
-table[data-taco^=table][data-table-row-height] tfoot td {
-  @apply min-h-[41px];
-}
-table[data-taco^=table] [data-cell-align=left] {
-  @apply justify-start text-left;
-}
-table[data-taco^=table] [data-cell-align=center] {
-  @apply justify-center text-center;
-}
-table[data-taco^=table] [data-cell-align=right] {
-  @apply justify-end text-right;
-}
-table[data-taco^=table] [data-cell-pinned] {
-  @apply sticky;
-}
-table[data-taco^=table] th[data-cell-pinned] {
-  @apply z-30;
-}
-table[data-taco^=table] td[data-cell-pinned] {
-  @apply z-20;
-}
-table[data-taco^=table] td:not([data-cell-truncate=true]) {
-  @apply break-word hyphens-auto whitespace-pre-line;
-}
-table[data-taco^=table] tfoot td {
-  @apply border-b-0 !py-1 font-bold;
-}
-table[data-taco^=table] tfoot td:first-child {
-  @apply z-30 !pb-0 !pt-[2px];
-}
-table[data-taco^=table] tfoot td:before {
-  @apply bg-grey-300 absolute left-0 right-0 top-0 h-[2px] content-[""];
-}
-table[data-taco^=table][data-table-resizing=true] {
-  @apply select-none;
-}
-table[data-taco^=table][data-table-resizing=true] th,
-table[data-taco^=table][data-table-resizing=true] td,
-table[data-taco^=table][data-table-resizing=true] tbody tr {
-  @apply pointer-events-none;
-}
-table[data-taco^=table] td[data-cell-align=right] [data-taco=input],
-table[data-taco^=table] td[data-cell-align=right] [data-taco=textarea] {
-  @apply text-right;
-}
-table[data-taco^=table] td [data-taco=textarea] {
-  @apply resize-none overflow-y-hidden focus:resize-y;
-}
-table[data-taco^=table] td[data-cell-truncate=true] [data-taco=textarea] {
-  @apply focus:absolute focus:overflow-y-auto;
-}
-table[data-taco^=table] td label {
-  @apply h-fit !min-h-fit w-full !pb-0;
-}
-table[data-taco^=table] td label [data-taco=label-message] {
-  @apply !-mb-1.5 !-ml-2 !mt-1.5;
+table[data-taco^='table'] {
+    /* reset table */
+    @apply border-separate border-spacing-0;
+    /* z-indexes & layout */
+    @apply relative isolate h-full w-full grow overflow-auto;
+    /* styling */
+    @apply border-grey-300 rounded border bg-white outline-none;
+    /* grid */
+    @apply grid;
+    /* print */
+    @apply print:float-left print:h-max print:w-full print:overflow-visible print:border-0;
+    /* resolves a virtualisation resizing issue */
+    overflow-anchor: none;
 }
-table[data-taco^=table] td label [data-taco=switch] + [data-taco=label-message] {
-  @apply !ml-0;
-}
-table[data-taco^=table][data-table-font-size=small] {
-  @apply text-xs;
-}
-table[data-taco^=table][data-table-font-size=medium] {
-  @apply text-sm;
+
+table[data-taco^='table'] thead {
+    /* z-indexes & layout */
+    @apply sticky top-0 isolate z-20;
+    /* grid */
+    @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
 }
-table[data-taco^=table][data-table-font-size=large] {
-  @apply text-base;
+
+/* header column separator */
+
+table[data-taco^='table'] thead:hover th:not(:last-child):after {
+            @apply bg-grey-300 absolute bottom-2 right-0 top-2 w-px content-[''];
+        }
+
+table[data-taco^='table'] thead tr:first-child {
+        @apply rounded-t;
+    }
+
+table[data-taco^='table'] thead tr:first-child th:first-child {
+            @apply rounded-tl;
+        }
+
+table[data-taco^='table'] thead tr:first-child th:last-child {
+            @apply rounded-tr;
+        }
+
+table[data-taco^='table'] thead tr:last-child {
+        @apply border-grey-300 border-b-2;
+    }
+
+/* bottom border for column groups */
+
+table[data-taco^='table'] thead tr:not(:last-child) th:before {
+            @apply bg-grey-300 absolute bottom-0 left-2 right-2 h-[2px] content-[''];
+        }
+
+table[data-taco^='table'] tfoot {
+    /* z-indexes & layout */
+    @apply sticky bottom-0 isolate z-20;
+    /* grid */
+    @apply col-span-full grid grid-cols-[subgrid];
 }
-table[data-taco^=table][data-table-font-size=small] td > [data-taco=button],
-table[data-taco^=table][data-table-font-size=small] td > [data-taco=icon-button] {
-  @apply !-my-2;
+
+table[data-taco^='table'] tfoot td {
+        @apply items-center;
+    }
+
+table[data-taco^='table'] tbody {
+    /* z-indexes & layout */
+    @apply isolate z-10;
+    /* grid */
+    @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
+    /* printing - override virtualiser bottom spacing */
+    @apply print:!h-auto;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=spinner] {
-  @apply !h-4 !w-4;
+
+table[data-taco^='table'] tr {
+    /* styling */
+    @apply relative bg-white outline-none;
+    /* grid */
+    @apply col-span-full grid auto-rows-min grid-cols-[subgrid];
 }
-table[data-taco^=table][data-table-font-size=small] td > [data-taco=icon],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=spinner] {
-  @apply !-my-[3px];
+
+/* botom border for column groups */
+
+table[data-taco^='table'] tr:last-child th:before {
+        @apply left-0 right-0;
+    }
+
+/* row groups */
+
+table[data-taco^='table'] tr[data-row-group] {
+        @apply bg-grey-100 sticky top-[calc((var(--table-header-group-depth)_-_1)_*_40px_+_42px)] z-30 pt-10 print:pt-0;
+    }
+
+table[data-taco^='table'] tr[data-row-group]:first-child {
+            @apply pt-0;
+        }
+
+table[data-taco^='table'] tr[data-row-group]:not(:first-child):before {
+            content: '';
+            @apply bg-grey-100 border-grey-300 absolute left-0 right-0 top-0 h-10 border-t print:top-0 print:h-[2px] print:border-t-2;
+        }
+
+table[data-taco^='table'] tr[data-row-group] td {
+            @apply -mt-px border-b-2 border-t-0 font-bold;
+        }
+
+table[data-taco^='table'] tr:first-child td {
+        @apply !border-t-0;
+    }
+
+table[data-taco^='table'] tr[aria-grabbed='true'] td {
+        @apply !wcag-blue-500;
+    }
+
+table[data-taco^='table'] tr[data-row-dragged-over='true'] td {
+        @apply !bg-grey-100;
+    }
+
+table[data-taco^='table'] tr:hover > td[data-cell-id='__actions'] {
+        @apply sticky;
+    }
+
+table[data-taco^='table'] th {
+    /* layout */
+    @apply relative flex h-10 items-center justify-start px-[var(--table-cell-padding-x)];
+    /* styling */
+    @apply border-grey-300 bg-white font-bold;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=badge],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=badge-icon],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=icon],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=spinner] {
-  @apply !-my-0.5 !text-xs;
+
+table[data-taco^='table'] th:not([data-cell-placeholder='true']):hover {
+        @apply bg-grey-100;
+    }
+
+table[data-taco^='table'] th[aria-sort]:hover {
+        @apply cursor-pointer;
+    }
+
+table[data-taco^='table'] td {
+    /* layout */
+    @apply flex justify-start px-[var(--table-cell-padding-x)] py-[var(--table-cell-padding-y)];
+    /* styling */
+    @apply border-grey-300 border-b bg-white outline-none;
+    /* word breaking */
+    @apply break-word hyphens-auto whitespace-pre-line;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=tag] {
-  @apply !-my-0.5 h-5;
+
+table[data-taco^='table'][data-table-row-height='short'] td {
+    @apply min-h-[33px];
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=select2-container],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=Select2],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=textarea] {
-  @apply !-mx-[7px] !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
+
+table[data-taco^='table'][data-table-row-height='medium'] td,
+/* Footer should always have medium row height */
+table[data-taco^='table'][data-table-row-height] tfoot td {
+    @apply min-h-[41px];
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=input-container]:has([data-taco=input]) {
-  @apply !-mx-[7px] !w-auto;
+
+table[data-taco^='table'] [data-cell-align='left'] {
+    @apply justify-start text-left;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=input-container]:has([data-taco=input]) [data-taco=input] {
-  @apply !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
+
+table[data-taco^='table'] [data-cell-align='center'] {
+    @apply justify-center text-center;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=Select2],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=textarea] {
-  @apply !px-1.5;
+
+table[data-taco^='table'] [data-cell-align='right'] {
+    @apply justify-end text-right;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=select2-container] [data-taco=Select2] {
-  @apply !m-auto !w-full;
+
+table[data-taco^='table'] [data-cell-pinned] {
+    @apply sticky;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=Select2] [data-taco=tag],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=Select2] [data-taco=scrollarea] {
-  @apply !my-0;
+
+table[data-taco^='table'] th[data-cell-pinned] {
+    @apply z-30;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=textarea] {
-  @apply !py-[3px] !leading-4;
+
+table[data-taco^='table'] td[data-cell-pinned] {
+    @apply z-20;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=input-container] [data-affix-type=postfix] button {
-  @apply z-10 !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)];
+
+table[data-taco^='table'] td:not([data-cell-truncate='true']) {
+    @apply break-word hyphens-auto whitespace-pre-line;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=input-container] [data-affix-type=postfix]:not([data-taco=icon-button]),
-table[data-taco^=table][data-table-font-size=small] td [data-taco=input-container] [data-affix-type=prefix]:not([data-taco=icon-button]) {
-  @apply z-10;
+
+/* FOOTER */
+table[data-taco^='table'] tfoot td {
+    /*
+     * Since footer has sticky position, the top and bottom padding ensures that the inner content doesn't come over
+     * the border of the footer row.
+     */
+    @apply border-b-0 !py-1 font-bold;
+}
+table[data-taco^='table'] tfoot td:first-child {
+        @apply z-30 !pb-0 !pt-[2px];
+    }
+
+table[data-taco^='table'] tfoot td:before {
+    @apply bg-grey-300 absolute left-0 right-0 top-0 h-[2px] content-[''];
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=input-container] [data-affix-type=postfix]:not([data-taco=icon-button])[data-taco=icon],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=input-container] [data-affix-type=prefix]:not([data-taco=icon-button])[data-taco=icon] {
-  @apply !h-4 !w-4;
+
+/* OTHER */
+
+/* resizing */
+table[data-taco^='table'][data-table-resizing='true'] {
+        @apply select-none;
+    }
+table[data-taco^='table'][data-table-resizing='true'] th,
+    table[data-taco^='table'][data-table-resizing='true'] td,
+    table[data-taco^='table'][data-table-resizing='true'] tbody tr {
+        @apply pointer-events-none;
+    }
+
+/* components in cells */
+table[data-taco^='table'] td[data-cell-align='right'] [data-taco='input'],
+table[data-taco^='table'] td[data-cell-align='right'] [data-taco='textarea'] {
+    @apply text-right;
 }
-table[data-taco^=table][data-table-font-size=small] td [role=combobox] {
-  @apply !flex;
+
+table[data-taco^='table'] td [data-taco='textarea'] {
+    @apply resize-none overflow-y-hidden focus:resize-y;
 }
-table[data-taco^=table][data-table-font-size=small] td [role=combobox] [data-taco=input] {
-  @apply !pr-7;
+
+table[data-taco^='table'] td[data-cell-truncate='true'] [data-taco='textarea'] {
+    @apply focus:absolute focus:overflow-y-auto;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=checkbox],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=checkbox-container],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=switch],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=switch-container] {
-  @apply !-my-0.5;
+
+table[data-taco^='table'] td label {
+    @apply h-fit !min-h-fit w-full !pb-0;
 }
-table[data-taco^=table][data-table-font-size=small] td [data-taco=checkbox-container] [data-taco=checkbox],
-table[data-taco^=table][data-table-font-size=small] td [data-taco=switch-container] [data-taco=switch] {
-  @apply !my-0;
+
+table[data-taco^='table'] td label [data-taco='label-message'] {
+    @apply !-mb-1.5 !-ml-2 !mt-1.5;
 }
-table[data-taco^=table][data-table-font-size=medium] td > [data-taco=spinner] {
-  @apply !h-5 !w-5;
+
+table[data-taco^='table'] td label [data-taco='switch'] + [data-taco='label-message'] {
+    @apply !ml-0;
 }
-table[data-taco^=table][data-table-font-size=medium] td > [data-taco=button],
-table[data-taco^=table][data-table-font-size=medium] td > [data-taco=icon-button] {
-  @apply !-my-1.5;
+
+/* font sizing */
+table[data-taco^='table'][data-table-font-size='small'] {
+    @apply text-xs;
 }
-table[data-taco^=table][data-table-font-size=medium] td > [data-taco=icon] {
-  @apply !-my-0.5;
+
+table[data-taco^='table'][data-table-font-size='medium'] {
+    @apply text-sm;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=tag] {
-  @apply !-my-0.5;
+
+table[data-taco^='table'][data-table-font-size='large'] {
+    @apply text-base;
 }
-table[data-taco^=table][data-table-font-size=medium] td [role=combobox] {
-  @apply !flex;
+
+/* small font size */
+table[data-taco^='table'][data-table-font-size='small'] td > [data-taco='button'],
+table[data-taco^='table'][data-table-font-size='small'] td > [data-taco='icon-button'] {
+    @apply !-my-2;
 }
-table[data-taco^=table][data-table-font-size=medium] td [role=combobox] [data-taco=input] {
-  @apply !pr-9;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='spinner'] {
+    @apply !h-4 !w-4;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=select2-container],
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=Select2],
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=textarea] {
-  @apply !-mx-[9px] !-my-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
+
+table[data-taco^='table'][data-table-font-size='small'] td > [data-taco='icon'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='spinner'] {
+    @apply !-my-[3px];
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=input-container]:has([data-taco=input]) {
-  @apply !-mx-[9px] !w-auto;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='badge'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='badge-icon'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='icon'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='spinner'] {
+    @apply !-my-0.5 !text-xs;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=input-container]:has([data-taco=input]) [data-taco=input] {
-  @apply !-my-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='tag'] {
+    @apply !-my-0.5 h-5;
 }
-table[data-taco^=table][data-table-font-size=medium] td[data-cell-align=right] [data-taco=input],
-table[data-taco^=table][data-table-font-size=medium] td[data-cell-align=right] [data-taco=textarea] {
-  @apply pr-1.5;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='select2-container'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'] {
+    @apply !-mx-[7px] !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=select2-container] [data-taco=Select2] {
-  @apply !m-auto !w-full;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container']:has([data-taco='input']) {
+    @apply !-mx-[7px] !w-auto;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=Select2] [data-taco=tag] {
-  @apply !my-0;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container']:has([data-taco='input']) [data-taco='input'] {
+        @apply !-my-[4px] !min-h-[theme(spacing.6)] !w-[calc(100%_+_14px)] text-xs focus:z-10;
+    }
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'] {
+    @apply !px-1.5;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=Select2] {
-  @apply !px-2;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='select2-container'] [data-taco='Select2'] {
+    @apply !m-auto !w-full;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=textarea] {
-  @apply !-mb-[8px] !pr-[5px];
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'] [data-taco='tag'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='Select2'] [data-taco='scrollarea'] {
+    @apply !my-0;
 }
-table[data-taco^=table][data-table-font-size=medium] td[data-cell-truncate=true] [data-taco=textarea] {
-  @apply !pb-[5px];
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='textarea'] {
+    @apply !py-[3px] !leading-4;
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=input-container] [data-affix-type=postfix] button {
-  @apply z-10;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply z-10 !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)];
 }
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=input-container] [data-affix-type=postfix]:not([data-taco=icon-button]),
-table[data-taco^=table][data-table-font-size=medium] td [data-taco=input-container] [data-affix-type=prefix]:not([data-taco=icon-button]) {
-  @apply z-10;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button']), table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button']) {
+        @apply z-10;
+    }
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button'])[data-taco='icon'], table[data-taco^='table'][data-table-font-size='small'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button'])[data-taco='icon'] {
+            @apply !h-4 !w-4;
+        }
+
+table[data-taco^='table'][data-table-font-size='small'] td [role='combobox'] {
+    @apply !flex;
 }
-table[data-taco^=table][data-table-font-size=large] td > [data-taco=spinner] {
-  @apply !h-6 !w-6;
+
+table[data-taco^='table'][data-table-font-size='small'] td [role='combobox'] [data-taco='input'] {
+        @apply !pr-7;
+    }
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='checkbox'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='checkbox-container'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='switch'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='switch-container'] {
+    @apply !-my-0.5;
 }
-table[data-taco^=table][data-table-font-size=large] td > [data-taco=button],
-table[data-taco^=table][data-table-font-size=large] td > [data-taco=icon-button] {
-  @apply !-my-1;
+
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='checkbox-container'] [data-taco='checkbox'],
+table[data-taco^='table'][data-table-font-size='small'] td [data-taco='switch-container'] [data-taco='switch'] {
+    @apply !my-0;
 }
-table[data-taco^=table][data-table-font-size=large] td > [data-taco=icon] {
-  @apply !-my-0.5;
+
+/* medium font size */
+table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='spinner'] {
+    @apply !h-5 !w-5;
 }
-table[data-taco^=table][data-table-font-size=large] td [role=combobox] {
-  @apply !flex;
+
+table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='button'],
+table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='icon-button'] {
+    @apply !-my-1.5;
 }
-table[data-taco^=table][data-table-font-size=large] td [role=combobox] [data-taco=input] {
-  @apply !pr-11;
+
+table[data-taco^='table'][data-table-font-size='medium'] td > [data-taco='icon'] {
+    @apply !-my-0.5;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=select2-container],
-table[data-taco^=table][data-table-font-size=large] td [data-taco=Select2],
-table[data-taco^=table][data-table-font-size=large] td [data-taco=textarea] {
-  @apply !-mx-[11px] !-mb-[7.5px] !-mt-[8.5px] !w-[calc(100%_+_22px)] focus:z-10;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='tag'] {
+    @apply !-my-0.5;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=input-container]:has([data-taco=input]) {
-  @apply !-mx-[11px] !w-auto;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [role='combobox'] {
+    @apply !flex;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=input-container]:has([data-taco=input]) [data-taco=input] {
-  @apply !-mb-[7.5px] !-mt-[8.5px] !w-[calc(100%_+_22px)] focus:z-10;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [role='combobox'] [data-taco='input'] {
+        @apply !pr-9;
+    }
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='select2-container'],
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='Select2'],
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='textarea'] {
+    @apply !-mx-[9px] !-my-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=select2-container] [data-taco=Select2] {
-  @apply !m-auto !w-full;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container']:has([data-taco='input']) {
+    @apply !-mx-[9px] !w-auto;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=Select2] {
-  @apply !px-2.5;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container']:has([data-taco='input']) [data-taco='input'] {
+        @apply !-my-[6px] !min-h-[theme(spacing.8)] !w-[calc(100%_+_16px)] focus:z-10;
+    }
+
+table[data-taco^='table'][data-table-font-size='medium'] td[data-cell-align='right'] [data-taco='input'],
+table[data-taco^='table'][data-table-font-size='medium'] td[data-cell-align='right'] [data-taco='textarea'] {
+    @apply pr-1.5;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=Select2] [data-taco=tag] {
-  @apply !my-0 !mt-px;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='select2-container'] [data-taco='Select2'] {
+    @apply !m-auto !w-full;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=textarea] {
-  @apply !py-[7.5px];
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='Select2'] [data-taco='tag'] {
+    @apply !my-0;
 }
-table[data-taco^=table][data-table-font-size=large] td:not([data-cell-truncate=true]) > [data-taco=textarea] {
-  @apply !pb-[8.5px];
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='Select2'] {
+    @apply !px-2;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=input],
-table[data-taco^=table][data-table-font-size=large] td [data-taco=Select2],
-table[data-taco^=table][data-table-font-size=large] td [data-taco=textarea] {
-  @apply h-10 px-2.5 text-base;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='textarea'] {
+    @apply !-mb-[8px] !pr-[5px];
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=textarea] {
-  @apply !pb-[8px] !leading-6;
+
+table[data-taco^='table'][data-table-font-size='medium'] td[data-cell-truncate='true'] [data-taco='textarea'] {
+    @apply !pb-[5px];
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=input-container] [data-affix-type=postfix] button {
-  @apply z-10 !h-10 !w-10;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply z-10;
 }
-table[data-taco^=table][data-table-font-size=large] td [data-taco=input-container] [data-affix-type=postfix]:not([data-taco=icon-button]),
-table[data-taco^=table][data-table-font-size=large] td [data-taco=input-container] [data-affix-type=prefix]:not([data-taco=icon-button]) {
-  @apply z-10;
+
+table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button']), table[data-taco^='table'][data-table-font-size='medium'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button']) {
+        @apply z-10;
+    }
+
+/* large font size */
+table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='spinner'] {
+    @apply !h-6 !w-6;
 }
-table[data-taco^=table] > tbody > tr:not([data-row-selected]) > td {
-  @apply bg-white;
+
+table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='button'],
+table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='icon-button'] {
+    @apply !-my-1;
 }
-table[data-taco^=table] > tbody > tr:not([data-row-selected]):hover > td,
-table[data-taco^=table] > tbody > tr:not([data-row-selected])[data-row-active] > td,
-table[data-taco^=table] > tbody > tr:not([data-row-selected])[data-row-group] > td {
-  --table-row-actions-shadow: theme(colors.grey.100);
-  @apply bg-grey-100 print:bg-white;
+
+table[data-taco^='table'][data-table-font-size='large'] td > [data-taco='icon'] {
+    @apply !-my-0.5;
 }
-table[data-taco^=table] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted=true] {
-  --table-row-actions-shadow: #e9f2ff;
-  @apply !bg-[#e9f2ff];
+
+table[data-taco^='table'][data-table-font-size='large'] td [role='combobox'] {
+    @apply !flex;
 }
-table[data-taco^=table] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted=current] {
-  --table-row-actions-shadow: #bdd7fc;
-  @apply !bg-[#bdd7fc];
+
+table[data-taco^='table'][data-table-font-size='large'] td [role='combobox'] [data-taco='input'] {
+        @apply !pr-11;
+    }
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='select2-container'],
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='Select2'],
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='textarea'] {
+    @apply !-mx-[11px] !-mb-[7.5px] !-mt-[8.5px] !w-[calc(100%_+_22px)] focus:z-10;
 }
-table[data-taco^=table] > tbody > tr[data-row-selected] > td {
-  @apply bg-blue-100;
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container']:has([data-taco='input']) {
+    @apply !-mx-[11px] !w-auto;
 }
-table[data-taco^=table] > tbody > tr[data-row-selected]:hover > td,
-table[data-taco^=table] > tbody > tr[data-row-selected][data-row-active] > td,
-table[data-taco^=table] > tbody > tr[data-row-selected][data-row-group] > td {
-  --table-row-actions-shadow: #d6e3f6;
-  @apply bg-[#d6e3f6];
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container']:has([data-taco='input']) [data-taco='input'] {
+        @apply !-mb-[7.5px] !-mt-[8.5px] !w-[calc(100%_+_22px)] focus:z-10;
+    }
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='select2-container'] [data-taco='Select2'] {
+    @apply !m-auto !w-full;
 }
-table[data-taco^=table] > tbody > tr[data-row-selected] > td[data-cell-highlighted] {
-  --table-row-actions-shadow: #b4d2fd;
-  @apply !bg-[#b4d2fd];
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='Select2'] {
+    @apply !px-2.5;
 }
-table[data-taco^=table]:focus-within > tbody > tr:not([data-row-selected])[data-row-active] > td {
-  --table-row-actions-shadow: theme(colors.grey.200);
-  @apply bg-grey-200;
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='Select2'] [data-taco='tag'] {
+    @apply !my-0 !mt-px;
 }
-table[data-taco^=table]:focus-within > tbody > tr[data-row-selected][data-row-active] > td {
-  --table-row-actions-shadow: #ccd8eb;
-  @apply bg-[#ccd8eb];
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='textarea'] {
+    @apply !py-[7.5px];
 }
-table[data-taco^=table][data-table-pause-hover=true] > tbody > tr:hover:not([data-row-selected]):not([data-row-active]) > td {
-  --table-row-actions-shadow: theme(colors.white);
-  @apply bg-white;
+
+table[data-taco^='table'][data-table-font-size='large'] td:not([data-cell-truncate='true']) > [data-taco='textarea'] {
+    @apply !pb-[8.5px];
 }
-table[data-taco^=table][data-table-pause-hover=true] > tbody > tr:hover:not([data-row-selected])[data-row-active] > td {
-  --table-row-actions-shadow: theme(colors.grey.200);
-  @apply bg-grey-200;
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input'],
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='Select2'],
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='textarea'] {
+    @apply h-10 px-2.5 text-base;
 }
-table[data-taco^=table][data-table-pause-hover=true] > tbody > tr:hover[data-row-selected]:not([data-row-active]) > td {
-  --table-row-actions-shadow: theme(colors.blue.100);
-  @apply bg-blue-100;
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='textarea'] {
+    @apply !pb-[8px] !leading-6;
 }
-table[data-taco^=table][data-table-pause-hover=true] > tbody > tr:hover[data-row-selected][data-row-active] > td {
-  --table-row-actions-shadow: #ccd8eb;
-  @apply bg-[#CCD8EB];
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply z-10 !h-10 !w-10;
 }
-table[data-taco^=table] tbody tr[data-row-meta-layout=heading]:not([data-row-group=true]) td {
-  @apply !border-b-0 border-t font-bold;
+
+table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container'] [data-affix-type='postfix']:not([data-taco='icon-button']), table[data-taco^='table'][data-table-font-size='large'] td [data-taco='input-container'] [data-affix-type='prefix']:not([data-taco='icon-button']) {
+        @apply z-10;
+    }
+
+/* row/cell backgrounds -- we have to be specific so that nested tables don't inherit */
+/* normal rows */
+table[data-taco^='table'] > tbody > tr:not([data-row-selected]) > td {
+            @apply bg-white;
+        }
+table[data-taco^='table'] > tbody > tr:not([data-row-selected]):hover > td,
+        table[data-taco^='table'] > tbody > tr:not([data-row-selected])[data-row-active] > td,
+        table[data-taco^='table'] > tbody > tr:not([data-row-selected])[data-row-group] > td {
+            --table-row-actions-shadow: theme(colors.grey.100);
+            @apply bg-grey-100 print:bg-white;
+        }
+/* search highlighting */
+table[data-taco^='table'] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted='true'] {
+            --table-row-actions-shadow: #e9f2ff;
+            @apply !bg-[#e9f2ff];
+        }
+table[data-taco^='table'] > tbody > tr:not([data-row-selected]) > td[data-cell-highlighted='current'] {
+            --table-row-actions-shadow: #bdd7fc;
+            @apply !bg-[#bdd7fc];
+        }
+/* selected rows */
+table[data-taco^='table'] > tbody > tr[data-row-selected] > td {
+            @apply bg-blue-100;
+        }
+table[data-taco^='table'] > tbody > tr[data-row-selected]:hover > td,
+        table[data-taco^='table'] > tbody > tr[data-row-selected][data-row-active] > td,
+        table[data-taco^='table'] > tbody > tr[data-row-selected][data-row-group] > td {
+            --table-row-actions-shadow: #d6e3f6;
+            @apply bg-[#d6e3f6];
+        }
+/* search highlighting */
+table[data-taco^='table'] > tbody > tr[data-row-selected] > td[data-cell-highlighted] {
+            --table-row-actions-shadow: #b4d2fd;
+            @apply !bg-[#b4d2fd];
+        }
+
+/* normal rows */
+
+table[data-taco^='table']:focus-within > tbody > tr:not([data-row-selected])[data-row-active] > td {
+            --table-row-actions-shadow: theme(colors.grey.200);
+            @apply bg-grey-200;
+        }
+
+/* selected rows */
+
+table[data-taco^='table']:focus-within > tbody > tr[data-row-selected][data-row-active] > td {
+            --table-row-actions-shadow: #ccd8eb;
+            @apply bg-[#ccd8eb];
+        }
+
+/* normal rows */
+
+table[data-taco^='table'][data-table-pause-hover='true'] > tbody > tr:hover:not([data-row-selected]):not([data-row-active]) > td {
+            --table-row-actions-shadow: theme(colors.white);
+            @apply bg-white;
+        }
+
+table[data-taco^='table'][data-table-pause-hover='true'] > tbody > tr:hover:not([data-row-selected])[data-row-active] > td {
+            --table-row-actions-shadow: theme(colors.grey.200);
+            @apply bg-grey-200;
+        }
+
+/* selected rows */
+
+table[data-taco^='table'][data-table-pause-hover='true'] > tbody > tr:hover[data-row-selected]:not([data-row-active]) > td {
+            --table-row-actions-shadow: theme(colors.blue.100);
+            @apply bg-blue-100;
+        }
+
+table[data-taco^='table'][data-table-pause-hover='true'] > tbody > tr:hover[data-row-selected][data-row-active] > td {
+            --table-row-actions-shadow: #ccd8eb;
+            @apply bg-[#CCD8EB];
+        }
+
+/* row metadata */
+table[data-taco^='table'] tbody tr[data-row-meta-layout='heading']:not([data-row-group='true']) td {
+    @apply !border-b-0 border-t font-bold;
 }
-table[data-taco^=table] tbody tr[data-row-group=true] + tr[data-row-meta-layout=heading] td {
-  @apply !border-t-0;
+
+table[data-taco^='table'] tbody tr[data-row-group='true'] + tr[data-row-meta-layout='heading'] td {
+    @apply !border-t-0;
 }
-table[data-taco^=table] tbody tr[data-row-meta-layout=summary]:not([data-row-group=true]) td {
-  @apply !border-b-0 font-bold;
+
+table[data-taco^='table'] tbody tr[data-row-meta-layout='summary']:not([data-row-group='true']) td {
+    @apply !border-b-0 font-bold;
 }
-table[data-taco^=table] tbody tr[data-row-meta-layout=item]:not([data-row-group=true]) td {
-  @apply !border-b-0;
+
+table[data-taco^='table'] tbody tr[data-row-meta-layout='item']:not([data-row-group='true']) td {
+    @apply !border-b-0;
 }
 
-/* src/components/Table/components/Table.css */
+/* rows */
 .yt-table__row {
-  @apply border-grey-300 flex border-b;
-  min-height: 2.5rem;
+    @apply border-grey-300 flex border-b;
+    min-height: 2.5rem;
 }
-.yt-table__cell > [data-taco=button],
-.yt-table__cell > [data-taco=icon-button] {
-  @apply -mt-1 -mb-1 flex;
+
+/* cells */
+.yt-table__cell > [data-taco='button'],
+.yt-table__cell > [data-taco='icon-button'] {
+    @apply -mt-1 -mb-1 flex;
 }
-.yt-table__row.yt-table__row--dragging .yt-table__cell.yt-table__cell--draggable [data-taco=icon] {
-  @apply text-white;
+
+.yt-table__row.yt-table__row--dragging .yt-table__cell.yt-table__cell--draggable [data-taco='icon'] {
+    @apply text-white;
 }
-.yt-table__cell.yt-table__cell--draggable [data-taco=icon]:active {
-  @apply cursor-grabbing;
+
+.yt-table__cell.yt-table__cell--draggable [data-taco='icon']:active {
+    @apply cursor-grabbing;
 }
-.yt-table__row:hover .yt-table__cell.yt-table__cell--draggable [data-taco=icon] {
-  @apply visible;
+
+.yt-table__row:hover .yt-table__cell.yt-table__cell--draggable [data-taco='icon'] {
+    @apply visible;
 }
+
+/* head */
 .yt-table__head .yt-table__row {
-  @apply h-auto w-full select-none border-t-0 border-b-2 font-bold;
+    @apply h-auto w-full select-none border-t-0 border-b-2 font-bold;
 }
+
 .yt-table__head .yt-table__head__group {
-  @apply flex flex-1 flex-wrap;
+    @apply flex flex-1 flex-wrap;
 }
+
 .yt-table__head .yt-table__head__group .yt-table__cell.yt-table__cell__group {
-  @apply border-grey-300 border-b;
-  flex-basis: 100%;
+    @apply border-grey-300 border-b;
+    flex-basis: 100%;
 }
+
 .yt-table__head .yt-table__head__group + .yt-table__head__group {
-  @apply border-grey-300 border-l;
+    @apply border-grey-300 border-l;
 }
-.yt-table__head .yt-table__cell > [data-taco=icon] {
-  @apply flex-shrink-0;
+
+.yt-table__head .yt-table__cell > [data-taco='icon'] {
+    @apply flex-shrink-0;
 }
+
 .yt-table__head .yt-table__cell.yt-table__cell__group + .yt-table__cell__group {
-  @apply border-grey-300 border-l-2;
+    @apply border-grey-300 border-l-2;
 }
+
 .yt-table.yt-table--windowed.table-with-scrollbar .yt-table__head {
-  padding-right: 14px;
+    padding-right: 14px;
 }
+
+/* body */
+
 .yt-table__body .yt-table__row:first-child {
-  @apply border-t-0;
+    @apply border-t-0;
 }
+
 .yt-table__body .yt-table__row.yt-table__row--clickable:hover,
 .yt-table__body .yt-table__row.yt-table__row--clickable.yt-table__row--active:hover {
-  @apply cursor-pointer;
+    @apply cursor-pointer;
 }
+
 .yt-table__body .yt-table__row.yt-table__row__unselectable:hover,
 .yt-table__body .yt-table__row.yt-table__row__unselectable.yt-table__row--active:hover {
-  @apply cursor-default;
+    @apply cursor-default;
 }
+
 .yt-table__body .yt-table__row.yt-table__row--active {
-  @apply wcag-grey-200;
+    @apply wcag-grey-200;
 }
+
 .yt-table__body .yt-table__row.yt-table__row--dragging,
 .yt-table__body .yt-table__row.yt-table__row--dragging:hover {
-  @apply bg-blue-500 text-white;
+    @apply bg-blue-500 text-white;
 }
+
+/* edit */
 .yt-table__body .yt-table__row.yt-table__row--editing {
-  @apply border-grey-300 border-t;
+    @apply border-grey-300 border-t;
 }
+
 .yt-table__body .yt-table__row.yt-table__row--editing,
 .yt-table__body .yt-table__row.yt-table__row--editing:hover {
-  @apply wcag-grey-50;
+    @apply wcag-grey-50;
 }
+
 .yt-table__body .yt-table__row.yt-table__row--editing .yt-table__cell {
-  @apply overflow-visible;
-  overflow-wrap: normal;
+    @apply overflow-visible;
+    overflow-wrap: normal;
 }
-.yt-table__cell [data-taco=label] {
-  @apply -my-2 pb-0 text-transparent;
-  min-height: theme("spacing.10");
+
+.yt-table__cell [data-taco='label'] {
+    @apply -my-2 pb-0 text-transparent;
+    min-height: theme('spacing.10');
 }
-.yt-table__cell [data-taco=label] > *:not([data-taco="label"]__message) {
-  @apply mt-1;
+
+.yt-table__cell [data-taco='label'] > *:not([data-taco='label']__message) {
+    @apply mt-1;
 }
-.yt-table__body .yt-table__row.yt-table__row--editing .yt-table__cell [data-taco=label] > *:not([data-taco="label"]__message) {
-  @apply -mt-5;
+
+.yt-table__body .yt-table__row.yt-table__row--editing .yt-table__cell [data-taco='label'] > *:not([data-taco='label']__message) {
+    @apply -mt-5;
 }
-.yt-table__cell [data-taco="label"] > [data-taco="label"]__message {
-  @apply mb-1;
+
+.yt-table__cell [data-taco='label'] > [data-taco='label']__message {
+    @apply mb-1;
 }
+
+/* drag */
 #yt-table__drag__placeholder {
-  @apply flex w-3/12 rounded bg-blue-500 p-4 font-bold text-white;
-}
-
-/* src/components/Table3/style.css */
-table[data-taco=table3][data-table-editing-mode=detailed] td [data-taco=input]:focus,
-table[data-taco=table3][data-table-editing-mode=detailed] td [data-taco=textarea]:focus {
-  @apply yt-focus-dark;
-}
-table[data-taco=table3] td:focus {
-  @apply rounded-sm ring-2 ring-inset ring-[#4573D2];
-}
-table[data-taco=table3] [data-taco=checkbox][data-focus=programmatic]:focus {
-  @apply yt-focus;
-}
-table[data-taco=table3][data-table-editing-mode] tbody tr:not([data-row-active=true]):hover td [data-taco=input],
-table[data-taco=table3][data-table-editing-mode] tbody tr:not([data-row-active=true]):hover td [data-taco=textarea],
-table[data-taco=table3][data-table-editing-mode] tbody tr:not([data-row-active=true]):hover td [data-taco=Select2] {
-  @apply bg-grey-100;
-}
-table[data-taco=table3][data-table-editing-mode] tbody tr:not([data-row-active=true]):hover td [data-taco=switch] {
-  @apply opacity-50;
-}
-table[data-taco=table3][data-table-editing-mode] tbody tr[data-row-editing-move=true] {
-  @apply rounded border-2 border-blue-500 px-px;
-}
-table[data-taco=table3][data-table-editing-mode] tbody tr[data-row-editing-move=true] td {
-  @apply z-30 border-b-0;
-}
-table[data-taco=table3][data-table-editing-mode] tbody tr[data-row-editing-move=true] > td:first-child {
-  @apply rounded-l;
-}
-table[data-taco=table3][data-table-editing-mode] tbody tr[data-row-editing-move=true] > td:last-child {
-  @apply rounded-l;
-}
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true] > td,
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true] > td,
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true] > td {
-  --table-row-actions-shadow: #ffe4de;
-  @apply bg-[#ffede9];
-}
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true]:hover > td,
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true][data-row-group] > td,
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true]:hover > td,
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true][data-row-group] > td,
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true]:hover > td,
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true][data-row-group] > td {
-  --table-row-actions-shadow: #ffe4de;
-  @apply bg-[#ffe4de];
-}
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true][data-row-active] > td,
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true][data-row-active]:hover > td,
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true][data-row-active] > td,
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true][data-row-active]:hover > td,
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true][data-row-active] > td,
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true][data-row-active]:hover > td {
-  --table-row-actions-shadow: theme(colors.red.100);
-  @apply bg-red-100;
-}
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true] > td[data-cell-highlighted],
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true] > td[data-cell-highlighted],
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true] > td[data-cell-highlighted] {
-  --table-row-actions-shadow: #b4d2fd;
-  @apply !bg-[#b4d2fd];
-}
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=input],
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=textarea],
-table[data-taco=table3] > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=Select2],
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=input],
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=textarea],
-table[data-taco=table3]:focus-within > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=Select2],
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=input],
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=textarea],
-table[data-taco=table3][data-table-pause-hover=true] > tbody > tr[data-row-editing-invalid=true]:not([data-row-active=true]) td [data-taco=Select2] {
-  @apply !bg-transparent;
-}
-/*# sourceMappingURL=index.css.map */
+    @apply flex w-3/12 rounded bg-blue-500 p-4 font-bold text-white;
+}
+
+/* editing */
+table[data-taco='table3'][data-table-editing-mode='detailed'] td [data-taco='input']:focus,
+table[data-taco='table3'][data-table-editing-mode='detailed'] td [data-taco='textarea']:focus {
+    @apply yt-focus-dark;
+}
+
+table[data-taco='table3'] td:focus {
+    @apply rounded-sm ring-2 ring-inset ring-[#4573D2];
+}
+
+table[data-taco='table3'] [data-taco='checkbox'][data-focus='programmatic']:focus {
+    @apply yt-focus;
+}
+
+table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='input'],
+table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='textarea'],
+table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='Select2'] {
+    @apply bg-grey-100;
+}
+
+table[data-taco='table3'][data-table-editing-mode] tbody tr:not([data-row-active='true']):hover td [data-taco='switch'] {
+    @apply opacity-50;
+}
+
+table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] {
+    @apply rounded border-2 border-blue-500 px-px;
+}
+
+table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] td {
+        @apply z-30 border-b-0;
+    }
+
+table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] > td:first-child {
+        @apply rounded-l;
+    }
+
+table[data-taco='table3'][data-table-editing-mode] tbody tr[data-row-editing-move='true'] > td:last-child {
+        @apply rounded-l;
+    }
+
+/* invalid rows */
+
+table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true'] > td, table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true'] > td, table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true'] > td {
+            --table-row-actions-shadow: #ffe4de;
+            @apply bg-[#ffede9];
+        }
+
+table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true']:hover > td,
+        table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true'][data-row-group] > td,
+        table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true']:hover > td,
+        table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true'][data-row-group] > td,
+        table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true']:hover > td,
+        table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true'][data-row-group] > td {
+            --table-row-actions-shadow: #ffe4de;
+            @apply bg-[#ffe4de];
+        }
+
+table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true'][data-row-active] > td,
+        table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true'][data-row-active]:hover > td,
+        table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true'][data-row-active] > td,
+        table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true'][data-row-active]:hover > td,
+        table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true'][data-row-active] > td,
+        table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true'][data-row-active]:hover > td {
+            --table-row-actions-shadow: theme(colors.red.100);
+            @apply bg-red-100;
+        }
+
+/* search highlighting */
+
+table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true'] > td[data-cell-highlighted], table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true'] > td[data-cell-highlighted], table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true'] > td[data-cell-highlighted] {
+            --table-row-actions-shadow: #b4d2fd;
+            @apply !bg-[#b4d2fd];
+        }
+
+table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='input'],
+        table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='textarea'],
+        table[data-taco='table3'] > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='Select2'],
+        table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='input'],
+        table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='textarea'],
+        table[data-taco='table3']:focus-within > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='Select2'],
+        table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='input'],
+        table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='textarea'],
+        table[data-taco='table3'][data-table-pause-hover='true'] > tbody > tr[data-row-editing-invalid='true']:not([data-row-active='true']) td [data-taco='Select2'] {
+            @apply !bg-transparent;
+        }