/* Quitar fondo de imagen */
.qf-trabajo { display: grid; gap: 14px; }
.qf-vista {
  display: flex; align-items: center; justify-content: center;
  max-height: 60vh; min-height: 180px; overflow: hidden; border-radius: 12px;
  background-color: #eef2f1;
  background-image:
    linear-gradient(45deg, #d5dcda 25%, transparent 25%), linear-gradient(-45deg, #d5dcda 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #d5dcda 75%), linear-gradient(-45deg, transparent 75%, #d5dcda 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0;
}
.qf-vista.qf-solido { background-image: none; background-color: transparent; }
.qf-vista canvas { display: block; max-width: 100%; max-height: 60vh; width: auto; height: auto; }
.qf-opciones { display: grid; gap: 10px; }
.qf-etiqueta { margin: 0; font-weight: 700; }
.qf-fondos { display: flex; flex-wrap: wrap; gap: 8px; }
.qf-fondo {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 14px;
  border: 1px solid var(--line); border-radius: 99px; background: transparent; color: var(--text);
  font: inherit; font-weight: 600; cursor: pointer;
}
.qf-fondo.is-activo { border-color: var(--brand); box-shadow: inset 0 0 0 1px var(--brand); }
.qf-fondo:focus-visible, .qf-fondo:focus-within { outline: 2px solid var(--brand); outline-offset: 2px; }
.qf-color input { width: 28px; height: 24px; padding: 0; border: none; background: none; cursor: pointer; }
.qf-check { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; cursor: pointer; }
.qf-check input { width: 18px; height: 18px; }
