@holoviz/panel 0.14.4 → 1.0.0-a.2

package/dist/bundled/fast/css/fast.css

@@ -0,0 +1,919 @@
+/* Variables */
+:host {
+    --track-width: 4;
+    --thumb-size: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 0.5 - var(--design-unit));
+    --handle-width: calc(var(--thumb-size) * 1px);
+    --handle-height: calc(var(--thumb-size) * 1px);
+    --slider-size: calc(var(--track-width) * 1px);
+    --bar-height: 16px;
+    --control-corner-radius: calc(var(--corner-radius) * 1.5);
+    --border-radius: calc(var(--corner-radius) * 1px);
+    --base-font: var(--body-font);
+    --font-size: var(--type-ramp-base-font-size);
+    --switch-size: 12px;
+    --container-background: var(--panel-surface-color);
+    color: var(--neutral-foreground-rest);
+}
+
+/* Track */
+
+::-webkit-scrollbar-track {
+    background: #f1f1f1;
+}
+
+/* Separator */
+
+hr {
+    color: var(--neutral-divider-rest);
+    border-color: var(--neutral-divider-rest);
+    background: var(--neutral-divider-rest);
+    border-style: solid;
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+/* Loading */
+
+.pn-loading:before {
+    position: absolute;
+    height: 100%;
+    width: 100%;
+    content: '';
+    z-index: 1000;
+    background-color: rgb(255,255,255,0.50);
+    border-color: lightgray;
+    background-image: url('https://raw.githubusercontent.com/MarcSkovMadsen/awesome-panel-assets/e6cb56375bb1c436975e09739a231fb31e628a63/spinners/default.svg');
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: auto 50%;
+    border-width: 1px;
+}
+
+.pn-loading:hover:before {
+  cursor: progress;
+}
+
+/* Bokeh */
+
+canvas, img {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+/* Toolbar */
+
+.bk-toolbar.bk-above .bk-toolbar-button.bk-active {
+    border-bottom-color: var(--accent-foreground-active);
+}
+
+.bk-toolbar.bk-below .bk-toolbar-button.bk-active {
+    border-top-color: var(--accent-foreground-active);
+}
+
+.bk-toolbar.bk-right .bk-toolbar-button.bk-active {
+    border-left-color: var(--accent-foreground-active);
+}
+
+.bk-toolbar.bk-left .bk-toolbar-button.bk-active {
+    border-right-color: var(--accent-foreground-active);
+}
+
+/* Tooltips */
+
+.bk-tooltip {
+    font-weight: 300;
+    font-size: calc(var(--type-ramp-minus-1-font-size) * 1px);
+    position: absolute;
+    padding: 5px;
+    border: none;
+    border-radius: calc(var(--corner-radius) * 1px);
+    color: var(--neutral-foreground-rest);
+    background-color: var(--container-background);
+    pointer-events: none;
+    opacity: 0.95;
+    z-index: 100;
+}
+
+.bk-tooltip > div:not(:first-child) {
+  /* gives space when multiple elements are being hovered over */
+    margin-top: 5px;
+    border-top: #e5e5e5 1px dashed;
+}
+
+.bk-tooltip-row-label {
+    text-align: right;
+    color: var(--accent-foreground-rest);
+  /* blue from toolbar highlighting */
+}
+
+/* Context menu */
+
+.bk-context-menu {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+.bk-context-menu > :not(.bk-divider).bk-active {
+    border-color: var(--accent-foreground-active);
+}
+
+/* Widget box */
+
+.panel-widget-box {
+    min-height: 20px;
+    background-color: var(--neutral-fill-card-rest);
+    border: none;
+    border-radius: calc(var(--corner-radius) * 1px);
+    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
+    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
+    overflow-x: hidden;
+    overflow-y: hidden;
+}
+
+/* Card */
+
+:host(.accordion), :host(.card) {
+    background-color: var(--neutral-fill-layer-rest);
+}
+
+.card-header, .accordion-header {
+    background-color: var(--neutral-fill-rest);
+    border: unset;
+    box-shadow: unset;
+    color: var(--neutral-foreground-rest);
+    height: unset;
+}
+
+.card-margin {
+    margin: 1em;
+}
+
+.card-header > .card-header-row {
+    margin-left: 15px;
+}
+
+.card-button {
+    display: block;
+    margin-left: 0.5em;
+    padding-right: 1em;
+}
+
+:host(.card-title) h1, :host(.card-title) h2, :host(.card-title) h3,
+:host(.card-title) h4, :host(.card-title) h5, :host(.card-title) h6 {
+    margin-block-end: 0.2em;
+    margin-block-start: 0.2em;
+}
+
+/* Tabs */
+
+.bk-header .bk-tab {
+    border: 1px solid transparent;
+    border-radius: unset;
+    height: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);
+}
+
+.bk-header .bk-tab:hover {
+    color: var(--neutral-foreground-hover);
+}
+
+.bk-header .bk-tab.bk-active {
+    color: var(--accent-foreground-rest);
+    background-color: var(--neutral-fill-rest);
+    border-color: var(--accent-foreground-rest);
+}
+
+.bk-header .bk-tab.bk-active:hover {
+    color: var(--accent-foreground-hover);
+}
+
+.bk-header {
+    --pn-tab-padding-x: 1rem;
+    --pn-tab-padding-y: 0.5rem;
+    --pn-tabs-border-width: 1px;
+    --pn-tabs-border-width: 1px;
+    --pn-tab-color: var(--neutral-fill-rest);
+    --pn-tab-active-color: var(--accent-foreground-rest);
+}
+
+:host(.bk-above) .bk-header {
+    border-bottom: var(--pn-tabs-border-width) solid var(--pn-tab-color);
+}
+
+:host(.bk-left) .bk-header {
+    border-right: var(--pn-tabs-border-width) solid var(--pn-tab-color);
+}
+
+:host(.bk-right) .bk-header {
+    border-left: var(--pn-tabs-border-width) solid var(--pn-tab-color);
+}
+
+:host(.bk-below) .bk-header {
+    border-top: var(--pn-tabs-border-width) solid var(--pn-tab-color);
+}
+
+:host(.bk-above) .bk-header .bk-tab,
+:host(.bk-left) .bk-header .bk-tab,
+:host(.bk-right) .bk-header .bk-tab,
+:host(.bk-below) .bk-header .bk-tab {
+    background: transparent;
+    border: none;
+    padding: var(--pn-tab-padding-y) var(--pn-tab-padding-x);
+    border-style: solid;
+    border-width: 0;
+}
+
+:host(.bk-above) .bk-header .bk-tab {
+    margin-bottom: calc(-1 * var(--pn-tabs-border-width));
+    border-bottom-width: 2px;
+}
+
+:host(.bk-left) .bk-header .bk-tab {
+    margin-right: calc(-1 * var(--pn-tabs-border-width));
+    border-right-width: 2px;
+}
+
+:host(.bk-right) .bk-header .bk-tab {
+    margin-left: calc(-1 * var(--pn-tabs-border-width));
+    border-left-width: 2px;
+}
+
+:host(.bk-below) .bk-header .bk-tab {
+    margin-top: calc(-1 * var(--pn-tabs-border-width));
+    border-top-width: 2px;
+}
+
+/* DataFrame */
+
+table.panel-df {
+    color: var(--neutral-foreground-rest);
+}
+
+.panel-df tbody tr:nth-child(odd) {
+    background: var(--neutral-fill-active);
+}
+
+.panel-df thead {
+    border-bottom: 1px solid var(--neutral-divider-rest);
+}
+
+.panel-df tr:hover {
+    background: var(--accent-fill-hover) !important;
+    color: var(--accent-foreground-cut-rest);
+    cursor: pointer;
+}
+
+/* Slider Widgets */
+
+.noUi-target {
+    background: var(--neutral-stroke-rest);
+    border-color: var(--neutral-stroke-rest);
+    box-shadow: unset;
+}
+
+.noUi-base {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+.noUi-handle {
+    background: var(--neutral-foreground-rest);
+    border-radius: calc(var(--corner-radius) * 1px);
+    box-shadow: unset;
+}
+
+/* Input widgets */
+
+.bk-input {
+    background-color: var(--background-color);
+    border: 1px solid var(--accent-fill-rest);
+    border-radius: calc(var(--control-corner-radius) * 1px);
+    color: var(--neutral-foreground-rest);
+    font-size: var(--type-ramp-base-font-size);
+    height: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);
+    line-height: var(--type-ramp-base-line-height);
+    padding: 0 calc(var(--design-unit) * 2px + 1px);
+}
+
+.bk-input:focus {
+    border: 1px solid var(--neutral-stroke-active);
+    box-shadow: 0 0 0 1px var(--neutral-stroke-active) inset;
+}
+
+.bk-input[disabled], .bk-input[disabled]:hover {
+    cursor: not-allowed;
+    background-color: transparent;
+    border-color: var(--accent-fill-rest);
+    opacity: var(--disabled-opacity)
+}
+
+/* TextArea widget */
+
+textarea.bk-input {
+    padding: calc(var(--design-unit) * 2px + 1px);
+}
+
+/* Select widget */
+
+.bk-input:focus option:checked, .bk-input:focus option:checked, .bk-input option:active {
+    background: var(--accent-fill-hover) -webkit-linear-gradient(bottom, var(--accent-fill-hover) 0%, var(--accent-fill-hover) 100%);
+}
+
+.bk-input option:hover, .bk-input:focus option:hover {
+    background: var(--accent-fill-hover) -webkit-linear-gradient(bottom, var(--accent-fill-hover) 0%, var(--accent-fill-hover) 100%);
+}
+
+/* Choices widget */
+
+.choices.is-disabled .choices__inner, .choices.is-disabled .choices__input {
+    background: unset;
+    opacity: var(--disabled-opacity);
+}
+
+.choices[data-type*='select-one'] .choices__input {
+    display: block;
+    width: 100%;
+    padding: 10px;
+    border-bottom: 1px solid var(--accent-fill-rest);
+    background-color: transparent;
+    margin: 0;
+}
+
+.choices__inner {
+    display: inline-block;
+    vertical-align: top;
+    width: 100%;
+    background-color: transparent;
+    padding: 7.5px 7.5px 3.75px;
+    border: 1px solid var(--accent-fill-rest);
+    border-radius: calc(var(--corner-radius) * 1px);
+    font-size: 14px;
+    min-height: 44px;
+    overflow: hidden;
+    min-height: unset;
+}
+
+.is-focused .choices__inner,
+.is-open .choices__inner {
+    border-color: var(--accent-fill-active);
+}
+
+.choices__list--dropdown, .choices__list[aria-expanded] {
+    background-color: var(--neutral-fill-rest);
+    border: 1px solid var(--accent-fill-rest);
+}
+
+.choices__list--dropdown {
+    border: 1px solid var(--accent-fill-rest);
+}
+
+.is-open .choices__list--dropdown, .is-open .choices__list[aria-expanded] {
+    border-color: var(--accent-fill-rest);
+}
+
+
+.choices__list--dropdown .choices__item--selectable.is-highlighted, .choices__list[aria-expanded] .choices__item--selectable.is-highlighted {
+    background-color: var(--accent-fill-rest);
+}
+
+.choices__inner .choices__item.solid {
+    background-color: var(--accent-fill-rest);
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+.choices__inner .choices__item.solid .is-highlighted {
+    background-color: var(--accent-fill-active);
+}
+
+.choices[data-type*=select-multiple] .choices__button.solid {
+    border-left: 1px solid var(--accent-fill-rest);
+}
+
+.choices[data-type*=select-multiple] .choices__button.solid:hover {
+    background: var(--accent-fill-hover);
+    border-left: 1px solid var(--accent-fill-hover);
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+/* FileInput */
+
+input[type=file] {
+    background: transparent;
+    width: 100%;
+    height: 50px;
+    border: 3px dashed var(--neutral-stroke-rest);
+    border-radius: calc(var(--corner-radius) * 1px);
+    text-align: center;
+    margin: auto;
+}
+
+input[type=file][disabled]:hover {
+    cursor: not-allowed;
+    border-color: var(--neutral-stroke-rest);
+}
+
+input[type=file]:hover {
+    border-color: var(--neutral-stroke-hover);
+}
+
+input[type=file]:active {
+    border: 3px dashed var(--neutral-stroke-active);
+}
+
+/* Buttons */
+
+.bk-btn {
+    border: unset;
+    border-radius: calc(var(--control-corner-radius) * 1px);
+    line-height: var(--type-ramp-base-line-height);
+    height: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);
+    min-width: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);
+    padding: 0 calc((10 + (var(--design-unit) * 2 * var(--density))) * 1px);
+}
+
+.bk-btn.bk-btn-default {
+    background-color:  var(--neutral-fill-rest);
+    color: var(--neutral-foreground-rest);
+}
+
+.bk-btn.bk-btn-default:hover {
+    background-color: var(--neutral-fill-hover);
+}
+
+.bk-btn.bk-btn-default.bk-active {
+    background-color: var(--neutral-fill-active);
+    border: 1px solid var(--accent-fill-active);
+    box-shadow: inset 0px 3px 5px rgb(0 0 0 / 25%);
+    filter: brightness(0.9);
+}
+
+.bk-btn[disabled],
+.bk-btn[disabled]:hover,
+.bk-btn[disabled]:focus,
+.bk-btn[disabled]:active,
+.bk-btn[disabled].bk-active {
+    cursor: not-allowed;
+    pointer-events: none !important;
+}
+
+.bk-menu {
+    background-color: var(--neutral-fill-rest);
+    color: var(--neutral-foreground-rest);
+    border: unset;
+    border-radius: calc(var(--control-corner-radius) * 1px);
+}
+
+.bk-menu > .bk-divider {
+    background-color: var(--neutral-focus);
+}
+
+.bk-menu > :not(.bk-divider):hover,
+.bk-menu > :not(.bk-divider).bk-active {
+    background-color: var(--accent-fill-hover);
+}
+
+/* Checkbox/Radio */
+
+.bk-input-group input[type="checkbox"], .bk-input-group input[type="radio"] {
+    width: 15px;
+    height: 15px;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -o-appearance: none;
+    appearance: none;
+    border: calc(var(--stroke-width) * 1px) solid var(--neutral-stroke-rest);
+    outline: none;
+    background-color: var(--neutral-fill-input-rest);
+    cursor: pointer;
+    margin-right: 0.25em;
+}
+
+.bk-input-group input[type="checkbox"] {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+.bk-input-group input[type="checkbox"]:hover, .bk-input-group input[type="radio"]:hover {
+    background: var(--neutral-fill-input-hover);
+    border-color: var(--neutral-stroke-hover);
+}
+
+.bk-input-group input[type="checkbox"]:active, .bk-input-group input[type="radio"]:active {
+    background: var(--accent-fill-active);
+    border: calc(var(--outline-width) * 1px) solid var(--accent-fill-active);
+}
+
+.bk-input-group input[type="checkbox"]:checked:hover {
+    background: var(--accent-fill-hover);
+}
+
+.bk-input-group input[type="radio"]:checked:hover {
+    border-color: var(--accent-fill-hover);
+}
+
+.bk-input-group input[type="checkbox"]:checked {
+    background: var(--accent-fill-active);
+    border: calc(var(--outline-width) * 1px) solid var(--accent-fill-active);
+}
+
+.bk-input-group input[type="radio"]:checked {
+    background: var(--accent-foreground-cut-rest);
+    border: calc(var(--outline-width) * 4px) solid var(--accent-fill-rest);
+}
+
+.bk-input-group input[type="checkbox"]:checked::before {
+    content: '\2713';
+    display: block;
+    text-align: center;
+    color: var(--neutral-foreground-rest);
+    position: relative;
+    left: 0.0rem;
+    bottom: 0.25rem;
+}
+
+.bk-input-group input[type="checkbox"]:disabled,
+.bk-input-group input[type="checkbox"]:disabled:hover {
+    cursor: not-allowed;
+    pointer-events: none !important;
+    opacity: var(--disabled-opacity)
+}
+
+.bk-input-group input[type="checkbox"]:disabled {
+    border-color: var(--neutral-outline-rest);
+}
+
+.bk-input-group input[type="radio"]:disabled:checked,
+.bk-input-group input[type="radio"]:disabled:checked:hover {
+    background: var(--accent-foreground-cut-rest);
+    border: calc(var(--outline-width) * 4px) solid var(--accent-fill-rest);
+}
+
+.bk-input-group input[type="radio"]:disabled,
+.bk-input-group input[type="radio"]:disabled:hover {
+    cursor: not-allowed;
+    pointer-events: none !important;
+    opacity: var(--disabled-opacity);
+}
+
+/* Switch */
+
+:host(.bk-Switch) .body {
+    height: calc(((var(--base-height-multiplier) + var(--density)) * var(--design-unit) / 2 + var(--design-unit)) * 1px);
+}
+
+.body > .knob {
+    background-color: var(--neutral-foreground-rest);
+    border-radius: calc(var(--control-corner-radius) * 1px);
+    top: 6px;
+    bottom: 6px;
+    left: 5px;
+    transition: all 0.2s ease-in-out 0s;
+}
+
+.body > .bar {
+    background: var(--neutral-fill-input-rest);
+    border: 1px solid var(--neutral-stroke-rest);
+    border-radius: calc(var(--control-corner-radius) * 1px);
+    height: calc(((var(--base-height-multiplier) + var(--density)) * var(--design-unit) / 2 + var(--design-unit)) * 1px);
+    top: 0;
+    width: calc((var(--base-height-multiplier) + var(--density)) * var(--design-unit) * 1px);
+}
+
+.body > .bar:hover {
+    border-color: var(--neutral-stroke-hover);
+}
+
+:host(.active) .bar {
+    background: var(--accent-fill-rest);
+    border-color: var(--accent-fill-rest);
+}
+
+:host(.active) .knob {
+    background-color: var(--accent-foreground-cut-rest);
+    border-radius: calc(var(--control-corner-radius) * 1px);
+    left: calc(100% - var(--switch-size)/2 - 2px);
+}
+
+/* TextEditor */
+
+.ql-container.ql-snow {
+    border: 1px solid #ccc;
+}
+
+/* Progress Indicator */
+
+progress {
+    border-radius: calc(var(--corner-radius) * 1px);
+    height: 5px;
+    margin: 0 0 0.5em;
+}
+
+progress[value]::-moz-progress-bar {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+progress:not([value])::-moz-progress-bar {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+progress[value]::-webkit-progress-value {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+progress[value]::-webkit-progress-bar {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+progress:not([value])::-webkit-progress-bar {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+progress:not([value])::before {
+    border-radius: calc(var(--corner-radius) * 1px);
+    height: 5px;
+}
+
+/* Panes */
+
+video {
+    max-height: 100% !important;
+    max-width: 100% !important;
+    min-width: auto !important;
+    min-height: auto !important;
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+canvas {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+iframe {
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+/* Markdown */
+
+.markdown {
+    padding: 0.5em;
+}
+
+.markdown a img {
+    text-decoration: none
+}
+
+.markdown img {
+    border-radius: calc(var(--corner-radius) * 1px);
+    max-width: 100%;
+    margin: 1em;
+}
+
+.codehilite {
+    background: var(--neutral-fill-active);
+    padding-top: 1px;
+    padding-bottom: 1px;
+    padding-left: 1em;
+    padding-right: 1em;
+    border-radius: calc(var(--corner-radius) * 1px);
+}
+
+/* Alert */
+
+.alert {
+    padding-left: 1em;
+    padding-right: 1em;
+}
+
+/* DataFrame */
+
+table.panel-df {
+    color: var(--neutral-foreground-rest);
+}
+
+.panel-df tbody tr:nth-child(odd) {
+    background: var(--neutral-fill-active);
+}
+
+.panel-df thead {
+    border-bottom: 1px solid var(--neutral-divider-rest);
+}
+
+.panel-df tr:hover {
+    background: var(--accent-fill-hover) !important;
+    color: var(--accent-foreground-cut-rest);
+    cursor: pointer;
+}
+
+/* Tabulator */
+
+.pnx-tabulator.tabulator {
+    max-width: 100%;
+    overflow-x:
+}
+
+/* SlickGrid */
+
+/* fast_bokeh_slickgrid.css */
+.slick-header-column.ui-state-default {
+    border-right: 1px solid var(--neutral-focus);
+}
+
+.slick-sort-indicator-numbered {
+    color: #6190CD;
+}
+
+.slick-sortable-placeholder {
+    background: var(--neutral-focus);
+}
+
+.slick-cell,
+.slick-headerrow-column,
+.slick-footerrow-column {
+    border: 1px solid transparent;
+    border-right: 1px dotted var(--neutral-focus);
+    border-bottom-color: var(--neutral-focus);
+}
+
+.slick-cell,
+.slick-headerrow-column {
+    border-bottom: none;
+}
+
+.slick-footerrow-column {
+    border-top-color: var(--neutral-focus);
+}
+
+.slick-cell.highlighted {
+    background: lightskyblue;
+    background: rgba(0, 0, 255, 0.2);
+}
+
+.slick-cell.flashing {
+    border: 1px solid red !important;
+}
+
+.slick-cell.editable {
+    background: white;
+    border-color: black;
+    border-style: solid;
+}
+
+.slick-cell.bk-cell-index {
+    background: transparent;
+}
+
+.slick-reorder-proxy {
+    background: blue;
+    opacity: 0.15;
+}
+
+.slick-reorder-guide {
+    background: blue;
+    opacity: 0.7;
+}
+
+.slick-selection {
+    border: 2px dashed black;
+}
+
+.slick-header-columns {
+    border-bottom: 1px solid var(--accent-fill-rest);
+}
+
+.slick-header-column {
+    border-right: 1px solid var(--neutral-focus);
+    background: transparent;
+    font-weight: 500px;
+}
+
+.slick-header-column:hover {
+    filter: brightness(0.98);
+}
+
+.slick-header-column-active {
+    filter: brightness(0.95);
+}
+
+.slick-headerrow {
+    background: #fafafa;
+}
+
+.slick-headerrow-column {
+    background: #fafafa;
+}
+
+.slick-row.ui-state-active {
+    background: #F5F7D7;
+}
+
+.slick-row {
+    background: transparent;
+}
+
+.slick-row.selected {
+    background: var(--accent-fill-active);
+}
+
+.slick-row:hover, .slick-row.odd:hover {
+    background-color: var(--accent-fill-hover);
+    color: var(--accent-foreground-cut-rest);
+}
+
+.slick-group {
+    border-bottom: 2px solid var(--neutral-focus);
+}
+
+.slick-group-totals {
+    color: gray;
+    background: white;
+}
+
+.slick-cell.selected {
+    background-color: var(--accent-fill-rest);
+    color: var(--accent-foreground-cut-rest);
+}
+
+.slick-cell.active {
+    background-color: var(--accent-fill-active);
+    border: none;
+    border-bottom: 1px solid var(--accent-fill-active);
+}
+
+.slick-sortable-placeholder {
+    background: var(--neutral-focus) !important;
+}
+
+.slick-row.odd {
+    background: var(--neutral-fill-active);
+}
+
+.slick-row.ui-state-active {
+    background: #F5F7D7;
+}
+
+.slick-row.loading {
+    opacity: 0.5;
+}
+
+.slick-cell.invalid {
+    border-color: red;
+}
+
+@-moz-keyframes slickgrid-invalid-hilite {
+    from {
+	box-shadow: 0 0 6px red;
+    }
+    to {
+	box-shadow: none;
+    }
+}
+
+@-webkit-keyframes slickgrid-invalid-hilite {
+    from {
+	box-shadow: 0 0 6px red;
+    }
+    to {
+	box-shadow: none;
+    }
+}
+
+.slick-header-menuitem-disabled {
+    color: var(--neutral-focus);
+}
+
+.slick-columnpicker {
+    background: #f0f0f0;
+}
+
+.slick-columnpicker li {
+    background: none;
+}
+
+.slick-columnpicker li a:hover {
+    background: white;
+}
+
+.slick-pager .ui-icon-container {
+    border-color: gray;
+}
+
+.bk-cell-special-defaults {
+    border-right-color: var(--neutral-focus);
+    border-right-style: solid;
+    background: #f5f5f5;
+}
+
+.bk-cell-select {
+    border-right-color: var(--neutral-focus);
+    border-right-style: solid;
+    background: #f5f5f5;
+}
+
+.bk-cell-index {
+    border-right-color: var(--neutral-focus);
+    border-right-style: solid;
+    background: #f5f5f5;
+    color: gray;
+}
+
+/* Quill editor */
+
+.ql-editor {
+    color: var(--neutral-foreground-rest);
+}
+
+.ql-editor.ql-blank::before {
+    color: var(--neutral-foreground-rest);
+}