/* Shared feedback, empty states, and notification workspace. */
.validation-summary { margin-block: 1rem; padding: 1rem; border: 1px solid var(--danger, #b42318); border-inline-start-width: 4px; border-radius: .75rem; background: var(--surface, #fff); color: var(--fg, #182230); }
.validation-summary h2 {font-weight: 700}
.validation-summary ul {list-style: disc; padding-inline-start: 1.5rem}
.validation-summary a {text-decoration: underline}
.field-error-message {display: block; font-size: .8rem; color: var(--danger, #b42318); margin-block-start: .3rem}
[aria-invalid="true"], .ts-wrapper[data-invalid="true"] .ts-control {border-color: var(--danger, #b42318) !important}
.shared-empty-state {display:flex;flex-direction:column;align-items:center;gap:.75rem;text-align:center;padding:2.5rem 1rem;color:var(--fg-muted,#667085)}
.shared-empty-state h2 {font-weight:600;color:var(--fg,#182230)}
.notification-tools {display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;padding-block:1rem}
.notification-tools input,.notification-tools select {max-width:100%;border:1px solid var(--line,#d0d5dd);border-radius:.5rem;padding:.5rem}
.notification-day th {text-align:start;padding:.75rem;background:var(--canvas,#f9fafb);font-size:.8rem}
.notification-kind,.notification-needs-you {display:inline-block;border-radius:999px;padding:.15rem .5rem;font-size:.7rem;margin-inline-end:.5rem;background:var(--canvas,#f2f4f7)}
.notification-needs-you {color:var(--primary,#175cd3)}
.notification-preview {font-size:.8rem;margin-block:.5rem;max-width:24rem;white-space:normal}
.notification-preferences-matrix {overflow-x:auto}
.notification-preferences-matrix table {width:100%;border-collapse:collapse}
.notification-preferences-matrix th,.notification-preferences-matrix td {padding:.75rem;text-align:start;border-bottom:1px solid var(--line,#d0d5dd)}
.notification-preferences-matrix select {max-width:12rem}
.personal-quiet-hours {display:flex;flex-wrap:wrap;gap:1rem;padding-block:1rem}
.shell-signals {position:relative}
.shell-signals summary {cursor:pointer;border:1px solid var(--line,#d0d5dd);border-radius:999px;padding:.35rem .7rem;font-size:.75rem}
.shell-signals__items {position:absolute;inset-inline-end:0;top:100%;min-width:15rem;padding:1rem;background:var(--surface,#fff);border:1px solid var(--line,#d0d5dd);border-radius:.75rem;z-index:70}
.shell-staging-edge {position:fixed;inset:0 0 auto;height:3px;z-index:100;background:repeating-linear-gradient(45deg,#f79009 0 8px,#fedf89 8px 16px)}
.smart-filters__status [aria-current="page"] {background:var(--primary);color:var(--primary-fg,#fff);border-color:var(--primary)}
.notification-kind[data-kind="approvals"], .notification-kind[data-kind="tasks"] {color:var(--primary);background:color-mix(in srgb,var(--primary) 10%,var(--surface))}
.notification-kind[data-kind="overdue"] {color:var(--danger,#b42318);background:color-mix(in srgb,var(--danger,#b42318) 10%,var(--surface))}
.notification-kind[data-kind="security"] {color:var(--fg);border:1px solid var(--line)}
.notification-preview form {display:flex;flex-direction:column;gap:.5rem;margin-block:1rem}
.notification-preview textarea {width:100%;min-height:4rem;border:1px solid var(--line);border-radius:.5rem}
.notification-preferences-matrix th[scope="row"] {position:sticky;inset-inline-start:0;background:var(--surface);min-width:12rem;z-index:1}

/* New design: one line saying what's left, then one button per field (messages sit under the fields). */
.validation-summary--compact { display: flex; gap: .75rem; align-items: flex-start; padding: .875rem 1rem; border: 1px solid color-mix(in srgb, var(--danger, #e11d48) 28%, transparent); border-radius: .875rem; background: var(--danger-soft, #fff1f2); color: var(--fg, #0f1f1c); }
.validation-summary--compact:focus { outline: 2px solid var(--danger, #e11d48); outline-offset: 2px; }
.validation-summary__icon { flex: none; width: 1.25rem; height: 1.25rem; margin-top: .1rem; color: var(--danger, #e11d48); }
.validation-summary__body { display: flex; flex-direction: column; gap: .5rem; min-width: 0; }
.validation-summary__title { margin: 0; font-size: .9375rem; color: var(--danger-hover, #be123c); }
.validation-summary__title strong { font-weight: 600; }
.validation-summary__base { margin: 0; font-size: .875rem; }
.validation-summary--compact ul.validation-summary__fields { display: flex; flex-wrap: wrap; gap: .375rem; margin: 0; padding: 0; list-style: none; }
.validation-summary--compact .validation-summary__fields a { display: inline-flex; align-items: center; gap: .375rem; padding: .25rem .625rem; border: 1px solid color-mix(in srgb, var(--danger, #e11d48) 28%, transparent); border-radius: 999px; background: var(--surface, #fff); color: var(--danger-hover, #be123c); font-size: .8125rem; text-decoration: none; }
.validation-summary--compact .validation-summary__fields a:hover { background: var(--danger-soft, #fff1f2); }
.validation-summary__count { min-width: 1.125rem; padding: 0 .3rem; border-radius: 999px; background: var(--danger, #e11d48); color: #fff; font-size: .6875rem; text-align: center; }
html[data-design="redesign"] .field-error-message { font-size: .8125rem; }
/* Status tags on external portal pages; the portal layout does not load redesign.css. */
.portal-layout .workspace-tag {display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:500;white-space:nowrap;background:var(--surface-muted,#f3f4f6);color:var(--fg-muted,#667085)}
.portal-layout .workspace-tag::before {content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.portal-layout .workspace-tag--ok {background:var(--success-soft);color:var(--success)}
.portal-layout .workspace-tag--warn {background:var(--warning-soft);color:var(--warning)}
.portal-layout .workspace-tag--bad {background:var(--danger-soft);color:var(--danger)}
.portal-layout .workspace-tag--info {background:var(--info-soft);color:var(--info)}
