/*
 * Shared readability contract for authenticated business surfaces.
 *
 * Backend modules have accumulated many local component scales. This layer is
 * intentionally loaded last by both internal shells so metadata never falls
 * below a readable floor and page headers cannot consume the working canvas.
 * Public/marketing websites do not load this file.
 */

body[data-peopleos-chrome="1"] {
  --blr-readable-caption: .75rem;
  --blr-readable-control: .8125rem;
  --blr-readable-body: .875rem;
  --blr-readable-title: 1.5rem;
  --blr-readable-title-mobile: 1.25rem;
  --blr-readable-leading: 1.45;
}

/* Semantic text floors cover the common server-rendered surfaces immediately. */
body[data-peopleos-chrome="1"] :where(.main, main, [data-shell-page-region])
  :where(label, legend, caption, th, dt, .kicker, .eyebrow, .grouptitle,
    [class*="-kicker"], [class*="-eyebrow"], [class*="-caption"],
    [class*="-meta"], [class*="-hint"]) {
  font-size: var(--blr-readable-caption) !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
}

body[data-peopleos-chrome="1"] :where(.main, main, [data-shell-page-region])
  :where(p, li, td, dd, input, select, textarea) {
  font-size: var(--blr-readable-body) !important;
  line-height: var(--blr-readable-leading);
}

body[data-peopleos-chrome="1"] :where(.main, main, [data-shell-page-region])
  :where(button, .btn, .button, [role="button"], nav a, [class*="-nav"] > a,
    [class*="-tabs"] > a, [class*="-actions"] > a) {
  font-size: var(--blr-readable-control) !important;
  line-height: 1.35;
}

body[data-peopleos-chrome="1"] :where(.main, main, [data-shell-page-region]) small {
  font-size: max(var(--blr-readable-caption), .875em) !important;
  line-height: 1.4;
}

/* The companion runtime adds this class only when a legacy leaf is actually
 * computed below 12px. Larger local typography remains untouched. */
body[data-peopleos-chrome="1"] .blr-readable-floor {
  font-size: var(--blr-readable-caption) !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
}

body[data-peopleos-chrome="1"] .blr-readable-control-floor {
  font-size: var(--blr-readable-control) !important;
  line-height: 1.35 !important;
}

/* Shell navigation remains compact, but not microscopic. */
body[data-peopleos-chrome="1"] :where(
  .hx-mega-top, .hx-mega-item b, .hx-context-brand b, .hx-search input,
  .hx-process-code, .hx-process-copy b, .hx-process-actions > a,
  .hx-proc-menu > summary, .hx-proc-tools > a, .hx-object-nav a,
  .hx-module-tabs a, .hx-work-tabs a, .hx-form-tabs button,
  .hx-table-tools label, .hx-table-tools span
) {
  font-size: var(--blr-readable-control) !important;
  line-height: 1.35 !important;
}

body[data-peopleos-chrome="1"] :where(
  .hx-brand small, .hx-mega-item small, .hx-mega-head small,
  .hx-launch-head small, .hx-launch-item small, .hx-context-brand small,
  .hx-process-copy small, .hx-system-reference-compact small,
  .fpro-object-facts small, .fpro-catalog-tabs small,
  .hx-module-summary-grid span
) {
  font-size: var(--blr-readable-caption) !important;
  line-height: 1.35 !important;
}

/* Compact page headers. This list names the top-level business header families
 * used by module, object, report, process, role, finance, commerce and smart-op
 * pages. It deliberately does not target nested cards or public-site heroes. */
body.erp-pro-body :where(
  .sa-hero, .rs-hero, .rs-atlas-hero, .hx-work-hero, .hx-native-head,
  .b2bc-hero, .payops-hero, .qw-hero, .bgw-hero, .osw-hero,
  .cerp-pagebar, .fpro-head, .fpro-object-pagebar, .fpro-report-pagebar,
  .hx-erp-pagebar, .hx-tx-detail-hero, .hx-hero.cool, .hx-rpt-hero,
  .hx-chart-gallery-hero, .hx-pe-hero, .hx-pe-process-hero,
  .hx-nc-hero, .hx-nc-detail-hero, .ps-hero, .pv-hero, .pw-hero,
  .hwl-hero, .hwl-detail-hero, .sxa-hero, .sxc-hero, .fdc-hero,
  .so-app-hero, .so-hero, .rc-role-hero, .rc-matrix-hero,
  .cxm-hero, .scw-hero, .payops-hero, .hx-log-hero
) {
  min-height: 0 !important;
  padding: 14px 16px !important;
  gap: 12px !important;
  border-radius: 8px !important;
}

