Tabs y Accordion animados

css/sigpro.css

@@ -6913,6 +6913,32 @@
   color: oklch(28% 0.01 260);
   font-size: 1.1rem;
 }
+.collapse .collapse-content {
+  transform: scaleY(0);
+  transform-origin: top;
+  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  height: 0;
+  opacity: 0;
+}
+.collapse:has(input:checked) .collapse-content {
+  transform: scaleY(1);
+  height: auto;
+  opacity: 1;
+}
+.tab-content-inner {
+  animation: tabFadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  transform-origin: top;
+}
+@keyframes tabFadeIn {
+  from {
+    opacity: 0;
+    transform: scaleY(0.95);
+  }
+  to {
+    opacity: 1;
+    transform: scaleY(1);
+  }
+}
 @layer base {
   :where(:root),:root:has(input.theme-controller[value=light]:checked),[data-theme=light] {
     color-scheme: light;