@khipu/design-system 0.3.2 → 0.3.4

package/dist/beercss/khipu-beercss.scoped.css

@@ -15,7 +15,7 @@
  *
  * AUTO-GENERATED FILE - DO NOT EDIT MANUALLY
  * Source: design-system/src/tokens/tokens.json
- * Generated: 2026-08-12T19:58:58.122Z
+ * Generated: 2026-08-12T21:28:55.469Z
  *
  * To regenerate:
  *   cd design-system && npm run tokens:generate
@@ -2424,6 +2424,12 @@
     /* Llena y centra dentro de contenedores flex (pantalla de carga); en flujo
        normal (contenedor no-flex) se reduce a su contenido. */
     flex: 1 1 auto;
+    /* Alto propio: el loader es contenido minimo por definicion, asi que sin esto la
+       card queda del alto del spinner y se lee como un recorte. Ocupa el body completo
+       de un telefono para que la pantalla de carga se lea como una pantalla y no como
+       una franja. Va aca y no en la card para que el minimo aplique solo a la carga:
+       el resto de las pantallas crece con su contenido. */
+    min-height: 36rem;
 }
 
 .kds-theme-root .kds-secure-loader-text {
@@ -7179,6 +7185,19 @@
     padding: var(--kds-spacing-0-5);
 }
 
+/* Titulo del body de la card: alineado a la izquierda, sin importar que el consumidor
+   traiga .kds-text-center. Va con especificidad de contexto (screen + card) a proposito:
+   el centrado se venia pidiendo app por app y el resultado era inconsistente entre
+   pantallas. Si alguna necesita centrarlo, el modificador explicito es
+   .kds-card-title--centered. */
+.kds-theme-root .kds-screen > .kds-card-elevated :is(h1, .kds-card-title) {
+    text-align: left;
+}
+
+.kds-theme-root .kds-screen > .kds-card-elevated :is(h1, .kds-card-title).kds-card-title--centered {
+    text-align: center;
+}
+
 /* -- Card Title -- */
 .kds-theme-root .kds-card-title {
     font-weight: var(--kds-font-weight-semibold);
@@ -7831,13 +7850,16 @@
     padding-bottom: 0;
 }
 
-/* Body card: alto mínimo estable para que NO salte entre estados de distinta altura
-   (loader/progress ↔ formulario). Solo la body card = hijo directo de `.kds-screen`
+/* Body card: crece con su contenido. Solo la body card = hijo directo de `.kds-screen`
    (los headers van dentro de `.kds-invoice-sticky-wrap`, no la afecta).
-   Flex-column para que el contenido quede arriba y el footer interno (versión / secure
-   footer) pueda pinearse al fondo con `margin-top: auto` aunque el contenido sea corto. */
+   NO lleva alto mínimo: un valor fijo deja espacio muerto en las apps cuyo contenido es
+   más bajo, y el DS lo sirve a todas por igual. Cuando el contenido es corto el footer
+   interno (versión / secure footer) queda pegado a él en vez de al fondo: su padding
+   da el respiro. Las apps que embeben el flujo en un iframe reciben la altura real por
+   el mensaje RESIZE (KTUF-239), asi que tampoco dependen de un mínimo aca.
+   Flex-column se mantiene: ordena el contenido y sostiene el `margin-top: auto` del
+   footer cuando la card sí tiene alto de sobra. */
 .kds-theme-root .kds-screen > .kds-card-elevated {
-    min-height: 36rem;
     display: flex;
     flex-direction: column;
     /* mismo radio que el header (invoice-sticky usa radius-card); el base card-elevated