[hidden] {
  display: none !important;
}

:host {
  --background: var(--bp-layer-background-200);
  --body-height: auto;
  --body-min-height: auto;
  --column-height: var(--bp-size-900);
  --row-height: var(--bp-size-900);
  --scroll-padding-top: var(--column-height);
  --row-content-visibility: auto;
  --border: 0;
  --border-width: var(--bp-object-border-width-100);
  --border-color: var(--bp-object-border-color-100);
  width: 100%;
  display: block;
  position: relative;
}

:host([range-selection]) {
  user-select: none;
}

/* border options */
:host([column-style*='border']) ::slotted(bp-grid-row) {
  --cell-border-width: var(--border-width);
  --border-top: 0;
  --border-bottom: 0;
}

:host([row-style*='border']) ::slotted(bp-grid-row) {
  --border-top: var(--border-width) solid var(--border-color);
}

:host([row-style*='border']) ::slotted(bp-grid-row:last-of-type) {
  --border-bottom: var(--border-width) solid var(--border-color);
}

:host([row-style*='border']) ::slotted(bp-grid-row:first-of-type) {
  --border-top: 0;
}

:host([row-style*='stripe']) ::slotted(bp-grid-row) {
  --border-top: 0;
  --border-bottom: 0;
}

:host([row-style*='stripe']) ::slotted(bp-grid-row:nth-child(even)) {
  --bp-interaction-offset: var(--bp-interaction-hover-offset);
}

:host([row-style*='hover']) ::slotted(bp-grid-row:hover) {
  --bp-interaction-offset: var(--bp-interaction-hover-offset);
}

:host([layer='flat']) {
  --background: inherit !important;
  --border-color: var(--bp-object-border-color-200);
}

[part='internal'] {
  border: var(--border);
  border-radius: var(--bp-object-border-radius-100);
  background: var(--background);
  position: relative;
}

.scroll-container {
  scrollbar-color: var(--bp-scrollbar-color);
  scrollbar-width: var(--bp-scrollbar-width);
  box-shadow: var(--box-shadow);
  border: var(--border);
  height: var(--body-height, 100%);
  min-height: var(--body-min-height, auto);
  scroll-padding-top: var(--scroll-padding-top);
  overflow: auto;
  width: 100%;
  display: flex;
  flex-direction: column;
}

:host([scroll-lock]) .scroll-container {
  overflow: hidden;
}

.body-row-group {
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
  min-width: fit-content;
  margin-top: var(--bp-size-200);
}

slot[name='header'] {
  display: flex;
  flex-direction: column;
  min-width: fit-content;
  position: sticky;
  top: 0;
  z-index: 99;
}

::slotted(bp-grid-row:not([bp-draggable='target']):first-of-type) {
  --box-shadow: var(--border-width) solid transparent;
}

@keyframes fadein {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}
