/*
 * Title centered.
 * Body/table use the full content pane from the left (no 944px column),
 * without expanding the page wider than the viewport.
 */

:root,
html,
body,
#app {
  --affine-editor-width: 100% !important;
  --affine-editor-side-padding: 32px !important;
}

/* Keep the editor stack inside the content pane */
.affine-page-viewport,
.editor-wrapper,
.editor-wrapper.page-mode,
page-editor,
.page-editor-container,
editor-host,
affine-page-root {
  --affine-editor-width: 100% !important;
  --affine-editor-side-padding: 32px !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

/* display:table wrapper must not grow to the table's intrinsic width */
.affine-page-viewport > div {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.affine-page-root-block-container {
  --affine-editor-width: 100% !important;
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-inline: 0 !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
  box-sizing: border-box !important;
}

/* Title stays centered */
.doc-title-container,
.doc-icon-container,
affine-doc-title {
  max-width: 720px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Database fills the content pane; horizontal scroll stays inside the table */
affine-database,
affine-database-title,
affine-data-view-renderer,
.affine-database-block-container,
[data-block-is-database='true'] {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

/* Cancel the default negative margins that pull the DB outside the pane */
affine-database.css-pbfec5,
affine-database {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

affine-data-view-kanban-card {
  --affine-background-kanban-card-color: transparent !important;
  background: transparent !important;
}

affine-database-column-header,
.affine-database-column-header,
.header-add-column-button,
.data-view-table-view-drag-handler {
  background: transparent !important;
  background-color: transparent !important;
}

[class*='docPropertiesTableContainer'] {
  justify-content: flex-start !important;
}
[class*='docPropertiesTable'] {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Peek / record detail */
affine-data-view-record-detail,
database-datasource-note-renderer {
  --affine-editor-width: 100% !important;
}

@media screen and (max-width: 800px) {
  :root,
  .affine-page-root-block-container {
    --affine-editor-side-padding: 16px !important;
  }
  .affine-page-root-block-container {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}