/* PRABA accessibility text scaling — STAGING v2.4.0 */ html { font-size: 100%; -webkit-text-size-adjust: auto; text-size-adjust: auto; } /* On Apple browsers/WebViews, use the system body text metric so the operating system's Larger Text preference can participate in sizing. */ @supports (font: -apple-system-body) { html { font: -apple-system-body; } } body { overflow-wrap: break-word; word-break: normal; } button, input, select, textarea { max-width: 100%; } button { white-space: normal; } .praba-text-size-control { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 0.375rem; margin: 0 0 0.75rem; padding: 0.5rem 0.625rem; border: 1px solid var(--input-border, rgba(0, 0, 0, 0.12)); border-radius: 0.75rem; background: var(--card-bg, #fff); color: var(--text-main, #222); box-shadow: var(--shadow-soft, 0 2px 8px rgba(0, 0, 0, 0.06)); } .praba-text-size-label { margin-right: 0.125rem; font-size: 0.8125rem; font-weight: 700; color: var(--text-muted, #667); } .praba-text-size-button { min-height: 2.5rem; padding: 0.45rem 0.75rem; border: 1px solid var(--input-border, #ccc); border-radius: 999px; background: var(--button-secondary-bg, var(--button-secondary, #eef1ec)); color: var(--button-secondary-text, var(--text-main, #222)); font-size: 0.875rem; font-weight: 700; line-height: 1.25; cursor: pointer; } .praba-text-size-button[aria-pressed="true"] { border-color: var(--nav-active-bg, #222); background: var(--nav-active-bg, #222); color: var(--nav-active-text, #fff); } .praba-text-size-button:focus-visible { outline: 0.1875rem solid var(--focus-ring, rgba(34, 34, 34, 0.22)); outline-offset: 0.125rem; } /* Let dense controls wrap instead of clipping when text is enlarged. */ html[data-praba-text-size="large"] .button-row, html[data-praba-text-size="xlarge"] .button-row, html[data-praba-text-size="large"] .record-actions, html[data-praba-text-size="xlarge"] .record-actions, html[data-praba-text-size="large"] .today-schedule-actions, html[data-praba-text-size="xlarge"] .today-schedule-actions { flex-wrap: wrap; } html[data-praba-text-size="xlarge"] .dynamic-field-grid, html[data-praba-text-size="xlarge"] .record-field-grid, html[data-praba-text-size="xlarge"] .form-grid, html[data-praba-text-size="xlarge"] .profile-grid { grid-template-columns: minmax(0, 1fr) !important; } @media (max-width: 480px) { .praba-text-size-control { justify-content: flex-start; } .praba-text-size-label { flex-basis: 100%; } .praba-text-size-button { flex: 1 1 auto; } }