/*
 * Goal 10 - Refined WPF density and theme.
 *
 * This file is intentionally loaded after component-scoped styles. It owns
 * presentation only: semantic colour tokens, compact native control defaults,
 * and bounded host-management/Workflow/Interface Designer theme adaptations.
 */

:root {
    --rw-canvas: #e4e9ed;
    --rw-surface: #ffffff;
    --rw-surface-subtle: #f1f4f6;
    --rw-side-surface: #f8fafb;
    --rw-surface-muted: #dce3e8;
    --rw-surface-hover: #e6eff6;
    --rw-surface-selected: #d7e7f3;
    --rw-text: #20262c;
    --rw-text-muted: #56616b;
    --rw-border: #b7c2cb;
    --rw-border-strong: #8f9da8;
    --rw-focus: #287fc0;
    --rw-focus-ring: rgba(40, 127, 192, 0.24);
    --rw-accent: #176fa7;
    --rw-accent-hover: #125f91;
    --rw-action-accent: #007acc;
    --rw-action-accent-hover: #006bb3;
    --rw-constructive: #3d8854;
    --rw-constructive-hover: #327245;
    --rw-action-constructive: #2da01e;
    --rw-action-constructive-hover: #258619;
    --rw-danger: #a43f47;
    --rw-warning: #865b06;
    --rw-success: #2f7a49;
    --workflow-counter-success: #a7d8ee;
    --workflow-counter-failed: #f0b7cb;
    --workflow-counter-stopped: #8c969d;
    --rw-callout-warm: #fff8df;
    --rw-callout-warm-border: #dec98c;
    --rw-callout-warm-text: #4b432f;
    --rw-callout-link: #1f618c;
    --rw-shadow: 0 0.45rem 1.2rem rgba(33, 43, 54, 0.14);
    --rw-selection-shadow: 0 0.18rem 0.42rem rgba(33, 43, 54, 0.18);
    --rw-control-min-height: calc(1.5em + 0.5rem + 2px);
    --rw-control-padding-y: 0.25rem;
    --rw-control-padding-x: 0.5rem;
    --rw-control-radius: 0.375rem;
    --rw-pill-surface: #ffffff;
    --rw-pill-surface-hover: #eef5fb;
    --rw-pill-text: #294d6e;
    --rw-pill-border: rgba(57, 91, 122, 0.3);
    --rw-pill-strong-text: #101820;
    --rw-pill-danger-text: #66403b;
    --rw-popup-surface: #fffdf8;
    --rw-popup-subtle-surface: #f7fafc;
    --rw-popup-hover-surface: rgba(213, 229, 234, 0.58);
    --rw-popup-current-surface: rgba(213, 229, 234, 0.44);
    --rw-popup-text: #2d2a26;
    --rw-popup-status-text: #51483e;
    --rw-popup-secondary-text: #59636e;
    --rw-popup-muted-text: #8a8175;
    --rw-popup-border: rgba(96, 78, 48, 0.14);
    --rw-popup-control-border: rgba(45, 52, 60, 0.16);
    --rw-popup-divider: rgba(96, 78, 48, 0.11);
    --rw-popup-shadow: 0 0.9rem 2rem rgba(45, 42, 38, 0.2);
    --rw-popup-current-badge-surface: rgba(13, 110, 253, 0.1);
    --rw-popup-current-badge-text: #0b5ed7;
    --rw-popup-remove-hover-surface: #f0ece4;
    --rw-popup-apply-surface: #f2eee5;
    --rw-popup-apply-hover-surface: #e8e1d3;
    --rw-popup-apply-text: #413a32;
    /* INTEGRATION-SOUP-MONACO-PILL-THEME: Shared product-owned pill tokens. */
    --rw-expression-pill-surface: #f6f7f8;
    --rw-expression-pill-text: #27313a;
    --rw-expression-pill-border: rgba(59, 64, 69, 0.22);
    --rw-expression-pill-variable-surface: #fbf0fc;
    --rw-expression-pill-variable-text: #7b2085;
    --rw-expression-pill-variable-border: rgba(160, 42, 172, 0.34);
    --rw-expression-pill-binding-surface: #f1f7ed;
    --rw-expression-pill-binding-text: #365b2b;
    --rw-expression-pill-binding-border: rgba(87, 109, 72, 0.36);
    --rw-expression-pill-binding-invalid-surface: #fff0f0;
    --rw-expression-pill-binding-invalid-text: #8e2020;
    --rw-expression-pill-binding-invalid-border: rgba(184, 45, 45, 0.58);
    --rw-expression-pill-datatable-surface: #fff5df;
    --rw-expression-pill-datatable-text: #704b00;
    --rw-expression-pill-datatable-border: rgba(145, 102, 28, 0.32);
    --rw-expression-pill-hl7-datatable-surface: #edf8f7;
    --rw-expression-pill-hl7-datatable-text: #245f5d;
    --rw-expression-pill-hl7-datatable-border: rgba(42, 116, 112, 0.34);
    --rw-expression-pill-hl7-surface: #f5f0fb;
    --rw-expression-pill-hl7-text: #4e3479;
    --rw-expression-pill-hl7-border: rgba(112, 82, 156, 0.34);
    --rw-expression-pill-activity-surface: #eaf5ff;
    --rw-expression-pill-activity-text: #005f9e;
    --rw-expression-pill-activity-secondary-text: #4c82a8;
    --rw-expression-pill-activity-border: rgba(0, 122, 204, 0.42);
    --rw-expression-pill-unknown-surface: #f4f4f4;
    --rw-expression-pill-unknown-text: #4d5359;
    --rw-expression-pill-unknown-border: rgba(92, 98, 105, 0.28);
    --integration-host-app-background: var(--rw-canvas);
    --integration-host-panel-background: var(--rw-surface);
}

:root.soup-theme-dark {
    color-scheme: dark;
    --rw-canvas: #111820;
    --rw-surface: #18222c;
    --rw-surface-subtle: #1d2934;
    --rw-side-surface: #202d38;
    --rw-surface-muted: #26333f;
    --rw-surface-hover: #243a4a;
    --rw-surface-selected: #28475e;
    --rw-text: #edf3f8;
    --rw-text-muted: #a9b8c5;
    --rw-border: #3a4a57;
    --rw-border-strong: #536674;
    --rw-focus: #5db8f2;
    --rw-focus-ring: rgba(93, 184, 242, 0.28);
    --rw-accent: #2688c8;
    --rw-accent-hover: #329bdc;
    --rw-action-accent: #007acc;
    --rw-action-accent-hover: #1692df;
    --workflow-counter-success: #a7d8ee;
    --workflow-counter-failed: #f0b7cb;
    --workflow-counter-stopped: #9aa8b3;
    --rw-constructive: #3f9a61;
    --rw-constructive-hover: #4caf70;
    --rw-action-constructive: #2da01e;
    --rw-action-constructive-hover: #39b929;
    --rw-danger: #ee7c83;
    --rw-warning: #e4b75c;
    --rw-success: #73c78e;
    --rw-callout-warm: #3a321f;
    --rw-callout-warm-border: #796737;
    --rw-callout-warm-text: #f1dfaa;
    --rw-callout-link: #8cccf2;
    --rw-shadow: 0 0.6rem 1.45rem rgba(0, 0, 0, 0.34);
    --rw-selection-shadow: 0 0.2rem 0.48rem rgba(0, 0, 0, 0.32);
    --rw-pill-surface: #202d38;
    --rw-pill-surface-hover: #28475e;
    --rw-pill-text: #dceaf4;
    --rw-pill-border: #536674;
    --rw-pill-strong-text: #f7fbff;
    --rw-pill-danger-text: #ffb0a8;
    --rw-popup-surface: #18222c;
    --rw-popup-subtle-surface: #202d38;
    --rw-popup-hover-surface: #243a4a;
    --rw-popup-current-surface: #28475e;
    --rw-popup-text: #edf3f8;
    --rw-popup-status-text: #dce7ef;
    --rw-popup-secondary-text: #b8c7d2;
    --rw-popup-muted-text: #8293a0;
    --rw-popup-border: #536674;
    --rw-popup-control-border: #536674;
    --rw-popup-divider: #3a4a57;
    --rw-popup-shadow: 0 0.9rem 2rem rgba(0, 0, 0, 0.46);
    --rw-popup-current-badge-surface: #203f56;
    --rw-popup-current-badge-text: #8fd2ff;
    --rw-popup-remove-hover-surface: #2a3d4a;
    --rw-popup-apply-surface: #243a4a;
    --rw-popup-apply-hover-surface: #2d4a5d;
    --rw-popup-apply-text: #edf3f8;
    --rw-expression-pill-surface: #2b343c;
    --rw-expression-pill-text: #d8e0e6;
    --rw-expression-pill-border: #7c8994;
    --rw-expression-pill-variable-surface: #3a2947;
    --rw-expression-pill-variable-text: #efd8ff;
    --rw-expression-pill-variable-border: #a879c8;
    --rw-expression-pill-binding-surface: #243a2b;
    --rw-expression-pill-binding-text: #d5efd3;
    --rw-expression-pill-binding-border: #78a874;
    --rw-expression-pill-binding-invalid-surface: #482729;
    --rw-expression-pill-binding-invalid-text: #ffc3c3;
    --rw-expression-pill-binding-invalid-border: #d87878;
    --rw-expression-pill-datatable-surface: #3d3220;
    --rw-expression-pill-datatable-text: #f3ddb1;
    --rw-expression-pill-datatable-border: #b58b45;
    --rw-expression-pill-hl7-datatable-surface: #3b3820;
    --rw-expression-pill-hl7-datatable-text: #f2e9ad;
    --rw-expression-pill-hl7-datatable-border: #bca953;
    --rw-expression-pill-hl7-surface: #203747;
    --rw-expression-pill-hl7-text: #d4ecfb;
    --rw-expression-pill-hl7-border: #6c9ebf;
    --rw-expression-pill-activity-surface: #1d3b42;
    --rw-expression-pill-activity-text: #d0f0f4;
    --rw-expression-pill-activity-secondary-text: #9fcbd3;
    --rw-expression-pill-activity-border: #5aa7b4;
    --rw-expression-pill-unknown-surface: #2b343c;
    --rw-expression-pill-unknown-text: #d8e0e6;
    --rw-expression-pill-unknown-border: #7c8994;
    --integration-host-app-background: #111820;
    --integration-host-panel-background: #18222c;
}

/* Server Color is intentionally scoped to a small set of host controls.
   It must not replace shared theme accents or colour broad UI surfaces. */
