/*
 * Columnas del contenido migrado.
 *
 * El reparto del ancho lo trae cada fila en una variable escrita al importar
 * (`style="--fila: 0.75fr 0.25fr"`), y no en una clase: las combinaciones son
 * abiertas —3/4 y 1/4, 3/5 y 2/5, cinco quintos…— y enumerarlas en CSS sería
 * una lista que nunca está completa.
 *
 * Se reparte en `fr` y no en porcentajes porque las `fr` reparten lo que queda
 * DESPUÉS de descontar el hueco entre columnas; con porcentajes, dos columnas al
 * 50% más el hueco se salen del ancho.
 *
 * El marcado lo genera lib/filas-legacy.ts. Lo carga la web pública
 * (globals.css) y también el panel (gestion.css).
 */

[data-seom-fila] {
  display: grid;
  /* En móvil, una debajo de otra. El reparto solo entra a partir de 960px, que
     es el corte `m` de UIkit: los anchos que guarda la maqueta son los de ese
     tamaño en adelante (`width_medium`). */
  grid-template-columns: 1fr;
  gap: 30px;
  margin: 0 0 1.15em;
}

[data-seom-columna] {
  /* Sin esto, una palabra larga o una tabla ancha estiran su columna y
     descuadran el reparto entero. */
  min-width: 0;
}

/* La primera cosa de una columna no arrastra su margen de arriba: si no, las
   columnas arrancan a distintas alturas según lleven título, imagen o texto. */
[data-seom-columna] > :first-child {
  margin-top: 0;
}

[data-seom-columna] > :last-child {
  margin-bottom: 0;
}

@media (min-width: 960px) {
  [data-seom-fila] {
    grid-template-columns: var(--fila, 1fr);
  }
}