/* Force horizontal, single-line headers */
.tabulator .tabulator-header .tabulator-col .tabulator-col-content,
.tabulator .tabulator-header .tabulator-col .tabulator-col-title {
  writing-mode: horizontal-tb !important;
  transform: none !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* Let the table scroll horizontally instead of squashing headers */
#tabulator-root .tabulator {
  width: 100%;
}

/* Float the spinner higher on the screen */
.create-loading-overlay {
  position: fixed;
  top: 110px;             /* <- move up/down as you like */
  left: 50%;
  transform: translateX(-50%);
  z-index: 2000;          /* above the canvas */
  pointer-events: none;   /* don't block clicks */
}

/* (Optional) make the spinner a bit bigger */
.create-loading-overlay .dash-spinner {
  width: 56px;
  height: 56px;
}

/* Spinner position (high on the page) */
.create-loading-overlay {
  position: fixed;
  top: 110px;                 /* adjust to taste */
  left: 50%;
  transform: translateX(-50%);
  z-index: 2001;
  pointer-events: none;
}

/* Biggish spinner (optional) */
.create-loading-overlay .dash-spinner {
  width: 56px;
  height: 56px;
}

/* Gray overlay that disables the rest of the UI */
.busy-overlay {
  position: fixed;            /* cover whole viewport */
  inset: 0;
  background: rgba(0,0,0,0.25);
  backdrop-filter: blur(1px);
  z-index: 2000;              /* just under spinner */
  /* keep default pointer-events so it blocks clicks */
}