.saas-bell{min-block-size:0;max-block-size:inherit;flex-direction:column;display:flex}.saas-bell__head{justify-content:space-between;align-items:flex-start;gap:var(--saas-space-sm);padding:var(--saas-space-md) var(--saas-space-md) var(--saas-space-sm);border-radius:var(--saas-radius-lg) var(--saas-radius-lg) 0 0;background:linear-gradient(180deg, var(--saas-brand-subtle), var(--saas-bg-surface));display:flex}.saas-bell__heading{color:var(--saas-text-primary);font-size:var(--saas-font-title);margin:0;font-weight:700}.saas-bell__sub{color:var(--saas-text-secondary);font-size:var(--saas-font-caption);margin:0}.saas-bell__all-read{border-radius:var(--saas-radius-md);background:var(--saas-brand-subtle);block-size:36px;inline-size:36px;color:var(--saas-brand-strong);cursor:pointer;border:0;place-items:center;display:inline-grid}.saas-bell__all-read:disabled{opacity:.5;cursor:default}.saas-bell__tabs{gap:var(--saas-space-2xs);margin-inline:var(--saas-space-md);border-radius:var(--saas-radius-full);background:var(--saas-bg-sunken);padding:3px;display:flex}.saas-bell__tab{justify-content:center;align-items:center;gap:var(--saas-space-2xs);border-radius:var(--saas-radius-full);min-block-size:32px;color:var(--saas-text-secondary);font:inherit;font-size:var(--saas-font-body-sm);cursor:pointer;background:0 0;border:0;flex:1;font-weight:600;display:inline-flex}.saas-bell__tab[aria-pressed=true]{background:var(--saas-bg-surface);color:var(--saas-brand-strong);box-shadow:var(--saas-elevation-card)}.saas-bell__count{border-radius:var(--saas-radius-full);background:var(--saas-brand-subtle);color:var(--saas-brand-strong);font-size:var(--saas-font-caption);padding:0 6px}.saas-bell__list{padding:var(--saas-space-sm);flex:1;margin:0;list-style:none;overflow-y:auto}.saas-bell__item+.saas-bell__item{margin-block-start:var(--saas-space-2xs)}.saas-bell__open{align-items:flex-start;gap:var(--saas-space-sm);inline-size:100%;padding:var(--saas-space-sm);border:0;border-radius:var(--saas-radius-md);color:inherit;font:inherit;text-align:start;cursor:pointer;transition:background-color var(--saas-motion-micro) var(--saas-ease-standard);background:0 0;border-inline-start:3px solid #0000;display:flex}.saas-bell__item[data-unread=true] .saas-bell__open{border-inline-start-color:var(--saas-brand-primary);background:var(--saas-brand-subtle)}.saas-bell__item[data-priority=URGENT][data-unread=true] .saas-bell__open{border-inline-start-color:var(--saas-status-danger);background:var(--saas-status-danger-subtle)}.saas-bell__open:hover{background:var(--saas-bg-sunken)}.saas-bell__open:focus-visible,.saas-bell__tab:focus-visible,.saas-bell__all-read:focus-visible,.saas-bell__footer:focus-visible{box-shadow:var(--saas-focus-ring);outline:none}.saas-bell__icon{border-radius:var(--saas-radius-full);background:var(--saas-brand-subtle);block-size:36px;inline-size:36px;color:var(--saas-brand-strong);flex:none;place-items:center;display:inline-grid}.saas-bell__icon[data-tone=success]{background:var(--saas-status-success-subtle);color:var(--saas-status-success)}.saas-bell__icon[data-tone=warning]{background:var(--saas-status-warning-subtle);color:var(--saas-status-warning)}.saas-bell__icon[data-tone=danger]{background:var(--saas-status-danger-subtle);color:var(--saas-status-danger)}.saas-bell__icon[data-tone=info]{background:var(--saas-status-info-subtle);color:var(--saas-status-info)}.saas-bell__icon[data-tone=neutral]{background:var(--saas-status-neutral-subtle);color:var(--saas-status-neutral)}.saas-bell__text{flex-direction:column;flex:1;gap:2px;min-inline-size:0;display:flex}.saas-bell__title{color:var(--saas-text-primary);font-size:var(--saas-font-body-sm);font-weight:500}.saas-bell__item[data-unread=true] .saas-bell__title{font-weight:700}.saas-bell__summary{color:var(--saas-text-secondary);font-size:var(--saas-font-caption);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.saas-bell__meta{align-items:center;gap:var(--saas-space-2xs);color:var(--saas-text-secondary);font-size:var(--saas-font-caption);flex-wrap:wrap;display:inline-flex}.saas-bell__ack{border-radius:var(--saas-radius-full);background:var(--saas-status-warning-subtle);color:var(--saas-status-warning);padding:0 6px;font-weight:600}.saas-bell__dot{border-radius:var(--saas-radius-full);background:var(--saas-brand-primary);flex:none;block-size:8px;inline-size:8px;margin-block-start:6px}.saas-bell__empty{padding:var(--saas-space-xl) var(--saas-space-md);color:var(--saas-text-secondary);font-size:var(--saas-font-body-sm);text-align:center;margin:0}.saas-bell__footer{justify-content:center;align-items:center;gap:var(--saas-space-2xs);border:0;border-block-start:1px solid var(--saas-border-default);border-radius:0 0 var(--saas-radius-lg) var(--saas-radius-lg);background:var(--saas-bg-surface);min-block-size:44px;color:var(--saas-brand-primary);font:inherit;font-size:var(--saas-font-body-sm);cursor:pointer;font-weight:600;display:inline-flex}[dir=rtl] .saas-bell__footer .saas-icon{transform:scaleX(-1)}