/**
 * Photon Grid base styles — panels section.
 *
 * Auto-split from base-styles.ts. Concatenated back (in order) by
 * base-styles.ts; edit here, not there. Order is preserved because CSS
 * cascade depends on it.
 */
export declare const panelsCss = "/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Three-panel header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-grid__header {\n  display: flex;\n  flex-direction: row;\n  flex-shrink: 0;\n  border-bottom: 1px solid var(--pg-colors-header-border, #e2e8f0);\n  background: var(--pg-colors-header-background, #f8fafc);\n  overflow: hidden;\n  z-index: 10;\n  position: relative;\n}\n/* Mirrors the vertical-scrollbar flex item that lives in the body row so that\n   the center header panel is exactly as wide as the center body panel.\n   Without this spacer the header center is scrollbar_width wider and the right\n   pinned-column header is shifted right relative to the body cells.\n   Uses the *live* scrollbar width (--pg-scrollbar-v-live-width: 0 when the body\n   has no scrollbar showing, the real width when it does \u2014 kept in sync every\n   scroll/resize by ScrollController.syncScrollbars) rather than the constant\n   --pg-scrollbar-v-width, so header\u2194body alignment stays exact whether or not a\n   vertical scrollbar is currently present. */\n.pg-header-vscroll-spacer {\n  flex-shrink: 0;\n  width: var(--pg-scrollbar-v-live-width, 0px);\n  background: var(--pg-colors-header-background, #f8fafc);\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Three-panel body \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-grid__body {\n  display: flex;\n  flex-direction: row;\n  flex: 1 1 0;\n  min-height: 0;\n  overflow: hidden;\n  position: relative;\n  transform: translateZ(10px)\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Panel base \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-panel {\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  flex-shrink: 0;\n  position: relative;\n}\n/* Both pinned panels are sized to their columns PLUS the divider they draw on\n   the edge facing the data. Everything here is box-sizing: border-box, so a\n   panel sized to exactly its columns would spend that pixel on the border and\n   clip the last pinned column's rightmost pixel \u2014 taking with it the one thing\n   drawn there: a cell's right-hand range outline, the focused cell's ring, and\n   the fill handle. They reach it from opposite directions:\n     \u2022 left  \u2014 GridRenderer publishes columns + 1 (PINNED_DIVIDER_WIDTH);\n     \u2022 right \u2014 GridRenderer publishes columns + 2 and the calc() below takes 1\n               back, which is the same arithmetic written the other way round.\n   Change either one and change its counterpart in GridRenderer with it. */\n.pg-panel--left {\n  z-index: 2;\n  width: var(--pg-left-panel-width, auto);\n  border-right: 1px solid var(--pg-colors-border, #e2e8f0);\n}\n.pg-panel--center {\n  flex: 1 1 0;\n  min-width: 0;\n  overflow: hidden;\n}\n.pg-panel--right {\n  z-index: 2;\n  width: calc(var(--pg-right-panel-width, auto) - 1px);\n  border-left: 1px solid var(--pg-colors-border, #e2e8f0);\n  // padding-inline: 1px\n}\n/* \u2500\u2500 Pinned-region divider \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   Structural boundary between a frozen (pinned) column region and the\n   scrollable center. Deliberately independent of showVerticalBorders (which\n   only governs interior column grid-lines) \u2014 the frozen edge must stay visible\n   even when interior lines are off, otherwise pinned columns visually merge\n   into the scrolling area.\n   Implemented as an absolutely-positioned 1px overlay (::after) rather than a\n   real border or an inset shadow:\n     \u2022 a real border would consume 1px of the border-box width and clip the\n       last pinned column;\n     \u2022 an inset box-shadow paints behind the panel's descendant rows, whose\n       opaque backgrounds (--pg-colors-row-background) would hide it.\n   The overlay adds no layout box (zero reflow, no width shift) and paints above\n   the rows. It only renders while the panel is displayed, i.e. that side\n   actually has pinned columns (empty panels are display:none). */\n// .pg-panel--left::after,\n// .pg-panel--right::after {\n//   content: \"\";\n//   position: absolute;\n//   top: 0;\n//   bottom: 0;\n//   width: 1px;\n//   background: var(--pg-colors-pinned-border, var(--pg-colors-border, #e2e8f0));\n//   z-index: 4;\n//   pointer-events: none;\n// }\n.pg-panel--left::after  { right: 0; }\n// .pg-panel .pg-panel--left{\n//   border-right: 1px solid var(--pg-colors-border, #e2e8f0));\n// }\n.pg-panel--right::after { left: 0; }\n\n/* \u2500\u2500 Pinned-edge shadow \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n   The full-height depth cue that separates a frozen (pinned) column region\n   from the scrolling center.\n   Deliberately on the BODY panel container (z-index: 2) and nowhere else:\n   .pg-detail-layer (master-detail.css.ts) carries the same z-index but is a\n   later DOM sibling (mounted after the panels in GridRenderer.buildLayout),\n   so it paints on top \u2014 which means an expanded detail row's opaque,\n   full-width background covers this shadow instead of the shadow striping\n   across the detail content. Hoisting it any higher (e.g. onto the\n   always-on-top .pg-sticky-layer, where it used to live) reintroduces\n   exactly that artefact, because the panels are full-viewport-height flex\n   items: their shadow spans every detail row's Y range too, not just the\n   pinned cells' own.\n   Scoped to .pg-grid__body so the *header* panels \u2014 same .pg-panel classes,\n   different container \u2014 are untouched. */\n.pg-grid__body > .pg-panel--left {\n  // box-shadow: var(--pg-shadows-pinned-left, 2px 0 4px rgba(0,0,0,0.06));\n  border-right: 1px solid var(--pg-colors-border, #e2e8f0);\n}\n.pg-grid__body > .pg-panel--right {\n  // box-shadow: var(--pg-shadows-pinned-right, -2px 0 4px rgba(0,0,0,0.06));\n  border-left: 1px solid var(--pg-colors-border, #e2e8f0);\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Panel header \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-panel__header {\n  flex-shrink: 0;\n  overflow: hidden;\n  position: relative;\n  z-index: 2;\n}\n/* Center panel header sits behind pinned-panel headers so that center\n   content translated by the scroll transform cannot visually overlap the\n   left / right pinned column headers when scrolled near their edges. */\n.pg-panel--center .pg-panel__header {\n  z-index: 1;\n}\n.pg-panel__header-inner {\n  display: flex;\n  flex-direction: column;\n}\n.pg-panel--center .pg-panel__header-inner {\n  transform: translateX(var(--pg-scroll-x, 0px));\n  width: var(--pg-center-content-width, 100%);\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Panel body \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n.pg-panel__body {\n  flex: 1 1 0;\n  min-height: 0;\n  overflow: hidden;\n  position: relative;\n}\n\n/* \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 Panel content (virtual scroll) \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 */\n/*\n * The vertical translate reads `--pg-row-offset-y`, NOT `--pg-scroll-y`.\n *\n * Row `top`s are absolute offsets into the dataset, so at a million rows they\n * reach tens of millions of pixels \u2014 and browsers rasterise with 32-bit floats,\n * whose spacing grows past 1px beyond 2^24 (~16.7M). At that depth a 1px row\n * border is a rect whose two edges round to the same value, so it collapses to\n * zero height and simply stops being painted. Rows are therefore positioned\n * relative to the top of the render window (RowPositionSheet writes\n * `top - origin`) and this transform adds the origin back:\n *\n *   --pg-row-offset-y = rowOrigin - scrollTop\n *\n * ScrollController computes that subtraction in JS doubles, where it is exact.\n * Doing it here as `calc(var(--pg-scroll-y) + var(--pg-row-origin-y))` would\n * round both huge terms to float32 first and jitter the whole panel by a pixel\n * as you scroll.\n *\n * `--pg-scroll-y` is still published (absolute, unscaled) for code that needs\n * the true scroll offset \u2014 see RowDragRenderer.\n */\n.pg-panel__content {\n  position: relative;\n  height: var(--pg-content-height, 0px);\n  will-change: transform;\n}\n.pg-panel--left .pg-panel__content,\n.pg-panel--right .pg-panel__content {\n  transform: translateY(var(--pg-row-offset-y, 0px));\n}\n.pg-panel--center .pg-panel__content {\n  transform: translate(var(--pg-scroll-x, 0px), var(--pg-row-offset-y, 0px));\n  width: var(--pg-center-content-width, 100%);\n}\n/* Master/Detail only (see GridRenderer's pg-grid--has-master-detail class):\n   a BODY panel (left/center/right \u2014 scoped via .pg-grid__body so the\n   *header* panels, which share the same .pg-panel classes, are untouched\n   and stay fully interactive for sort/resize/filter) is a full-height block\n   regardless of whether it has a row at a given Y \u2014 including the Y range\n   where the full-width detail/nested grid layer shows through underneath.\n   Without this, empty panel space (there is no row there \u2014 a detail row\n   renders nothing in these panels by design) still geometrically blocks\n   clicks meant for whatever is showing through from that layer.\n   pointer-events is inherited, so every actual row must explicitly opt\n   back in \u2014 scoped to Master/Detail grids only, this has no effect on the\n   vast majority of grids that never use it. */\n.pg-grid--has-master-detail .pg-grid__body > .pg-panel,\n.pg-grid--has-master-detail .pg-panel__body,\n.pg-grid--has-master-detail .pg-panel__content {\n  pointer-events: none;\n}\n.pg-grid--has-master-detail .pg-row {\n  pointer-events: auto;\n}\n\n";
//# sourceMappingURL=panels.css.d.ts.map