:root[data-bs-theme=light] {
    --bs-tertiary-bg: rgb(238, 239, 240);
    --bs-tertiary-bg-rgb: 238, 239, 240;
    --debusine-hover-color-multiplier: 0.8;
    --debusine-disabled-color-multiplier: 1.5;
    --debusine-hover-layer: rgb(0 0 0 / 20%);
}
:root[data-bs-theme=dark] {
    --bs-tertiary-bg: rgb(53, 58, 63);
    --bs-tertiary-bg-rgb: 53, 58, 63;
    --debusine-hover-layer: rgb(255 255 255 / 20%);
    --debusine-hover-color-multiplier: 1.2;
    --debusine-disabled-color-multiplier: 0.5;
}

/* Theme-friendly way to specify colors for toolbars */
.bg-debusine-toolbar {
  --bs-bg-opacity: 1;
  background-color: rgba(var(--bs-secondary-bg-rgb), var(--bs-bg-opacity)) !important;
}
/* Button that preserves the underlying color scheme */
.btn-debusine {
  --bs-btn-hover-color: rgb(from var(--bs-btn-color) calc(r * var(--debusine-hover-color-multiplier)) calc(g * var(--debusine-hover-color-multiplier)) calc(b * var(--debusine-hover-color-multiplier)));
  --bs-btn-hover-bg: var(--debusine-hover-layer);
  --bs-btn-disabled-color: rgb(from var(--bs-btn-color) calc(r * var(--debusine-disabled-color-multiplier)) calc(g * var(--debusine-disabled-color-multiplier)) calc(b * var(--debusine-disabled-color-multiplier)));
  --bs-btn-disabled-bg: var(--bs-btn-bg);
  --bs-btn-disabled-border-color: var(--bs-btn-border-color);
} 

.order-active {
    color: inherit;
    text-decoration: none; /* avoid link underline */
}

.order-inactive {
    color: grey;
    text-decoration: none; /* avoid link underline */
}

.errorlist {
    color:red;
}

footer {
    font-size: 80%;
}
footer a {
    text-decoration: none;
}
footer a:visited {
}
footer button {
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    color: var(--bs-link-color);
}

.line-numbers {
    background-color: #e0e0e0;
    color: #000;
}
pre.file_contents_lineno a {
    text-decoration: none;
    color: inherit;
}
pre.file_contents_lineno a:hover {
    text-decoration: underline;
}

div.file_highlighted pre {
    margin: 0;
}

/* Style logout button to appear in the same way it did when we were logging
 * out using a GET request via a link.
 */
#logout-form button {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

/*
 * A height attribute (any height attribute) is needed on a table element to be
 * able to use height: 100% inside table cells.
 *
 * See https://stackoverflow.com/a/73399942
 */
table {
    height: fit-content;
}


div.table-filter-form-container
{
    width: 30rem;
}

form.table-filter-form .select2
{
    flex-grow: 1;
}

/* Bootstrap supports buttons styled like links, but their default alignment
 * and padding means that they aren't quite suitable for use in the middle
 * of a paragraph of text.  Adjust these.
 */
button.btn-link.in-running-text
{
    vertical-align: baseline;
    padding: 0;
}

#scope-workspace-list th:nth-last-child(-n+3),
#scope-workspace-list td:nth-last-child(-n+3) {
    width: 1%;
    white-space: nowrap; /* Prevent wrapping */
}

.workflow-ancestor {
    opacity: 0.6;
}

.table-tds-vertical-align-middle td {
    vertical-align: middle;
}

.table-ths-vertical-align-middle th {
    vertical-align: middle;
}

/* Allow wrapping but still preserve newlines */
pre.pre-wrap {
    white-space: pre-wrap;    /* preserve \n, wrap long lines */
    overflow-wrap: anywhere;  /* break long URLs/tokens */
}

.error-list {
    list-style-type: none;  /* remove bullets */
    padding-left: 0;
    margin-left: 0;
}
