/* ============================================================================
   EDICIONES (public/ediciones.js): Mesa de trabajo › Ediciones. Tren 2a del plan PLAN-ediciones-motor-2026-11; lienzo aprobado por Daniel el
   12 nov 2026. Detras de estudio.ediciones (bandera en codigo, src/ediciones-puerta.js).

   SOLO TOKENS de cuarto-oscuro.css: `paridad-cuarto-oscuro` cuenta este archivo desde el dia uno.
   Todo se parte por CONTENEDOR y no por pantalla: con el chat abierto a la CRM le tocan ~420 px aunque la ventana mida 1280.
   Forma: pildora = se toca; 16 px = flota (la tarjeta que se arrastra); 4 px = contenido. Renglones sin cajas ni rayas.
   Si llegas o no se dice con una PALABRA, no con una leyenda de colores: solo «Tarde» usa el almagre.
   Lo que vive en una hoja (#modal) NO cuelga de `.ed`: la hoja esta fuera de la pantalla, asi que sus clases van sueltas.
   ============================================================================ */

.ed{ container-type:inline-size; }
/* Las acciones de la cabecera pueden bajar de renglon en una columna angosta (en la pieza no se encogen). */
.ed .pz-cab{ flex-wrap:wrap; row-gap:var(--e-2); }
.ed .pz-cab-acc{ flex:0 1 auto; flex-wrap:wrap; justify-content:flex-end; }

/* La linea de arriba: una frase con su accion. */
.ed-pista{ margin:0 0 var(--e-2); max-width:70ch; color:var(--texto); line-height:1.5; }
.ed-pista:last-of-type{ margin-bottom:var(--e-5); }

/* Los filtros de la mesa: pildoras (se tocan). */
.ed-filtros{ display:flex; flex-wrap:wrap; gap:var(--e-1); margin:0 0 var(--e-3); }
.ed-chip{ display:inline-flex; align-items:center; gap:6px; min-height:32px; padding:0 var(--e-3); border:0; border-radius:var(--r-pildora);
  background:transparent; color:var(--medio); font-family:inherit; font-size:var(--t-texto); white-space:nowrap; cursor:pointer; }
.ed-chip .n{ color:var(--apagado); font-variant-numeric:tabular-nums; }
.ed-chip.on{ background:var(--piedra-on); color:var(--tinta); }
@media (hover:hover){ .ed-chip:not(.on):hover{ background:var(--tinte-toque); color:var(--tinta); } }

/* Una edicion en la mesa: quien, camino, promesa, verbo. */
.ed .pz-fila.ed-fila{ display:grid; grid-template-columns:32px minmax(0,1.1fr) minmax(0,1.7fr) 104px auto; gap:var(--e-4); align-items:center;
  min-height:68px; padding:var(--e-3) var(--e-2) var(--e-3) 0; cursor:pointer; }
.ed .ed-fila .pz-fila-ico{ width:32px; height:32px; }
.ed-inicial{ display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:var(--r-pildora); background:var(--piedra-on);
  color:var(--medio); font-size:var(--t-meta); font-weight:500; }
.ed-cam{ display:block; width:100%; min-width:0; padding:var(--e-1) 0; border:0; border-radius:var(--r); background:transparent; color:inherit;
  font-family:inherit; font-size:inherit; text-align:left; cursor:pointer; }
.ed-riel{ display:flex; gap:3px; }
.ed-riel i{ flex:1; height:4px; border-radius:var(--r-pildora); background:var(--piedra-on); }
.ed-riel i.h{ background:var(--texto); }
.ed-riel i.a{ background:var(--punto); }
.ed-paso{ display:block; margin-top:6px; font-size:var(--t-meta); color:var(--medio); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums; }
.ed-paso b{ font-weight:500; font-size:var(--t-texto); color:var(--tinta); }
.ed-prom{ display:flex; flex-direction:column; gap:2px; min-width:0; font-size:var(--t-meta); color:var(--medio); font-variant-numeric:tabular-nums; white-space:nowrap; }
.ed-prom b{ font-weight:400; font-size:var(--t-texto); color:var(--tinta); }
.ed-est{ font-size:var(--t-meta); color:var(--medio); }
.ed-est.justo{ color:var(--tinta); font-weight:500; }
.ed-est.tarde{ color:var(--urge); font-weight:500; }
.ed-est.espera{ color:var(--apagado); }
.ed-verbo{ justify-self:end; white-space:nowrap; color:var(--tinta); }
.ed-grupo{ margin:var(--e-5) 0 var(--e-2); font-size:var(--t-meta); color:var(--apagado); }
/* Dentro de la ficha de un trabajo (pestana Entrega): los mismos renglones, sin iniciales (el nombre es el del entregable). */
.ed-boda{ margin:0 0 var(--e-4); }
.ed-boda-t{ display:flex; align-items:center; justify-content:space-between; gap:var(--e-3); min-height:36px; font-size:var(--t-meta); color:var(--apagado); }
.ed .pz-fila.ed-fila.ed-fila-sin{ grid-template-columns:minmax(0,1fr) minmax(0,1.7fr) 104px auto; }
.ed-boda-extra:empty{ display:none; }
.ed-boda-extra{ padding:0 0 var(--e-2); }

