/* Discovery / IQ Flows design-system tokens.
   Loaded after vendor themes and before generated-grid scroll overrides. */

.iq-flows-workbench {
    --iq-font-family: Roboto, "Helvetica Neue", "Segoe UI", Arial, sans-serif;
    --iq-font-size-xs: 0.72rem;
    --iq-font-size-sm: 0.78rem;
    --iq-font-size-md: 0.84rem;
    --iq-font-size-lg: 0.96rem;
    --iq-font-weight-regular: 400;
    --iq-font-weight-medium: 600;
    --iq-font-weight-strong: 720;
    --iq-letter-spacing-label: 0;

    --iq-color-outer-space: #253238;
    --iq-color-fjord: #455a65;
    --iq-color-tundora: #5e6b73;
    --iq-color-mercury: #e5e5e5;
    --iq-color-lochmara: #0288d1;
    --iq-color-pear: #c0d736;
    --iq-color-sushi: #8cc63e;
    --iq-color-white: #ffffff;

    --iq-text: #253238;
    --iq-text-muted: #5e6b73;
    --iq-text-subtle: #7c8a92;
    --iq-text-inverse: #ffffff;
    --iq-accent: #0288d1;
    --iq-accent-strong: #0369a1;
    --iq-accent-soft: #e7f5fd;
    --iq-tree-selected-bg: #dff1fb;
    --iq-tree-selected-border: #0288d1;
    --iq-tree-selected-text: #253238;
    --iq-tree-selected-icon: #0288d1;
    --iq-success: #2f8f55;
    --iq-success-soft: #eef9f0;
    --iq-warning: #a16207;
    --iq-warning-soft: #fff7df;
    --iq-danger: #b42335;
    --iq-danger-soft: #fff1f3;
    --iq-ai: #0f8ebf;
    --iq-ai-soft: #eaf7fb;

    --iq-page-bg: #f6f8fb;
    --iq-surface: #ffffff;
    --iq-surface-subtle: #fbfcfe;
    --iq-surface-raised: #ffffff;
    --iq-surface-selected: #eef7ff;
    --iq-surface-hover: #f3f8fc;
    --iq-canvas-bg: #fbfdff;
    --iq-canvas-grid: rgba(37, 50, 56, 0.055);

    --iq-border-muted: rgba(37, 50, 56, 0.1);
    --iq-border: rgba(37, 50, 56, 0.14);
    --iq-border-strong: rgba(2, 136, 209, 0.38);
    --iq-divider: rgba(37, 50, 56, 0.08);

    --iq-radius-xs: 4px;
    --iq-radius-sm: 6px;
    --iq-radius-md: 8px;
    --iq-radius-pill: 999px;

    --iq-shadow-soft: 0 8px 22px rgba(18, 35, 48, 0.07);
    --iq-shadow-panel: 0 16px 38px rgba(18, 35, 48, 0.08);
    --iq-shadow-focus: 0 0 0 3px rgba(2, 136, 209, 0.18);

    --iq-space-1: 0.25rem;
    --iq-space-2: 0.5rem;
    --iq-space-3: 0.75rem;
    --iq-space-4: 1rem;
    --iq-space-5: 1.25rem;

    --iq-button-height-sm: 2rem;
    --iq-tab-active: #0288d1;
    --iq-table-header-bg: #f8fafc;
    --iq-status-running: #0288d1;
    --iq-status-complete: #2f8f55;
    --iq-status-failed: #b42335;
    --iq-node-input: #0288d1;
    --iq-node-prepare: #2f8f55;
    --iq-node-match: #a16207;
    --iq-node-materialize: #7c3aed;
    --iq-icon-muted: #5e6b73;
    --iq-icon-soft-bg: #f1f6f9;
    --iq-toolbar-group-bg: #fbfdff;
    --iq-toolbar-group-border: rgba(37, 50, 56, 0.09);
    --iq-node-card-shadow: 0 16px 34px rgba(18, 35, 48, 0.12);
    --iq-connector-muted: rgba(69, 90, 101, 0.5);
    --iq-container-soft-bg: rgba(251, 253, 255, 0.82);
    --iq-workflow-shell-bg: #f4f7fa;
    --iq-workflow-panel-shadow: 0 12px 30px rgba(18, 35, 48, 0.065);
    --iq-workflow-canvas-dot: rgba(37, 50, 56, 0.08);
    --iq-workflow-canvas-halo: rgba(2, 136, 209, 0.045);
    --iq-workflow-node-glow: 0 18px 36px rgba(18, 35, 48, 0.13);

    color: var(--iq-text);
    font-family: var(--iq-font-family);
    background: var(--iq-page-bg);
}

