Estilos

Variables CSS

Personaliza cada detalle con 19 variables CSS. Sobrescríbelas en :root o acótalas a un contenedor.

Overlay & tooltip

Design tokens read by this component. Override them on the host element (or any ancestor) to customize; every default falls back to the ng-hub-ui-ds layer.

Variable	Por defecto	Tipo	Descripción
`--hub-overlay-backdrop-zindex`	`calc(var(--hub-sys-zindex-dropdown, 1000) - 1)`	number	Overlay backdrop z index
`--hub-overlay-bg`	`var(--hub-sys-surface-elevated, #f8f9fa)`	color	Overlay bg
`--hub-overlay-border-radius`	`var(--hub-sys-radius-sm, 0.25rem)`	length	Overlay border radius
`--hub-overlay-shadow`	`var(--hub-sys-shadow, 0 0.5rem 1rem rgba(0, 0, 0, 0.15))`	shadow	Overlay shadow
`--hub-overlay-zindex`	`var(--hub-sys-zindex-dropdown, 1000)`	number	Overlay z index
`--hub-tooltip-bg`	`var(--hub-ref-color-black, #000)`	color	Color de fondo del tooltip.
`--hub-tooltip-border-radius`	`var(--hub-sys-radius-md, 0.375rem)`	length	Radio de las esquinas del tooltip.
`--hub-tooltip-color`	`var(--hub-ref-color-white, #fff)`	color	Color del texto del tooltip.
`--hub-tooltip-font-family`	`var(--hub-ref-font-family-base, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif)`	string	Tooltip font family
`--hub-tooltip-font-size`	`var(--hub-ref-font-size-sm, 0.875rem)`	length	Tamaño de fuente del texto del tooltip.
`--hub-tooltip-font-weight`	`var(--hub-ref-font-weight-base, 400)`	number	Tooltip font weight
`--hub-tooltip-line-height`	`var(--hub-ref-line-height-base, 1.5)`	number	Ancho máximo antes de que el texto se ajuste.
`--hub-tooltip-max-width`	`200px`	length	Tooltip max width
`--hub-tooltip-opacity`	`0.9`	number	Opacidad del tooltip visible.
`--hub-tooltip-padding-x`	`var(--hub-ref-space-2, 0.5rem)`	length	Relleno horizontal interno del tooltip.
`--hub-tooltip-padding-y`	`var(--hub-ref-space-1, 0.25rem)`	length	Relleno vertical interno del tooltip.
`--hub-tooltip-shadow`	`none`	shadow	Tooltip box shadow
`--hub-tooltip-transition-duration`	`0.15s`	transition	Duración del fundido de entrada/salida.
`--hub-tooltip-zindex`	`var(--hub-sys-zindex-tooltip, 1080)`	number	Orden de apilamiento del elemento tooltip.