.supply-grid .production-scroll-row[hidden] { display: none; }

/* The sticky rail must use the table viewport as its horizontal scroll parent.
   Standard data cells clip their content and would trap it in the moving cell. */
.production-plan-scroll .supply-grid > thead > tr.production-scroll-row > td {
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0;
  overflow: visible !important;
  line-height: 0;
  background: #f1f1f1;
}
.production-scroll-rail {
  position: sticky;
  left: 0;
  box-sizing: border-box;
  height: 10px;
  overflow-x: scroll;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  background: #f1f1f1;
}
.production-scroll-rail > div { height: 1px; }

.production-scroll-rail::-webkit-scrollbar,
.production-plan-scroll::-webkit-scrollbar { height: 9px; }
.production-scroll-rail::-webkit-scrollbar-track,
.production-plan-scroll::-webkit-scrollbar-track { background: #f1f1f1; }
.production-scroll-rail::-webkit-scrollbar-thumb,
.production-plan-scroll::-webkit-scrollbar-thumb {
  border: 1px solid #f1f1f1;
  border-radius: 8px;
  background: #888;
}
.production-scroll-rail::-webkit-scrollbar-thumb:hover,
.production-plan-scroll::-webkit-scrollbar-thumb:hover { background: #666; }
.production-plan-scroll::-webkit-scrollbar-thumb:vertical {
  border-width: 3px;
  background: #bcbcbc;
}
.production-scroll-rail:focus-visible {
  outline: 2px solid #26649a;
  outline-offset: -2px;
}
@supports not selector(::-webkit-scrollbar) {
  .production-plan-scroll, .production-scroll-rail { scrollbar-width: thin; }
}