.iq-flows-workbench *,
.iq-flows-workbench *::before,
.iq-flows-workbench *::after {
    letter-spacing: 0;
}

.iq-flows-workbench :is(.btn, .form-control, .form-select, .dropdown-menu, .badge, .card, .e-control, .k-widget) {
    font-family: var(--iq-font-family);
}

.iq-flows-workbench :is(.btn, .form-control, .form-select) {
    border-radius: var(--iq-radius-sm);
}

.iq-flows-workbench :is(.btn:focus-visible, .form-control:focus, .form-select:focus, button:focus-visible) {
    border-color: var(--iq-border-strong);
    box-shadow: var(--iq-shadow-focus);
    outline: 0;
}

.iq-flows-workbench .btn-primary,
.iq-flows-workbench .btn-outline-primary:hover,
.iq-flows-workbench .btn-outline-primary:focus-visible {
    border-color: var(--iq-accent);
    background: var(--iq-accent);
    color: var(--iq-text-inverse);
}

.iq-flows-workbench .btn-outline-primary {
    border-color: rgba(2, 136, 209, 0.42);
    color: var(--iq-accent-strong);
}

.iq-flows-workbench .btn-outline-secondary {
    border-color: var(--iq-border);
    color: var(--iq-color-fjord);
    background: var(--iq-surface);
}

.iq-flows-workbench .btn-outline-secondary:hover,
.iq-flows-workbench .btn-outline-secondary:focus-visible {
    border-color: var(--iq-border-strong);
    color: var(--iq-accent-strong);
    background: var(--iq-accent-soft);
}

.iq-flows-workbench .text-muted {
    color: var(--iq-text-muted) !important;
}

.iq-flows-workbench .card {
    border-color: var(--iq-border);
    border-radius: var(--iq-radius-md);
    background: var(--iq-surface);
}

.iq-flows-workbench .card-header {
    border-bottom-color: var(--iq-divider);
    background: var(--iq-surface-subtle);
    color: var(--iq-text);
    font-weight: var(--iq-font-weight-strong);
}

.iq-flows-workbench .badge {
    border-radius: var(--iq-radius-pill);
    font-weight: var(--iq-font-weight-medium);
}

.iq-flows-workbench .text-bg-primary {
    background-color: var(--iq-accent) !important;
}

.iq-flows-workbench .text-bg-success {
    background-color: var(--iq-success) !important;
}

.iq-flows-workbench :is(.discovery-layout-mode-selector, .discovery-data-surface-tabs, .discovery-canvas-tabs) {
    border-color: var(--iq-border);
    background: var(--iq-surface-subtle);
}

.iq-flows-workbench :is(.discovery-layout-mode-button, .discovery-data-surface-tab, .discovery-canvas-tab) {
    color: var(--iq-text-muted);
}

.iq-flows-workbench :is(.discovery-layout-mode-button.active, .discovery-data-surface-tab.active, .discovery-canvas-tab.active) {
    color: var(--iq-accent-strong);
    background: var(--iq-surface);
    box-shadow: inset 0 -2px 0 var(--iq-tab-active);
}

.iq-flows-workbench .discovery-layout-mode-button.active {
    color: var(--iq-text-inverse);
    background: var(--iq-accent);
}

.iq-flows-workbench :is(.e-grid, .k-grid) {
    border-color: var(--iq-border);
    color: var(--iq-text);
    font-family: var(--iq-font-family);
}

.iq-flows-workbench :is(.e-grid .e-headercell, .k-grid th) {
    background: var(--iq-table-header-bg);
    color: var(--iq-text-muted);
    font-size: var(--iq-font-size-xs);
    font-weight: var(--iq-font-weight-strong);
}

.iq-flows-workbench.discovery-workbench-shell {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.72), rgba(246, 248, 251, 0.96)),
        var(--iq-page-bg);
}

.iq-flows-workbench .discovery-workbench-splitter {
    background: var(--iq-page-bg);
}

.iq-flows-workbench .discovery-workbench-splitter .e-pane {
    background: var(--iq-surface);
}

.iq-flows-workbench .discovery-workbench-splitter .e-split-bar,
.iq-flows-workbench .discovery-canvas-splitter .e-split-bar,
.iq-flows-workbench .discovery-canvas-workbench-splitter .e-split-bar,
.iq-flows-workbench .discovery-canvas-center-splitter .e-split-bar-vertical {
    background: #f1f5f8 !important;
    border-color: var(--iq-divider) !important;
}

