html, body {
  height: 100vh;
  max-width: 100vw; /* Ensure it takes full viewport width */
  background: #2A7B9B;
background: linear-gradient(180deg,rgba(42, 123, 155, 1) 0%, rgba(17, 27, 92, 1) 53%, rgba(42, 123, 155, 1) 100%);
}


.existing-interactives {
  box-shadow: inset 0px 10px 20px -10px rgba(0,0,0,0.4);
}

.accordion-content {
    /* This is the <tr>. It will be shown/hidden using the 'hidden' class (display: none).
       No max-height or overflow here anymore for animation purposes. */
    background-color: #f9fafb; /* Corresponds to bg-gray-50 */
}

.accordion-animatable-content {
    /* This is the inner div that will be animated.
       Initial state is set inline in HTML: max-height: 0; overflow: hidden; */
    transition: max-height 0.3s ease-out;
    /* Padding is already applied to this div via Tailwind p-4 class */
}