.shell--tinted {
    --server-color: rgb(var(--server-tint-rgb));
    --server-color-hover: color-mix(in srgb, var(--server-color) 86%, #000000);
    --server-color-ink: color-mix(in srgb, var(--server-color) 68%, #000000);
}

.shell--tinted :is(.settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) :is(button:not(.secondary):not(.danger):not(.workflow-feature-tab):not(.dashboard-filter-chip):not(.workflow-card__action):not(.lookup-tables-page__table-option):not(.interfaces-page__list-item):not(.server-settings-page__auth-option-button):not(.server-settings-page__tint-trigger):not(.server-settings-page__tint-option):not(.server-settings-page__tint-dismiss):not(.workflow-log-panel__entry):not(.workflow-log-panel__filter-button), .button-link:not(.secondary):not(.danger)) {
    border-color: var(--server-color);
    background: var(--server-color);
}

.shell--tinted :is(.settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) :is(button:not(.secondary):not(.danger):not(.workflow-feature-tab):not(.dashboard-filter-chip):not(.workflow-card__action):not(.lookup-tables-page__table-option):not(.interfaces-page__list-item):not(.server-settings-page__auth-option-button):not(.server-settings-page__tint-trigger):not(.server-settings-page__tint-option):not(.server-settings-page__tint-dismiss):not(.workflow-log-panel__entry):not(.workflow-log-panel__filter-button), .button-link:not(.secondary):not(.danger)):is(:hover, :focus-visible) {
    border-color: var(--server-color-hover);
    background: var(--server-color-hover);
}

.shell--tinted .shell__sidebar-toggle.secondary,
.shell--tinted .nav__link.active,
.shell--tinted .nav__link.active:hover,
.shell--tinted .nav__sublink.active {
    border-color: var(--server-color);
    background: var(--server-color);
}

.shell--tinted .nav__sublink.active::before {
    background: #ffffff;
}

.shell--tinted .settings-page.server-settings-page .server-settings-page__switch-input:checked + .server-settings-page__switch-track {
    background: var(--server-color);
    box-shadow: inset 0 0 0 1px var(--server-color-hover);
}

.shell--tinted .settings-page input:where([type="checkbox"], [type="radio"]):checked {
    accent-color: var(--server-color);
}

.shell--tinted .settings-page.server-settings-page .server-settings-page__server-card.is-current {
    border-color: color-mix(in srgb, var(--server-color) 62%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
}

/* Standalone shell. Dashboard structure is deliberately not changed. */
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell__body {
    background: var(--rw-canvas);
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell-header {
    border-bottom-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell-header__server-name,
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell-header__brand-text {
    color: var(--rw-text);
}

:root.soup-theme-dark body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) {
    background: var(--rw-canvas);
    color: var(--rw-text);
}

.shell-header__theme-menu {
    position: relative;
}

.shell-header__theme-menu > summary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--rw-control-min-height);
    min-width: var(--rw-control-min-height);
    min-height: var(--rw-control-min-height);
    padding: 0;
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background-color: var(--rw-surface);
    color: var(--rw-text);
    cursor: pointer;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    list-style: none;
}

.shell-header__theme-menu > summary::-webkit-details-marker {
    display: none;
}

.shell-header__theme-menu > summary:hover {
    background: var(--rw-surface-hover);
}

.shell-header__theme-menu > summary:focus-visible {
    border-color: var(--rw-focus);
    outline: 0;
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

.shell-header__theme-options {
    position: absolute;
    top: calc(100% + 0.4rem);
    right: 0;
    z-index: 60;
    display: grid;
    min-width: 7rem;
    padding: 0.3rem;
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    box-shadow: var(--rw-shadow);
}

.shell-header__theme-options button {
    justify-content: flex-start;
    padding: 0.38rem 0.55rem;
    border: 0;
    border-radius: calc(var(--rw-control-radius) - 0.1rem);
    background: transparent;
    color: var(--rw-text);
    font: inherit;
    font-size: 0.82rem;
    cursor: pointer;
}

.shell-header__theme-options button:hover,
.shell-header__theme-options button[aria-checked="true"] {
    background: var(--rw-surface-hover);
}

.shell-header__theme-options button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.14rem var(--rw-focus-ring);
}

:root.soup-theme-dark .shell-header {
    border-bottom-color: var(--rw-border);
    background: #151f28;
    color: var(--rw-text);
}

:root.soup-theme-dark .shell--tinted .shell-header {
    border-bottom-color: rgba(var(--server-tint-rgb), 0.52);
    box-shadow: inset 0 3px 0 rgba(var(--server-tint-rgb), 0.58);
}

:root.soup-theme-dark .shell--tinted .shell__sidebar {
    border-right-color: rgba(var(--server-tint-rgb), 0.46);
}

:root.soup-theme-dark .shell--tinted .shell-header__server-role {
    border-color: rgba(var(--server-tint-rgb), 0.62);
    background: rgba(var(--server-tint-rgb), 0.3);
    color: var(--rw-text);
}

:root.soup-theme-dark .shell-header__server-name,
:root.soup-theme-dark .shell-header__brand-text {
    color: var(--rw-text);
}

:root.soup-theme-dark .shell-header__server-picker {
    border-color: var(--rw-border);
    background-color: var(--rw-surface-muted);
    color: var(--rw-text);
    box-shadow: none;
}

:root.soup-theme-dark .shell__body-overlay {
    background: rgba(17, 24, 32, 0.35);
}

:root.soup-theme-dark :is(.panel, .metric, .shell__wall-card) {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: var(--rw-shadow);
}

:root.soup-theme-dark :is(.metric__label, .inline-status, .text-mutedhl7) {
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .data-table :is(th, td) {
    border-bottom-color: var(--rw-border);
}

:root.soup-theme-dark .data-table tbody tr:hover {
    background: var(--rw-surface-hover);
}

:root.soup-theme-dark .data-table tbody tr.is-selected {
    background: var(--rw-surface-selected);
}

/* Compact management surfaces use the same density and palette as the designers. */
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) {
    color: var(--rw-text);
    font-size: 0.875rem;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .page-header {
    gap: 0.65rem;
    align-items: center;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .page-header h1 {
    color: var(--rw-text);
    font-size: clamp(1.4rem, 1.15rem + 0.7vw, 1.75rem);
    line-height: 1.1;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .page-header p,
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) :is(.inline-status, .text-mutedhl7) {
    color: var(--rw-text-muted);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .panel {
    padding: 0.8rem;
    border: 1px solid var(--rw-border);
    border-radius: 0.6rem;
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: 0 0.16rem 0.45rem rgba(33, 43, 54, 0.1);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) :is(.panel__header, .panel__toolbar, .actions, .field-row, .page-grid, .tab-row) {
    gap: 0.5rem;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .panel__header {
    margin-bottom: 0.55rem;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .panel__toolbar {
    margin-bottom: 0.65rem;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    input:where(:not([type="checkbox"]):not([type="radio"]):not(.inputarea)),
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) select,
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) textarea:where(:not(.inputarea)) {
    width: 100%;
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
    font: inherit;
    line-height: 1.5;
    box-shadow: none;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) textarea:where(:not(.inputarea)) {
    resize: vertical;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    input:where(:not([type="checkbox"]):not([type="radio"]):not(.inputarea):hover:not(:disabled)),
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) select:where(:hover:not(:disabled)),
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) textarea:where(:not(.inputarea):hover:not(:disabled)) {
    border-color: var(--rw-border-strong);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    input:where(:not([type="checkbox"]):not([type="radio"]):not(.inputarea):focus),
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) select:focus,
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) textarea:where(:not(.inputarea):focus) {
    border-color: var(--rw-focus);
    outline: 0;
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) input:where([type="checkbox"], [type="radio"]) {
    accent-color: var(--rw-accent);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    button:where(:not([class*="delete"]):not([class*="close"]):not([class*="icon"])) {
    min-height: 1.8rem;
    padding: 0.24rem 0.58rem;
    border: 1px solid transparent;
    border-radius: var(--rw-control-radius);
    background: var(--rw-action-accent);
    color: #ffffff;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.15;
    box-shadow: none;
    transform: none;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    button.secondary:where(:not([class*="delete"]):not([class*="close"]):not([class*="icon"])),
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .button-link.secondary {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) button.danger,
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .button-link.danger {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-subtle);
    color: var(--rw-text-muted);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    button:where(:not([class*="delete"]):not([class*="close"]):not([class*="icon"]):not(:disabled):hover),
:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    button:where(:not([class*="delete"]):not([class*="close"]):not([class*="icon"]):not(:disabled):focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-action-accent-hover);
    color: #ffffff;
    opacity: 1;
    transform: none;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) button.constructive:not(:disabled) {
    border-color: var(--rw-action-constructive);
    background: var(--rw-action-constructive);
    color: #ffffff;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    button.constructive:not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-action-constructive-hover);
    background: var(--rw-action-constructive-hover);
    color: #ffffff;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page)
    :is(button.danger, .button-link.danger):not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-accent);
    background: var(--rw-surface-hover);
    color: var(--rw-accent);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) button:disabled {
    cursor: not-allowed;
    opacity: 0.58;
    transform: none;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .list-box {
    gap: 0.3rem;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .list-box button {
    min-height: 1.9rem;
    padding: 0.3rem 0.55rem;
    border: 1px solid transparent;
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
    font-weight: 500;
    transform: none;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .list-box button strong {
    font-weight: inherit;
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .list-box button:is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .list-box button.active {
    border-color: var(--rw-border);
    background: var(--rw-surface-selected);
    color: var(--rw-text);
    font-weight: 600;
    box-shadow: var(--rw-selection-shadow);
}

/* Lookup-table choices use the same restrained hierarchy as workflow rows:
   ordinary entries sit quietly on the theme surface, while only the active
   entry carries the Server Color outline and light selection wash. */
.settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box {
    background: var(--rw-surface);
}

.settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box button:not(.active) {
    border-color: transparent;
    background: var(--rw-surface);
    color: var(--rw-text);
}

.settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box button:not(.active):is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--rw-action-accent) 44%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-accent) 2%, var(--rw-surface));
    color: color-mix(in srgb, var(--rw-action-accent) 68%, #000000);
}

.settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box button.active {
    border-color: var(--rw-action-accent);
    background: color-mix(in srgb, var(--rw-action-accent) 8%, var(--rw-surface));
    color: color-mix(in srgb, var(--rw-action-accent) 68%, #000000);
    box-shadow: none;
}

.shell--tinted .settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box button:not(.active) {
    border-color: transparent;
    background: var(--rw-surface);
    color: var(--rw-text);
}

.shell--tinted .settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box button:not(.active):is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--server-color) 44%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 2%, var(--rw-surface));
    color: var(--server-color-ink);
}

.shell--tinted .settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box button.active {
    border-color: var(--server-color);
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface));
    color: var(--server-color-ink);
}

:root.soup-theme-dark .shell--tinted .settings-page.lookup-tables-page .lookup-tables-page__table-list .list-box button:is(.active, :hover, :focus-visible) {
    color: color-mix(in srgb, var(--server-color) 58%, var(--rw-text));
}

/* Grid cells own their geometry; their editors stay square and flush. */
:is(.settings-page.lookup-tables-page .lookup-table-grid__cell,
    .settings-page.data-tables-page .data-tables-page__grid-cell)
    input:where(:not([type="checkbox"]):not([type="radio"])),
.settings-page.data-tables-page .data-tables-page__column-header input {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 0;
    border-radius: 0;
    background: var(--rw-surface);
    color: var(--rw-text);
    box-sizing: border-box;
    box-shadow: none;
}

:is(.settings-page.lookup-tables-page .lookup-table-grid__cell,
    .settings-page.data-tables-page .data-tables-page__grid-cell)
    input:where(:not([type="checkbox"]):not([type="radio"])):focus,
.settings-page.data-tables-page .data-tables-page__column-header input:focus {
    border: 0;
    outline: 0;
    box-shadow: inset 0 0 0 2px var(--rw-focus);
}

/* Data Table hierarchy follows the same quiet list treatment as workflows and
   lookup tables. Indentation and icons carry the hierarchy; only hover and the
   selected row receive a restrained outline. */
.data-tables-page .data-tables-page__tree-shell,
.data-tables-page .data-tables-page__tree-shell .data-tables-page__loading-content {
    background: var(--rw-surface);
}

.data-tables-page .data-table-tree-node {
    margin-block: 1px;
}

.data-tables-page .data-table-tree-node__row {
    border: 1px solid transparent;
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: none;
}

.data-tables-page .data-table-tree-node__row:not(.is-selected):is(:hover, :focus-within) {
    border-color: color-mix(in srgb, var(--rw-action-accent) 44%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-accent) 2%, var(--rw-surface));
    color: color-mix(in srgb, var(--rw-action-accent) 68%, #000000);
}

.data-tables-page .data-table-tree-node__row.is-selected {
    border-color: var(--rw-action-accent);
    background: color-mix(in srgb, var(--rw-action-accent) 8%, var(--rw-surface));
    color: color-mix(in srgb, var(--rw-action-accent) 68%, #000000);
    box-shadow: none;
}

.settings-page.data-tables-page button.data-table-tree-node__content,
.settings-page.data-tables-page button.data-table-tree-node__content:is(:hover, :focus-visible) {
    min-height: 1.8rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font-weight: 400;
    box-shadow: none;
}

/* The node button fills its row.  Explicitly keep that inner hit target
   transparent so the shared Server Color action-button rule cannot turn every
   folder/table into a solid block; the outer row owns hover and selection. */
body .shell--tinted .settings-page.data-tables-page button.data-table-tree-node__content,
body .shell--tinted .settings-page.data-tables-page button.data-table-tree-node__content:is(:hover, :focus-visible, :active) {
    border-color: transparent !important;
    background: transparent !important;
    color: inherit !important;
    box-shadow: none !important;
    transform: none !important;
}

.data-tables-page .data-table-tree-node__row.is-selected .data-table-tree-node__name {
    font-weight: 500;
}

.data-tables-page .data-table-tree-node__row:is(.is-file, .is-field):not(.is-selected) :is(.data-table-tree-node__content, .data-table-tree-node__name) {
    font-weight: 400;
}

.data-tables-page .data-table-tree-node__toggle {
    color: var(--rw-text-muted);
}

.data-tables-page .data-table-tree-node__icon {
    color: var(--rw-callout-link);
}

.data-tables-page .data-table-tree-node__row.is-file .data-table-tree-node__icon {
    color: var(--rw-success);
}

.settings-page.data-tables-page button.data-tables-page__child-card {
    min-height: 1.9rem;
    padding: 0.32rem 0.55rem;
    border: 1px solid transparent;
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
    font-weight: 500;
    box-shadow: none;
}

.settings-page.data-tables-page button.data-tables-page__child-card:is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.data-tables-page .data-tables-page__child-card.is-file {
    font-weight: 400;
}

.data-tables-page .data-tables-page__child-card .data-tables-page__child-icon {
    color: var(--rw-callout-link);
}

.data-tables-page .data-tables-page__child-card.is-file .data-tables-page__child-icon {
    color: var(--rw-success);
}

/* Data Table hierarchy stays neutral unless the actual tree row is selected.
   Hover is a separate, quieter cue; it must not make every row look selected. */
.shell--tinted .data-tables-page .data-table-tree-node__row:not(.is-selected) {
    border-color: transparent;
    background: var(--rw-surface);
    color: var(--rw-text);
}

.shell--tinted .data-tables-page .data-table-tree-node__row:not(.is-selected):is(:hover, :focus-within) {
    border-color: color-mix(in srgb, var(--server-color) 44%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 2%, var(--rw-surface));
    color: var(--server-color-ink);
}

.shell--tinted .data-tables-page .data-table-tree-node__row.is-selected {
    border-color: var(--server-color);
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface));
    color: var(--server-color-ink);
    box-shadow: none;
}

.shell--tinted .data-tables-page .data-table-tree-node__row.is-selected .data-table-tree-node__icon {
    color: var(--server-color);
}

body .shell--tinted .settings-page.data-tables-page button.data-tables-page__child-card {
    border-color: transparent !important;
    background: var(--rw-surface-subtle) !important;
    color: var(--rw-text) !important;
}

body .shell--tinted .settings-page.data-tables-page button.data-tables-page__child-card:is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--server-color) 38%, var(--rw-border)) !important;
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface)) !important;
    color: var(--server-color-ink) !important;
}

:root.soup-theme-dark .shell--tinted .data-tables-page .data-table-tree-node__row:not(.is-selected):is(:hover, :focus-within),
:root.soup-theme-dark body .shell--tinted .settings-page.data-tables-page button.data-tables-page__child-card:is(:hover, :focus-visible) {
    background: color-mix(in srgb, var(--server-color) 3%, var(--rw-surface));
    color: color-mix(in srgb, var(--server-color) 58%, var(--rw-text));
}

:root.soup-theme-dark .shell--tinted .data-tables-page .data-table-tree-node__row.is-selected {
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
    color: color-mix(in srgb, var(--server-color) 58%, var(--rw-text));
}

:root.soup-theme-dark .shell--tinted .data-tables-page .data-table-tree-node__row.is-selected .data-table-tree-node__icon {
    color: color-mix(in srgb, var(--server-color) 74%, var(--rw-text));
}

/* Returned table rows keep the narrow selection strip neutral in both themes;
   only the checked box itself carries the Server Color. */
.shell--tinted .settings-page.data-tables-page :is(.data-tables-page__grid-header, .data-tables-page__grid-row) > .data-tables-page__select-column {
    background: var(--rw-surface);
    color: var(--rw-text);
}

/* Lookup and returned Data Table grids use their checkbox as the authoritative
   row-selection state.  Invalid rows retain their own semantic error cue. */
.shell--tinted .settings-page :is(.lookup-tables-page, .data-tables-page) :is(.lookup-table-grid__row, .data-tables-page__grid-row):not(.is-invalid) {
    background: var(--rw-surface);
    color: var(--rw-text);
}

.shell--tinted .settings-page :is(.lookup-tables-page, .data-tables-page) :is(.lookup-table-grid__row, .data-tables-page__grid-row):hover:not(.is-invalid):not(:has(> :is(.lookup-table-grid__select-column, .data-tables-page__select-column) input[type="checkbox"]:checked)) {
    background: color-mix(in srgb, var(--server-color) 7%, var(--rw-surface));
}

.shell--tinted .settings-page :is(.lookup-tables-page, .data-tables-page) :is(.lookup-table-grid__row, .data-tables-page__grid-row):has(> :is(.lookup-table-grid__select-column, .data-tables-page__select-column) input[type="checkbox"]:checked):not(.is-invalid) {
    background: var(--server-color);
    color: #ffffff;
}

.shell--tinted .settings-page :is(.lookup-tables-page, .data-tables-page) :is(.lookup-table-grid__row, .data-tables-page__grid-row):has(> :is(.lookup-table-grid__select-column, .data-tables-page__select-column) input[type="checkbox"]:checked):not(.is-invalid) :is(.lookup-table-grid__cell, .data-tables-page__grid-cell) input:not([type="checkbox"]) {
    background: transparent;
    color: #ffffff;
}

.shell--tinted .settings-page.data-tables-page .data-tables-page__grid-shell {
    background: var(--rw-surface);
}

.shell--tinted .settings-page.data-tables-page .data-tables-page__loading-overlay {
    background: color-mix(in srgb, var(--server-color) 9%, var(--rw-surface));
    color: var(--rw-text);
}