.iq-flows-workbench .discovery-workbench-splitter .e-resize-handler,
.iq-flows-workbench .discovery-canvas-splitter .e-resize-handler,
.iq-flows-workbench .discovery-canvas-workbench-splitter .e-resize-handler,
.iq-flows-workbench .discovery-canvas-center-splitter .e-resize-handler {
    background: rgba(69, 90, 101, 0.42) !important;
}

.iq-flows-workbench .discovery-authoring-explorer,
.iq-flows-workbench .discovery-pane-body,
.iq-flows-workbench .discovery-panel-scroll {
    background: var(--iq-page-bg);
}

/* The Explorer pane is a child component of the responsive splitter. Keep its
   own height chain constrained and give the tree a single reachable scroller.
   These global rules intentionally bridge Razor CSS-isolation boundaries. */
.iq-flows-workbench [data-testid="discovery-explorer-pane"] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
}

.iq-flows-workbench [data-testid="discovery-explorer-pane"] > .discovery-panel-scroll {
    flex: 1 1 auto;
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}

.iq-flows-workbench [data-testid="discovery-explorer-pane"] > .discovery-panel-scroll > .card {
    height: auto !important;
    min-height: 100%;
}

.iq-flows-workbench .discovery-panel-scroll > .card,
.iq-flows-workbench .discovery-authoring-explorer > .discovery-pane-body .card {
    border: 1px solid var(--iq-border);
    border-radius: var(--iq-radius-md);
    box-shadow: none;
}

.iq-flows-workbench .discovery-panel-scroll > .card > .card-header {
    min-height: 2.55rem;
    padding: 0.65rem 0.8rem;
    border-bottom: 1px solid var(--iq-divider);
    background: var(--iq-surface);
}

.iq-flows-workbench .discovery-panel-scroll > .card > .card-body {
    padding: 0.65rem;
    background: var(--iq-surface);
}

.iq-flows-workbench .discovery-tree-node-row {
    margin: 0.05rem 0;
}

.iq-flows-workbench .discovery-tree-node-label {
    min-height: 1.75rem;
    border: 0;
    border-radius: var(--iq-radius-sm);
    color: var(--iq-text);
    font-size: var(--iq-font-size-md);
    font-weight: var(--iq-font-weight-medium);
}

.iq-flows-workbench .discovery-tree-node-label:hover,
.iq-flows-workbench .discovery-tree-node-label:focus-visible,
.iq-flows-workbench .discovery-tree-node-label.active,
.iq-flows-workbench .discovery-tree-node-label--selected,
.iq-flows-workbench .discovery-tree-node-label.btn-primary {
    border-color: var(--iq-tree-selected-border);
    background: var(--iq-tree-selected-bg);
    color: var(--iq-tree-selected-text);
}

.iq-flows-workbench .discovery-tree-node-label--selected .discovery-tree-node-icon {
    color: var(--iq-tree-selected-icon);
}

.iq-flows-workbench .discovery-tree-expand-toggle {
    color: var(--iq-accent-strong);
    text-decoration: none;
}

.iq-flows-workbench .discovery-tree-node-row > .badge {
    border: 1px solid var(--iq-border);
    background: #f8fafc !important;
    color: var(--iq-text-muted) !important;
}

.iq-flows-workbench .discovery-build-card {
    background: transparent;
}

.iq-flows-workbench .discovery-build-toolbar,
.iq-flows-workbench .discovery-workbench-modebar,
.iq-flows-workbench .discovery-build-drawer,
.iq-flows-workbench .discovery-build-side-panel,
.iq-flows-workbench .discovery-data-inspector-main,
.iq-flows-workbench .discovery-data-inspector-meta-card,
.iq-flows-workbench .discovery-selected-binding-status,
.iq-flows-workbench .discovery-node-conversation-header,
.iq-flows-workbench .discovery-validation-card,
.iq-flows-workbench .discovery-presentation-design-panel,
.iq-flows-workbench .discovery-presentation-preview,
.iq-flows-workbench .discovery-presentation-toolbar,
.iq-flows-workbench .discovery-presentation-version {
    border-color: var(--iq-border);
    border-radius: var(--iq-radius-md);
    background: var(--iq-surface);
    box-shadow: none;
}

.iq-flows-workbench .discovery-build-toolbar {
    padding: 0.62rem 0.72rem;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: var(--iq-shadow-soft);
}

