@layer components.banner{:host{--banner-accent:var(--color-primary);--banner-accent-soft:color-mix(in srgb, var(--banner-accent) var(--banner-accent-soft-mix,12%), transparent);align-items:center;gap:var(--banner-gap,1rem);padding:var(--banner-padding,1.125rem 1.5rem);border-radius:var(--banner-border-radius,var(--border-radius,14px));background:linear-gradient(135deg, var(--banner-accent-soft) 0%, transparent 65%), var(--banner-background-color,var(--color-surface,#fff));border:1px solid var(--banner-border-color,color-mix(in srgb, var(--banner-accent) 25%, transparent));box-shadow:var(--banner-box-shadow,0 1px 2px rgba(0,0,0,.04), 0 4px 16px -8px color-mix(in srgb, var(--banner-accent) 30%, transparent));color:var(--banner-color,var(--banner-text-color,var(--color-text)));contain:style;transition:box-shadow var(--duration-200) ease, transform var(--duration-200) ease;grid-template-columns:auto minmax(0,1fr) auto;display:grid;position:relative;overflow:hidden}:host([hidden]){display:none}:host([severity=info]){--banner-accent:var(--color-info,#3b82f6)}:host([severity=success]){--banner-accent:var(--color-success,#10b981)}:host([severity=warning]){--banner-accent:var(--color-warning,#f59e0b)}:host([severity=error]){--banner-accent:var(--color-error,#ef4444)}e-icon{color:var(--banner-accent);flex-shrink:0;justify-content:center;align-items:center;font-size:1.75rem;line-height:1;display:flex}e-icon ::slotted(*){color:var(--banner-accent)}e-icon:not(:has()){display:none}e-body{flex-direction:column;gap:.25rem;min-width:0;display:flex}e-headline{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}e-headline:not(:has()){display:none}e-headline ::slotted(h1){font-size:var(--banner-headline-size,1.0625rem);letter-spacing:-.01em;color:var(--banner-headline-color,var(--banner-text-color,var(--color-text,#1a1a1a)));margin:0;font-weight:600;line-height:1.3}e-headline ::slotted(h2){font-size:var(--banner-headline-size,1.0625rem);letter-spacing:-.01em;color:var(--banner-headline-color,var(--banner-text-color,var(--color-text,#1a1a1a)));margin:0;font-weight:600;line-height:1.3}e-headline ::slotted(h3){font-size:var(--banner-headline-size,1.0625rem);letter-spacing:-.01em;color:var(--banner-headline-color,var(--banner-text-color,var(--color-text,#1a1a1a)));margin:0;font-weight:600;line-height:1.3}e-headline ::slotted(h4){font-size:var(--banner-headline-size,1.0625rem);letter-spacing:-.01em;color:var(--banner-headline-color,var(--banner-text-color,var(--color-text,#1a1a1a)));margin:0;font-weight:600;line-height:1.3}e-headline ::slotted(h5){font-size:var(--banner-headline-size,1.0625rem);letter-spacing:-.01em;color:var(--banner-headline-color,var(--banner-text-color,var(--color-text,#1a1a1a)));margin:0;font-weight:600;line-height:1.3}e-headline ::slotted(h6){font-size:var(--banner-headline-size,1.0625rem);letter-spacing:-.01em;color:var(--banner-headline-color,var(--banner-text-color,var(--color-text,#1a1a1a)));margin:0;font-weight:600;line-height:1.3}e-content{overflow-wrap:anywhere;color:color-mix(in srgb, var(--banner-color,var(--color-text)) 80%, transparent);font-size:.9375rem;line-height:1.5;display:block}e-content:not(:has()){display:none}e-actions{flex-shrink:0;align-items:center;gap:.5rem;display:flex}:host(:not([has-actions])) e-actions{display:none}e-actions ::slotted(a){align-items:stretch;line-height:1;text-decoration:none;display:inline-flex}@media (width<=640px){:host{grid-template-columns:minmax(0,1fr);gap:.875rem;padding:1rem 1.125rem}e-icon{justify-content:flex-start}e-actions{border-top:1px solid color-mix(in srgb, var(--banner-accent) 15%, transparent);flex-wrap:wrap;grid-column:1/-1;justify-content:flex-end;padding-top:.75rem}}@media (prefers-reduced-motion:reduce){:host{transition:none}}@media (forced-colors:active){:host{border:2px solid}}}