:root.soup-theme-dark .shell--tinted .settings-page :is(.lookup-tables-page, .data-tables-page) :is(.lookup-table-grid__row, .data-tables-page__grid-row):hover:not(.is-invalid):not(:has(> :is(.lookup-table-grid__select-column, .data-tables-page__select-column) input[type="checkbox"]:checked)) {
    background: color-mix(in srgb, var(--server-color) 14%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .settings-page.data-tables-page .data-tables-page__grid-shell {
    background: var(--rw-surface);
}

:root.soup-theme-dark .shell--tinted .settings-page.data-tables-page .data-tables-page__loading-overlay {
    background: color-mix(in srgb, var(--server-color) 17%, var(--rw-surface));
}

.settings-page.data-tables-page .data-tables-page__details-card {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

.settings-page.data-tables-page .data-tables-page__details-label {
    color: var(--rw-text-muted);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) .data-table :is(th, td) {
    padding: 0.45rem 0.55rem;
    border-bottom-color: var(--rw-border);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) :is(.notification, .metric) {
    border-color: var(--rw-border);
    border-radius: 0.5rem;
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

:is(.settings-page:not(.interface-designer-page):not(.license-page--onboarding), .audit-page) a:not(.button-link) {
    color: var(--rw-callout-link);
}

/*
 * Management-page components pre-date the shared theme and some still carry
 * light-only colours. Keep their existing structure while mapping every
 * visible surface/state onto the same semantic palette. Composite list and
 * disclosure buttons opt out of the generic primary-action treatment.
 */
.settings-page.alerts-page :is(.alerts-page__checkbox-grid label, .alerts-page__inline-check) {
    color: var(--rw-text);
}

.settings-page.alerts-page .alerts-page__suffix,
.settings-page.log-settings-page .log-settings-page__supporting-text {
    color: var(--rw-text-muted);
}

:is(.settings-page.alerts-page .alerts-page__section,
    .settings-page.log-settings-page .log-settings-page__section,
    .settings-page.schedules-page .schedules-page__section) {
    border-color: var(--rw-border);
}

:is(.settings-page.alerts-page .alerts-page__warning,
    .settings-page.log-settings-page .log-settings-page__warning,
    .settings-page.server-settings-page .server-settings-page__warning) {
    border-color: color-mix(in srgb, var(--rw-danger) 36%, transparent);
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
    color: var(--rw-danger);
}

:is(.settings-page.log-settings-page .log-settings-page__server-link-card,
    .settings-page.log-settings-page .log-settings-page__filter-card,
    .settings-page.schedules-page .schedules-page__workflow-meta) {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

.settings-page.log-settings-page .log-settings-page__server-link-card.is-ready {
    border-color: color-mix(in srgb, var(--rw-success) 34%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-success) 12%, var(--rw-surface));
}

.settings-page.log-settings-page .log-settings-page__server-link-card.is-warning {
    border-color: color-mix(in srgb, var(--rw-warning) 34%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-warning) 12%, var(--rw-surface));
}

:is(.settings-page.global-variables-page .global-variables-page__notice,
    .settings-page.global-variables-page .global-variables-page__server-link) {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text-muted);
}

.settings-page.global-variables-page .global-variables-page__table-shell {
    border-color: var(--rw-border);
    background: var(--rw-surface);
}

.settings-page.global-variables-page .global-variables-page__table :is(th, td) {
    border-color: var(--rw-border);
}

.settings-page.global-variables-page .global-variables-page__table th {
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.settings-page.global-variables-page .global-variables-page__table td,
.settings-page.global-variables-page .global-variables-page__table td > :is(input, select, textarea) {
    background: var(--rw-surface);
    color: var(--rw-text);
}

.settings-page.global-variables-page .global-variables-page__vault-text {
    color: var(--rw-text-muted);
}

.settings-page.interfaces-page .interfaces-page__list-shell {
    border-color: var(--rw-border);
    background: var(--rw-surface);
}

.settings-page.interfaces-page button.interfaces-page__list-item {
    min-height: 0;
    padding: 0.55rem 0.65rem;
    border: 1px solid transparent;
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
    font-weight: 500;
    box-shadow: none;
}

.settings-page.interfaces-page button.interfaces-page__list-item:is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.settings-page.interfaces-page button.interfaces-page__list-item.is-selected,
.settings-page.interfaces-page button.interfaces-page__list-item.is-selected:is(:hover, :focus-visible) {
    border-color: var(--rw-border);
    background: var(--rw-surface-selected);
    color: var(--rw-text);
    font-weight: 600;
    box-shadow: var(--rw-selection-shadow);
}

.settings-page.interfaces-page .interfaces-page__list-item-header strong {
    font-weight: inherit;
}

.settings-page.interfaces-page .interfaces-page__list-item-summary,
.settings-page.interfaces-page .interfaces-page__list-item.is-selected .interfaces-page__list-item-summary,
.settings-page.interfaces-page :is(.interfaces-page__empty-list, .interfaces-page__empty-state),
.settings-page.interfaces-page :is(.interfaces-page__metadata, .interfaces-page__detail-label, .interfaces-page__help) {
    color: var(--rw-text-muted);
}

.settings-page.interfaces-page .interfaces-page__badge {
    background: var(--rw-surface-muted);
    color: var(--rw-text-muted);
}

.settings-page.interfaces-page .interfaces-page__badge--orphaned {
    border: 1px solid color-mix(in srgb, var(--rw-danger) 40%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
    color: var(--rw-danger);
}

.settings-page.interfaces-page .interfaces-page__list-item.is-selected .interfaces-page__badge {
    background: color-mix(in srgb, var(--rw-accent) 12%, var(--rw-surface));
    color: var(--rw-callout-link);
}

.settings-page.interfaces-page .interfaces-page__list-item.is-selected .interfaces-page__badge--orphaned {
    border-color: color-mix(in srgb, var(--rw-danger) 40%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
    color: var(--rw-danger);
}

/* Interface rows remain neutral until selected.  The selected item gets the
   stronger, readable Server Color cue; Orphaned remains a semantic state. */
.shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item {
    border-color: transparent;
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

.shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item:is(:hover, :focus-visible):not(.is-selected) {
    border-color: color-mix(in srgb, var(--server-color) 36%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item.is-selected,
.shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item.is-selected:is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--server-color) 74%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 24%, var(--rw-surface));
    color: var(--server-color-hover);
    font-weight: 650;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--server-color) 36%, transparent);
}

:root.soup-theme-dark .shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item:is(:hover, :focus-visible):not(.is-selected) {
    background: color-mix(in srgb, var(--server-color) 15%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item.is-selected,
:root.soup-theme-dark .shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item.is-selected:is(:hover, :focus-visible) {
    background: color-mix(in srgb, var(--server-color) 36%, var(--rw-surface));
    color: color-mix(in srgb, var(--server-color) 66%, var(--rw-text));
}

.shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item.is-selected .interfaces-page__list-item-summary {
    color: var(--server-color-hover);
}

:root.soup-theme-dark .shell--tinted .settings-page.interfaces-page button.interfaces-page__list-item.is-selected .interfaces-page__list-item-summary {
    color: color-mix(in srgb, var(--server-color) 66%, var(--rw-text));
}

:is(.settings-page.interfaces-page .interfaces-page__form-card,
    .settings-page.interfaces-page .interfaces-page__editor-card,
    .settings-page.interfaces-page .interfaces-page__description-card,
    .settings-page.interfaces-page .interfaces-page__tip,
    .settings-page.interfaces-page .interfaces-page__preview-card,
    .settings-page.interfaces-page .interfaces-page__modal,
    .settings-page.create-interface-page .create-interface-page__option-section) {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

.settings-page.interfaces-page :is(.interfaces-page__details-grid dt,
    .interfaces-page__description-label,
    .interfaces-page__autosave-note,
    .interfaces-page__tip,
    .interfaces-page__metadata,
    .interfaces-page__detail-label,
    .interfaces-page__help) {
    color: var(--rw-text-muted);
}

.settings-page.interfaces-page .interfaces-page__status {
    border-color: color-mix(in srgb, var(--rw-success) 34%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-success) 12%, var(--rw-surface));
    color: var(--rw-success);
}

.settings-page.interfaces-page :is(.interfaces-page__error, .interfaces-page__modal-error) {
    border-color: color-mix(in srgb, var(--rw-danger) 34%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
    color: var(--rw-danger);
}

.audit-page .audit-page__filter-grid label {
    color: var(--rw-text);
}

.audit-page .audit-page__table-shell {
    border-color: var(--rw-border);
    background: var(--rw-surface);
}

.audit-page :is(.audit-page__empty, .audit-page__detail-label, .audit-page__detail-list dt) {
    color: var(--rw-text-muted);
}

.audit-page .audit-page__empty--error {
    color: var(--rw-danger);
}

.audit-page .audit-page__details-row td {
    background: var(--rw-surface-subtle);
}

/* Audit Results rows keep their semantic outcome indicators. Server Color is
   only a quiet hover and expanded-row cue, never a dark action surface. */
.shell--tinted .audit-page .audit-page__actions button:not(.secondary):not(.danger) {
    border-color: var(--server-color);
    background: var(--server-color);
    color: #ffffff;
}

.shell--tinted .audit-page .audit-page__actions button:not(.secondary):not(.danger):is(:hover, :focus-visible) {
    border-color: var(--server-color-hover);
    background: var(--server-color-hover);
    color: #ffffff;
}

.shell--tinted .audit-page .audit-page__table tbody .audit-page__row:hover {
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface));
}

.shell--tinted .audit-page .audit-page__table tbody .audit-page__row.is-selected {
    background: color-mix(in srgb, var(--server-color) 16%, var(--rw-surface));
}

.shell--tinted .audit-page .audit-page__details-row td {
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .audit-page .audit-page__table tbody .audit-page__row:hover {
    background: color-mix(in srgb, var(--server-color) 16%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .audit-page .audit-page__table tbody .audit-page__row.is-selected {
    background: color-mix(in srgb, var(--server-color) 26%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .audit-page .audit-page__details-row td {
    background: color-mix(in srgb, var(--server-color) 20%, var(--rw-surface));
}

.audit-page .audit-page__details {
    border-color: var(--rw-border);
}

.audit-page .audit-page__outcome.is-succeeded {
    background: color-mix(in srgb, var(--rw-success) 14%, var(--rw-surface));
    color: var(--rw-success);
}

.audit-page .audit-page__outcome.is-failed {
    background: color-mix(in srgb, var(--rw-danger) 14%, var(--rw-surface));
    color: var(--rw-danger);
}

:is(.settings-page.history-page .history-page__count-pill,
    .settings-page.history-page .history-page__toggle,
    .settings-page.history-page .history-page__summary-card) {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

.settings-page.history-page .history-page__table-shell {
    border-color: var(--rw-border);
    background: var(--rw-surface);
}

.settings-page.history-page :is(.history-page__table-empty, .history-page__summary-label, .history-page__import-note) {
    color: var(--rw-text-muted);
}

.settings-page.history-page .history-page__summary-value {
    color: var(--rw-text);
}

.settings-page.history-page :is(.history-page__comment-state, .history-page__import-note.is-pending) {
    color: var(--rw-warning);
}

.settings-page.history-page .history-page__version-row--pending {
    background: color-mix(in srgb, var(--rw-warning) 10%, var(--rw-surface));
}

.settings-page.create-interface-page .create-interface-page__message-drop-note,
.settings-page.create-interface-page .create-interface-page__note {
    color: var(--rw-text-muted);
}

.settings-page.create-interface-page .create-interface-page__message-drop-note code {
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.settings-page.create-interface-page button.create-interface-page__option-section-toggle,
.settings-page.create-interface-page button.create-interface-page__option-section-toggle:is(:hover, :focus-visible) {
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--rw-text);
    box-shadow: none;
}

.settings-page.create-interface-page button.create-interface-page__option-section-toggle:is(:hover, :focus-visible) {
    background: var(--rw-surface-hover);
}

.settings-page.create-interface-page .create-interface-page__note {
    background: var(--rw-surface-subtle);
}

.settings-page.create-interface-page .create-interface-page__error {
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
    color: var(--rw-danger);
}

:is(.settings-page.server-settings-page .server-settings-page__server-card,
    .settings-page.server-settings-page .server-settings-page__note,
    .settings-page.server-settings-page .server-settings-page__fact,
    .settings-page.server-settings-page .server-settings-page__auth-option,
    .settings-page.server-settings-page .server-settings-page__empty-select,
    .settings-page.server-settings-page .server-settings-page__diagnostic-details,
    .settings-page.server-settings-page .server-settings-page__switch,
    .settings-page.server-settings-page .server-settings-page__oidc-test-row,
    .settings-page.server-settings-page .server-settings-page__examples,
    .settings-page.server-settings-page .server-settings-page__example-code,
    .settings-page.server-settings-page .server-settings-page__optional-card,
    .settings-page.server-settings-page .server-settings-page__session-card) {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
    box-shadow: none;
}

.settings-page.server-settings-page .server-settings-page__server-card.is-current,
.settings-page.server-settings-page .server-settings-page__auth-option.is-selected {
    border-color: var(--rw-focus);
    background: var(--rw-surface-selected);
    box-shadow: var(--rw-selection-shadow);
}

.settings-page.server-settings-page .server-settings-page__auth-option:hover:not(.server-settings-page__auth-option--disabled) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    box-shadow: none;
}

/* Authentication choices are neutral until an enabled choice is expanded.
   A configured Server Color then supplies only the selected-card treatment. */
.shell--tinted .settings-page.server-settings-page .server-settings-page__auth-option.is-selected:has(.server-settings-page__auth-option-details) {
    border-color: color-mix(in srgb, var(--server-color) 56%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
    box-shadow: none;
}

.shell--tinted .settings-page.server-settings-page .server-settings-page__auth-option.is-selected:has(.server-settings-page__auth-option-details):is(:hover, :focus-within) {
    border-color: color-mix(in srgb, var(--server-color) 62%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 15%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .settings-page.server-settings-page .server-settings-page__auth-option.is-selected:has(.server-settings-page__auth-option-details) {
    background: color-mix(in srgb, var(--server-color) 20%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .settings-page.server-settings-page .server-settings-page__auth-option.is-selected:has(.server-settings-page__auth-option-details):is(:hover, :focus-within) {
    background: color-mix(in srgb, var(--server-color) 22%, var(--rw-surface));
}

.settings-page.server-settings-page button.server-settings-page__auth-option-button,
.settings-page.server-settings-page button.server-settings-page__auth-option-button:is(:hover, :focus-visible),
.settings-page.server-settings-page .server-settings-page__auth-option.is-selected button.server-settings-page__auth-option-button {
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--rw-text);
    font-size: inherit;
    text-align: left;
    box-shadow: none;
}

/* The custom Server Color combobox remains an input surface rather than
   inheriting the default action-button fill. Its menu can therefore show a
   real, readable swatch for every colour option. */
.settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-trigger {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

.settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-trigger:is(:hover, :focus-visible),
.settings-page.server-settings-page .server-settings-page__identity-grid .server-settings-page__tint-control.is-open button.secondary.server-settings-page__tint-trigger {
    border-color: var(--rw-focus);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-option {
    border-color: transparent;
    background: var(--rw-surface);
    color: var(--rw-text);
}

.settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-option:is(:hover, :focus-visible, .is-highlighted) {
    border-color: color-mix(in srgb, var(--rw-focus) 42%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-focus) 7%, var(--rw-surface));
    color: var(--rw-text);
}

.settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-option[aria-selected="true"] {
    border-color: var(--rw-focus);
}

.shell--tinted .settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-option:is(:hover, :focus-visible, .is-highlighted, [aria-selected="true"]) {
    border-color: color-mix(in srgb, var(--server-color) 52%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 7%, var(--rw-surface));
    color: var(--server-color-ink);
}

.shell--tinted .settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-option[aria-selected="true"] {
    border-color: var(--server-color);
}

:root.soup-theme-dark .shell--tinted .settings-page.server-settings-page .server-settings-page__identity-grid button.secondary.server-settings-page__tint-option:is(:hover, :focus-visible, .is-highlighted, [aria-selected="true"]) {
    color: color-mix(in srgb, var(--server-color) 58%, var(--rw-text));
}

.settings-page.server-settings-page button.server-settings-page__tint-dismiss {
    border: 0;
    background: transparent;
    box-shadow: none;
}

.settings-page.server-settings-page :is(.server-settings-page__server-url,
    .server-settings-page__attachment-meta,
    .server-settings-page__note,
    .server-settings-page__fact-label,
    .server-settings-page__auth-option-summary,
    .server-settings-page__auth-option.is-selected .server-settings-page__auth-option-summary,
    .server-settings-page__auth-option-chevron,
    .server-settings-page__auth-option-coming-soon,
    .server-settings-page__auth-option-copy,
    .server-settings-page__oidc-redirect-label,
    .server-settings-page__diagnostic-details,
    .server-settings-page__switch-hint,
    .server-settings-page__optional-copy,
    .server-settings-page__audit-retention-input,
    .server-settings-page__import-note) {
    color: var(--rw-text-muted);
}

.settings-page.server-settings-page :is(.server-settings-page__auth-option-title,
    .server-settings-page__switch-label,
    .server-settings-page__oidc-redirect-value) {
    color: var(--rw-text);
}

.settings-page.server-settings-page .server-settings-page__oidc-redirect-uri {
    border-color: var(--rw-border);
    background: var(--rw-surface-hover);
}

.settings-page.server-settings-page .server-settings-page__switch-track {
    background: var(--rw-surface-muted);
    box-shadow: inset 0 0 0 1px var(--rw-border-strong);
}

.settings-page.server-settings-page .server-settings-page__switch-thumb {
    background: var(--rw-surface);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

.settings-page.server-settings-page .server-settings-page__switch-input:checked + .server-settings-page__switch-track {
    background: var(--rw-action-accent);
    box-shadow: inset 0 0 0 1px var(--rw-accent-hover);
}

.settings-page.server-settings-page .server-settings-page__switch-input:focus-visible + .server-settings-page__switch-track {
    outline-color: var(--rw-focus-ring);
}

.settings-page.server-settings-page .server-settings-page__badge {
    background: var(--rw-surface-muted);
    color: var(--rw-text-muted);
}

.settings-page.server-settings-page .server-settings-page__badge--current {
    background: color-mix(in srgb, var(--rw-accent) 14%, var(--rw-surface));
    color: var(--rw-callout-link);
}

.settings-page.server-settings-page :is(.server-settings-page__badge--warning, .server-settings-page__import-note.is-pending) {
    background: color-mix(in srgb, var(--rw-warning) 14%, var(--rw-surface));
    color: var(--rw-warning);
}

.settings-page.server-settings-page :is(.server-settings-page__offline-detail, .server-settings-page__validation-message) {
    color: var(--rw-danger);
}

.settings-page.server-settings-page .server-settings-page__input--invalid {
    border-color: var(--rw-danger) !important;
    background: color-mix(in srgb, var(--rw-danger) 8%, var(--rw-surface));
    box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--rw-danger) 22%, transparent);
}

/* Shared designer control density. */
:is(.workflow-designer-page, .interface-designer-page) {
    color: var(--rw-text);
    font-size: 0.875rem;
}

:where(.workflow-designer-page, .interface-designer-page)
    input:where(:not([type="checkbox"]):not([type="radio"]):not(.inputarea)),
:where(.workflow-designer-page, .interface-designer-page) select,
:where(.workflow-designer-page, .interface-designer-page) textarea:where(:not(.inputarea)) {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
    font: inherit;
    line-height: 1.5;
    box-shadow: none;
}

:where(.workflow-designer-page, .interface-designer-page)
    input:where(:not([type="checkbox"]):not([type="radio"]):not(.inputarea):hover:not(:disabled)),
:where(.workflow-designer-page, .interface-designer-page) select:where(:hover:not(:disabled)),
:where(.workflow-designer-page, .interface-designer-page) textarea:where(:not(.inputarea):hover:not(:disabled)) {
    border-color: var(--rw-border-strong);
}

:where(.workflow-designer-page, .interface-designer-page)
    input:where(:not([type="checkbox"]):not([type="radio"]):not(.inputarea):focus),
:where(.workflow-designer-page, .interface-designer-page) select:where(:focus),
:where(.workflow-designer-page, .interface-designer-page) textarea:where(:not(.inputarea):focus) {
    border-color: var(--rw-focus);
    outline: 0;
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

:where(.workflow-designer-page, .interface-designer-page) input:where(:disabled),
:where(.workflow-designer-page, .interface-designer-page) select:where(:disabled),
:where(.workflow-designer-page, .interface-designer-page) textarea:where(:disabled) {
    background: var(--rw-surface-muted);
    color: var(--rw-text-muted);
    opacity: 0.78;
}

:where(.workflow-designer-page, .interface-designer-page)
    input:where([type="checkbox"], [type="radio"]) {
    accent-color: var(--rw-accent);
}

:is(.workflow-designer-page, .interface-designer-page) :is(.form-control, .form-select) {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border-color: var(--rw-border);
    border-radius: var(--rw-control-radius);
    background-color: var(--rw-surface);
    color: var(--rw-text);
    font: inherit;
    line-height: 1.5;
    box-shadow: none;
}

:is(.workflow-designer-page, .interface-designer-page) .form-select {
    padding-right: 1.75rem;
}

:is(.workflow-designer-page, .interface-designer-page) :is(.form-control, .form-select):focus {
    border-color: var(--rw-focus);
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

:is(.workflow-designer-page, .interface-designer-page) .input-group-text {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .interface-designer-page)
    button:where(:not([class*="workflow-designer-activity"]):not(.workflow-designer-resizer):not(.interface-grid-header__button)) {
    min-height: 1.8rem;
    padding: 0.24rem 0.58rem;
    border: 1px solid transparent;
    border-radius: var(--rw-control-radius);
    background: var(--rw-action-accent);
    color: #ffffff;
    font: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.15;
    box-shadow: none;
    transform: none;
}

:where(.workflow-designer-page, .interface-designer-page)
    button:where(.secondary:not([class*="workflow-designer-activity"])),
:where(.workflow-designer-page, .interface-designer-page) .button-link.secondary {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .interface-designer-page)
    button:where(:not([class*="workflow-designer-activity"]):not(:disabled):hover),
:where(.workflow-designer-page, .interface-designer-page)
    button:where(:not([class*="workflow-designer-activity"]):not(:disabled):focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-action-accent-hover);
    color: #ffffff;
    opacity: 1;
    transform: none;
}

:where(.workflow-designer-page, .interface-designer-page)
    button:where(.secondary:not([class*="workflow-designer-activity"]):not(:disabled):hover),
:where(.workflow-designer-page, .interface-designer-page)
    button:where(.secondary:not([class*="workflow-designer-activity"]):not(:disabled):focus-visible) {
    border-color: var(--rw-focus);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .interface-designer-page) button:where(:focus-visible),
:where(.workflow-designer-page, .interface-designer-page) .button-link:where(:focus-visible) {
    outline: 0;
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

/* Workflow Designer's established compact, three-pane WPF hierarchy. */
.workflow-designer-page .workflow-designer-shell {
    border-color: var(--rw-border);
    background: var(--rw-canvas);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-shell__header {
    border-bottom-color: var(--rw-border);
    background: var(--rw-surface);
}

.workflow-designer-page .workflow-designer-shell .workflow-designer-shell__title-input,
.workflow-designer-page .workflow-designer-shell .workflow-designer-shell__title-input::placeholder {
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-shell__meta {
    color: var(--rw-text-muted);
}

.workflow-designer-page .workflow-designer-shell__meta > span,
.workflow-designer-page .workflow-designer-shell__runtime-state {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
}

.workflow-designer-page .workflow-designer-rail {
    border-right-color: var(--rw-border);
    background: #cfd7dd;
}

.workflow-designer-page .workflow-designer-rail__list {
    background: #c7d0d7;
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-main,
.workflow-designer-page .workflow-designer-side {
    background: var(--rw-canvas);
}

.workflow-designer-page .workflow-designer-main {
    border-right-color: var(--rw-border);
}

.workflow-designer-page .workflow-designer-tabs {
    border-bottom-color: var(--rw-border);
    background: var(--rw-surface-muted);
}

.workflow-designer-page .workflow-designer-tab {
    border-color: transparent;
    border-radius: 0.3rem 0.3rem 0 0;
    background: transparent;
    color: var(--rw-text-muted);
}

.workflow-designer-page .workflow-designer-tab:hover:not(:disabled),
.workflow-designer-page .workflow-designer-tab:focus-visible:not(:disabled) {
    border-color: var(--rw-border);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-tab.is-active {
    border-color: var(--rw-border) var(--rw-border) var(--rw-surface);
    background: var(--rw-surface);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-tab-body,
.workflow-designer-page .workflow-designer-editor-pane,
.workflow-designer-page .workflow-designer-side-section {
    background: var(--rw-surface);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-section-header,
.workflow-designer-page .workflow-designer-side-section__header,
.workflow-designer-page .workflow-designer-subsection-header {
    border-color: var(--rw-border-strong);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-section-header :is(p, span, small),
.workflow-designer-page .workflow-designer-subsection-header :is(p, span, small),
.workflow-designer-page .workflow-designer-side-section :is(p, small) {
    color: var(--rw-text-muted);
}

.workflow-designer-page .workflow-designer-activity-identity,
.workflow-designer-page .workflow-designer-row-editor,
.workflow-designer-page .workflow-designer-filter-transformers,
.workflow-designer-page .workflow-designer-filter-preview,
.workflow-designer-page .workflow-designer-transformer-import-preview {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-filter-row,
.workflow-designer-page .workflow-designer-transformer-row,
.workflow-designer-page .workflow-designer-side-row,
.workflow-designer-page .workflow-designer-data-table-shortcut {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-filter-row:hover,
.workflow-designer-page .workflow-designer-transformer-row:hover,
.workflow-designer-page .workflow-designer-side-row:hover,
.workflow-designer-page .workflow-designer-data-table-shortcut:hover {
    background: var(--rw-surface-hover);
}

.workflow-designer-page .workflow-designer-filter-row.is-selected,
.workflow-designer-page .workflow-designer-transformer-row.is-selected {
    border-color: var(--rw-focus);
    background: var(--rw-surface-selected);
}

.workflow-designer-page .workflow-designer-filter-row.is-invalid,
.workflow-designer-page .workflow-designer-transformer-row.is-invalid {
    border-color: var(--rw-danger);
}

.workflow-designer-page .workflow-designer-transformer-row:not(.is-selected):not(.is-invalid) {
    background: var(--rw-surface);
}

.workflow-designer-page .workflow-designer-binding-list,
.workflow-designer-page .workflow-designer-side-list,
.workflow-designer-page .workflow-designer-filter-list,
.workflow-designer-page .workflow-designer-transformer-list,
.workflow-designer-page .workflow-designer-data-table-shortcuts {
    scrollbar-color: var(--rw-border-strong) transparent;
}

:is(.workflow-designer-activity-context-menu,
    .workflow-designer-template-context-menu,
    .workflow-designer-template-context-menu__submenu,
    .workflow-designer-data-table-context-menu,
    .workflow-designer-shell__new-menu-panel,
    .workflow-designer-shell__save-comment-panel,
    .workflow-designer-filter-data-table-picker__menu,
    .workflow-designer-transformer-format-popup,
    .workflow-designer-database-secure-variable__panel) {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: var(--rw-shadow);
}

:is(.workflow-designer-activity-context-menu,
    .workflow-designer-template-context-menu,
    .workflow-designer-template-context-menu__submenu,
    .workflow-designer-data-table-context-menu,
    .workflow-designer-shell__new-menu-panel,
    .workflow-designer-filter-data-table-picker__menu,
    .workflow-designer-transformer-format-popup,
    .workflow-designer-database-secure-variable__panel) button {
    background: transparent;
    color: var(--rw-text);
}

:is(.workflow-designer-activity-context-menu,
    .workflow-designer-template-context-menu,
    .workflow-designer-template-context-menu__submenu,
    .workflow-designer-data-table-context-menu,
    .workflow-designer-shell__new-menu-panel,
    .workflow-designer-filter-data-table-picker__menu,
    .workflow-designer-transformer-format-popup,
    .workflow-designer-database-secure-variable__panel) button:hover:not(:disabled),
:is(.workflow-designer-activity-context-menu,
    .workflow-designer-template-context-menu,
    .workflow-designer-template-context-menu__submenu,
    .workflow-designer-data-table-context-menu,
    .workflow-designer-shell__new-menu-panel,
    .workflow-designer-filter-data-table-picker__menu,
    .workflow-designer-transformer-format-popup,
    .workflow-designer-database-secure-variable__panel) button:focus-visible:not(:disabled) {
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

:is(.workflow-designer-activity-context-menu,
    .workflow-designer-template-context-menu,
    .workflow-designer-template-context-menu__submenu,
    .workflow-designer-data-table-context-menu,
    .workflow-designer-shell__new-menu-panel,
    .workflow-designer-filter-data-table-picker__menu,
    .workflow-designer-transformer-add__menu,
    .workflow-designer-database-secure-variable__panel) button:disabled {
    color: var(--rw-text-muted);
}

.workflow-designer-page .workflow-designer-mllp-address-helper {
    gap: 0.18rem 0.4rem;
    padding: 0.25rem 0.42rem;
    border-color: var(--rw-callout-warm-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-callout-warm);
    color: var(--rw-callout-warm-text);
}

.workflow-designer-page .workflow-designer-mllp-address-helper p {
    margin: 0;
    font-size: 0.76rem;
    line-height: 1.22;
}

.workflow-designer-page .workflow-designer-mllp-address-helper__copy {
    min-height: 0;
}

.workflow-designer-page :is(.workflow-designer-mllp-address-helper__copy,
    .workflow-designer-mllp-address-helper__refresh,
    .workflow-designer-mllp-address-change > summary) {
    color: var(--rw-callout-link);
}

.workflow-designer-page :is(.workflow-designer-mllp-address-helper__copy,
    .workflow-designer-mllp-address-helper__refresh,
    .workflow-designer-mllp-address-change > summary):hover {
    color: var(--rw-accent-hover);
}

.workflow-designer-page .workflow-designer-mllp-address-change > .workflow-designer-mllp-grid--accept-from {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: var(--rw-shadow);
}

/* Activity cards use one Server/System Color family.  Activity type remains
   available through its icon and label; selection is the only strong visual
   state, with a themed border rather than the former white frame. */
.workflow-designer-page .workflow-designer-activity:not(.is-disabled) {
    --workflow-activity-accent: var(--server-color, var(--rw-action-accent));
    --workflow-activity-ink: color-mix(in srgb, var(--workflow-activity-accent) 68%, #000000);
    border: 1px solid color-mix(in srgb, var(--workflow-activity-accent) 48%, var(--rw-border));
    background: color-mix(in srgb, var(--workflow-activity-accent) 14%, var(--rw-surface));
    color: var(--workflow-activity-ink);
    box-shadow: none;
    filter: none;
}

.workflow-designer-page .workflow-designer-activity:not(.is-disabled):hover {
    border-color: color-mix(in srgb, var(--workflow-activity-accent) 72%, var(--rw-border));
    background: color-mix(in srgb, var(--workflow-activity-accent) 20%, var(--rw-surface));
    box-shadow: 0 0.18rem 0.45rem color-mix(in srgb, var(--workflow-activity-accent) 14%, transparent);
}

.workflow-designer-page .workflow-designer-activity:not(.is-disabled).is-selected {
    border: 2px solid var(--workflow-activity-accent);
    background: var(--workflow-activity-accent);
    color: #ffffff;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--workflow-activity-accent) 22%, transparent),
                0 0.2rem 0.5rem color-mix(in srgb, var(--workflow-activity-accent) 16%, transparent);
}

.workflow-designer-page .workflow-designer-activity__selection-surface:focus-visible {
    outline: 2px solid var(--rw-focus);
    outline-offset: -4px;
}

/* Quick Filter/Transformer controls follow their card state: dark tint ink on
   the quiet card, white on the bold selected card, including hover/focus. */
.workflow-designer-page .workflow-designer-activity:not(.is-disabled):not(.is-selected) .workflow-designer-activity__icon-button,
.workflow-designer-page .workflow-designer-activity:not(.is-disabled):not(.is-selected) .workflow-designer-activity__icon-button:is(.has-items, :hover, :focus-visible, :active),
.workflow-designer-page .workflow-designer-activity:not(.is-disabled):not(.is-selected) .workflow-designer-activity__icon-button:is(:hover, :focus-visible, :active) svg {
    color: var(--workflow-activity-ink);
    fill: currentColor;
}

.workflow-designer-page .workflow-designer-activity:not(.is-disabled):not(.is-selected) .workflow-designer-activity__icon-button:is(.has-items, :hover, :focus-visible, :active) {
    background: color-mix(in srgb, var(--workflow-activity-accent) 10%, var(--rw-surface));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--workflow-activity-accent) 28%, transparent);
}

.workflow-designer-page .workflow-designer-activity:not(.is-disabled).is-selected .workflow-designer-activity__icon-button,
.workflow-designer-page .workflow-designer-activity:not(.is-disabled).is-selected .workflow-designer-activity__icon-button:is(.has-items, :hover, :focus-visible, :active),
.workflow-designer-page .workflow-designer-activity:not(.is-disabled).is-selected .workflow-designer-activity__icon-button:is(:hover, :focus-visible, :active) svg {
    color: #ffffff;
    fill: currentColor;
}

.workflow-designer-page .workflow-designer-activity:not(.is-disabled).is-selected .workflow-designer-activity__icon-button:is(.has-items, :hover, :focus-visible, :active) {
    background: rgba(255, 255, 255, 0.18);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.28);
}

/* Code editors use the same clean light canvas as Message Template.  The
   explicit light-theme guard leaves the themed dark surfaces untouched. */
:root:not(.soup-theme-dark) .workflow-designer-page :is(
    .workflow-designer-code-settings,
    .workflow-designer-code-response-settings,
    .workflow-designer-code-action-editor) {
    background: #ffffff;
}

/* Monaco paints its own theme surface inside the Code Activity container, so
   the outer white panel above is not enough. Override only this editor's light
   canvas; the shared Monaco theme and every dark-theme editor remain intact. */
:root:not(.soup-theme-dark) .workflow-designer-page .workflow-designer-code-settings .workflow-code-editor-monaco :is(
    .monaco-editor,
    .monaco-editor-background,
    .monaco-editor .margin,
    .monaco-editor .overflow-guard,
    .monaco-editor .current-line) {
    --vscode-editor-background: #ffffff !important;
    --vscode-editor-lineHighlightBackground: #ffffff !important;
    background-color: #ffffff !important;
}

/* The server-path editor carries a legacy 3.2rem minimum.  Directory Scanner
   is intentionally single-line, so align its complete field with File Filter. */
.workflow-designer-page .workflow-designer-directory-path-field .workflow-designer-server-path-field__variable-target,
.workflow-designer-page .workflow-designer-directory-path-field .workflow-designer-server-path-variable-input.single-line-variable-text-box,
.workflow-designer-page .workflow-designer-directory-path-field .workflow-designer-server-path-variable-input.single-line-variable-text-box .single-line-variable-text-box__editor {
    height: 2.15rem;
    min-height: 2.15rem;
    max-height: 2.15rem;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-activity:not(.is-disabled) {
    --workflow-activity-ink: color-mix(in srgb, var(--workflow-activity-accent) 58%, var(--rw-text));
    background: color-mix(in srgb, var(--workflow-activity-accent) 12%, var(--rw-surface));
    color: var(--workflow-activity-ink);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-activity:not(.is-disabled):hover {
    background: color-mix(in srgb, var(--workflow-activity-accent) 18%, var(--rw-surface));
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-activity:not(.is-disabled).is-selected {
    background: var(--workflow-activity-accent);
    color: #ffffff;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-rail,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-rail__list {
    background: #202b35;
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-shell,
    .workflow-designer-shell__header,
    .workflow-designer-main,
    .workflow-designer-side,
    .workflow-designer-tabs,
    .workflow-designer-tab-body,
    .workflow-designer-editor-pane,
    .workflow-designer-side-section) {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page :is(.workflow-designer-main, .workflow-designer-side) {
    background: var(--rw-canvas);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-tabs {
    background: var(--rw-surface-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-tab {
    border-color: transparent;
    background: transparent;
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-tab:is(:hover, :focus-visible) {
    border-color: var(--rw-border);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-tab.is-active {
    border-color: var(--rw-border) var(--rw-border) var(--rw-surface);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-activity-identity__row > span,
    .workflow-designer-message-type-field > span,
    .workflow-designer-binding-source-selector label,
    .workflow-designer-binding-row__main,
    .workflow-designer-binding-row__label,
    .workflow-designer-section-header h2,
    .workflow-designer-section-header h3,
    .workflow-designer-side-section h2,
    .workflow-designer-subsection-header h3) {
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-binding-row__description,
    .workflow-designer-binding-row__path,
    .workflow-designer-subsection-header span,
    .workflow-designer-activity-identity__summary) {
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-shell__runtime-state.is-running {
    border-color: rgba(115, 199, 142, 0.4);
    background: rgba(47, 122, 73, 0.22);
    color: #9ad9ad;
}

:root.soup-theme-dark .workflow-designer-shell__meta .workflow-designer-shell__meta-validation {
    border-color: rgba(228, 183, 92, 0.42);
    background: rgba(154, 105, 8, 0.2);
    color: #f0c976;
}

:root.soup-theme-dark .workflow-designer-shell__meta .workflow-designer-shell__meta-validation.is-invalid {
    border-color: rgba(238, 124, 131, 0.44);
    background: rgba(164, 63, 71, 0.22);
    color: #ffadb2;
}

:root.soup-theme-dark .workflow-designer-status {
    border-color: rgba(115, 199, 142, 0.38);
    background: #183326;
    color: #b7e3c5;
}

:root.soup-theme-dark .workflow-designer-status--error {
    border-color: rgba(238, 124, 131, 0.44);
    background: #3a2025;
    color: #ffb7bc;
}

/* Current Transformer workspace classes use an isolated light palette. */
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__pane,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__code-editor,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__custom-parameter,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-row {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__pane-header,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__details {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__pane-header :is(label, strong),
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__details-header strong,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__custom-parameter-header strong {
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__pane-header small,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__details :is(small, .workflow-designer-transformer-workspace__details-empty, .workflow-designer-transformer-workspace__details-note),
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row-summary,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__path-field > small,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__source-choice > small {
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__pane-header select,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__source-choice select,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-fields select,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-join select {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-add__button {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface);
    color: var(--rw-focus);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-add__button:hover:not(:disabled),
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-add__button:focus-visible:not(:disabled),
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-add__menu button:hover,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-add__menu button:focus-visible {
    border-color: var(--rw-focus);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-add__menu {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    box-shadow: var(--rw-shadow);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-add__menu button {
    background: transparent;
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__empty-list {
    background: var(--rw-surface-subtle);
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__empty-list.is-drop-target {
    background: rgba(45, 125, 132, 0.22);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row {
    border-color: #4a839f;
    background: #203b49;
    color: #dcecf4;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--notification {
    border-color: #9d793d;
    background: #3b321f;
    color: #f0d9ad;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--code,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--foreach,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--next {
    border-color: #686b9f;
    background: #2e3049;
    color: #dedff5;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--custom {
    border-color: #845f91;
    background: #382b3e;
    color: #eadbf0;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--conditional-begin,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--conditional-end,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-row--group {
    border-color: #587b99;
    background: #243747;
    color: #d9e7f1;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row--preserved,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-row--preserved {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row:is(.is-selected, .is-pointer-selected, .is-native-drag-source, .is-multi-selected),
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row:focus-visible:not(.is-drag-selection-suppressed) {
    border-color: #91b83c;
    background: #334724;
    color: #edf8cf;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row.is-invalid,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__custom-parameter.is-invalid,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-warnings {
    border-color: rgba(238, 124, 131, 0.62);
    background: #3a2025;
    color: #ffb7bc;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__row-index,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-index {
    background: rgba(255, 255, 255, 0.1);
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__mapping-arrow,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__variable-keyword,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__variable-equals,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__source-choice > span,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__path-field > span,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-fields > label > span,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__conditional-join > span {
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__custom-warning {
    border-color: rgba(228, 183, 92, 0.42);
    background: #3b301c;
    color: #f0c976;
}

/* Interface Designer keeps its established workspace, with WPF density. */
.interface-designer-page {
    --interface-designer-gap: 0.62rem;
    --interface-grid-segment-row-border: var(--rw-border-strong);
}

.interface-designer-page .interface-designer-page__panel,
.interface-designer-page .interface-designer-page__details-panel {
    padding: 0.62rem 0.7rem;
    border-color: var(--rw-border);
    border-radius: 0.5rem;
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: none;
}

.interface-designer-page .interface-designer-page__panel-header {
    margin-bottom: 0.48rem;
}

.interface-designer-page .interface-designer-page__details-content {
    padding-top: 0.25rem;
}

.interface-designer-page__details-content .form-label {
    color: var(--rw-text-muted);
    font-size: 0.76rem;
    font-weight: 600;
}

.interface-designer-page .interface-designer-action-button,
.interface-designer-page .interface-designer-action-button--compact {
    min-height: 1.8rem;
    padding: 0.24rem 0.58rem;
    border-radius: var(--rw-control-radius);
    font-size: 0.8rem;
}

.interface-designer-page .interface-designer-action-button.secondary {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.interface-designer-page .interface-designer-tab-button {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.interface-designer-page .interface-designer-tab-button.active {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

.interface-designer-page .interface-designer-page__monaco-shell {
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
}

.interface-designer-page #interfacegridview .interface-grid-header {
    border-bottom-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.interface-designer-page #interfacegridview .interface-grid-row,
.interface-designer-page #interfacegridview .interface-grid-data-cell {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

.interface-designer-page #interfacegridview .interface-grid-row.listhover:hover > .interface-grid-data-cell,
.interface-designer-page #interfacegridview .interface-grid-row.highlightCellBackGround > .interface-grid-data-cell {
    background: var(--rw-surface-hover) !important;
}

.interface-designer-page #interfacegridview .interface-grid-row.selected,
.interface-designer-page #interfacegridview .interface-grid-row.highlightSelectedCellBackGround,
.interface-designer-page #interfacegridview .interface-grid-row.selected > .interface-grid-data-cell,
.interface-designer-page #interfacegridview .interface-grid-row.highlightSelectedCellBackGround > .interface-grid-data-cell {
    background: var(--rw-surface-selected) !important;
}

:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.interface-grid-row--designer-validation-error,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.interface-grid-row--designer-validation-error > .interface-grid-data-cell {
    background: #3a2025;
}

:root.soup-theme-dark .interface-designer-page #interfacegridview,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row > .interface-grid-data-cell {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-header,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-header > .interface-grid-header__cell.is-pinned {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
    box-shadow: 1px 0 0 var(--rw-border);
}

:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row > .interface-grid-data-cell.is-pinned {
    background: inherit;
    box-shadow: 1px 0 0 var(--rw-border);
}

:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.listhover:hover > .interface-grid-data-cell,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.highlightCellBackGround > .interface-grid-data-cell {
    background: var(--rw-surface-hover) !important;
}

:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.selected,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.highlightSelectedCellBackGround,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.selected > .interface-grid-data-cell,
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.highlightSelectedCellBackGround > .interface-grid-data-cell {
    background: var(--rw-surface-selected) !important;
}

:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.interface-grid-row--designer-validation-error:is(.selected, .highlightSelectedCellBackGround),
:root.soup-theme-dark .interface-designer-page #interfacegridview .interface-grid-row.interface-grid-row--designer-validation-error:is(.selected, .highlightSelectedCellBackGround) > .interface-grid-data-cell {
    background: #4a252b !important;
}

:root.soup-theme-dark .interface-designer-page .interface-designer-page__conditions-list-shell .soup-condition-panel {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: none;
}

:root.soup-theme-dark .interface-designer-page .interface-designer-page__conditions-list-shell .soup-condition-panel__header {
    border-bottom-color: var(--rw-border);
    background: transparent;
}

:root.soup-theme-dark .interface-designer-page__validation-panel--attention {
    border-color: rgba(238, 124, 131, 0.4);
    background: #3a2025;
}

:root.soup-theme-dark .interface-designer-page__validation-panel--attention .interface-designer-page__panel-header h2 {
    color: #ffb7bc;
}

/* Shared scalar/message expression chrome. */
:where(.workflow-designer-page, .interface-designer-page) .single-line-variable-text-box,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__editor,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-editor {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .interface-designer-page) .single-line-variable-text-box:focus,
:where(.workflow-designer-page, .interface-designer-page) .single-line-variable-text-box:focus-within,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__editor:focus-within,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-editor:focus-within {
    border-color: var(--rw-focus);
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

:where(.workflow-designer-page, .interface-designer-page) :is(.soup-variable-textbox__expression-popover,
    .soup-variable-textbox__menu,
    .soup-variable-textbox__submenu) {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: var(--rw-shadow);
}

:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__menu-item,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-button,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__lookup-mode-button,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-action {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__menu-item:hover:not(:disabled),
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__menu-item:focus-visible:not(:disabled),
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-button:hover:not(:disabled),
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-button:focus-visible:not(:disabled),
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-action:hover,
:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__expression-action:focus-within {
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .interface-designer-page) .soup-variable-textbox__menu-separator {
    background: var(--rw-border);
}

:root.soup-theme-dark :where(.workflow-designer-page, .interface-designer-page) :is(.monaco-panel, .monaco-fill, .hl7-editor-root) {
    border-color: var(--rw-border);
    background: #0e1822;
}

/* Goal 10 owner-review: make each designer plane and its controls read as one system. */
.workflow-designer-page .workflow-designer-tab-body--details,
.workflow-designer-page .workflow-designer-editor-pane--details {
    background: var(--rw-surface-subtle);
}

.workflow-designer-page .workflow-designer-editor-pane--details > .workflow-designer-activity-identity {
    width: 100%;
    max-width: none;
    border: 0;
    background: transparent;
}

.workflow-designer-page .workflow-designer-side__body,
.workflow-designer-page .workflow-designer-side-section,
.workflow-designer-page .workflow-designer-side__body--binding,
.workflow-designer-page .workflow-designer-side-section--binding,
.workflow-designer-page .workflow-designer-binding-list,
.workflow-designer-page .workflow-designer-data-table-tree,
.workflow-designer-page .workflow-designer-side-list {
    background: var(--rw-side-surface);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-tabs--side {
    background: var(--rw-surface-muted);
}

.workflow-designer-page .workflow-designer-tabs--side .workflow-designer-tab.is-active {
    border-bottom-color: var(--rw-side-surface);
    background: var(--rw-side-surface);
}

.workflow-designer-page button.workflow-designer-side-row,
.workflow-designer-page button.workflow-designer-data-table-shortcut {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.workflow-designer-page button.workflow-designer-side-row:is(:hover, :focus-visible),
.workflow-designer-page button.workflow-designer-data-table-shortcut:is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.workflow-designer-page .workflow-designer-editor-pane--details
    .workflow-designer-subsection-header:not(.workflow-designer-subsection-header--compact) {
    border-top: 0;
}

.workflow-designer-page .workflow-designer-editor-pane--details
    .workflow-designer-subsection-header:not(.workflow-designer-subsection-header--compact) h3 {
    width: fit-content;
    color: var(--rw-text);
    font-size: 1.05rem;
    font-weight: 650;
    line-height: 1.2;
}

.workflow-designer-page .workflow-designer-editor-pane--details
    .workflow-designer-subsection-header:not(.workflow-designer-subsection-header--compact) h3::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    margin-top: 0.22rem;
    border-radius: 999px;
    background: var(--rw-border-strong);
}

.workflow-designer-page button.workflow-designer-interface-generate,
.workflow-designer-page button.workflow-designer-interface-generate:is(:hover, :focus-visible) {
    border-radius: var(--rw-control-radius) !important;
}

.workflow-designer-page .workflow-designer-shell .workflow-designer-shell__actions button {
    --workflow-toolbar-accent: var(--server-color, var(--rw-action-accent));
    --workflow-toolbar-fill: var(--workflow-toolbar-accent);
    height: 1.8rem;
    min-height: 1.8rem;
    max-height: 1.8rem;
    padding: 0.24rem 0.58rem;
    border: 1px solid var(--workflow-toolbar-fill);
    border-radius: var(--rw-control-radius) !important;
    background: var(--workflow-toolbar-fill);
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 600;
    line-height: 1.15;
    box-shadow: none;
    transform: none;
}

.workflow-designer-page .workflow-designer-shell .workflow-designer-shell__actions button:not(:disabled):is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--workflow-toolbar-accent) 90%, #000000);
    background: color-mix(in srgb, var(--workflow-toolbar-accent) 88%, #000000);
    color: #ffffff;
}

.workflow-designer-page .workflow-designer-shell .workflow-designer-shell__actions button:disabled {
    border-color: color-mix(in srgb, var(--workflow-toolbar-fill) 58%, var(--rw-border));
    background: color-mix(in srgb, var(--workflow-toolbar-fill) 66%, var(--rw-surface));
    color: rgba(255, 255, 255, 0.72);
    opacity: 1;
}

.workflow-designer-page .workflow-designer-shell .workflow-designer-shell__actions button.workflow-designer-shell__icon-button {
    width: 1.9rem;
    min-width: 1.9rem;
    height: 1.8rem;
    min-height: 1.8rem;
    max-height: 1.8rem;
    padding: 0.2rem;
}

.workflow-designer-page .workflow-designer-shell .workflow-designer-shell__actions button.workflow-designer-shell__icon-button svg {
    width: 1.2rem;
    height: 1.2rem;
}

.workflow-designer-page .workflow-designer-side .workflow-designer-section-actions button {
    min-height: 1.8rem;
    padding: 0.24rem 0.58rem;
    border: 1px solid var(--rw-action-accent);
    border-radius: var(--rw-control-radius) !important;
    background: var(--rw-action-accent);
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 600;
}

.workflow-designer-page .workflow-designer-side .workflow-designer-section-actions button.secondary {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

/* Workflow Logs retains status meaning but uses the shared surfaces and control shape. */
:where(.workflow-designer-page, .settings-page) .workflow-log-panel,
:where(.workflow-designer-page, .settings-page) .workflow-log-panel__toolbar-shell,
:where(.workflow-designer-page, .settings-page) .workflow-log-panel__workspace,
:where(.workflow-designer-page, .settings-page) .workflow-log-panel__detail,
:where(.workflow-designer-page, .settings-page) .workflow-log-panel__detail-body,
:where(.workflow-designer-page, .settings-page) .workflow-log-panel__text-detail {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) .workflow-log-panel__list,
:where(.workflow-designer-page, .settings-page) .workflow-log-panel__detail-content {
    background: var(--rw-surface);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) .workflow-log-panel__search,
:where(.workflow-designer-page, .settings-page) .workflow-log-panel__date-input {
    border-color: var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) :is(
    .workflow-log-panel__filter-button,
    .workflow-log-panel__sort,
    .workflow-log-panel__refresh,
    .workflow-log-panel__reprocess,
    .workflow-log-panel__clear,
    .workflow-log-panel__date-clear,
    .workflow-log-panel__detail-copy,
    .workflow-log-panel__detail-reprocess,
    .workflow-log-panel__tab) {
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
    box-shadow: none;
}

:where(.workflow-designer-page, .settings-page) :is(
    .workflow-log-panel__filter-button,
    .workflow-log-panel__sort,
    .workflow-log-panel__refresh,
    .workflow-log-panel__reprocess,
    .workflow-log-panel__clear,
    .workflow-log-panel__date-clear,
    .workflow-log-panel__detail-copy,
    .workflow-log-panel__detail-reprocess,
    .workflow-log-panel__tab):not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) :is(
    .workflow-log-panel__filter-button.is-active,
    .workflow-log-panel__tab.is-active) {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

:where(.workflow-designer-page, .settings-page) .workflow-log-panel__status {
    border-color: var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
    color: var(--rw-text-muted);
}

:where(.workflow-designer-page, .settings-page) .workflow-log-panel__status--error {
    border-color: color-mix(in srgb, var(--rw-danger) 45%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
    color: var(--rw-danger);
}

:where(.workflow-designer-page, .settings-page) :is(.workflow-log-panel__entry, .workflow-log-panel__activity-item) {
    border-color: var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) :is(.workflow-log-panel__entry--completed, .workflow-log-panel__activity-item--completed) {
    background: color-mix(in srgb, var(--rw-accent) 12%, var(--rw-surface));
}

:where(.workflow-designer-page, .settings-page) :is(.workflow-log-panel__entry--processing, .workflow-log-panel__activity-item--processing) {
    background: color-mix(in srgb, var(--rw-constructive) 14%, var(--rw-surface));
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) :is(.workflow-log-panel__entry--errored, .workflow-log-panel__activity-item--errored) {
    background: color-mix(in srgb, var(--rw-danger) 13%, var(--rw-surface));
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) :is(.workflow-log-panel__entry--filtered, .workflow-log-panel__activity-item--filtered) {
    background: var(--rw-surface-muted);
    color: var(--rw-text-muted);
}

:where(.workflow-designer-page, .settings-page) :is(.workflow-log-panel__entry, .workflow-log-panel__activity-item).is-selected {
    border-color: var(--rw-focus);
    background: var(--rw-surface-selected);
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) :is(
    .workflow-log-panel__entry-instance,
    .workflow-log-panel__entry-duration,
    .workflow-log-panel__entry-message-type,
    .workflow-log-panel__detail-status,
    .workflow-log-panel__activity-meta,
    .workflow-log-panel__empty-state) {
    color: var(--rw-text-muted);
}

:where(.workflow-designer-page, .settings-page) .workflow-log-panel__activity-name {
    color: var(--rw-text);
}

:where(.workflow-designer-page, .settings-page) .workflow-log-panel__activity-rail {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
}

/* Isolated log styles carry an attribute selector, so these host-specific rules
   intentionally win the final colour/shape cascade without changing log state. */
:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel,
:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel .workflow-log-panel__toolbar-shell,
:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel .workflow-log-panel__workspace,
:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel .workflow-log-panel__detail,
:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel .workflow-log-panel__detail-body,
:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel .workflow-log-panel__text-detail {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel :is(
    .workflow-log-panel__filter-button,
    .workflow-log-panel__sort,
    .workflow-log-panel__refresh,
    .workflow-log-panel__reprocess,
    .workflow-log-panel__clear,
    .workflow-log-panel__date-clear,
    .workflow-log-panel__detail-copy,
    .workflow-log-panel__detail-reprocess,
    .workflow-log-panel__tab) {
    border-color: var(--rw-border) !important;
    border-radius: var(--rw-control-radius) !important;
    background: var(--rw-surface-muted) !important;
    color: var(--rw-text) !important;
}

:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel :is(
    .workflow-log-panel__filter-button,
    .workflow-log-panel__tab).is-active {
    border-color: var(--rw-action-accent) !important;
    background: var(--rw-action-accent) !important;
    color: #ffffff !important;
}

:is(.workflow-designer-page .workflow-designer-side, .settings-page) .workflow-log-panel :is(
    .workflow-log-panel__filter-button,
    .workflow-log-panel__sort,
    .workflow-log-panel__refresh,
    .workflow-log-panel__reprocess,
    .workflow-log-panel__clear,
    .workflow-log-panel__date-clear,
    .workflow-log-panel__detail-copy,
    .workflow-log-panel__detail-reprocess,
    .workflow-log-panel__tab):not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong) !important;
    background: var(--rw-surface-hover) !important;
    color: var(--rw-text) !important;
}

/* The designer hosts Logs in a resizable narrow rail. Keep every existing
   filter available, but group it as a compact vertical toolbar instead of
   letting the desktop row wrap over itself. */
.workflow-designer-page .workflow-designer-side .workflow-log-panel__toolbar-shell {
    padding: 0.55rem 0.65rem;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.42rem;
    align-items: stretch;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__inline-controls {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.35rem;
    width: 100%;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.25rem;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__filters button {
    min-width: 0;
    padding-inline: 0.38rem;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__search,
.workflow-designer-page .workflow-designer-side .workflow-log-panel__search-options,
.workflow-designer-page .workflow-designer-side .workflow-log-panel__date-range {
    width: 100%;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__date-range {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: 0.3rem 0.4rem;
    align-items: center;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__date-field {
    display: contents;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__date-field input {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__date-clear {
    grid-column: 2;
    justify-self: start;
}

.workflow-designer-page .workflow-designer-side .workflow-log-panel__actions--always {
    margin-left: 0;
}

@container (max-width: 290px) {
    .workflow-designer-page .workflow-designer-side .workflow-log-panel__inline-controls {
        grid-template-columns: minmax(0, 1fr);
    }

    .workflow-designer-page .workflow-designer-side .workflow-log-panel__sort {
        justify-self: start;
    }
}

/* Lookup and Data Table rows let value cells own the full width. Destructive
   row affordances sit over the trailing edge and appear only for the active row. */
.settings-page.lookup-tables-page :is(.lookup-table-grid__header, .lookup-table-grid__row) {
    position: relative;
    grid-template-columns: 3rem minmax(14rem, 1fr) minmax(14rem, 1fr) 0;
}

.settings-page.lookup-tables-page .lookup-table-grid__delete-column {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    width: 2rem;
    border: 0;
    pointer-events: none;
}

.settings-page.lookup-tables-page .lookup-table-grid__row > .lookup-table-grid__cell:nth-child(3) input {
    padding-right: 2.2rem;
}

.settings-page.lookup-tables-page button.lookup-table-grid__delete-button,
.settings-page.data-tables-page button.data-tables-page__row-delete,
.settings-page.data-tables-page button.data-tables-page__column-delete {
    width: 1.5rem;
    min-width: 1.5rem;
    height: 1.5rem;
    min-height: 1.5rem;
    padding: 0;
    border: 1px solid var(--rw-border);
    border-radius: 50%;
    background: var(--rw-surface-subtle);
    color: var(--rw-text-muted);
    opacity: 0;
    box-shadow: none;
    pointer-events: auto;
    transition: opacity 120ms ease, background-color 120ms ease, color 120ms ease;
}

.settings-page.lookup-tables-page .lookup-table-grid__row:is(:hover, :focus-within) button.lookup-table-grid__delete-button,
.settings-page.data-tables-page .data-tables-page__grid-row:is(:hover, :focus-within) button.data-tables-page__row-delete,
.settings-page.data-tables-page .data-tables-page__grid-header-cell:is(:hover, :focus-within) button.data-tables-page__column-delete {
    opacity: 1;
}

.settings-page.lookup-tables-page button.lookup-table-grid__delete-button:is(:hover, :focus-visible),
.settings-page.data-tables-page button.data-tables-page__row-delete:is(:hover, :focus-visible),
.settings-page.data-tables-page button.data-tables-page__column-delete:is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.settings-page.data-tables-page :is(.data-tables-page__grid-header, .data-tables-page__grid-row) {
    position: relative;
}

.settings-page.data-tables-page .data-tables-page__grid-header-cell {
    min-height: 2rem;
    padding: 0;
}

.settings-page.data-tables-page .data-tables-page__column-header {
    position: relative;
    display: block;
}

.settings-page.data-tables-page .data-tables-page__column-header input {
    min-width: 0;
    min-height: 2rem;
    padding-right: 2rem;
}

.settings-page.data-tables-page .data-tables-page__column-delete {
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
}

.settings-page.data-tables-page .data-tables-page__row-delete-column {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    width: 1.9rem;
    border: 0;
    pointer-events: none;
}

.settings-page.data-tables-page .data-tables-page__grid-row > .data-tables-page__grid-cell:nth-last-child(2) input {
    padding-right: 2rem;
}

/* Global Variables uses the same flush grid density instead of oversized
   form controls nested inside table borders. */
.settings-page.global-variables-page .global-variables-page__table th {
    padding: 0.38rem 0.5rem;
}

.settings-page.global-variables-page .global-variables-page__table td > :is(input, select, textarea) {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.settings-page.global-variables-page .global-variables-page__table td > :is(input, select, textarea):focus {
    border: 0;
    outline: 0;
    box-shadow: inset 0 0 0 2px var(--rw-focus);
}

.settings-page.global-variables-page .global-variables-page__table td > textarea {
    height: var(--rw-control-min-height);
    min-height: var(--rw-control-min-height);
    overflow-y: auto;
}

.settings-page.global-variables-page .global-variables-page__check-cell {
    width: 3rem;
}

.settings-page.global-variables-page .global-variables-page__delete-cell {
    width: 2.5rem;
    padding: 0;
}

.settings-page.global-variables-page button.global-variables-page__delete-button {
    width: 1.5rem;
    min-width: 1.5rem;
    height: 1.5rem;
    min-height: 1.5rem;
    padding: 0;
    border: 1px solid var(--rw-border);
    border-radius: 50%;
    background: var(--rw-surface-subtle);
    color: var(--rw-text-muted);
    opacity: 0;
}

.settings-page.global-variables-page .global-variables-page__table tr:is(:hover, :focus-within) button.global-variables-page__delete-button {
    opacity: 1;
}

/* Interface Designer still owns grid mechanics; these rules only replace legacy beige surfaces. */
.interface-designer-page #interfacegridview .interface-grid-header,
.interface-designer-page #interfacegridview .interface-grid-header > .interface-grid-header__cell {
    border-color: var(--rw-border) !important;
    background: var(--rw-surface-muted) !important;
    color: var(--rw-text) !important;
}

.interface-designer-page #interfacegridview .interface-grid-header__button {
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

.interface-designer-page #interfacegridview .interface-grid-header__button:is(:hover, :focus-visible) {
    background: var(--rw-surface-hover);
}

.interface-designer-page .interface-designer-page__preview-panel .monaco-editor,
.interface-designer-page .interface-designer-page__preview-panel .monaco-editor-background,
.interface-designer-page .interface-designer-page__preview-panel .monaco-editor .margin {
    --vscode-editor-background: var(--rw-surface) !important;
    background-color: var(--rw-surface) !important;
}

.loading-splash__backdrop {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--rw-canvas) 82%, transparent), color-mix(in srgb, var(--rw-canvas) 94%, transparent)),
        radial-gradient(circle at top, color-mix(in srgb, var(--rw-accent) 10%, transparent), transparent 44%);
}

.loading-splash__card {
    border-color: var(--rw-border);
    border-radius: 0.6rem;
    background: color-mix(in srgb, var(--rw-surface) 96%, transparent);
    color: var(--rw-text);
    box-shadow: var(--rw-shadow);
}

.loading-splash__spinner {
    border-color: color-mix(in srgb, var(--rw-accent) 18%, transparent);
    border-top-color: var(--rw-accent);
}

.loading-splash__eyebrow,
.loading-splash__detail {
    color: var(--rw-text-muted);
}

.loading-splash__message {
    color: var(--rw-text);
}

.loading-splash__progress {
    background: var(--rw-surface-muted);
}

.loading-splash__progress span {
    background: linear-gradient(90deg, var(--rw-accent), var(--rw-focus));
}

/* Simple management forms remain readable instead of stretching sparse
   settings across a desktop canvas. Data Tables, workflows, and designers
   deliberately retain the full available width. */
:is(.settings-page.alerts-page,
    .settings-page.log-settings-page,
    .settings-page.lookup-tables-page) {
    width: min(100%, 60rem);
    margin-inline: auto;
}

.settings-page.global-variables-page {
    width: min(100%, 87.5rem);
    margin-inline: auto;
}

:is(.settings-page.interfaces-page,
    .settings-page.server-settings-page) {
    width: min(100%, 62.5rem);
    margin-inline: auto;
}

/* Retire the remaining warm legacy shell colours while retaining the existing
   navigation structure and its compact desktop layout. */
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell__sidebar-toggle.secondary {
    border: 1px solid var(--rw-action-accent);
    border-radius: var(--rw-control-radius);
    background: var(--rw-action-accent);
    color: #ffffff;
    box-shadow: none;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell__sidebar-toggle.secondary:is(:hover, :focus-visible) {
    border-color: var(--rw-action-accent-hover);
    background: var(--rw-action-accent-hover);
    color: #ffffff;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell__kicker,
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__link {
    color: #d8e1e8;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__link {
    border: 1px solid transparent;
    border-radius: var(--rw-control-radius);
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__link:hover {
    border-color: color-mix(in srgb, var(--rw-action-accent) 38%, transparent);
    background: color-mix(in srgb, var(--rw-action-accent) 24%, transparent);
    color: #ffffff;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__link.active,
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__link.active:hover {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

/* This follows the shared navigation defaults above so a configured Server
   Color wins for selected navigation without tinting the navigation surface. */
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell--tinted .shell__sidebar-toggle.secondary,
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell--tinted .nav__link.active,
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell--tinted .nav__link.active:hover,
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell--tinted .nav__sublink.active {
    border-color: var(--server-color);
    background: var(--server-color);
    color: #ffffff;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell--tinted .shell__sidebar-toggle.secondary:is(:hover, :focus-visible) {
    border-color: var(--server-color-hover);
    background: var(--server-color-hover);
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .shell--tinted .nav__sublink.active::before {
    background: #ffffff;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__link--disabled,
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__link--disabled:hover {
    border-color: transparent;
    background: transparent;
    color: rgba(216, 225, 232, 0.46);
}

/* The standalone dashboard keeps its accepted structure. Only its old beige
   action and Log chrome joins the shared semantic palette. */
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .dashboard-create-workflow__buttons {
    border-color: var(--rw-action-constructive);
    border-radius: var(--rw-control-radius);
    box-shadow: none;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(
    .dashboard-create-workflow__primary,
    .dashboard-create-workflow__toggle) {
    border-color: var(--rw-action-constructive);
    background: var(--rw-action-constructive);
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(
    .dashboard-create-workflow__primary,
    .dashboard-create-workflow__toggle):is(:hover, :focus-visible) {
    border-color: var(--rw-action-constructive-hover);
    background: var(--rw-action-constructive-hover);
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .dashboard-filter-chip {
    background: var(--rw-surface);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .dashboard-filter-chip.is-active {
    background: var(--dashboard-label-color, var(--rw-action-accent));
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(
    .dashboard-panel,
    .workflow-feature-tabs,
    .workflow-log-panel,
    .workflow-log-panel__list,
    .workflow-log-panel__toolbar-shell,
    .workflow-log-panel__workspace) {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .dashboard-workflow-tabs {
    background: transparent;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab {
    border-color: var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab:not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab.is-active,
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab.is-active:is(:hover, :focus-visible) {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

/* Workflow labels retain their own semantic category colours. Feature tabs use
   Server Color only to distinguish the selected view from the available views. */
.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab {
    border-color: color-mix(in srgb, var(--server-color) 28%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab:not(:disabled):is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--server-color) 46%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 20%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab.is-active,
.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-feature-tab.is-active:is(:hover, :focus-visible) {
    border-color: var(--server-color);
    background: var(--server-color);
    color: #ffffff;
}

/* Workflow rows follow the desktop list treatment: normal rows are separated
   by breathing room rather than grid lines, hover is restrained, and the
   selected row uses a thin system-colour outline with a very light wash. */
body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-list {
    gap: 0.18rem;
    padding-block: 0.12rem;
    background: var(--rw-surface);
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__sublink--compact {
    border-color: color-mix(in srgb, var(--rw-action-accent) 28%, transparent);
    background: transparent;
    color: #d8e1e8;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)) .nav__sublink--compact:hover {
    border-color: color-mix(in srgb, var(--rw-action-accent) 58%, transparent);
    background: color-mix(in srgb, var(--rw-action-accent) 18%, transparent);
    color: #ffffff;
}

body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card:not(.is-selected) {
    border-color: transparent;
    background: var(--rw-surface);
    color: var(--rw-text);
}

body .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card:not(.is-selected) {
    border-color: transparent;
    background: var(--rw-surface);
    color: var(--rw-text);
}

body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card:not(.is-selected):hover {
    border-color: color-mix(in srgb, var(--rw-action-accent) 44%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-accent) 2%, var(--rw-surface));
    color: color-mix(in srgb, var(--rw-action-accent) 68%, #000000);
}

body .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card:not(.is-selected):hover {
    border-color: color-mix(in srgb, var(--server-color) 44%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 2%, var(--rw-surface));
    color: var(--server-color-ink);
}

body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card.is-selected {
    border-width: 1px;
    border-color: var(--rw-action-accent);
    background: color-mix(in srgb, var(--rw-action-accent) 8%, var(--rw-surface));
    color: color-mix(in srgb, var(--rw-action-accent) 68%, #000000);
}

body .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card.is-selected {
    border-color: var(--server-color);
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface));
    color: var(--server-color-ink);
}

body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card.is-selected :is(.workflow-card__title, .workflow-card__count-separator) {
    color: color-mix(in srgb, var(--rw-action-accent) 68%, #000000);
}

body .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card.is-selected :is(.workflow-card__title, .workflow-card__count-separator) {
    color: var(--server-color-ink);
}

:root.soup-theme-dark body .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card:is(.is-selected, :hover) {
    color: color-mix(in srgb, var(--server-color) 58%, var(--rw-text));
}

:root.soup-theme-dark body .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-card.is-selected :is(.workflow-card__title, .workflow-card__count-separator) {
    color: color-mix(in srgb, var(--server-color) 58%, var(--rw-text));
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-create-menu .workflow-label-menu__action {
    border: 1px solid color-mix(in srgb, var(--rw-action-accent) 72%, var(--rw-surface));
    background: var(--rw-action-accent);
    color: #ffffff;
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-create-menu .workflow-label-menu__action {
    border-color: color-mix(in srgb, var(--server-color) 72%, var(--rw-surface));
    background: var(--server-color);
    color: #ffffff;
}

/* Workflow dropdowns use the normal popup surface in dark mode.  Keep the
   create-menu actions accented; only the workflow context menu needs its
   inherited text restored to the neutral popup foreground. */
:root.soup-theme-dark :is(.workflow-create-menu, .workflow-label-menu) {
    border-color: var(--rw-popup-border);
    background: var(--rw-popup-surface);
    box-shadow: var(--rw-popup-shadow);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-label-menu :is(.workflow-label-menu__title,
    .workflow-label-menu__toggle,
    .workflow-label-menu__action) {
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-label-menu :is(.workflow-label-menu__section-title,
    .workflow-label-menu__empty) {
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-label-menu .workflow-label-menu__divider {
    border-top-color: var(--rw-popup-divider);
}

:root.soup-theme-dark body .dashboard-shell .workflow-card .workflow-card__title:not(.is-muted) {
    color: var(--rw-text);
}

.dashboard-shell .workflow-card__counts.is-muted .workflow-card__count-separator {
    color: inherit;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-list__item:not(.is-drop-target) .workflow-card__divider {
    border-bottom-color: transparent;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel__toolbar-shell {
    background: var(--rw-surface-subtle);
}

/* Scheduling and History retain their existing behavior while sharing the
   compact current control treatment instead of the legacy rounded buttons. */
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) {
    gap: 0.7rem;
    padding: 0.7rem 0.8rem 0.8rem;
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel__body, .workflow-history-panel__section) {
    gap: 0.7rem;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel__body {
    padding-top: 0.65rem;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel__section, .workflow-history-panel__section--compact) {
    padding-top: 0.7rem;
    border-top-color: var(--rw-border);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) :is(input, select) {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
    font: inherit;
}

/* Scheduling's native time picker follows the same compact, theme-aware input
   treatment as the rest of the host.  Its open option list needs explicit
   colours because browsers do not reliably inherit a dark select surface. */
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select {
    min-width: 10rem;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select option {
    background: var(--rw-surface);
    color: var(--rw-text);
}

/* app.css has a deliberately broad legacy shell selector with body/:has
   specificity.  Match that scope here so Scheduling's native combo genuinely
   receives the current control treatment at runtime, rather than merely a
   lower-priority generic rule. */
body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)):not(:has(:where(.workflow-designer-page, .interface-designer-page, .audit-page, .settings-page:not(.license-page--onboarding)))) .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select {
    width: 100%;
    min-width: 10rem;
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
    color-scheme: light;
    font: inherit;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)):not(:has(:where(.workflow-designer-page, .interface-designer-page, .audit-page, .settings-page:not(.license-page--onboarding)))) .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select:not(:disabled):hover {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)):not(:has(:where(.workflow-designer-page, .interface-designer-page, .audit-page, .settings-page:not(.license-page--onboarding)))) .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select:focus-visible {
    border-color: var(--rw-focus);
    outline: 0;
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)):not(:has(:where(.workflow-designer-page, .interface-designer-page, .audit-page, .settings-page:not(.license-page--onboarding)))) .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select:disabled {
    background: var(--rw-surface-muted);
    color: var(--rw-text-muted);
    cursor: not-allowed;
}

body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)):not(:has(:where(.workflow-designer-page, .interface-designer-page, .audit-page, .settings-page:not(.license-page--onboarding)))) .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select option:checked {
    background: var(--rw-action-accent);
    color: #ffffff;
}

:root.soup-theme-dark body:not(:has(.hl7-soup-page)):not(:has(.fhir-soup-page)):not(:has(:where(.workflow-designer-page, .interface-designer-page, .audit-page, .settings-page:not(.license-page--onboarding)))) .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__time-grid select {
    color-scheme: dark;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__actions {
    gap: 0.45rem;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__body,
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-schedule-panel .workflow-schedule-panel__fieldset {
    gap: 0.8rem;
}

/* Dashboard empty states retain a normal application surface.  Label-filter
   feedback can carry only the lightest Server Color cue, while the selected
   colour remains reserved for compact interactive controls. */
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-filter-empty-state {
    border: 1px solid var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-filter-empty-state {
    border-color: color-mix(in srgb, var(--server-color) 28%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 5%, var(--rw-surface));
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-filter-empty-state__title, .workflow-filter-empty-state__body) {
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-filter-empty-state__body {
    color: var(--rw-text-muted);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-filter-empty-state button.secondary {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 1px solid var(--rw-border-strong);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
    box-shadow: none;
    transform: none;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-filter-empty-state button.secondary:not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-feature-placeholder, .dashboard-empty-state--detail) {
    border-color: color-mix(in srgb, var(--server-color) 25%, var(--rw-border));
    background: var(--rw-surface);
    color: var(--server-color-hover);
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-filter-empty-state {
    background: color-mix(in srgb, var(--server-color) 11%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-feature-placeholder, .dashboard-empty-state--detail) {
    color: color-mix(in srgb, var(--server-color) 52%, var(--rw-text));
}

/* The loaded workflow name appears in the shared Scheduling and History
   subtitles. Keep it legible and server-identifiable instead of inheriting
   the former brown detail-copy token. */
.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel__subtitle, .workflow-history-panel__subtitle) {
    color: var(--server-color-hover);
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel__subtitle, .workflow-history-panel__subtitle) {
    color: color-mix(in srgb, var(--server-color) 52%, var(--rw-text));
}

/* Settings keeps one entry in the main sidebar. Its related pages share this
   compact vertical rail, so moving between them does not lose orientation. */
.settings-workspace {
    display: grid;
    grid-template-columns: minmax(10.5rem, 12rem) minmax(0, 1fr);
    gap: 0.75rem;
    min-width: 0;
    align-items: start;
}

.settings-workspace__content {
    min-width: 0;
}

.settings-rail {
    position: sticky;
    top: 0.75rem;
    display: grid;
    gap: 0.35rem;
    padding: 0.5rem;
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
}

.settings-rail__link {
    display: block;
    min-height: var(--rw-control-min-height);
    padding: 0.42rem 0.55rem;
    border: 1px solid transparent;
    border-radius: calc(var(--rw-control-radius) - 0.1rem);
    color: var(--rw-text);
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
}

.settings-rail__link:not(.active):is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.settings-rail__link:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.18rem var(--rw-focus-ring);
}

.settings-rail__link.active {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

.shell--tinted .settings-rail__link.active {
    border-color: var(--server-color);
    background: var(--server-color);
    color: #ffffff;
}

@media (max-width: 760px) {
    .settings-workspace {
        grid-template-columns: minmax(0, 1fr);
    }

    .settings-rail {
        position: static;
    }
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) button {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 1px solid var(--rw-action-accent);
    border-radius: var(--rw-control-radius);
    background: var(--rw-action-accent);
    color: #ffffff;
    box-shadow: none;
    transform: none;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) button.secondary {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) button.danger {
    border-color: var(--rw-danger);
    background: var(--rw-danger);
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) button:not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-action-accent-hover);
    background: var(--rw-action-accent-hover);
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) button.secondary:not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel, .workflow-history-panel) button.danger:not(:disabled):is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--rw-danger) 86%, #000000);
    background: color-mix(in srgb, var(--rw-danger) 86%, #000000);
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel__status, .workflow-history-panel__status) {
    margin-bottom: 0;
    padding: 0.55rem 0.65rem;
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-schedule-panel__status--error, .workflow-history-panel__status--error) {
    border-color: color-mix(in srgb, var(--rw-danger) 45%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
    color: var(--rw-danger);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel :is(
    .workflow-log-panel__filter-button,
    .workflow-log-panel__sort,
    .workflow-log-panel__refresh,
    .workflow-log-panel__reprocess,
    .workflow-log-panel__clear,
    .workflow-log-panel__date-clear,
    .workflow-log-panel__detail-copy,
    .workflow-log-panel__detail-reprocess) {
    border-color: var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
    box-shadow: none;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel :is(
    .workflow-log-panel__filter-button,
    .workflow-log-panel__sort,
    .workflow-log-panel__refresh,
    .workflow-log-panel__reprocess,
    .workflow-log-panel__clear,
    .workflow-log-panel__date-clear,
    .workflow-log-panel__detail-copy,
    .workflow-log-panel__detail-reprocess):not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button.is-active,
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button.is-active:is(:hover, :focus-visible) {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

/* Log rows communicate runtime status, not server identity. Only the filter
   affordance uses Server Color; unselected filters stay pale and readable. */
.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button:not(.is-active) {
    border-color: color-mix(in srgb, var(--server-color) 28%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button:not(.is-active):is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--server-color) 46%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 20%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button.is-active,
.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button.is-active:is(:hover, :focus-visible) {
    border-color: var(--server-color);
    background: var(--server-color);
    color: #ffffff;
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button:not(.is-active) {
    background: color-mix(in srgb, var(--server-color) 22%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__filter-button:not(.is-active):is(:hover, :focus-visible) {
    background: color-mix(in srgb, var(--server-color) 30%, var(--rw-surface));
}

/* Log detail tabs identify content, rather than status. Keep inactive tabs
   light and readable; the selected tab alone receives the solid accent. */
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__tab:not(.is-active) {
    border-color: color-mix(in srgb, var(--rw-action-accent) 28%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-accent) 10%, var(--rw-surface));
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__tab:not(.is-active):is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--rw-action-accent) 46%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-accent) 17%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__tab:not(.is-active) {
    border-color: color-mix(in srgb, var(--server-color) 28%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 10%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__tab.is-active {
    border-color: var(--server-color);
    background: var(--server-color);
    color: #ffffff;
}

/* Activity navigation is an interaction state, not a log-status indicator. */
.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__activity-rail {
    border-color: var(--rw-border);
    background: var(--rw-surface);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__activity-item {
    border-color: color-mix(in srgb, var(--rw-action-accent) 24%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-accent) 9%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__activity-item {
    border-color: color-mix(in srgb, var(--server-color) 24%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 9%, var(--rw-surface));
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__activity-item.is-selected {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__activity-item.is-selected {
    border-color: var(--server-color);
    background: var(--server-color);
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__activity-item.is-selected :is(.workflow-log-panel__activity-name, .workflow-log-panel__activity-meta) {
    color: #ffffff;
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel :is(.workflow-log-panel__detail, .workflow-log-panel__detail-body, .workflow-log-panel__detail-content, .workflow-log-panel__text-detail, .log-variables-grid) {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

.dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .log-variables-grid__table th {
    border-color: color-mix(in srgb, var(--rw-action-accent) 25%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-accent) 10%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .log-variables-grid__table th {
    border-color: color-mix(in srgb, var(--server-color) 25%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 10%, var(--rw-surface));
    color: var(--rw-text);
}

:root.soup-theme-dark .log-variables-grid__name-badge {
    border-color: #b983e1;
    background: #38234a;
    color: #f0dcff;
}

/* The activity rail is also used inside the workflow designer, where the
   component's legacy status classes otherwise win the cascade. Activity rows
   are navigation, so only the selected item receives a solid accent. */
body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__activity-item:not(.is-selected) {
    border-color: color-mix(in srgb, var(--rw-action-accent) 24%, var(--rw-border)) !important;
    background: color-mix(in srgb, var(--rw-action-accent) 9%, var(--rw-surface)) !important;
    color: var(--rw-text) !important;
}

body .shell--tinted :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__activity-item:not(.is-selected) {
    border-color: color-mix(in srgb, var(--server-color) 24%, var(--rw-border)) !important;
    background: color-mix(in srgb, var(--server-color) 9%, var(--rw-surface)) !important;
    color: var(--rw-text) !important;
}

/* Legacy activity typography sets its own dark foreground. In dark mode only,
   let inactive cards inherit the readable themed foreground while leaving the
   selected status treatment and its white text untouched. */
:root.soup-theme-dark body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel
    .workflow-log-panel__activity-item:not(.is-selected) .workflow-log-panel__activity-name {
    color: var(--rw-text) !important;
}

:root.soup-theme-dark body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel
    .workflow-log-panel__activity-item:not(.is-selected) .workflow-log-panel__activity-meta {
    color: var(--rw-text-muted) !important;
}

body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__activity-item.is-selected {
    border-color: var(--rw-action-accent) !important;
    background: var(--rw-action-accent) !important;
    color: #ffffff !important;
}

body .shell--tinted :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__activity-item.is-selected {
    border-color: var(--server-color) !important;
    background: var(--server-color) !important;
    color: #ffffff !important;
}

body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__activity-item.is-selected :is(.workflow-log-panel__activity-name, .workflow-log-panel__activity-meta) {
    color: #ffffff !important;
}

/* Source, Response, Variables and conditional Errors use the same compact
   tab model in every log host. The older isolated stylesheet otherwise leaves
   the designer path with legacy brown surfaces. */
body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__tab:not(.is-active) {
    border-color: color-mix(in srgb, var(--rw-action-accent) 28%, var(--rw-border)) !important;
    background: color-mix(in srgb, var(--rw-action-accent) 10%, var(--rw-surface)) !important;
    color: var(--rw-text) !important;
}

body .shell--tinted :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__tab:not(.is-active) {
    border-color: color-mix(in srgb, var(--server-color) 28%, var(--rw-border)) !important;
    background: color-mix(in srgb, var(--server-color) 10%, var(--rw-surface)) !important;
    color: var(--rw-text) !important;
}

body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__tab.is-active {
    border-color: var(--rw-action-accent) !important;
    background: var(--rw-action-accent) !important;
    color: #ffffff !important;
}

body .shell--tinted :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel .workflow-log-panel__tab.is-active {
    border-color: var(--server-color) !important;
    background: var(--server-color) !important;
    color: #ffffff !important;
}

body :is(.workflow-designer-page, .settings-page, .dashboard-shell:not(.dashboard-shell--hl7soup-embedded)) .workflow-log-panel :is(.workflow-log-panel__detail, .workflow-log-panel__detail-body, .workflow-log-panel__detail-content, .workflow-log-panel__text-detail, .log-variables-grid) {
    border-color: var(--rw-border) !important;
    background: var(--rw-surface) !important;
    color: var(--rw-text) !important;
}

/* Dashboard Source/Response tabs host InteractiveMessageViewer (monaco-panel).
   Give only those light-mode message canvases the same pure white as Message
   Template; Variables and every dark-theme surface retain their own styling. */
:root:not(.soup-theme-dark) body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel :is(
    .workflow-log-panel__detail-body:has(.workflow-log-panel__detail-content > .monaco-panel),
    .workflow-log-panel__detail-content:has(> .monaco-panel),
    .workflow-log-panel__detail-content > .monaco-panel,
    .workflow-log-panel__detail-content > .monaco-panel > .monaco-fill) {
    background: #ffffff !important;
}

/* Source and Response both render InteractiveMessageViewer as a direct
   monaco-panel child. Reach the actual Monaco-painted canvas while keeping
   Variables and Error (which have no such child) completely unchanged. */
:root:not(.soup-theme-dark) body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel
    .workflow-log-panel__detail-content:has(> .monaco-panel) :is(
        .monaco-editor,
        .monaco-editor-background,
        .monaco-editor .margin,
        .monaco-editor .overflow-guard,
        .monaco-editor .current-line) {
    --vscode-editor-background: #ffffff !important;
    --vscode-editor-lineHighlightBackground: #ffffff !important;
    background-color: #ffffff !important;
}

/* A Source/Response viewer can be reconstructed when its tab is selected.
   MyEditor starts with its light default before the current shell theme is
   re-synchronised, so keep that short lifecycle dark at every painted layer.
   InteractiveMessageViewer also re-applies the Monaco dark theme after the
   new editor is ready, restoring the matching token and foreground palette. */
:root.soup-theme-dark body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel :is(
    .workflow-log-panel__detail-body:has(.workflow-log-panel__detail-content > .monaco-panel),
    .workflow-log-panel__detail-content:has(> .monaco-panel),
    .workflow-log-panel__detail-content > .monaco-panel,
    .workflow-log-panel__detail-content > .monaco-panel > .monaco-fill) {
    background: #0e1822 !important;
    color: #f1f5f9 !important;
}

:root.soup-theme-dark body .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel
    .workflow-log-panel__detail-content:has(> .monaco-panel) :is(
        .monaco-editor,
        .monaco-editor-background,
        .monaco-editor .margin,
        .monaco-editor .overflow-guard,
        .monaco-editor .current-line) {
    --vscode-editor-background: #0e1822 !important;
    --vscode-editor-lineHighlightBackground: #142637 !important;
    background-color: #0e1822 !important;
    color: #f1f5f9 !important;
}

/* The message-log search remains an input surface, so its Server Color tint is
   deliberately lighter than any selected row or filter treatment. */
.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__search {
    border-color: color-mix(in srgb, var(--server-color) 20%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 6%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__search:is(:hover, :focus) {
    border-color: color-mix(in srgb, var(--server-color) 36%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 10%, var(--rw-surface));
    color: var(--rw-text);
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__search {
    background: color-mix(in srgb, var(--server-color) 13%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-log-panel .workflow-log-panel__search:is(:hover, :focus) {
    background: color-mix(in srgb, var(--server-color) 19%, var(--rw-surface));
}

/* Log Settings data controls are subdued selections rather than primary
   actions.  Keep the configured Server Color local to this control. */
body .shell--tinted .settings-page.log-settings-page input[type="checkbox"]:checked {
    accent-color: var(--server-color);
}

body .shell--tinted .settings-page.log-settings-page button.secondary.log-settings-page__data-toggle,
body .shell--tinted .settings-page.log-settings-page button.secondary.log-settings-page__data-toggle:is(:hover, :focus-visible) {
    width: 100%;
    border-color: color-mix(in srgb, var(--server-color) 56%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
    color: var(--server-color-hover);
}

body .shell--tinted .settings-page.log-settings-page button.secondary.log-settings-page__data-toggle:is(:hover, :focus-visible) {
    border-color: color-mix(in srgb, var(--server-color) 70%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 20%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .settings-page.log-settings-page button.secondary.log-settings-page__data-toggle,
:root.soup-theme-dark .shell--tinted .settings-page.log-settings-page button.secondary.log-settings-page__data-toggle:is(:hover, :focus-visible) {
    background: color-mix(in srgb, var(--server-color) 19%, var(--rw-surface));
    color: color-mix(in srgb, var(--server-color) 62%, var(--rw-text));
}

:root.soup-theme-dark .shell--tinted .settings-page.log-settings-page button.secondary.log-settings-page__data-toggle:is(:hover, :focus-visible) {
    background: color-mix(in srgb, var(--server-color) 28%, var(--rw-surface));
}

/* A configured Server Color is the shared checked-control accent.  This is
   intentionally limited to enabled controls: disabled controls retain their
   neutral state, and the Interface Designer's highlight toggle keeps its
   meaningful per-highlight colour. */
body .shell--tinted input:where([type="checkbox"], [type="radio"]):checked:not(:disabled):not(.interface-grid-highlight-toggle) {
    accent-color: var(--server-color) !important;
}

/* Data Tables has a single clear commit action. Keep it subdued only while
   there is nothing staged; active Save and dialog primary actions use the
   exact resolved Server Color with a readable white foreground. */
body .shell--tinted .settings-page.data-tables-page button.data-tables-page__save-button:not(:disabled),
body .shell--tinted .data-tables-page__modal-actions button.data-tables-page__primary-action:not(:disabled) {
    border-color: var(--server-color) !important;
    background: var(--server-color) !important;
    color: #ffffff !important;
    opacity: 1;
}

body .shell--tinted .settings-page.data-tables-page .data-tables-page__page-actions
:is(button.data-tables-page__save-button, .data-tables-page__toolbar-action) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.25rem;
    padding: 0.45rem 0.8rem;
    border-radius: var(--rw-control-radius);
    font: inherit;
    font-weight: 600;
    line-height: 1.1;
    box-shadow: none;
}

body .shell--tinted .settings-page.data-tables-page .data-tables-page__page-actions
.data-tables-page__toolbar-action {
    border: 1px solid var(--rw-border-strong) !important;
    background: var(--rw-surface-subtle) !important;
    color: var(--rw-text) !important;
}

body .shell--tinted .settings-page.data-tables-page .data-tables-page__page-actions
.data-tables-page__toolbar-action:is(:hover, :focus-visible) {
    border-color: var(--server-color) !important;
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface)) !important;
    color: var(--server-color-ink) !important;
    transform: none !important;
}

body .shell--tinted .settings-page.data-tables-page .data-tables-page__page-actions
.data-tables-page__toolbar-action:disabled {
    opacity: 0.55;
}

body .shell--tinted .settings-page.data-tables-page button.data-tables-page__save-button:not(:disabled):is(:hover, :focus-visible),
body .shell--tinted .data-tables-page__modal-actions button.data-tables-page__primary-action:not(:disabled):is(:hover, :focus-visible) {
    border-color: var(--server-color-hover) !important;
    background: var(--server-color-hover) !important;
    color: #ffffff !important;
}

body .shell--tinted .settings-page.data-tables-page button.data-tables-page__rename-icon {
    border-color: color-mix(in srgb, var(--server-color) 38%, var(--rw-border));
    background: var(--rw-surface-subtle);
    color: var(--server-color-ink);
    box-shadow: none;
}

body .shell--tinted .settings-page.data-tables-page button.data-tables-page__rename-icon:is(:hover, :focus-visible) {
    border-color: var(--server-color);
    background: color-mix(in srgb, var(--server-color) 10%, var(--rw-surface));
    color: var(--server-color-ink);
}

body .shell--tinted .settings-page.data-tables-page button.data-tables-page__select-all {
    width: 1rem;
    min-width: 1rem;
    height: 1rem;
    min-height: 1rem;
    padding: 0 !important;
    border: 1px solid var(--rw-border-strong) !important;
    border-radius: 0.18rem;
    background: var(--rw-surface) !important;
    color: var(--server-color) !important;
    box-shadow: none !important;
}

body .shell--tinted .settings-page.data-tables-page button.data-tables-page__select-all:is(:hover, :focus-visible) {
    border-color: var(--server-color) !important;
    background: color-mix(in srgb, var(--server-color) 8%, var(--rw-surface)) !important;
    color: var(--server-color-ink) !important;
    transform: none !important;
}

body .shell--tinted .interface-designer-page .interface-grid-checkbox .form-check-input:checked:not(:disabled):not(.interface-grid-highlight-toggle) {
    background-color: var(--server-color) !important;
    border-color: var(--server-color-hover) !important;
}

/* Workflow History identifies its selected workflow and saved-version count
   with a quiet Server Color surface.  Version rows use a deliberately more
   distinct hover tint so it is not confused with the selected summary. */
.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-history-panel__count-pill, .workflow-history-panel__summary-card) {
    border-color: color-mix(in srgb, var(--server-color) 58%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 12%, var(--rw-surface));
    color: var(--rw-text);
}

.shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-history-panel__table tbody tr:hover {
    background: color-mix(in srgb, var(--server-color) 22%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) :is(.workflow-history-panel__count-pill, .workflow-history-panel__summary-card) {
    background: color-mix(in srgb, var(--server-color) 21%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .dashboard-shell:not(.dashboard-shell--hl7soup-embedded) .workflow-history-panel__table tbody tr:hover {
    background: color-mix(in srgb, var(--server-color) 34%, var(--rw-surface));
}

/* Date controls stay readable surfaces while their native calendar/time
   selection follows the configured Server Color rather than browser blue. */
.shell--tinted .workflow-log-panel .workflow-log-panel__date-field input[type="datetime-local"] {
    border-color: color-mix(in srgb, var(--server-color) 30%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 6%, var(--rw-surface));
    color: var(--rw-text);
    accent-color: var(--server-color);
}

.shell--tinted .workflow-log-panel .workflow-log-panel__date-field input[type="datetime-local"]:is(:hover, :focus) {
    border-color: color-mix(in srgb, var(--server-color) 48%, var(--rw-border));
    background: color-mix(in srgb, var(--server-color) 11%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .workflow-log-panel .workflow-log-panel__date-field input[type="datetime-local"] {
    background: color-mix(in srgb, var(--server-color) 13%, var(--rw-surface));
}

:root.soup-theme-dark .shell--tinted .workflow-log-panel .workflow-log-panel__date-field input[type="datetime-local"]:is(:hover, :focus) {
    background: color-mix(in srgb, var(--server-color) 20%, var(--rw-surface));
}

/* Management dialogs share the current compact, neutral shell.  Their
   behavior remains component-owned; this only replaces legacy brown surfaces
   and pill-like controls. */
body :is(.data-tables-page__modal, .dashboard-modal, .confirm-action-dialog) {
    border-color: var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: var(--rw-shadow);
}

body :is(.data-tables-page__overlay, .dashboard-overlay--modal, .confirm-action-dialog__backdrop) {
    background: rgba(17, 24, 32, 0.34);
}

body .data-tables-page__modal {
    padding: 0.9rem;
}

body :is(.data-tables-page__modal-body, .dashboard-modal__body) {
    gap: 0.7rem;
}

body .dashboard-modal__header {
    padding: 0.7rem 0.8rem 0.55rem;
    border-bottom-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

body :is(.data-tables-page__field, .dashboard-modal__field) {
    gap: 0.3rem;
    color: var(--rw-text);
}

body :is(.data-tables-page__field, .dashboard-modal__field) :is(input, select, textarea) {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border: 1px solid var(--rw-border);
    border-radius: var(--rw-control-radius);
    background: var(--rw-surface);
    color: var(--rw-text);
    box-shadow: none;
}

body :is(.data-tables-page__field, .dashboard-modal__field) :is(input, select, textarea):is(:hover, :focus) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
}

body :is(.data-tables-page__modal-actions, .dashboard-modal__actions, .confirm-action-dialog__actions) {
    gap: 0.5rem;
    margin-top: 0.7rem;
    padding: 0;
}

body :is(.data-tables-page__modal-actions, .dashboard-modal__actions, .confirm-action-dialog__actions) button {
    min-height: var(--rw-control-min-height);
    padding: var(--rw-control-padding-y) var(--rw-control-padding-x);
    border-radius: var(--rw-control-radius);
    box-shadow: none;
    transform: none;
}

body :is(.data-tables-page__modal-actions, .dashboard-modal__actions, .confirm-action-dialog__actions) button:not(.secondary):not(.danger) {
    border-color: var(--rw-action-accent);
    background: var(--rw-action-accent);
    color: #ffffff;
}

body :is(.data-tables-page__modal-actions, .dashboard-modal__actions, .confirm-action-dialog__actions) button:not(.secondary):not(.danger):is(:hover, :focus-visible) {
    border-color: var(--rw-action-accent-hover);
    background: var(--rw-action-accent-hover);
}

body :is(.data-tables-page__modal-actions, .dashboard-modal__actions, .confirm-action-dialog__actions) button.secondary {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-muted);
    color: var(--rw-text);
}

body :is(.data-tables-page__modal-actions, .dashboard-modal__actions, .confirm-action-dialog__actions) button.secondary:is(:hover, :focus-visible) {
    background: var(--rw-surface-hover);
}

body :is(.data-tables-page__modal-actions, .dashboard-modal__actions, .confirm-action-dialog__actions) button.danger {
    border-color: var(--rw-danger);
    background: var(--rw-danger);
    color: #ffffff;
}

body :is(.data-tables-page__modal-error, .dashboard-modal__error, .confirm-action-dialog--danger h3) {
    color: var(--rw-danger);
}

body .confirm-action-dialog :is(.confirm-action-dialog__eyebrow, p) {
    color: var(--rw-text-muted);
}

/* Non-error host notices use a quiet constructive tint instead of the former
   beige notification palette. */
.toast-host .toast-host__toast {
    border-color: color-mix(in srgb, var(--rw-action-constructive) 40%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-action-constructive) 9%, var(--rw-surface));
    color: var(--rw-text);
    box-shadow: var(--rw-shadow);
}

.toast-host .toast-host__message {
    color: var(--rw-text);
}

.toast-host .toast-host__dismiss {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text-muted);
}

.toast-host .toast-host__dismiss:is(:hover, :focus-visible) {
    border-color: var(--rw-border-strong);
    background: var(--rw-surface-hover);
    color: var(--rw-text);
}

.toast-host .toast-host__toast--error {
    border-color: color-mix(in srgb, var(--rw-danger) 45%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
}

.toast-host .toast-host__toast--error .toast-host__message {
    color: var(--rw-danger);
}

.settings-page.license-page .badge--success {
    border: 1px solid color-mix(in srgb, var(--rw-success) 35%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-success) 12%, var(--rw-surface));
    color: var(--rw-success);
}

/* Goal 10 owner-review: close the remaining Workflow Designer dark-theme gaps. */
:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-filter-builder,
    .workflow-designer-filter-builder--goal5,
    .workflow-designer-filter-workspace--goal5,
    .workflow-designer-filter-list--goal5) {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-filter-row,
    .workflow-designer-filter-row--group,
    .workflow-designer-filter-row--nested) {
    border-color: var(--rw-border);
    border-left-color: var(--rw-accent);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-filter-row:is(.is-selected, .is-multi-selected) {
    border-color: var(--rw-focus);
    background: var(--rw-surface-selected);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-filter-row.is-invalid {
    border-color: color-mix(in srgb, var(--rw-danger) 62%, var(--rw-border));
    border-left-color: var(--rw-danger);
    background: color-mix(in srgb, var(--rw-danger) 12%, var(--rw-surface));
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-filter-builder__empty,
    .workflow-designer-filter-row__number,
    .workflow-designer-filter-row__drag-handle) {
    border-color: var(--rw-border);
    background: var(--rw-surface-muted);
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-filter-row__group small,
    .workflow-designer-filter-row__unsupported small,
    .workflow-designer-filter-row__fields label > span,
    .workflow-designer-filter-row__fields .workflow-designer-filter-path-target > span,
    .workflow-designer-filter-row__group label > span) {
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--selected .workflow-designer-binding-row__main {
    border-color: color-mix(in srgb, var(--rw-focus) 52%, var(--rw-border));
    background: var(--rw-surface-selected);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--path-hover .workflow-designer-binding-row__main {
    border-color: color-mix(in srgb, var(--rw-focus) 12%, transparent);
    background: color-mix(in srgb, var(--rw-focus) 5%, transparent);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--path-hover-exact .workflow-designer-binding-row__main {
    border-color: color-mix(in srgb, var(--rw-focus) 48%, var(--rw-border));
    background: color-mix(in srgb, var(--rw-focus) 18%, var(--rw-surface));
    box-shadow: inset 0.12rem 0 0 var(--rw-focus);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--path-selected .workflow-designer-binding-row__main {
    border-color: rgba(145, 184, 60, 0.12);
    background: rgba(145, 184, 60, 0.06);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-binding-tree-row--path-selected-exact,
    .workflow-designer-binding-tree-row--pointer-selected,
    .workflow-designer-binding-tree-row--native-drag-source,
    .workflow-designer-binding-tree-row.is-native-drag-source) .workflow-designer-binding-row__main {
    border-color: rgba(145, 184, 60, 0.62);
    background: #304322;
    box-shadow: inset 0.16rem 0 0 #91b83c;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--source-match .workflow-designer-binding-row__main {
    border-color: #4f916f;
    background: #243a2b;
    box-shadow: inset 0.16rem 0 0 #4f916f;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--source-match .workflow-designer-binding-row__path {
    color: #a9d9be;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--destination-match .workflow-designer-binding-row__main {
    border-color: #657fbd;
    background: #29364f;
    box-shadow: inset 0.16rem 0 0 #657fbd;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--destination-match .workflow-designer-binding-row__path {
    color: #b7c9f2;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-binding-tree-row--drop-target .workflow-designer-binding-row__main {
    border-color: #4c969b;
    background: #213b3d;
    box-shadow: inset 0 0 0 1px rgba(76, 150, 155, 0.35);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-transformer-workspace__details,
    .workflow-designer-filter-builder,
    .workflow-designer-interface-design,
    .workflow-designer-editor-pane--details,
    .workflow-designer-side) :is(
        input:not([type="checkbox"]):not([type="radio"]),
        select,
        textarea),
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__details :is(
    .single-line-variable-text-box,
    .soup-variable-textbox__editor,
    .soup-variable-textbox__expression-editor),
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__path-field .single-line-variable-text-box,
:root.soup-theme-dark .workflow-designer-page .workflow-designer-transformer-workspace__source-path-group .single-line-variable-text-box {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
    color-scheme: dark;
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-interface-design {
    border-color: var(--rw-border);
    background: var(--rw-surface-subtle);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-interface-design__summary,
    .workflow-designer-interface-design__template-preview) {
    border-color: var(--rw-border);
    background: var(--rw-surface);
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-interface-design__grid span,
    .workflow-designer-interface-design__summary span,
    .workflow-designer-interface-design__summary small,
    .workflow-designer-interface-design__template-preview span) {
    color: var(--rw-text-muted);
}

:root.soup-theme-dark .workflow-designer-page .workflow-designer-interface-design__template-preview pre {
    border-color: var(--rw-border);
    background: #0e1822;
    color: var(--rw-text);
}

:root.soup-theme-dark .workflow-designer-page :is(
    .workflow-designer-transformer-workspace__details,
    .workflow-designer-filter-builder,
    .workflow-designer-editor-pane--details,
    .workflow-designer-interface-design,
    .workflow-designer-side) option {
    background: var(--rw-surface);
    color: var(--rw-text);
}

@media (prefers-reduced-motion: reduce) {
    :is(.workflow-designer-page, .interface-designer-page) *,
    :is(.workflow-designer-page, .interface-designer-page) *::before,
    :is(.workflow-designer-page, .interface-designer-page) *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}