/* Partners 3.0 reusable component vocabulary. */

.ss3-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: var(--ss3-gap-heading-wrap) var(--ss3-gap-heading-actions);
    margin-bottom: var(--ss3-space-3);
}

.ss3-page-header > :first-child {
    min-width: 0;
}

/* A visible status context stays with the page identity when space permits and
   wraps only when its complete label/value unit no longer fits. */
.ss3-status-context {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: var(--ss3-gap-inline);
    min-height: calc(var(--ss3-font-size-page-title) + var(--ss3-space-1));
    color: var(--ss3-color-text);
    font-size: var(--ss3-font-size-label);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
    white-space: nowrap;
}

/* Compact name/fact and pill composition wraps whole items before shrinking text. */
.ss3-status-context[data-wrap="true"] {
    flex-wrap: wrap;
    gap: var(--ss3-space-1) var(--ss3-gap-inline);
    max-width: 100%;
    min-width: 0;
    min-height: 0;
    white-space: normal;
}

.ss3-status-context[data-wrap="true"] > :not(.ss3-status-pill) {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

.ss3-page-header h1,
.ss3-page-header h2 {
    margin: 0;
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
}

.ss3-page-header h1 {
    font-size: var(--ss3-font-size-page-title);
}

.ss3-page-header h2 {
    font-size: var(--ss3-font-size-section-title);
}

.ss3-stack > .ss3-page-header,
.ss3-stack-lg > .ss3-page-header {
    margin-bottom: 0;
}

.ss3-page-header-summary {
    max-width: 60rem;
    color: var(--ss3-color-text-muted);
    font-size: var(--ss3-font-size-supporting);
    line-height: var(--ss3-line-height-body);
}

.ss3-toolbar,
.ss3-action-bar,
.ss3-grid-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--ss3-space-2);
}

.ss3-toolbar {
    margin-bottom: var(--ss3-space-3);
}

/* A toolbar field followed by row actions aligns those actions with the control. */
.ss3-toolbar > .ss3-field + .ss3-row-actions {
    align-self: flex-end;
}

.ss3-toolbar > .ss3-field + .ss3-row-actions .button {
    margin-bottom: 0;
    white-space: nowrap;
}

.ss3-page-header-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: var(--ss3-space-2);
    margin-bottom: 0;
}

.ss3-page-header .ss3-row-actions,
.ss3-page-header .ss3-toolbar {
    flex: 0 0 auto;
    margin-bottom: 0;
}

.ss3-grid-toolbar > h1,
.ss3-grid-toolbar > h2,
.ss3-grid-toolbar > h3 {
    margin-bottom: 0;
}

.ss3-page-header-actions .button,
.ss3-row-actions .button,
.ss3-grid-toolbar .button {
    margin-bottom: 0;
}

.ss3-action-bar {
    margin: 0;
    padding-top: 0;
    border-top: 0;
}

.ss3-action-bar .button {
    margin-bottom: 0;
}

/* Compatibility for direct actions in unmigrated sections/cards. Form-grid gap is
   already authoritative. Remove these selectors when those consumers migrate. */
.ss3-section:not([data-layout="section"]) > .ss3-action-bar,
.ss3-card:not([data-layout="section"]) > .ss3-action-bar {
    margin-top: var(--ss3-gap-actions);
}

/* Optional compact in-section actions retain normal control text and touch height. */
.ss3-action-bar[data-density="compact"] .button {
    padding-inline: var(--ss3-space-3);
}

.ss3-action-bar[hidden] {
    display: none !important;
}

.ss3-card,
.ss3-summary-card,
.ss3-detail-panel,
.ss3-child-panel {
    background: var(--ss3-color-surface);
    border: 1px solid var(--ss3-color-border);
    border-radius: var(--ss3-radius-lg);
    box-shadow: var(--ss3-shadow-sm);
}

.ss3-card,
.ss3-detail-panel,
.ss3-child-panel {
    padding: var(--ss3-space-4);
}

