/*
 * Shared wide-screen layout for the modern QHealth application shell.
 * Loaded by pwa-head.php in every module. Shell specificity deliberately wins
 * over the older module-level .content rules, regardless of stylesheet order.
 *
 * Below 1600 CSS pixels the existing laptop/tablet/phone layouts are retained.
 * Standard pages share a stable width before and after results load.
 * Calendars/boards use the available width; focused pages keep a readable measure.
 * New pages can opt in with data-layout="workspace" or data-layout="focused"
 * on their .content element. Inner form/document width limits still apply.
 */
@media screen and (min-width: 1600px) {
  .layout {
    --qh-layout-page: 100rem;
    --qh-layout-focused: 77.5rem;
    --qh-layout-gutter: 40px;
  }

  .layout .main {
    min-width: 0;
  }

  .layout .main > .content {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: var(--qh-layout-page);
    margin-inline: 0 auto;
    padding-inline: var(--qh-layout-gutter);
  }

  /* Full width is reserved for spatial workspaces and explicit opt-ins.
     A results table must not change the width of the page around it. */
  .layout .main > .content[data-layout="workspace"],
  .layout .main > .content.content-calendar,
  .layout .main > .content:has(> .today-board, > .reception-calendar-page, > .doctor-calendar-page) {
    max-width: none;
  }

  /* Forms and account screens keep a focused layout, including any small tables. */
  .layout .main > .content[data-layout="focused"],
  .layout .main > .content:has(> .account-page, .ac2-form-layout,
    > .hr-form-page, > .clinical-editor-page, > .clinical-authoring-page, > .consent-record-page) {
    max-width: var(--qh-layout-focused);
  }

  .layout .main > .content > .ac2-page,
  .layout .main > .content > .today-board,
  .layout .main > .content > .pricelist-batch-page,
  .layout .main > .content .insurance-pricelist-page,
  .layout .main > .content .insurance-pricelist-results,
  .layout .main > .content > .access-log-page,
  .layout .main > .content > .access-log-results,
  .layout .main > .content > .qlm-approvals-page,
  .layout .main > .content > .hr-payroll-batch-page,
  .layout .main > .content > .treasury-salary-payments {
    max-width: none;
    margin-inline: 0;
  }

  .layout .main > .content > .patient-consents-page.consent-host-emr:not(.consent-record-page) {
    width: 100%;
    margin-inline: 0;
  }

  /* The calendar owns its gutters; avoid padding it a second time. */
  .layout .main > .content.content-calendar {
    padding: 0;
  }

  /* Card edges align with subsequent cards/results. Bound individual controls
     inside the card, rather than narrowing the card itself. */
  .layout .main > .content .pricelist-batch-upload-card,
  .layout .main > .content .insurance-pricelist-filter-card,
  .layout .main > .content .access-log-filter-card,
  .layout .main > .content .salary-payment-filter-card {
    max-width: none;
  }
}