/* System readability overlay - 2026-08-09.
   Typography applies on desktop and mobile. Tables remain complete and
   horizontally scrollable; no workflow controls or business data are hidden. */
body {
  font-size: 17px;
  line-height: 1.55;
}

button,
input,
select,
textarea,
.primary,
.secondary,
.mini {
  font-size: 16px;
  line-height: 1.4;
}

.graphic-login-card input,
.graphic-login-card button,
.graphic-login-help a {
  font-size: 16px;
}

label,
.form-grid label,
.job-filters label,
.modal > label {
  font-size: 15px;
  line-height: 1.45;
}

small,
.sub,
.eyebrow,
.topbar p,
.panel-head p,
.formula-note {
  font-size: 14px;
  line-height: 1.45;
}

table,
th,
td {
  font-size: 15px;
  line-height: 1.45;
}

.pill,
.count,
.urgency-label,
.calendar-stage,
.shipping-state,
.payment-flag,
.app-shell [class$="-badge"],
.app-shell [class*="-badge "] {
  font-size: 13px;
  line-height: 1.35;
}

/* Calendar labels were intentionally compact in the original dashboard.
   Keep the same cells and state colors while lifting the readable text floor. */
.calendar-head p,
.calendar-legend,
.calendar-weekdays,
.calendar-selection span,
.calendar-alert-head p,
.calendar-alert-main small,
.calendar-alert-detail,
.calendar-history-note,
.calendar-day-kpis span,
.calendar-day-stage-summary span,
.calendar-day-job-main small,
.calendar-day-job-meta,
.calendar-day-modal-foot,
.calendar-day small {
  font-size: 14px;
  line-height: 1.45;
}

.calendar-day b,
.calendar-alert-main b,
.calendar-day-job-main b {
  font-size: 15px;
  line-height: 1.4;
}

.calendar-alert-item > button,
.calendar-day-job > button {
  font-size: 16px;
}

.calendar-day.today::after,
.calendar-alert-head > strong {
  font-size: 13px;
}

/* Shipping rows contain nested compact summaries. Raise their text without
   changing queue grouping, actions, state semantics, or row disclosure. */
.shipping-group-head small,
.shipping-day-head span,
.shipping-info p,
.shipping-info .address-preview,
.shipping-actors,
.shipping-tracking-tools small,
.shipping-address-pending-choice small,
.completed-shipment-cancel-action small,
.shipping-row-main small,
.shipping-row-person small,
.shipping-row-delivery small,
.shipping-priority-panel > div:first-child small,
.shipping-filter-result {
  font-size: 14px;
  line-height: 1.45;
}

.shipping-day-head b,
.shipping-info h3,
.shipping-tracking-tools b,
.shipping-address-pending-choice b,
.shipping-row-main > b,
.shipping-row-person > b,
.shipping-row-delivery > b,
.shipping-title-line > b {
  font-size: 15px;
  line-height: 1.4;
}

.shipping-card .shipping-actions button,
.shipping-actions .shipping-work-link,
.shipping-tracking-tools button,
.shipping-filter-bar button,
.shipping-copy-menu > summary,
.shipping-copy-menu > div button {
  font-size: 16px;
}

.shipping-filter-bar form,
.shipping-filter-bar label {
  font-size: 15px;
}

.shipping-filter-bar input,
.shipping-filter-bar select {
  font-size: 16px;
}

.shipping-priority-badge,
.shipping-row-summary .payment-flag,
.shipping-row-summary .shipping-state,
.shipping-color-filters button,
.shipping-color-filters strong,
.reference-thumb span,
.reference-delete-button {
  font-size: 13px;
}

@media (max-width: 760px) {
  html,
  body {
    max-width: 100%;
  }

  .graphic-login {
    padding-top: max(16px, env(safe-area-inset-top));
    padding-right: max(16px, env(safe-area-inset-right));
    padding-bottom: max(16px, env(safe-area-inset-bottom));
    padding-left: max(16px, env(safe-area-inset-left));
  }

  .graphic-login-card {
    max-width: 100%;
  }

  .graphic-login-card input,
  .graphic-login-card button,
  .graphic-login-help a {
    min-height: 44px;
    touch-action: manipulation;
  }

  .app-shell > main {
    max-width: 100%;
    padding-right: max(15px, env(safe-area-inset-right));
    padding-bottom: max(35px, env(safe-area-inset-bottom));
    padding-left: max(15px, env(safe-area-inset-left));
  }

  .app-shell > .sidebar {
    padding-right: max(14px, env(safe-area-inset-right));
    padding-left: max(14px, env(safe-area-inset-left));
  }

  .app-shell > .sidebar nav {
    max-width: 100%;
    padding-bottom: 5px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
  }

  .app-shell > .sidebar nav button {
    min-height: 44px;
    scroll-snap-align: start;
    touch-action: manipulation;
  }

  .topbar,
  .top-actions,
  .toolbar,
  .job-filters,
  .day-pager {
    width: 100%;
    min-width: 0;
  }

  .app-shell button,
  .app-shell input:not([type="checkbox"]):not([type="radio"]),
  .app-shell select,
  .app-shell .primary,
  .app-shell .secondary,
  .app-shell .mini {
    min-height: 44px;
    touch-action: manipulation;
  }

  .app-shell button[aria-label],
  .modal-head button {
    min-width: 44px;
  }

  .content-grid,
  .panel,
  .job-day-group,
  .table-wrap,
  .bonus-admin-table-wrap {
    min-width: 0;
    max-width: 100%;
  }

  .table-wrap,
  .bonus-admin-table-wrap {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-gutter: stable;
  }

  .table-wrap table,
  .bonus-admin-table-wrap table {
    max-width: none;
  }

  .panel-head,
  .job-day-heading,
  .payment-summary {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .modal-backdrop {
    padding-top: max(12px, env(safe-area-inset-top));
    padding-right: max(12px, env(safe-area-inset-right));
    padding-bottom: max(12px, env(safe-area-inset-bottom));
    padding-left: max(12px, env(safe-area-inset-left));
  }

  .modal,
  dialog[open] {
    width: 100%;
    max-width: 100%;
    max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
    overflow: auto;
    overscroll-behavior: contain;
  }

  .toast {
    right: max(12px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
    left: max(12px, env(safe-area-inset-left));
    max-width: none;
  }
}