/* Practice Toolbox Typography System (aligned with forum sizing) */

:root {
  --pt-font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --pt-font-size-base: 15px;
  --pt-line-height-base: 1.5;

  --pt-text-xs: 12px;
  --pt-text-sm: 13px;
  --pt-text-md: 15px;
  --pt-text-lg: 17px;

  --pt-h1: 28px;
  --pt-h2: 22px;
  --pt-h3: 18px;
  --pt-h4: 16px;

  --pt-type-page-title: clamp(1.6rem, 2.1vw, 1.95rem);
  --pt-type-section-title: 1.1rem;
  --pt-type-card-title: 1rem;
  --pt-type-body: 1rem;
  --pt-type-micro: 0.82rem;
  --pt-type-tooltip: 0.82rem;

  --pt-nav-text: 14px;
  --pt-card-title: 16px;
  --pt-muted: 13px;
  --pt-table: 14px;
  --pt-label: 13px;
  --pt-input: 14px;
  --pt-button: 14px;
}

html {
  font-size: var(--pt-font-size-base);
}

body {
  font-family: var(--pt-font-family);
  font-size: 1rem;
  line-height: var(--pt-line-height-base);
}

p, li, td, th, input, textarea, select, button {
  font-size: inherit;
  line-height: inherit;
}

small,
.text-muted,
.helptext,
.muted {
  font-size: var(--pt-muted);
}

h1, .h1 { font-size: var(--pt-h1); line-height: 1.15; }
h2, .h2 { font-size: var(--pt-h2); line-height: 1.2; }
h3, .h3 { font-size: var(--pt-h3); line-height: 1.25; }
h4, .h4 { font-size: var(--pt-h4); line-height: 1.3; }

/* Keep left app navigation typography tied to .app-sidebar to avoid collisions with module sidebars. */
.navbar, .app-sidebar, nav { font-size: var(--pt-nav-text); }
.card-title, .panel-title, .module-title { font-size: var(--pt-card-title); }
.card-text, .panel-body, .module-desc { font-size: var(--pt-text-md); }

table, .table { font-size: var(--pt-table); }
.table th { font-weight: 600; }

label, .form-label { font-size: var(--pt-label); }
.form-control, input, select, textarea { font-size: var(--pt-input); }
.form-text, .field-help, .errorlist { font-size: var(--pt-muted); }

.btn, button { font-size: var(--pt-button); }

.pt-text-xs { font-size: var(--pt-text-xs) !important; }
.pt-text-sm { font-size: var(--pt-text-sm) !important; }
.pt-text-md { font-size: var(--pt-text-md) !important; }
.pt-text-lg { font-size: var(--pt-text-lg) !important; }
.pt-muted { font-size: var(--pt-muted) !important; }
.pt-tight { line-height: 1.35 !important; }

/* Explicitly opt-in larger marketing typography */
.pt-display-lg { font-size: clamp(32px, 4vw, 42px) !important; line-height: 1.15 !important; }
.pt-display-md { font-size: clamp(26px, 3vw, 34px) !important; line-height: 1.2 !important; }