/*
 * Copyright 2012 The Chromium Authors
 * Use of this source code is governed by a BSD-style license that can be
 * found in the LICENSE file.
 */

.indexed-db-data-view .data-view-toolbar {
  position: relative;
  background-color: var(--sys-color-cdt-base-container);
  border-bottom: 1px solid var(--sys-color-divider);
}

.indexed-db-data-view devtools-data-grid {
  border: 0;
  flex: auto;
}

:host-context(.indexed-db-data-view) .data-grid .data-container tr:nth-last-child(1) {
  background-color: var(--sys-color-cdt-base-container);
}

:host-context(.indexed-db-data-view) .data-grid .data-container tr:nth-last-child(1) td {
  border: 0;
}

:host-context(.indexed-db-data-view) .data-grid .data-container tr:nth-last-child(2) td {
  border-bottom: 1px solid var(--sys-color-divider);
}

:host-context(.indexed-db-data-view) .data-grid:focus .data-container tr.selected {
  background-color: var(--sys-color-tonal-container);
  color: inherit;
}

:host-context(.indexed-db-data-view) .section,
:host-context(.indexed-db-data-view) .section > .header,
:host-context(.indexed-db-data-view) .section > .header .title {
  margin: 0;
  min-height: inherit;
  line-height: inherit;
}

:host-context(.indexed-db-data-view) .data-grid .data-container td .section .header .title {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.indexed-db-key-path {
  color: var(--sys-color-error);
  white-space: pre-wrap;
  unicode-bidi: isolate;
}

.indexed-db-container {
  overflow: auto;
}

.indexed-db-header {
  min-width: 400px;
  flex-shrink: 0;
  flex-grow: 0;
}

.source-code.indexed-db-key-path {
  font-size: unset !important; /* stylelint-disable-line declaration-no-important */
}

.resources-toolbar {
  padding-right: 10px;
}

.object-store-summary-bar {
  flex: 0 0 27px;
  line-height: 27px;
  padding-left: 5px;
  background-color: var(--sys-color-cdt-base-container);
  border-top: 1px solid var(--sys-color-divider);
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.object-store-summary-bar .separator {
  padding: 0 0.5em;
}

.key-filter-input {
  flex-grow: 0.5;
}

.stale-data-warning {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 4px;
}

.stale-data-warning .warning-icon {
  --icon-color: var(--icon-warning);

  width: 20px;
  height: 20px;
}

.data-grid-container {
  flex: auto;
  display: flex;
  flex-direction: column;
}