.iq-flows-workbench .discovery-build-toolbar-name,
.iq-flows-workbench .discovery-build-activity {
    border-color: var(--iq-border);
    background: var(--iq-surface-subtle);
    color: var(--iq-text);
}

.iq-flows-workbench .discovery-build-activity.is-running {
    border-color: rgba(2, 136, 209, 0.34);
    background: var(--iq-accent-soft);
    color: var(--iq-accent-strong);
}

.iq-flows-workbench .discovery-build-activity.is-complete {
    border-color: rgba(47, 143, 85, 0.34);
    background: var(--iq-success-soft);
    color: #1f6b3a;
}

.iq-flows-workbench .discovery-build-activity.is-failed {
    border-color: rgba(180, 35, 53, 0.32);
    background: var(--iq-danger-soft);
    color: var(--iq-danger);
}

.iq-flows-workbench .discovery-build-drawer > summary,
.iq-flows-workbench .discovery-workflow-library-header,
.iq-flows-workbench .discovery-data-inspector-toolbar {
    border-bottom-color: var(--iq-divider);
    background: var(--iq-surface-subtle);
    color: var(--iq-text);
}

.iq-flows-workbench .discovery-workflow-library-panel,
.iq-flows-workbench .discovery-canvas-side-panel,
.iq-flows-workbench .discovery-canvas-panel {
    background: var(--iq-surface);
}

.iq-flows-workbench .discovery-workflow-library-item {
    border-color: var(--iq-border);
    border-radius: var(--iq-radius-sm);
    background: var(--iq-surface);
    color: var(--iq-text);
}

.iq-flows-workbench .discovery-workflow-library-item:hover,
.iq-flows-workbench .discovery-workflow-library-item:focus-visible,
.iq-flows-workbench .discovery-workflow-library-item.is-active {
    border-color: var(--iq-border-strong) !important;
    background: var(--iq-accent-soft);
    color: var(--iq-accent-strong);
}

.iq-flows-workbench .discovery-workflow-library-group-title,
.iq-flows-workbench .discovery-data-inspector-rail-title,
.iq-flows-workbench .discovery-canvas-tab.active,
.iq-flows-workbench .discovery-workbench-modebar-copy strong {
    color: var(--iq-text);
}

.iq-flows-workbench .discovery-data-inspector-meta-card,
.iq-flows-workbench .discovery-data-inspector-rail-section {
    background: var(--iq-surface-subtle);
}

.iq-flows-workbench .discovery-node-sfgrid-scroll {
    border-color: var(--iq-border);
    border-radius: var(--iq-radius-sm);
}

.iq-flows-workbench .discovery-canvas-diagram-panel {
    background:
        radial-gradient(circle, var(--iq-canvas-grid) 1px, transparent 1px) 0 0 / 18px 18px,
        linear-gradient(180deg, rgba(255, 255, 255, 0.82), rgba(251, 253, 255, 0.96)),
        var(--iq-canvas-bg);
}

.iq-flows-workbench .discovery-workflow-canvas-shell {
    background: transparent;
}

.iq-flows-workbench .discovery-canvas-tabs {
    border-bottom-color: var(--iq-divider);
    background: var(--iq-surface-subtle);
}

.iq-flows-workbench .discovery-canvas-tab {
    border-right-color: var(--iq-divider);
}

.iq-flows-workbench .discovery-canvas-side-pane-toggle {
    border-color: var(--iq-border);
    border-radius: var(--iq-radius-sm);
    color: var(--iq-text-muted);
}

.iq-flows-workbench .discovery-canvas-side-pane-toggle:hover,
.iq-flows-workbench .discovery-canvas-side-pane-toggle:focus-visible {
    border-color: var(--iq-border-strong);
    color: var(--iq-accent-strong);
    background: var(--iq-accent-soft);
}

.iq-flows-workbench .discovery-upsert-requirement-key {
    color: var(--iq-warning);
    background: var(--iq-warning-soft);
    border-color: rgba(161, 98, 7, 0.28);
}

.iq-flows-workbench .discovery-upsert-requirement-required {
    color: var(--iq-danger);
    background: var(--iq-danger-soft);
    border-color: rgba(180, 35, 53, 0.28);
}

.iq-flows-workbench .discovery-upsert-requirement-recommended {
    color: var(--iq-accent-strong);
    background: var(--iq-accent-soft);
    border-color: rgba(2, 136, 209, 0.28);
}