.mail-config-local-page.data-page,
.self-hosted-mail-page.data-page {
  height: 100%;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
}

.mail-config-local-page > .page-head,
.mail-config-local-page > .tabs,
.self-hosted-mail-page > .page-head,
.self-hosted-mail-page > .note,
.self-hosted-mail-summary,
.self-hosted-mail-tabs {
  flex: 0 0 auto;
}

.mail-config-local-page > .self-hosted-mail-page.data-page {
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
}

.self-hosted-mail-summary.stat-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.self-hosted-mail-summary .stat-card {
  min-width: 0;
  padding: 10px 12px;
}

.self-hosted-mail-summary .stat-value {
  font-size: 22px;
}

.self-hosted-mail-summary .stat-foot {
  font-size: 11px;
}

.self-hosted-mail-grid-card {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  min-width: 0;
  overflow: hidden;
}

.self-hosted-mail-grid-card > .card-head,
.self-hosted-mail-toolbar,
.self-hosted-mail-pagination,
.self-hosted-mail-grid-card > .note {
  flex: 0 0 auto;
}

.self-hosted-mail-list-scroll.table-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.pagination.data-table-pagination.self-hosted-mail-pagination .page-btn.active {
  background: var(--accent-dim);
  border-color: var(--accent);
  color: var(--accent);
}

.self-hosted-mail-pagination .self-hosted-mail-page-input {
  width: 64px;
  min-height: 28px;
  padding: 4px 6px;
  text-align: center;
}

.self-hosted-mail-integration-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.self-hosted-mail-integration-scroll .dr-value {
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 1100px) {
  .self-hosted-mail-summary .stat-foot {
    display: none;
  }

  .self-hosted-mail-page > .page-head.data-page-head {
    flex-direction: row;
    align-items: center;
  }

  .self-hosted-mail-page > .page-head.data-page-head .page-actions {
    width: auto;
  }

  .pagination.data-table-pagination.self-hosted-mail-pagination {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    padding: 10px;
  }

  .pagination.data-table-pagination.self-hosted-mail-pagination .self-hosted-mail-page-buttons {
    grid-column: 1 / -1;
    grid-row: 2;
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .self-hosted-mail-page-buttons .page-btn {
    flex-shrink: 0;
  }

  .pagination.data-table-pagination.self-hosted-mail-pagination form {
    flex-wrap: nowrap;
  }
}

@media (max-width: 600px) {
  .mail-config-local-page > .page-head .page-sub,
  .self-hosted-mail-page > .page-head .page-sub,
  .self-hosted-mail-grid-card > .card-head .card-hint {
    display: none;
  }

  .self-hosted-mail-summary.stat-grid {
    display: flex;
    gap: 6px;
    overflow-x: auto;
  }

  .self-hosted-mail-summary .stat-card {
    flex: 1 0 86px;
    padding: 8px;
  }

  .self-hosted-mail-summary .stat-value {
    font-size: 17px;
  }

  .self-hosted-mail-summary .stat-label {
    font-size: 11px;
  }

  .self-hosted-mail-tabs.tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .self-hosted-mail-tabs .tab {
    flex-shrink: 0;
  }

  .self-hosted-mail-grid-card > .card-head {
    padding: 10px;
  }

  .self-hosted-mail-toolbar.data-table-toolbar {
    flex-wrap: nowrap;
    gap: 6px;
    padding: 6px 8px;
  }

  .self-hosted-mail-toolbar > .input {
    width: 0;
    min-width: 0;
    flex: 1 1 auto;
  }

  .self-hosted-mail-toolbar > .toolbar-spacer {
    display: none;
  }

  .self-hosted-mail-toolbar > .btn,
  .self-hosted-mail-toolbar .data-page-size {
    flex-shrink: 0;
  }

  .pagination.data-table-pagination.self-hosted-mail-pagination .page-info {
    font-size: 10px;
    white-space: normal;
  }

  .pagination.data-table-pagination.self-hosted-mail-pagination .page-btn {
    padding: 4px 8px;
  }

}

.mail-config-local-page > .tabs {
  flex-wrap: nowrap;
  max-width: 100%;
  overflow-x: auto;
}

.mail-config-local-page > .tabs .tab,
.self-hosted-mail-summary .stat-value {
  white-space: nowrap;
}