/* =============================================================================
   pizarron-texto.css  -  reglas del motor de texto (frente MOTOR)
   Se carga DESPUES de app.css (ver index.html) y aplica a AMBOS contextos:
     - editor      : .tx-box  .tx-root  > p|h1..h4|ul|ol|li
     - presentacion : .pp-textbox .pp-tx-root > p|h1..h4|ul|ol|li
   para garantizar PARIDAD WYSIWYG editor<->presentacion.

   INTERLINEADO (causa raiz del reporte de Cesar #2: "el espacio entre renglones
   de repente se aumenta demasiado"):
     * El default de bloque es line-height NUMERICO 1.15 (single spacing tipo Word).
       Numerico (sin unidad) => cada linea escala con SU propio font-size; una linea
       con texto grande crece (WYSIWYG correcto) sin arrastrar a las demas.
     * La segunda mitad del bug la corrige el motor JS: los parrafos VACIOS ya no
       conservan un <span style="font-size:Ngrande"><br></span> que inflaba el line
       box (ver _normalizarParrafosVacios en pizarron-texto.js).

   !important + :not([style*="line-height"]) -- POR QUE:
     El CSS scoped del componente (.widget .tx-root p, .pp-tx-root p) recibe de Blazor
     un atributo de scope [b-xxxxx] que le sube la especificidad por encima de estos
     selectores globales; sin !important el default scoped (line-height:1.5) ganaria.
     El :not([style*="line-height"]) es la valvula de escape del CONTROL por-bloque:
     cuando aplicarInterlineado() fija line-height inline en el bloque, esta regla deja
     de casar y el valor inline gana (no pelea contra el !important). Para listas el
     interlineado se fija en el <ul>/<ol>, por eso el :not() va en el contenedor.
   ============================================================================= */

/* --- default de interlineado: bloques SIN line-height inline --- */
.tx-box .tx-root > p:not([style*="line-height"]),
.tx-box .tx-root > h1:not([style*="line-height"]),
.tx-box .tx-root > h2:not([style*="line-height"]),
.tx-box .tx-root > h3:not([style*="line-height"]),
.tx-box .tx-root > h4:not([style*="line-height"]),
.pp-textbox .pp-tx-root > p:not([style*="line-height"]),
.pp-textbox .pp-tx-root > h1:not([style*="line-height"]),
.pp-textbox .pp-tx-root > h2:not([style*="line-height"]),
.pp-textbox .pp-tx-root > h3:not([style*="line-height"]),
.pp-textbox .pp-tx-root > h4:not([style*="line-height"]) {
    line-height: 1.15 !important;
}

/* listas: el interlineado por-bloque se fija en el <ul>/<ol>; si el contenedor no lo
   lleva, el default 1.15 aplica a sus <li>. */
.tx-box .tx-root > ul:not([style*="line-height"]) > li,
.tx-box .tx-root > ol:not([style*="line-height"]) > li,
.pp-textbox .pp-tx-root > ul:not([style*="line-height"]) > li,
.pp-textbox .pp-tx-root > ol:not([style*="line-height"]) > li {
    line-height: 1.15 !important;
}

/* --- margenes de parrafo en em del TEXTO BASE de la caja (el <p>/<h4> tienen
   font-size relativo a --tx-base, NO al span interno): identicos editor/presentacion
   para paridad. Sin !important: refuerzan el valor que ya comparte el CSS scoped. --- */
.tx-box .tx-root > p,
.pp-textbox .pp-tx-root > p { margin: .25em 0; }

.tx-box .tx-root > h1, .tx-box .tx-root > h2, .tx-box .tx-root > h3, .tx-box .tx-root > h4,
.pp-textbox .pp-tx-root > h1, .pp-textbox .pp-tx-root > h2, .pp-textbox .pp-tx-root > h3, .pp-textbox .pp-tx-root > h4 { margin: 0 0 .5em; }
