.tabs-boxed :is(.tab-active, [aria-selected="true"]):not(.tab-disabled):not([disabled]),
.tabs-boxed :is(input:checked) {
    background-color: var(--fallback-bc, oklch(var(--bc) / var(--tw-bg-opacity)));

}

*{ 
    scrollbar-width: thin;
    scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

*::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
}

*::-webkit-scrollbar-thumb {
    background-color: var(--scrollbar-thumb);
    border-radius: 20px;
    border: 2px solid var(--scrollbar-track);
}

*{
    box-sizing: border-box;
    margin: 0;
}

/* Add to your CSS file or Tailwind config */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-20px); }
    to { opacity: 1; transform: translateY(0); }
  }
  
  @keyframes fadeOut {
    from { opacity: 1; transform: translateY(0); }
    to { opacity: 0; transform: translateY(20px); }
  }
  
  .animate-fade-in {
    animation: fadeIn 0.3s ease-out forwards;
  }
  
  .animate-fade-out {
    animation: fadeOut 0.3s ease-in forwards;
  }