@layer m3-components{.m3-status{--_bg:var(--md-sys-color-surface-container-highest);--_fg:var(--md-sys-color-on-surface-variant);--_accent:var(--md-sys-color-outline);--_h:24px;--_px:10px;--_gap:6px;--_dot:6px;--_icon:16px;align-items:center;gap:var(--_gap);box-sizing:border-box;max-width:100%;height:var(--_h);padding-inline:var(--_px);border-radius:var(--md-sys-shape-corner-full);white-space:nowrap;background:var(--_bg);color:var(--_fg);font:500 12px/16px var(--md-ref-typeface-brand);letter-spacing:.5px;vertical-align:middle;flex:none;display:inline-flex}.m3-status[data-size=s]{--_h:20px;--_px:8px;--_gap:5px;--_dot:5px;--_icon:14px}.m3-status__label{text-overflow:ellipsis;overflow:hidden}.m3-status__dot{width:var(--_dot);height:var(--_dot);border-radius:var(--md-sys-shape-corner-full);background:var(--_accent);flex:none}.m3-status__icon{--m3-icon-size:var(--_icon);color:var(--_accent)}.m3-status:has(.m3-status__dot,.m3-status__icon){padding-inline-start:calc(-2px + var(--_px))}.m3-status[data-tone=primary]{--_bg:var(--md-sys-color-primary-container);--_fg:var(--md-sys-color-on-primary-container);--_accent:var(--md-sys-color-primary)}.m3-status[data-tone=secondary]{--_bg:var(--md-sys-color-secondary-container);--_fg:var(--md-sys-color-on-secondary-container);--_accent:var(--md-sys-color-secondary)}.m3-status[data-tone=tertiary]{--_bg:var(--md-sys-color-tertiary-container);--_fg:var(--md-sys-color-on-tertiary-container);--_accent:var(--md-sys-color-tertiary)}.m3-status[data-tone=success]{--_bg:var(--md-sys-color-success-container);--_fg:var(--md-sys-color-on-success-container);--_accent:var(--md-sys-color-success)}.m3-status[data-tone=warning]{--_bg:var(--md-sys-color-warning-container);--_fg:var(--md-sys-color-on-warning-container);--_accent:var(--md-sys-color-warning)}.m3-status[data-tone=info]{--_bg:var(--md-sys-color-info-container);--_fg:var(--md-sys-color-on-info-container);--_accent:var(--md-sys-color-info)}.m3-status[data-tone=error]{--_bg:var(--md-sys-color-error-container);--_fg:var(--md-sys-color-on-error-container);--_accent:var(--md-sys-color-error)}@media (forced-colors:active){.m3-status{border:1px solid canvastext}.m3-status__dot{background:canvastext}}}@layer m3-density{:root[data-density=compact] .m3-status{--_h:22px;--_px:9px}:root[data-density=compact] .m3-status[data-size=s]{--_h:18px;--_px:7px}}
