@layer reset, tokens, base, layout, components, variants, states, utilities, overrides;
@layer reset,tokens,base,layout;@layer components{.alert{--wel-alert-bg:var(--wel-color-surface-sunken);--wel-alert-ink:var(--wel-color-ink);--wel-alert-accent:var(--wel-color-ink-muted);--wel-alert-radius:var(--wel-radius-surface);--wel-alert-padding:var(--wel-space-4);--wel-alert-gap:var(--wel-space-3);--wel-alert-icon-size:1.25em;--wel-color-accent:var(--wel-color-info);--wel-color-accent-hover:oklch(from var(--wel-color-accent) calc(l - .06) c h);--wel-color-accent-active:oklch(from var(--wel-color-accent) calc(l - .1) c h);gap:var(--wel-space-2) var(--wel-alert-gap);padding:var(--wel-alert-padding);background-color:var(--wel-alert-bg);color:var(--wel-alert-ink);border:var(--wel-border-width) solid transparent;border-inline-start:var(--wel-border-width-strong) solid var(--wel-alert-accent);border-radius:var(--wel-alert-radius);grid-template-columns:auto 1fr;display:grid}.alert>:where(*){grid-column:2;margin:0}.alert>:where(.alert-icon){inline-size:var(--wel-alert-icon-size);block-size:var(--wel-alert-icon-size);color:var(--wel-alert-accent);grid-column:1;align-self:start;margin-block-start:calc((1em * var(--wel-text-leading-normal) - var(--wel-alert-icon-size)) / 2)}.alert :where(.alert-title){color:var(--wel-alert-accent);font-weight:600}@container layout (inline-size<24rem){.alert{display:block}.alert>:where(.alert-icon){float:inline-start;margin-inline-end:var(--wel-space-2)}.alert>:where(*+*){margin-block-start:var(--wel-space-2)}.alert>:where(.alert-icon+*){margin-block-start:0}}@media (forced-colors:active){.alert{color:canvastext;background-color:canvas;border-color:canvastext}.alert>:where(.alert-icon),.alert :where(.alert-title){color:canvastext}}}@layer variants{.alert[data-tone=info]{--wel-alert-bg:var(--wel-color-info-tint);--wel-alert-accent:var(--wel-color-info);--wel-color-accent:var(--wel-color-info)}.alert[data-tone=success]{--wel-alert-bg:var(--wel-color-success-tint);--wel-alert-accent:var(--wel-color-success);--wel-color-accent:var(--wel-color-success)}.alert[data-tone=warning]{--wel-alert-bg:var(--wel-color-warning-tint);--wel-alert-accent:var(--wel-color-warning);--wel-color-accent:var(--wel-color-warning)}.alert[data-tone=danger]{--wel-alert-bg:var(--wel-color-danger-tint);--wel-alert-accent:var(--wel-color-danger);--wel-color-accent:var(--wel-color-danger)}}@layer states,utilities,overrides;