/** px-alert-label styles */
.px-alert-label .alertlabel { display: inline-block; position: relative; padding: 5px; text-transform: uppercase; text-align: center; font-size: 0.8rem; line-height: 0.8rem; background-color: var(--px-alert-label-background-color--important, red); color: var(--px-alert-label-text-color--important, white); border: 1px solid var(--px-alert-label-border-color, transparent); }

.px-alert-label .svg-canvas { width: 2.2rem; height: 2.2rem; }

.px-alert-label .svg-canvas #circle, .px-alert-label .svg-canvas #polygon { stroke-width: 1px; stroke: var(--px-alert-label-border-color, transparent); }

.px-alert-label .badge { padding: 0; }

.px-alert-label .badge .label { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

.px-alert-label .important { background-color: var(--px-alert-label-background-color--important, red); color: var(--px-alert-label-text-color--important, white); }

.px-alert-label .important.badge { background: none; border: none; fill: var(--px-alert-label-background-color--important, red); }

.px-alert-label .important.badge .label { top: calculateRem(8px); }

.px-alert-label .warning { background-color: var(--px-alert-label-background-color--warning, orange); color: var(--px-alert-label-text-color--warning, white); }

.px-alert-label .warning.badge { background: none; border: none; fill: var(--px-alert-label-background-color--warning, orange); }

.px-alert-label .error { background-color: var(--px-alert-label-background-color--error, yellow); color: var(--px-alert-label-text-color--error, black); }

.px-alert-label .error.badge { background: none; border: none; fill: var(--px-alert-label-background-color--error, yellow); }

.px-alert-label .info, .px-alert-label .information { background-color: var(--px-alert-label-background-color--information, blue); color: var(--px-alert-label-text-color--information, white); }

.px-alert-label .info.badge, .px-alert-label .information.badge { background: none; border: none; fill: var(--px-alert-label-background-color--information, blue); }

.px-alert-label .info.badge .label, .px-alert-label .information.badge .label { top: calculateRem(2px); }

.px-alert-label .healthy { background-color: var(--px-alert-label-background-color--healthy, green); color: var(--px-alert-label-text-color--healthy, white); }

.px-alert-label .healthy.badge { background: none; border: none; fill: var(--px-alert-label-background-color--healthy, green); }

.px-alert-label .unknown { background-color: var(--px-alert-label-background-color--unknown, gray); color: var(--px-alert-label-text-color--unknown, white); }

.px-alert-label .unknown.badge { background: none; border: none; fill: var(--px-alert-label-background-color--unknown, gray); }

.px-alert-label .unknown.badge .label { top: calculateRem(-1px); }
