/* C6 - Equivalencias de Producto */
#tabla-equivalencias td.cellInfo,
#tabla-log-equivalencias td { vertical-align: middle; }
#tabla-equivalencias .badge { font-size: 90%; }
.btnEstadoEquivalencia { margin-left: 4px; }
#responseEquivalencia, #responseLogEquivalencia { margin-top: 10px; }
#responseEquivalencia ul { margin-bottom: 0; padding-left: 18px; }
/* B.3: fila de error en la tabla de bitacora cuando la consulta falla. */
#tabla-log-equivalencias tr.fila-log-error td {
  background-color: #f8d7da;
  color: #842029;
  text-align: center;
  font-weight: bold;
  padding: 12px;
}

/* C6 - Atajos de tarifa: alineados bajo el campo Tarifas (CSP: sin estilos inline). */
.equiv-atajos { margin-top: 4px; margin-bottom: 12px; }
.equiv-atajos-lbl { display: block; font-size: 80%; margin-bottom: 4px; }
.equiv-atajos-btns { display: flex; flex-wrap: wrap; }
.equiv-atajos-btns .btn { margin: 0 6px 6px 0; }
/* Estado activo: el relleno "seleccionado" lo da SOLO la clase .activo (la calcula el JS */
/* desde la seleccion real), y se mantiene aunque haya hover/foco encima. */
.btnTarifaPreset.activo,
.btnTarifaPreset.activo:hover,
.btnTarifaPreset.activo:focus { background-color: #6c757d; border-color: #6c757d; color: #fff; }
/* Hover/clic de un atajo NO activo: realce leve, nunca el relleno "activo" de Bootstrap. */
.btnTarifaPreset:hover { background-color: #e9ecef; border-color: #6c757d; color: #343a40; }
.btnTarifaPreset:focus { box-shadow: none; }
/* Teclado: conservar contorno de foco visible (accesibilidad) solo con :focus-visible. */
.btnTarifaPreset:focus-visible { outline: 2px solid #495057; outline-offset: 2px; box-shadow: none; }
/* 768px: los multiselect (chosen) de este formulario no exceden el ancho de su columna. */
#formEquivalencia .chosen-container { width: 100% !important; max-width: 100%; }