/* A section is semantic grouping, not another nested card boundary. */
.ss3-section {
    min-width: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.ss3-summary-card {
    padding: var(--ss3-space-3);
}

.ss3-section:not([data-layout="section"]) + .ss3-section:not([data-layout="section"]) {
    margin-top: var(--ss3-space-6);
}

/* Opt-in boundary for peer workbench sections; not an underline or a form divider. */
.ss3-section[data-divider="true"]:not([data-layout="section"]) {
    margin-top: var(--ss3-space-3);
    padding-top: var(--ss3-space-3);
    border-top: 1px solid var(--ss3-color-border);
}

.ss3-card + .ss3-card,
.ss3-detail-panel + .ss3-detail-panel,
.ss3-child-panel + .ss3-child-panel {
    margin-top: var(--ss3-space-3);
}

/* Read-only business content is visually distinct from editable form controls. */
.ss3-readonly-content {
    padding: var(--ss3-space-2) var(--ss3-space-3);
    border: 0;
    border-radius: var(--ss3-radius-sm);
    background: rgb(17 45 78 / 0.035);
    color: var(--ss3-color-text);
    font-family: inherit;
    font-size: var(--ss3-font-size-body);
    font-weight: var(--ss3-font-weight-regular);
    line-height: var(--ss3-line-height-body);
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

/* Supported semantic composition: section/card -> header -> content groups ->
   owning actions. No empty slot is required. Header and group gaps are distinct. */
.ss3-section[data-layout="section"],
.ss3-card[data-layout="section"] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
:is(.ss3-section, .ss3-card)[data-layout="section"] > * {
    margin-block: 0;
    min-width: 0;
}
:is(.ss3-section, .ss3-card)[data-layout="section"] > :not([hidden]) ~ :not([hidden]) {
    margin-top: var(--ss3-gap-group);
}
:is(.ss3-section, .ss3-card)[data-layout="section"] > header:not([hidden]) ~ :not([hidden]) {
    margin-top: var(--ss3-gap-heading);
}
:is(.ss3-section, .ss3-card)[data-layout="section"] > :not(header):not([hidden]) ~ :not([hidden]) {
    margin-top: var(--ss3-gap-group);
}
:is(.ss3-section, .ss3-card)[data-layout="section"] > :not([hidden]) ~ .ss3-action-bar:not([hidden]) {
    margin-top: var(--ss3-gap-actions);
}
/* A headed subsection following visible content starts a new semantic group.
   The responsive section-before gap replaces the ordinary group gap once.
   First/hidden subsections and workbench peer boundaries remain separately owned. */
:is(.ss3-section, .ss3-card)[data-layout="section"] > :not(header):not([hidden]) ~ .ss3-section[data-layout="section"]:not([hidden]):has(> header:not([hidden])) {
    margin-top: var(--ss3-gap-section-before);
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--ss3-gap-heading-wrap) var(--ss3-gap-heading-actions);
}
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > :is(h2, h3) {
    flex: 0 1 auto;
    max-width: 100%;
    margin: 0;
    font-size: var(--ss3-font-size-section-title);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
    overflow-wrap: anywhere;
}
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar {
    flex: 0 1 auto;
    align-items: center;
    min-height: 1.2em;
    margin: 0;
    gap: var(--ss3-gap-inline);
    font-size: var(--ss3-font-size-section-title);
    line-height: var(--ss3-line-height-tight);
}

/* Labelled borderless heading actions align from the automatic-width icon canvas.
   Their horizontal padding extends the hit/hover target into the available gutter
   without indenting the visible icon. */
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar:has(> .ss3-icon-action[data-label="true"]:first-child) {
    margin-inline-start: calc(0rem - var(--ss3-space-3));
}

/* Icon-only heading actions retain their fixed target/canvas treatment. The shared
   inset aligns that fixed canvas without any icon-specific adjustment. */
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar:has(> .ss3-icon-action:not([data-label="true"]):first-child) {
    margin-inline-start: calc((1.5rem - var(--ss3-control-height)) / 2);
}

/* Section-heading action targets are decoupled from layout height. The visible
   24px action line participates in baseline layout; the pseudo target occupies the
   shared 40px hit area for labelled and icon-only actions without enlarging the
   heading-to-content relationship. */
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action {
    position: relative;
    isolation: isolate;
    height: 1.5rem;
    min-height: 1.5rem;
    padding-block: 0;
    border: 0;
    overflow: visible;
    line-height: 1.5rem;
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action::before {
    content: "";
    position: absolute;
    z-index: 0;
    border-radius: var(--ss3-radius-md);
    background: transparent;
    pointer-events: auto;
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action > * {
    position: relative;
    z-index: 1;
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action[data-label="true"]::before {
    top: calc(0rem - var(--ss3-gap-heading-wrap));
    right: 0;
    left: 0;
    height: var(--ss3-control-height);
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:not([data-label="true"])::before {
    top: 50%;
    left: 50%;
    width: var(--ss3-control-height);
    height: var(--ss3-control-height);
    transform: translate(-50%, -50%);
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:hover,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:focus {
    background: transparent;
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:hover::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:focus::before {
    background: var(--ss3-color-action-soft);
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-secondary:hover::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-secondary:focus::before {
    background: var(--ss3-color-action-secondary-soft);
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-delete:hover::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-delete:focus::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-destructive:hover::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-destructive:focus::before {
    background: var(--ss3-color-action-destructive-soft);
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:focus-visible {
    outline: 0;
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:focus-visible::before {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:disabled:hover::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action:disabled:focus::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-disabled:hover::before,
:is(.ss3-section, .ss3-card)[data-layout="section"] > header > .ss3-action-bar > .ss3-icon-action.is-disabled:focus::before {
    background: transparent;
}

/* Shared read-only label/value facts. */
.ss3-fact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ss3-gap-row) var(--ss3-gap-column);
    margin: 0;
}

.ss3-fact-grid[data-columns="1"] {
    grid-template-columns: minmax(0, 1fr);
}

.ss3-fact-grid[data-columns="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ss3-fact {
    min-width: 0;
    margin: 0;
}

.ss3-fact[data-span="full"] {
    grid-column: 1 / -1;
}

/* An optional leading symbol stays with its semantic label/value fact. */
.ss3-fact[data-icon="true"] {
    position: relative;
    padding-inline-start: calc(var(--ss3-space-6) + var(--ss3-space-3));
}

.ss3-fact[data-icon="true"] > dt > i {
    position: absolute;
    inset-inline-start: 0;
    top: 0;
    width: var(--ss3-space-6);
    color: var(--ss3-color-text-muted);
    font-size: var(--ss3-font-size-section-title);
    line-height: var(--ss3-line-height-tight);
    text-align: center;
}

.ss3-fact > dt {
    margin: 0 0 var(--ss3-gap-label);
    color: var(--ss3-color-text);
    font-size: var(--ss3-font-size-label);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
    letter-spacing: normal;
    text-transform: none;
}

.ss3-fact > dd {
    min-width: 0;
    margin: 0;
    color: var(--ss3-color-text);
    font-size: var(--ss3-font-size-data);
    font-weight: var(--ss3-font-weight-regular);
    line-height: var(--ss3-line-height-data);
    overflow-wrap: anywhere;
}

.ss3-fact > dd.ss3-muted,
.ss3-fact > dd .ss3-muted {
    color: var(--ss3-color-text-muted);
}

/* Shared phone-fact presentation keeps the number primary. A compact leading
   classification icon supplies scan context; an independent trailing indicator
   may communicate an actual lookup/number issue. */
.ss3-phone-value {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    gap: var(--ss3-space-1);
    color: inherit;
    font: inherit;
    line-height: inherit;
    vertical-align: baseline;
}

.ss3-phone-value > .ss3-phone-type-icon {
    flex: 0 0 1rem;
    width: 1rem;
    color: var(--ss3-color-text-muted);
    font-size: 1rem;
    line-height: 1;
    text-align: center;
}

.ss3-phone-value > .ss3-phone-number {
    min-width: 0;
}

.ss3-phone-value > .ss3-phone-issue-icon {
    flex: 0 0 auto;
    color: var(--ss3-color-warning);
    font-size: 1rem;
    line-height: 1;
}

.ss3-phone-value > .ss3-phone-issue-icon.is-error {
    color: var(--ss3-color-error);
}

.ss3-phone-value > .ss3-phone-issue-icon.is-info {
    color: var(--ss3-color-info);
}

.ss3-section-title,
.ss3-card-title {
    margin-bottom: var(--ss3-space-3);
    font-size: var(--ss3-font-size-section-title);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
}

.ss3-card > .ss3-toolbar > h2,
.ss3-section > .ss3-toolbar > h2,
.ss3-card > h2:first-child,
.ss3-section > h2:first-child,
.ss3-detail-panel > h2:first-child,
.ss3-child-panel > h2:first-child,
.ss3-grid-shell h2 {
    margin-top: 0;
    margin-bottom: var(--ss3-space-2);
    font-size: var(--ss3-font-size-section-title);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
}

/* A section heading retains its role when actions share its toolbar. */
.ss3-card > .ss3-toolbar > h2,
.ss3-section > .ss3-toolbar > h2,
.ss3-section > .ss3-toolbar > .button,
.ss3-card > .ss3-toolbar > .button {
    margin-bottom: 0;
}

.ss3-card > h3,
.ss3-section > h3,
.ss3-detail-panel > h3,
.ss3-child-panel > h3 {
    margin-top: var(--ss3-space-3);
    margin-bottom: var(--ss3-space-2);
    font-size: var(--ss3-font-size-data);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
}

.ss3-record-context {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--ss3-space-1) var(--ss3-space-3);
    margin: 0;
    color: var(--ss3-color-text-muted);
    font-size: var(--ss3-font-size-supporting);
    line-height: var(--ss3-line-height-body);
}

.ss3-record-context > span + span::before {
    content: "|";
    margin-right: var(--ss3-space-3);
    color: var(--ss3-color-border-strong);
}

/* Standard Excel download identity; CSV retains the ordinary action color. */
.ss3-icon-action[data-grid-action="excel"] > i {
    color: #217346;
}

.ss3-disclosure {
    border-top: 1px solid var(--ss3-color-border);
}

.ss3-disclosure > summary {
    padding: var(--ss3-space-2) 0;
    color: var(--ss3-color-text);
    font-weight: var(--ss3-font-weight-strong);
    cursor: pointer;
}

.ss3-disclosure > summary:hover,
.ss3-disclosure > summary:focus {
    color: var(--ss3-color-link-hover);
}

.ss3-disclosure-body {
    padding: 0 0 var(--ss3-space-3);
}

.ss3-status-pill {
    display: inline-flex;
    align-items: center;
    gap: var(--ss3-space-1);
    min-height: 1.65rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    border: 1px solid var(--ss3-color-border);
    background: var(--ss3-color-surface-muted);
    color: var(--ss3-color-text-muted);
    font-size: var(--ss3-font-size-supporting);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
}

.ss3-status-pill.is-success {
    border-color: rgb(20 108 67 / 0.28);
    background: var(--ss3-color-success-bg);
    color: var(--ss3-color-success);
}

/* Strong factual/status emphasis; geometry remains shared with ordinary pills. */
.ss3-status-pill.is-success[data-contrast="strong"] {
    flex: 0 0 auto;
    border-color: var(--ss3-color-success);
    background: var(--ss3-color-success);
    color: var(--ss3-color-primary-contrast);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.ss3-status-pill.is-warning {
    border-color: rgb(138 90 0 / 0.32);
    background: var(--ss3-color-warning-bg);
    color: var(--ss3-color-warning);
}

.ss3-status-pill.is-error {
    border-color: rgb(168 32 32 / 0.28);
    background: var(--ss3-color-error-bg);
    color: var(--ss3-color-error);
}

.ss3-status-pill.is-info {
    border-color: rgb(36 82 122 / 0.28);
    background: var(--ss3-color-info-bg);
    color: var(--ss3-color-info);
}

.ss3-alert,
.ss3-error-summary[data-ss3-message-host="true"] {
    display: flex;
    align-items: flex-start;
    gap: var(--ss3-space-3);
    padding: var(--ss3-space-3) var(--ss3-space-4);
    border: 1px solid var(--ss3-color-border);
    border-radius: var(--ss3-radius-md);
    background: var(--ss3-color-info-bg);
    color: var(--ss3-color-info);
}

.ss3-alert[hidden],
.ss3-error-summary[hidden] {
    display: none;
}

.ss3-alert-content {
    flex: 1 1 auto;
    min-width: 0;
}

.ss3-alert-content > :first-child {
    margin-top: 0;
}

.ss3-alert-content > :last-child {
    margin-bottom: 0;
}

.ss3-alert-content ul {
    margin: 0;
    padding-left: 1.25rem;
}

.ss3-alert-content li + li {
    margin-top: var(--ss3-space-1);
}

.ss3-alert-dismiss {
    appearance: none;
    -webkit-appearance: none;
    flex: 0 0 auto;
    width: 2rem;
    height: 2rem;
    margin: 0;
    padding: 0;
    border: 1px solid transparent;
    border-radius: var(--ss3-radius-sm);
    background: transparent;
    color: currentColor;
    cursor: pointer;
    line-height: 1;
}

.ss3-alert-dismiss:hover,
.ss3-alert-dismiss:focus {
    border-color: currentColor;
    background: rgb(255 255 255 / 0.55);
}

.ss3-alert-dismiss:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 1px;
}

.ss3-alert.is-success {
    background: var(--ss3-color-success-bg);
    color: var(--ss3-color-success);
}

.ss3-alert.is-warning {
    background: var(--ss3-color-warning-bg);
    color: var(--ss3-color-warning);
}

.ss3-alert.is-error {
    background: var(--ss3-color-error-bg);
    color: var(--ss3-color-error);
}

/* Compact row/action and confirmation helpers. */
.ss3-row-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.ss3-row-actions > .ss3-icon-action {
    flex: 0 0 auto;
}

.ss3-icon-action {
    appearance: none;
    -webkit-appearance: none;
    min-width: var(--ss3-control-height);
    width: var(--ss3-control-height);
    height: var(--ss3-control-height);
    padding: var(--ss3-space-2);
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: var(--ss3-radius-md);
    background: transparent;
    color: var(--ss3-color-action);
    cursor: pointer;
    line-height: 1;
    text-align: center;
    text-decoration: none;
}

.ss3-icon-action > i,
.ss3-icon-button > i,
.ss3-mobile-search-scope-button > i {
    flex: 0 0 auto;
    width: 1.5rem;
    font-size: 1.5rem;
    line-height: 1;
    pointer-events: none;
}

.ss3-icon-action:hover,
.ss3-icon-action:focus {
    background: var(--ss3-color-action-soft);
    color: var(--ss3-color-action-hover);
    outline: 0;
    text-decoration: none;
}

.ss3-icon-action:focus-visible {
    outline: 2px solid var(--ss3-color-action);
    outline-offset: 2px;
}

.ss3-icon-action.is-secondary {
    color: var(--ss3-color-action-secondary);
}

.ss3-icon-action.is-secondary:hover,
.ss3-icon-action.is-secondary:focus {
    background: var(--ss3-color-action-secondary-soft);
    color: var(--ss3-color-action-secondary-hover);
}

.ss3-icon-action.is-save {
    color: var(--ss3-color-action);
}

.ss3-icon-action.is-delete,
.ss3-icon-action.is-destructive {
    color: var(--ss3-color-action-destructive);
}

.ss3-icon-action.is-delete:hover,
.ss3-icon-action.is-delete:focus,
.ss3-icon-action.is-destructive:hover,
.ss3-icon-action.is-destructive:focus {
    background: var(--ss3-color-action-destructive-soft);
    color: var(--ss3-color-action-destructive-hover);
}

.ss3-icon-action:disabled,
.ss3-icon-action.is-disabled {
    color: var(--ss3-color-text-muted);
    cursor: not-allowed;
    opacity: 0.55;
}

.ss3-icon-action:disabled:hover,
.ss3-icon-action:disabled:focus,
.ss3-icon-action.is-disabled:hover,
.ss3-icon-action.is-disabled:focus {
    background: transparent;
    color: var(--ss3-color-text-muted);
}

.ss3-icon-action .show-for-sr {
    position: absolute !important;
}


/* Single-record designation: selected status replaces its action in the same slot.
   This span is informational, never a disabled button or keyboard stop. */
.ss3-designation-status {
    display: inline-flex;
    flex: 0 0 var(--ss3-control-height);
    align-items: center;
    justify-content: center;
    width: var(--ss3-control-height);
    height: var(--ss3-control-height);
    padding: var(--ss3-space-2);
    color: var(--ss3-color-success);
    cursor: default;
    line-height: 1;
}
.ss3-designation-status > i {
    flex: 0 0 auto;
    width: 1.5rem;
    font-size: 1.5rem;
    line-height: 1;
}

/* Labelled compact actions: navigation and collection commands, not primary CTAs. */
.ss3-icon-action[data-label="true"] {
    width: auto;
    padding: 0 var(--ss3-space-3);
    gap: var(--ss3-space-2);
    font-size: var(--ss3-font-size-control);
    font-weight: var(--ss3-font-weight-regular);
    line-height: var(--ss3-line-height-tight);
    white-space: nowrap;
}

.ss3-icon-action[data-label="true"] > i {
    --fa-width: auto;
    flex: 0 0 auto;
    width: var(--fa-width);
}

/* Back/parent navigation retains its start context; related destinations are
   composed beside the identity in the page header. */
.ss3-toolbar[data-layout="navigation"] {
    align-items: center;
    gap: var(--ss3-space-3);
    margin-bottom: var(--ss3-space-3);
}

.ss3-toolbar[data-layout="navigation"] > [data-position="end"] {
    margin-inline-start: auto;
}

.ss3-toolbar[data-layout="navigation"] > .ss3-icon-action:first-child {
    padding-inline-start: 0;
}

.ss3-toolbar[data-layout="navigation"] > .ss3-icon-action[data-position="end"] {
    padding-inline-end: 0;
}


/* Related navigation shares the identity row and wraps as a complete toolbar.
   The summary occupies the next row; ordinary 40px navigation targets remain. */
.ss3-page-header[data-layout="navigation"] {
    align-items: center;
}

.ss3-page-header[data-layout="navigation"] > :first-child {
    flex: 0 1 auto;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.ss3-page-header[data-layout="navigation"] > .ss3-toolbar[data-layout="navigation"] {
    min-width: 0;
    max-width: 100%;
    margin: 0;
    margin-inline-start: auto;
}

.ss3-page-header[data-layout="navigation"] > .ss3-page-header-summary {
    flex: 0 0 100%;
    max-width: 100%;
    margin: 0;
}

.ss3-confirm-inline {
    margin: 0.5rem 0 1rem;
    padding: var(--ss3-space-3);
    border: 1px solid var(--ss3-color-border);
    border-radius: var(--ss3-radius-md);
    background: var(--ss3-color-surface);
    box-shadow: var(--ss3-shadow-sm);
}

.ss3-confirm-text {
    margin-bottom: var(--ss3-space-2);
    color: var(--ss3-color-text);
    font-size: var(--ss3-font-size-supporting);
    line-height: var(--ss3-line-height-body);
}

.ss3-confirm-actions {
    display: flex;
    align-items: center;
    gap: var(--ss3-space-2);
    flex-wrap: wrap;
}

.ss3-confirm-actions .button {
    margin: 0;
}

.ss3-edit-drawer,
.ss3-modal,
.ss3-confirm {
    background: var(--ss3-color-surface);
    border: 1px solid var(--ss3-color-border);
    box-shadow: var(--ss3-shadow-md);
}

.ss3-edit-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: var(--ss3-z-drawer);
    width: min(34rem, 100vw);
    padding: var(--ss3-space-5);
    overflow-y: auto;
}


.ss3-task-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--ss3-space-3);
    padding: var(--ss3-space-3) var(--ss3-space-4);
    background: var(--ss3-task-header-bg);
    color: var(--ss3-task-header-text);
}

.ss3-task-header > :first-child {
    min-width: 0;
    flex: 1 1 auto;
}

.ss3-task-header h1,
.ss3-task-header h2 {
    margin: 0;
    color: var(--ss3-task-header-text);
    font-size: var(--ss3-font-size-section-title);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
}

.ss3-task-header p {
    margin: var(--ss3-space-1) 0 0;
    color: var(--ss3-task-header-text);
    font-size: var(--ss3-font-size-supporting);
    line-height: var(--ss3-line-height-tight);
    opacity: 0.88;
}

.ss3-task-header > .ss3-action-bar {
    justify-content: flex-end;
    flex: 0 0 auto;
    flex-wrap: nowrap;
    margin: 0;
    padding: 0;
    border: 0;
}

.ss3-task-header > .ss3-action-bar .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 5rem;
    min-height: var(--ss3-control-height);
    margin: 0;
    border-radius: var(--ss3-radius-md);
    font-size: var(--ss3-font-size-control);
    font-weight: var(--ss3-font-weight-strong);
    line-height: var(--ss3-line-height-tight);
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
}

.ss3-task-header > .ss3-action-bar .button.secondary {
    border-color: var(--ss3-task-header-secondary-bg);
    background: var(--ss3-task-header-secondary-bg);
    color: var(--ss3-task-header-secondary-text);
}

.ss3-task-header > .ss3-action-bar .button.secondary:hover,
.ss3-task-header > .ss3-action-bar .button.secondary:focus-visible {
    border-color: var(--ss3-task-header-secondary-bg);
    background: var(--ss3-task-header-secondary-bg);
    color: var(--ss3-task-header-secondary-text);
}

.ss3-task-header > .ss3-action-bar .button:not(.secondary) {
    border-color: var(--ss3-task-header-primary-bg);
    background: var(--ss3-task-header-primary-bg);
    color: var(--ss3-task-header-primary-text);
}

.ss3-task-header > .ss3-action-bar .button:not(.secondary):hover,
.ss3-task-header > .ss3-action-bar .button:not(.secondary):focus-visible {
    color: var(--ss3-task-header-primary-text);
}

.ss3-task-header > .ss3-action-bar .button:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.ss3-edit-drawer {
    display: flex;
    padding: 0;
    overflow: hidden;
    flex-direction: column;
}

.ss3-edit-drawer[hidden] {
    display: none;
}

.ss3-edit-drawer > .ss3-task-header {
    position: sticky;
    top: 0;
    z-index: 1;
    flex: 0 0 auto;
}

.ss3-edit-drawer > .ss3-task-header + * {
    min-height: 0;
    padding: var(--ss3-space-4);
    overflow-y: auto;
    flex: 1 1 auto;
}

.ss3-confirm {
    width: min(30rem, calc(100vw - (2 * var(--ss3-space-4))));
    max-height: calc(100vh - (2 * var(--ss3-space-4)));
    padding: 0;
    border-radius: var(--ss3-radius-md);
    color: var(--ss3-color-text);
}

.ss3-confirm::backdrop {
    background: rgb(15 23 42 / 0.55);
}

.ss3-confirm > div {
    padding: var(--ss3-space-5);
}

.ss3-confirm h2 {
    margin: 0 0 var(--ss3-space-3);
    font-size: var(--ss3-font-size-section-title);
    line-height: var(--ss3-line-height-tight);
}

.ss3-confirm p {
    margin: 0 0 var(--ss3-space-4);
}

.ss3-confirm .ss3-confirm-actions {
    justify-content: flex-end;
}

@media screen and (max-width: 39.9375em) {
    .ss3-edit-drawer {
        left: 0;
        width: 100vw;
    }

    .ss3-task-header {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .ss3-task-header > :first-child {
        flex: 1 1 12rem;
    }

    .ss3-task-header > .ss3-action-bar {
        margin-left: auto;
    }
}

.ss3-activity-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ss3-activity-list > li {
    padding: 0;
}

/* Collection-item boundaries are subordinate to peer-section boundaries. Apply
   one light inset rule only between visible items, with 8px on each side. The
   first and last visible items add no outer allowance or trailing separator. */
.ss3-activity-list > li:not([hidden]) ~ li:not([hidden]) {
    margin-top: var(--ss3-space-2);
    padding-top: var(--ss3-space-2);
    border-top: 1px solid var(--ss3-color-divider-subtle);
}

/* Activity actions use the same 40px target; the visible 24px line owns layout. */
.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]) {
    position: relative;
    isolation: isolate;
    height: 1.5rem;
    min-height: 1.5rem;
    padding-block: 0;
    border: 0;
    overflow: visible;
    line-height: 1.5rem;
}

.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"])::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 0;
    width: var(--ss3-control-height);
    height: var(--ss3-control-height);
    border-radius: var(--ss3-radius-md);
    background: transparent;
    transform: translate(-50%, -50%);
    pointer-events: auto;
}

.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]) > * {
    position: relative;
    z-index: 1;
}

.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]):hover,
.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]):focus {
    background: transparent;
}

