/* Panel Trazo del Estudio de diseño (panel-trazo.js): estilos de línea y pespuntes (#59) y
   fornituras a lo largo del trazado (#61). Usa las variables y clases de estudio.css. */

/* ---------- Estilo de la línea: continuo, discontinuo, punteado y doble pespunte ---------- */
.trazo-linea { display: grid; gap: 10px; }
.trazo-linea[hidden] { display: none; }
.trazo-estilos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
.trazo-estilos .relleno-modo { justify-content: flex-start; min-width: 0; }
.trazo-estilos .relleno-modo span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.trazo-puntadas { display: grid; gap: 8px; }
.trazo-puntadas[hidden] { display: none; }
.trazo-puntadas .campo { grid-template-columns: 76px minmax(0, 1fr) 56px; }
.trazo-extremos { display: flex; align-items: center; gap: 4px; font-size: 12.5px; }
.trazo-extremos[hidden] { display: none; }
.trazo-extremos > span { margin-right: auto; color: var(--secundario); }

/* ---------- Fornitura a lo largo del trazado: muestras sobre una curva ---------- */
.fornituras-trazo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.fornitura-trazo {
  display: grid;
  grid-template-rows: 38px auto;
  gap: 2px;
  padding: 4px 4px 5px;
  border: 1px solid var(--linea);
  border-radius: var(--radio);
  background: var(--hoja);
  color: var(--tinta);
  font: 500 11.5px/1.2 var(--letra);
  text-align: center;
  cursor: pointer;
}
.fornitura-trazo svg { display: block; width: 100%; height: 100%; }
.fornitura-trazo:hover:not(:disabled) { border-color: var(--tinta); }
.fornitura-trazo[aria-pressed="true"] { border-color: var(--acento); box-shadow: 0 0 0 1px var(--acento); color: var(--acento); }
.fornitura-trazo:disabled { cursor: default; }
/* «Ninguna»: ocupa la fila entera, sin dibujo. */
.fornitura-trazo[data-fornitura="ninguna"] { grid-column: 1 / -1; grid-template-rows: auto; padding: 5px 8px; }
.fornitura-ajustes { display: grid; gap: 8px; }
.fornitura-ajustes[hidden] { display: none; }
.fornitura-ajustes .relleno-modo { padding: 4px 7px; }
