/* Shared type scale for the home dashboard and approval workbench. */
:root {
  --oa-type-body: 13px;
  --oa-type-small: 12px;
  --oa-type-micro: 11px;
  --oa-type-section: 15px;
  --oa-type-title: 22px;
}

.app-shell.home-shell,
.app-shell.approval-shell {
  font-size: var(--oa-type-body);
}

/* Home: remove the very small 9-11px labels that made the dashboard feel
   like a different product from the approval workbench. */
.home-shell .oa-dashboard-heading h1,
.home-shell .oa-project-heading h1 {
  font-size: var(--oa-type-title);
  line-height: 30px;
}

.home-shell .oa-dashboard-heading .oa-muted,
.home-shell .oa-project-heading .oa-muted {
  font-size: var(--oa-type-body);
  line-height: 19px;
}

.home-shell .oa-eyebrow,
.home-shell .oa-detail-kicker {
  font-size: var(--oa-type-micro);
  line-height: 16px;
}

.home-shell .oa-metric-strip span {
  font-size: var(--oa-type-small);
}

.home-shell .oa-metric-strip b {
  font-size: 28px;
  line-height: 32px;
}

.home-shell .oa-metric-strip small {
  font-size: var(--oa-type-micro);
}

.home-shell .oa-panel-head h2 {
  font-size: var(--oa-type-section);
  line-height: 22px;
}

.home-shell .oa-panel-head .oa-text-button,
.home-shell .oa-queue-copy b,
.home-shell .oa-agenda-panel li b,
.home-shell .oa-quick-action,
.home-shell .oa-project-name {
  font-size: var(--oa-type-small);
}

.home-shell .oa-queue-copy small,
.home-shell .oa-agenda-date small,
.home-shell .oa-agenda-panel li small,
.home-shell .oa-project-panel td:first-child small {
  font-size: var(--oa-type-micro);
}

.home-shell .oa-agenda-date span,
.home-shell .oa-project-panel th,
.home-shell .oa-project-panel td {
  font-size: var(--oa-type-small);
}

/* Approval: use the same readable body scale while retaining its denser
   table layout. */
.approval-shell .primary-nav button,
.approval-shell .approval-process-trigger,
.approval-shell .approval-process-view,
.approval-shell .approval-head .toolbar,
.approval-shell .filing-approval-filter > span,
.approval-shell .filing-approval-filter > input,
.approval-shell .filing-approval-filter > select,
.approval-shell .filing-approval-date-range input,
.approval-shell .filing-approval-apply,
.approval-shell .filing-approval-search input {
  font-size: var(--oa-type-body);
}

.app-shell.approval-shell .primary-nav button {
  font-size: var(--oa-type-body);
}

.app-shell.approval-shell .primary-nav .nav-home {
  font-size: 20px !important;
}

.approval-shell .approval-view-tabs .approval-process-view {
  font-size: var(--oa-type-body);
}

.approval-shell .filing-approval-table,
.approval-shell .filing-approval-table th,
.approval-shell .filing-approval-table td,
.approval-shell .approval-body .data-table th,
.approval-shell .approval-body .data-table td {
  font-size: var(--oa-type-small);
}

.approval-shell .filing-approval-pagination,
.approval-shell .filing-approval-pagination button,
.approval-shell .filing-approval-pagination b,
.approval-shell .filing-approval-row-menu button,
.approval-shell .filing-approval-export-menu button,
.approval-shell .filing-approval-columns label {
  font-size: var(--oa-type-small);
}

.approval-shell .oa-approval-detail {
  font-size: var(--oa-type-body);
}

.approval-shell .oa-detail-kicker {
  font-size: var(--oa-type-micro);
  line-height: 16px;
}

.approval-shell .oa-detail-title-row h2 {
  font-size: 17px;
  line-height: 24px;
}

.approval-shell .oa-detail-client {
  font-size: var(--oa-type-small);
}

.approval-shell .oa-approval-detail dt,
.approval-shell .oa-detail-progress > div:first-child,
.approval-shell .oa-detail-progress li b {
  font-size: var(--oa-type-small);
}

.approval-shell .oa-approval-detail dd {
  font-size: var(--oa-type-body);
}

.approval-shell .oa-detail-progress li small {
  font-size: var(--oa-type-micro);
}

@media (max-width: 820px) {
  .home-shell .oa-dashboard-heading h1,
  .home-shell .oa-project-heading h1 {
    font-size: 20px;
    line-height: 28px;
  }

  .home-shell .oa-panel-head h2 {
    font-size: var(--oa-type-section);
  }

  .home-shell .oa-metric-strip b {
    font-size: 25px;
    line-height: 30px;
  }

  .approval-shell .oa-detail-title-row h2 {
    font-size: 16px;
    line-height: 22px;
  }

  .approval-shell .filing-approval-table,
  .approval-shell .filing-approval-table th,
  .approval-shell .filing-approval-table td {
    font-size: var(--oa-type-small);
  }
}