.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]):hover::before,
.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]):focus::before {
    background: var(--ss3-color-action-soft);
}

.ss3-activity-list .ss3-row-actions > .ss3-icon-action.is-delete:hover::before,
.ss3-activity-list .ss3-row-actions > .ss3-icon-action.is-delete:focus::before,
.ss3-activity-list .ss3-row-actions > .ss3-icon-action.is-destructive:hover::before,
.ss3-activity-list .ss3-row-actions > .ss3-icon-action.is-destructive:focus::before {
    background: var(--ss3-color-action-destructive-soft);
}

.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]):focus-visible {
    outline: 0;
}

.ss3-activity-list .ss3-row-actions > .ss3-icon-action:not([data-label="true"]):focus-visible::before {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.ss3-search-panel {
    padding: var(--ss3-space-4);
    border: 1px solid var(--ss3-color-border);
    border-radius: var(--ss3-radius-md);
    background: var(--ss3-color-surface-muted);
}


.ss3-lookup-option {
    display: block;
    min-width: 0;
}

.ss3-lookup-option > strong,
.ss3-lookup-option > small {
    display: block;
}

.ss3-lookup-option > strong {
    color: var(--ss3-color-text);
    font-size: var(--ss3-font-size-body);
    font-weight: var(--ss3-font-weight-medium);
    line-height: var(--ss3-line-height-data);
}

.ss3-lookup-option > small {
    margin-top: var(--ss3-space-1);
    color: var(--ss3-color-text-muted);
    font-size: var(--ss3-font-size-supporting);
    line-height: var(--ss3-line-height-tight);
}

.ss3-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--ss3-space-1);
    padding: 0.25rem 0.55rem;
    border: 1px solid var(--ss3-color-border);
    border-radius: 999px;
    background: var(--ss3-color-surface);
    color: var(--ss3-color-text-muted);
    font-size: var(--ss3-font-size-supporting);
    line-height: var(--ss3-line-height-tight);
}

@media screen and (max-width: 22rem) {
    .ss3-fact-grid:not([data-columns="2"]) {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media screen and (max-width: 39.9375em) {
    .ss3-fact-grid[data-stack="small"] {
        grid-template-columns: minmax(0, 1fr);
    }

    .ss3-card,
    .ss3-detail-panel,
    .ss3-child-panel {
        padding: var(--ss3-space-3);
    }

    .ss3-record-context {
        display: grid;
        gap: var(--ss3-space-1);
    }

    .ss3-record-context > span + span::before {
        content: none;
        margin-right: 0;
    }
}

/* Native hidden state wins over component display (toolbars, buttons and editors). */
.ss3-save-state[hidden],
.ss3-section[hidden],
.ss3-section [hidden] {
    display: none !important;
}

.ss3-status-pill[hidden] { display: none; }