&TabLayout{
    @apply flex flex-col bg-white dark:bg-[#212121];
}

&TabHeader{
    @apply overflow-x-auto flex bg-white dark:bg-[#212121] border-t border-x border-[#b1b1b1] dark:border-[#515151] rounded-t;
}

&TabLayout&.no-b &TabHeader{
    @apply border-none dark:border-none;
}

&TabButton{
    @apply text-base py-2 px-4 border-0 rounded-none rounded-t border-[#515151] dark:border-[#b1b1b1];
}

&TabButton&.active{
    @apply border-b-2;
}

&TabContent{
    @apply border-b border border-[#b1b1b1] dark:border-[#515151] p-4;
}

&TabContent&.no-p{
    @apply p-0;
}

&TabLayout&.no-b &TabContent{
    @apply border-0;
}
&TabLayout&.no-b &TabContent&.bt{
    @apply border-t dark:border-[#313131];
}

&TabPane{
    @apply overflow-x-auto hidden;
}

&TabPane&.active{
    @apply block;
}