/* El editor de documentos con formato: la barra encima y el papel debajo.
   Lo usan firmas.html (crear el pliego) y revisar.html (el borrador que un
   comité corrige). Capa fina sobre /meedificio.css: acá va SOLO lo propio de
   escribir un documento. */

.barra-fmt{display:flex;align-items:center;gap:var(--s7);flex-wrap:wrap;
  background:var(--mint-veil);border-radius:var(--radio) var(--radio) 0 0;
  padding:var(--s9) var(--s11)}
/* El sistema da a los select el ancho completo, que es lo correcto en un
   formulario y lo contrario de lo que necesita una barra de herramientas. */
.barra-fmt select,.barra-fmt button{background:var(--cream-paper);border:1px solid var(--border-mist);
  border-radius:var(--radio-nav);color:var(--charcoal);font-family:var(--sans);
  font-size:13px;min-width:34px;width:auto;padding:var(--s7) var(--s9);
  cursor:pointer;margin:0}
.barra-fmt button:hover{background:var(--keylime-wash);border-color:var(--forest-ink)}
.barra-fmt input[type=color]{width:34px;height:32px;border:1px solid var(--border-mist);
  border-radius:var(--radio-nav);background:var(--cream-paper);padding:3px;cursor:pointer;margin:0}
.barra-fmt .sep{width:1px;height:22px;background:var(--border-mist);margin:0 var(--s4)}

/* El documento se va a imprimir, así que se escribe sobre blanco y en serif
   desde el primer momento: ver el texto como quedará evita la sorpresa de la
   vista previa. */
.editor{background:#fff;color:#111927;border:1px solid var(--border-mist);border-top:0;
  border-radius:0 0 var(--radio) var(--radio);min-height:340px;padding:var(--s28);
  font-family:Georgia,"Times New Roman",serif;font-size:15.5px;line-height:1.7;
  outline:none;word-wrap:break-word}
/* El foco se marca con outline y no con box-shadow: el sistema no usa sombras
   en ninguna parte, y outline además respeta el alto contraste del sistema. */
.editor:focus{border-color:var(--forest-ink);outline:2px solid var(--sage-mist);
  outline-offset:-1px}
/* La pista del editor tiene que leerse: es un ejemplo de documento, no un
   adorno. #98A2AE sobre blanco daba 2,5:1. */
.editor:empty::before{content:attr(data-pista);white-space:pre-wrap;
  color:#5b6b5d;pointer-events:none}