html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.mud-main-content {
    min-width: 0;
}

.elsa-workflow-host {
    min-height: 42rem;
    min-width: 0;
    width: 100%;
    overflow: hidden;
}

/* Elsa retains the previous syntax editor while changing an input's expression
   type. Keep only the newest field extension visible for that input. */
.elsa-workflow-host .catalogue-dynamic-content-extension:has(
    ~ .catalogue-dynamic-content-extension) {
    display: none;
}

/* The embedded JavaScript editor can be measured before its input panel is
   visible, leaving Monaco with an inline height of zero. */
.elsa-workflow-host .monaco-editor-container {
    height: 10rem !important;
    min-height: 10rem !important;
}

.elsa-workflow-host .monaco-editor-container > div,
.elsa-workflow-host .monaco-editor-container .monaco-editor {
    height: 100% !important;
    min-height: 10rem !important;
}

/* Elsa 3.7 lays out its activity picker and workspace with RadzenSplitter.
   Keep the small set of required splitter rules local to the workflow host so
   the product UI does not need Radzen's complete theme alongside MudBlazor. */
.elsa-workflow-host .rz-splitter {
    box-sizing: border-box;
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100%;
    height: 100%;
    min-width: 0;
}

.elsa-workflow-host .rz-splitter-horizontal {
    flex-direction: row !important;
    align-items: stretch;
}

.elsa-workflow-host .rz-splitter-pane {
    box-sizing: border-box;
    position: relative;
    flex: 0 0 auto;
    overflow: hidden;
    min-width: 0;
    min-height: 0;
}

.elsa-workflow-host .rz-splitter-pane-lastresizable {
    flex: 1 1 auto;
}

.elsa-workflow-host .rz-splitter-horizontal > .rz-splitter-bar {
    box-sizing: border-box;
    display: inline-flex;
    flex: 0 0 8px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 8px;
    cursor: col-resize;
    background: var(--mud-palette-divider);
    opacity: .55;
    user-select: none;
}

.elsa-workflow-host .rz-splitter-horizontal > .rz-splitter-bar:hover {
    opacity: 1;
}

.elsa-workflow-host .rz-splitter-vertical {
    flex-direction: column !important;
    align-items: stretch;
}

.elsa-workflow-host .rz-splitter-vertical > .rz-splitter-bar {
    box-sizing: border-box;
    display: inline-flex;
    flex: 0 0 8px;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 8px;
    cursor: row-resize;
    background: var(--mud-palette-divider);
    opacity: .55;
    user-select: none;
}

.elsa-workflow-host .rz-splitter-vertical > .rz-splitter-bar:hover {
    opacity: 1;
}

@media (max-width: 700px) {
    .elsa-workflow-host .rz-splitter-horizontal {
        flex-direction: column !important;
    }

    .elsa-workflow-host .rz-splitter-horizontal > .rz-splitter-pane {
        width: 100% !important;
    }

    .elsa-workflow-host .rz-splitter-horizontal > .rz-splitter-bar {
        display: none;
    }
}

.mawson-elsa-workspace,
.mawson-elsa-instance-viewer {
    display: block;
    min-height: 36rem;
    width: 100%;
}

/* Studio's code view sizes itself with flex against ancestors that fill the
   viewport in the standalone Studio shell. Embedded in a scrolling Mawson page
   that chain collapses, leaving the Monaco editor a few pixels tall. */
.mawson-elsa-workspace .code-tab-content {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 22rem);
    min-height: 32rem;
}

.product-page {
    width: 100%;
}

.table-responsive {
    overflow-x: auto;
}

.file-input-hidden {
    display: none;
}

pre {
    max-width: 100%;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

.monaco-json-editor {
    min-width: 0;
    width: 100%;
}

.monaco-json-editor-label {
    color: var(--mud-palette-text-secondary);
    display: block;
    font-size: .75rem;
    margin: 0 0 .35rem .75rem;
}

.monaco-json-editor-host {
    border: 1px solid var(--mud-palette-lines-inputs);
    border-radius: var(--mud-default-borderradius);
    min-height: 16rem;
    overflow: hidden;
    width: 100%;
}

.monaco-json-editor-host:focus-within {
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 1px var(--mud-palette-primary);
}

.monaco-json-editor-status {
    font-size: .75rem;
    margin: .35rem .75rem 0;
}

.monaco-json-editor-status-valid {
    color: var(--mud-palette-success);
}

.monaco-json-editor-status-error {
    color: var(--mud-palette-error);
}