/* Por paso: cinco momentos. La tarjeta se arrastra, por eso flota (16 px). */
.ed-cols{ display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:var(--e-3); align-items:start; }
.ed-col{ min-width:0; padding-bottom:var(--e-4); border-radius:var(--r-flota); }
.ed-col.aqui{ box-shadow:inset 0 0 0 1px var(--punto); }
.ed-col-t{ display:flex; justify-content:space-between; align-items:baseline; margin:0 0 var(--e-3); padding:0 var(--e-1); font-size:var(--t-texto); font-weight:500; color:var(--tinta); }
.ed-col-t .n{ font-weight:400; color:var(--apagado); font-variant-numeric:tabular-nums; }
.ed-tar{ display:flex; flex-direction:column; gap:3px; margin:0 0 var(--e-2); padding:var(--e-3) var(--e-3) var(--e-3) var(--e-4); border-radius:var(--r-flota);
  background:var(--piedra); cursor:pointer; }
.ed-tar[draggable="true"]{ cursor:grab; }
.ed-tar.arrastra{ box-shadow:var(--sombra-menu); opacity:.6; }
.ed-tar-t{ color:var(--tinta); line-height:1.3; overflow:hidden; text-overflow:ellipsis; }
.ed-tar-m{ font-size:var(--t-meta); color:var(--medio); }
.ed-tar .ed-est{ margin-top:var(--e-1); }
.ed-hueco{ padding:var(--e-3) var(--e-4); border-radius:var(--r-flota); box-shadow:inset 0 0 0 1px var(--linea); font-size:var(--t-meta); color:var(--apagado); }
@media (hover:hover){ .ed-tar:hover{ background:var(--piedra-on); } }

/* ---- Lo que vive en una hoja (fuera de .ed) ---- */
.ed-texto{ margin:0 0 var(--e-3); max-width:60ch; color:var(--texto); line-height:1.5; }
.ed-camino{ list-style:none; margin:0 0 var(--e-4); padding:0; }
.ed-camino li{ display:grid; grid-template-columns:20px minmax(0,1fr) auto; gap:var(--e-3); align-items:center; padding:7px 0; color:var(--apagado); }
.ed-camino li.hecho{ color:var(--medio); }
.ed-camino li.ahora{ color:var(--tinta); font-weight:500; }
.ed-pt{ display:flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:var(--r-pildora); box-shadow:inset 0 0 0 1px var(--punto); color:var(--pag); }
.ed-camino li.hecho .ed-pt{ background:var(--texto); box-shadow:none; }
.ed-camino li.ahora .ed-pt{ box-shadow:inset 0 0 0 5px var(--tinta); }
.ed-camino-f{ font-size:var(--t-meta); font-weight:400; color:var(--medio); font-variant-numeric:tabular-nums; white-space:nowrap; }
.ed-campos{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:0 var(--e-3); }
.ed-datos{ display:grid; grid-template-columns:repeat(auto-fit, minmax(120px, 1fr)); gap:var(--e-4); margin:0 0 var(--e-4); }
.ed-dato{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.ed-dato .e{ font-size:var(--t-meta); color:var(--apagado); }
.ed-dato .v{ color:var(--tinta); }
.ed-enl{ display:flex; flex-wrap:wrap; gap:var(--e-1); margin:var(--e-3) 0 0 calc(var(--e-3) * -1); }
.ed-enl a.pz-b-s{ text-decoration:none; }
.ed-corto{ max-width:240px; }
.ed-nota{ display:block; margin-top:var(--e-1); font-size:var(--t-meta); color:var(--apagado); line-height:1.4; }

/* «Traer mis trabajos»: una casilla por trabajo. */
.ed-casillas{ display:flex; flex-direction:column; max-height:44vh; overflow:auto; }
.ed-casilla{ display:flex; align-items:center; gap:var(--e-3); min-height:48px; padding:var(--e-1) 0; cursor:pointer; }
.ed-casilla input{ flex:none; width:18px; height:18px; accent-color:var(--tinta); }
.ed-casilla-txt{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.ed-casilla-t{ color:var(--tinta); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ed-casilla-m{ font-size:var(--t-meta); color:var(--medio); }

/* «Mis dias de edicion»: siete pildoras. */
.ed-dias{ display:flex; flex-wrap:wrap; gap:var(--e-2); }
.ed-dia{ display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:36px; padding:0 var(--e-3); border:0; border-radius:var(--r-pildora);
  background:transparent; box-shadow:inset 0 0 0 1px var(--linea); color:var(--medio); font-family:inherit; font-size:var(--t-texto); cursor:pointer; }
.ed-dia.on{ background:var(--tinta); box-shadow:none; color:var(--pag); }

/* ---- Columna angosta (el chat abierto) y telefono: el renglon se apila y el tablero se desliza de lado ---- */
@container (max-width: 720px){
  .ed .pz-cifras, .ed .pz-cifras[data-n="3"]{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--e-4) var(--e-5); }
  .ed .pz-fila.ed-fila{ grid-template-columns:32px minmax(0,1fr) auto; grid-template-areas:"i q a" "c c c" "p p p"; gap:var(--e-2) var(--e-3); padding:var(--e-3) 0; }
  .ed .ed-fila .pz-fila-ico{ grid-area:i; }
  .ed .ed-fila .pz-fila-txt{ grid-area:q; }
  .ed .ed-fila .ed-verbo{ grid-area:a; }
  .ed .ed-fila .ed-cam{ grid-area:c; }
  .ed .ed-fila .ed-prom{ grid-area:p; flex-direction:row; align-items:baseline; gap:var(--e-3); }
  .ed .pz-fila.ed-fila.ed-fila-sin{ grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"q a" "c c" "p p"; }
  .ed-cols{ grid-template-columns:repeat(5, minmax(220px, 1fr)); overflow-x:auto; scroll-snap-type:x proximity; padding-bottom:var(--e-2); }
  .ed-col{ scroll-snap-align:start; }
}