/*
 * Oculta el icono jQuery UI (sprite ui-icon-*) en los botones que ademas
 * tienen texto visible (los botones de la barra de acciones de los
 * listados: Buscar, Exportar, Crear factura, Guardar, etc., generados por
 * `.button({icons:{primary:...}})` en toolbox-menu-init.js y equivalentes).
 *
 * No toca los botones "icon-only" (sin texto, ej. el engranaje del menu
 * "Mas...", el candado de bloqueo/desbloqueo) porque para esos el icono
 * ES el contenido del boton: ocultarlo lo dejaria vacio.
 *
 * No se toca ningun .shtml/.js: los botones se siguen armando igual con
 * `icons:{primary:'ui-icon-xxx'}`, esta hoja solo oculta el resultado
 * visual del icono cuando hay texto al lado.
 */

.ui-button-text-icon-primary .ui-button-icon-primary,
.ui-button-text-icon-secondary .ui-button-icon-secondary,
.ui-button-text-icons .ui-button-icon-primary,
.ui-button-text-icons .ui-button-icon-secondary {
  display: none !important;
}

.ui-button-text-icon-primary .ui-button-text,
.ui-button-text-icon-secondary .ui-button-text,
.ui-button-text-icons .ui-button-text {
  padding: .4em 1em !important;
}

/*
 * Excepcion: la flechita hacia abajo (`secondary: 'ui-icon-triangle-1-s'`) no
 * es decoracion, es lo que avisa que el boton DESPLIEGA un menu en vez de
 * ejecutar una accion directa: Compartir (negocio/cotizacion, OC, DTC) y
 * Etiquetar. Al ocultarla, esos botones se veian iguales a los demas y no se
 * notaba que tenian mas opciones.
 *
 * Se mantiene visible pero dibujada en CSS (triangulo con bordes, hereda el
 * color del texto del boton) en vez del sprite dentado de jQuery UI, que es
 * justo lo que esta hoja saca del resto de la barra.
 *
 * Los botones "icon-only" (el engranaje "Mas...") son `ui-button-icons-only`,
 * no `ui-button-text-icons`, asi que no entran aqui ni antes ni ahora.
 */
.ui-button-text-icons .ui-button-icon-secondary.ui-icon-triangle-1-s,
.ui-button-text-icon-secondary .ui-button-icon-secondary.ui-icon-triangle-1-s {
  display: block !important;
  background: none !important;
  position: absolute;
  right: .7em;
  top: 50%;
  width: 0;
  height: 0;
  margin-top: -2px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  opacity: .7;
}

/* Hueco para la flecha: el padding de arriba es simetrico y el texto quedaria
   debajo del triangulo. Solo en los botones que efectivamente la tienen. */
.ui-button-text-icons:has(.ui-button-icon-secondary.ui-icon-triangle-1-s) .ui-button-text,
.ui-button-text-icon-secondary:has(.ui-button-icon-secondary.ui-icon-triangle-1-s) .ui-button-text {
  padding-right: 1.9em !important;
}