body.erp-pro-body :where(
  .sa-hero, .rs-hero, .rs-atlas-hero, .hx-work-hero, .hx-native-head,
  .b2bc-hero, .payops-hero, .qw-hero, .bgw-hero, .osw-hero,
  .cerp-pagebar, .fpro-head, .fpro-object-pagebar, .fpro-report-pagebar,
  .hx-erp-pagebar, .hx-tx-detail-hero, .hx-hero.cool, .hx-rpt-hero,
  .hx-chart-gallery-hero, .hx-pe-hero, .hx-pe-process-hero,
  .hx-nc-hero, .hx-nc-detail-hero, .ps-hero, .pv-hero, .pw-hero,
  .hwl-hero, .hwl-detail-hero, .sxa-hero, .sxc-hero, .fdc-hero,
  .so-app-hero, .so-hero, .rc-role-hero, .rc-matrix-hero,
  .cxm-hero, .scw-hero, .hx-log-hero
) h1 {
  width: 100%;
  max-width: 100% !important;
  margin-block: 3px !important;
  overflow: hidden;
  color: inherit;
  font-size: var(--blr-readable-title) !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

body.erp-pro-body :where(
  .sa-hero, .rs-hero, .rs-atlas-hero, .hx-work-hero, .hx-native-head,
  .b2bc-hero, .payops-hero, .qw-hero, .bgw-hero, .osw-hero,
  .cerp-pagebar, .fpro-head, .fpro-object-pagebar, .fpro-report-pagebar,
  .hx-erp-pagebar, .hx-tx-detail-hero, .hx-hero.cool, .hx-rpt-hero,
  .hx-chart-gallery-hero, .hx-pe-hero, .hx-pe-process-hero,
  .hx-nc-hero, .hx-nc-detail-hero, .ps-hero, .pv-hero, .pw-hero,
  .hwl-hero, .hwl-detail-hero, .sxa-hero, .sxc-hero, .fdc-hero,
  .so-app-hero, .so-hero, .rc-role-hero, .rc-matrix-hero,
  .cxm-hero, .scw-hero, .hx-log-hero
) p {
  display: block;
  max-width: 100% !important;
  margin-block: 3px !important;
  overflow: hidden;
  font-size: var(--blr-readable-body) !important;
  line-height: 1.4 !important;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

body.erp-pro-body :where(
  .sa-hero, .b2bc-hero, .payops-hero, .qw-hero, .bgw-hero,
  .osw-hero, .hx-work-hero, .so-app-hero, .fdc-hero
) > [aria-hidden="true"] {
  display: none !important;
}

body.erp-pro-body .hx-work-role-contract {
  display: none !important;
}

body.erp-pro-body :where(.b2bc-proof, .qw-proof, .bgw-proof) {
  display: none !important;
}

/* Marketing automation, social activation, and BLR content silos predate the
 * common hero names above but serve the same page-header role. */
body.erp-pro-body :where(.ma-hero, .hx-silo-hero) {
  grid-template-columns: minmax(0, 1fr) !important;
  min-height: 0 !important;
  padding: 14px 16px !important;
  gap: 12px !important;
  border-radius: 8px !important;
}

body.erp-pro-body :where(.ma-hero, .hx-silo-hero) h1 {
  width: 100%;
  max-width: 100% !important;
  margin-block: 3px !important;
  overflow: hidden;
  font-size: var(--blr-readable-title) !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

body.erp-pro-body :where(.ma-hero, .hx-silo-hero) p {
  max-width: 100% !important;
  margin-block: 3px !important;
  overflow: hidden;
  font-size: var(--blr-readable-body) !important;
  line-height: 1.4 !important;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

body.erp-pro-body :where(.ma-hero, .hx-silo-hero) > [aria-hidden="true"] {
  display: none !important;
}

body.erp-pro-body :where(.esg-hero, .dai-hero, .hx-cyber-hero) {
  min-height: 0 !important;
  padding: 14px 16px !important;
  gap: 12px !important;
  border-radius: 8px !important;
}

body.erp-pro-body :where(.esg-hero, .dai-hero, .hx-cyber-hero) h1,
body.erp-pro-body .main > h1 {
  width: 100%;
  max-width: 100% !important;
  margin-block: 3px !important;
  overflow: hidden;
  font-size: var(--blr-readable-title) !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

body.erp-pro-body :where(.esg-hero, .dai-hero, .hx-cyber-hero) p {
  max-width: 100% !important;
  margin-block: 3px !important;
  overflow: hidden;
  font-size: var(--blr-readable-body) !important;
  line-height: 1.4 !important;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}

body.erp-pro-body :where(.esg-hero, .dai-hero, .hx-cyber-hero) > [aria-hidden="true"] {
  display: none !important;
}

body.erp-pro-body :where(.sa-hero-actions, .b2bc-hero-actions, .payops-actions,
  .hx-work-hero .actions, .qw-actions, .bgw-actions, .osw-actions) {
  flex-wrap: nowrap !important;
  gap: 6px !important;
  margin-top: 7px !important;
  overflow-x: auto;
  scrollbar-width: none;
}

body.erp-pro-body .rs-hero > aside {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 6px;
}

body.erp-pro-body .rs-hero > aside > span {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.erp-pro-body .rs-hero-stats {
  flex-wrap: nowrap;
  margin-top: 6px;
  overflow-x: auto;
  scrollbar-width: none;
}

body.erp-pro-body .hx-native-identity h1 small {
  display: none !important;
}

body.erp-pro-body .hx-native-identity h1 > i {
  width: 34px;
  height: 34px;
  border-radius: 7px;
}

body.erp-pro-body .hx-native-scope {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 6px;
}

/* Adapted HRMS/legacy pages use a separate shell but share the same contract. */
body[data-peopleos-chrome="1"] .pos-adapt .pos-adapt-pagehead {
  min-height: 0;
  margin: 10px 0 4px;
  padding: 12px 16px;
  border-radius: 8px;
}

body[data-peopleos-chrome="1"] .pos-adapt .pos-adapt-pagehead h1 {
  max-width: 100%;
  margin: 3px 0 0;
  overflow: hidden;
  font-size: var(--blr-readable-title) !important;
  line-height: 1.2;
  letter-spacing: 0;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-peopleos-chrome="1"] .pos-adapt .pos-adapt-pagehead p {
  max-width: 100%;
  margin-top: 3px;
  overflow: hidden;
  font-size: var(--blr-readable-body) !important;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body[data-peopleos-chrome="1"] .pos-adapt.pos-adapt table {
  font-size: var(--blr-readable-body);
}

body[data-peopleos-chrome="1"] .pos-adapt.pos-adapt table th {
  font-size: var(--blr-readable-caption) !important;
}

body[data-peopleos-chrome="1"] .pos-adapt :where(label, .form-label, .field-label,
  .pmx-label, .pmo-label, legend) {
  font-size: var(--blr-readable-control) !important;
  letter-spacing: 0;
}

@media (max-width: 760px) {
  body.erp-pro-body :where(
    .sa-hero, .rs-hero, .rs-atlas-hero, .hx-work-hero, .hx-native-head,
    .b2bc-hero, .payops-hero, .qw-hero, .bgw-hero, .osw-hero,
    .cerp-pagebar, .fpro-head, .fpro-object-pagebar, .fpro-report-pagebar,
    .hx-erp-pagebar, .hx-tx-detail-hero, .hx-hero.cool, .hx-rpt-hero,
    .hx-chart-gallery-hero, .hx-pe-hero, .hx-pe-process-hero,
    .hx-nc-hero, .hx-nc-detail-hero, .ps-hero, .pv-hero, .pw-hero,
    .hwl-hero, .hwl-detail-hero, .sxa-hero, .sxc-hero, .fdc-hero,
    .so-app-hero, .so-hero, .rc-role-hero, .rc-matrix-hero,
    .cxm-hero, .scw-hero, .hx-log-hero
  ) {
    grid-template-columns: minmax(0, 1fr) !important;
    padding: 11px 12px !important;
  }

  body.erp-pro-body :where(
    .sa-hero, .rs-hero, .rs-atlas-hero, .hx-work-hero, .hx-native-head,
    .b2bc-hero, .payops-hero, .qw-hero, .bgw-hero, .osw-hero,
    .cerp-pagebar, .fpro-head, .fpro-object-pagebar, .fpro-report-pagebar,
    .hx-erp-pagebar, .hx-tx-detail-hero, .hx-hero.cool, .hx-rpt-hero,
    .hx-chart-gallery-hero, .hx-pe-hero, .hx-pe-process-hero,
    .hx-nc-hero, .hx-nc-detail-hero, .ps-hero, .pv-hero, .pw-hero,
    .hwl-hero, .hwl-detail-hero, .sxa-hero, .sxc-hero, .fdc-hero,
    .so-app-hero, .so-hero, .rc-role-hero, .rc-matrix-hero,
    .cxm-hero, .scw-hero, .hx-log-hero
  ) h1 {
    font-size: var(--blr-readable-title-mobile) !important;
  }

  body.erp-pro-body :where(.rs-hero > aside, .hx-native-scope) {
    display: none !important;
  }

  body[data-peopleos-chrome="1"] :where(.hx-module-tabs, .hx-work-tabs,
    .hx-object-nav, .rs-surface-strip, .rs-role-strip, [class*="-nav"]) {
    flex-wrap: nowrap !important;
    overflow-x: auto;
    scrollbar-width: none;
  }
}