/* KB#3770: document foreground only. Canvas, ambient layers, cards, controls,
 * navigation and footer keep their existing paint and behavior in main.css. */
#main.pn-legal {
  --pn-document-title: 2rem;
  --pn-document-subheading: 1.25rem;
  --pn-document-measure: 48rem;
  color: var(--text);
  font: 400 var(--pn-type-body)/1.65 var(--pn-font-ui);
  letter-spacing: 0;
}

#main.pn-legal > .hero { padding: var(--pn-space-6) var(--pn-space-5); }

/* The inherited background is a glyph clip, not page or card surface paint. */
#main.pn-legal h1 {
  color: var(--text);
  background-image: none;
  -webkit-text-fill-color: currentColor;
  font-family: inherit;
  font-size: var(--pn-document-title);
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: 0;
  overflow-wrap: anywhere;
  margin-bottom: var(--pn-space-3);
}

#main.pn-legal .subtitle {
  color: var(--text-secondary);
  font-size: var(--pn-type-body);
  line-height: 1.5;
  margin-bottom: 0;
}

/* Translations replace card contents, so use stable semantic descendants. */
#main.pn-legal .card > :is(h2, h3, p, ul, ol, pre, table, .table-scroll) {
  max-inline-size: var(--pn-document-measure);
  margin-inline: auto;
}

#main.pn-legal .card :is(h2, h3) {
  color: var(--text);
  font-family: inherit;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0;
  overflow-wrap: anywhere;
  margin-bottom: var(--pn-space-3);
}

#main.pn-legal .card h2 { font-size: var(--pn-type-block); }
#main.pn-legal .card h3 { font-size: var(--pn-document-subheading); }
#main.pn-legal .card :is(h2, h3):not(:first-child) { margin-top: var(--pn-space-6); }

#main.pn-legal .card :is(p, ul, ol) {
  margin-bottom: var(--pn-space-4);
  overflow-wrap: anywhere;
}

#main.pn-legal .card :is(ul, ol) { padding-inline-start: var(--pn-space-5); }
#main.pn-legal .card li + li { margin-top: var(--pn-space-1); }
#main.pn-legal .card .text-note { color: var(--text-secondary); font-size: var(--pn-type-body); }

#main.pn-legal .card a:not(.btn),
#main.pn-legal .breadcrumb-nav a {
  color: var(--text);
  text-decoration: underline;
  text-underline-offset: var(--pn-space-1);
  overflow-wrap: anywhere;
}

#main.pn-legal .breadcrumb-nav { color: var(--text-secondary); }
#main.pn-legal .breadcrumb li,
#main.pn-legal .breadcrumb li + li::before { color: var(--text-secondary); }
#main.pn-legal .breadcrumb-nav a {
  display: inline-flex;
  align-items: center;
  min-block-size: var(--pn-target-min);
}

#main.pn-legal .card code { color: var(--text); overflow-wrap: anywhere; }
#main.pn-legal .card table { font-size: var(--pn-type-body); line-height: 1.5; }
#main.pn-legal .card th {
  color: var(--text-secondary);
  font: 500 var(--pn-type-body)/1.5 var(--pn-font-ui);
  letter-spacing: 0;
  text-transform: none;
}
#main.pn-legal .card td { color: var(--text); font: inherit; }
#main.pn-legal .card :is(th, td) {
  min-inline-size: calc(var(--pn-space-6) * 4);
  overflow-wrap: anywhere;
}

/* Existing translated markup can hardcode left alignment. */
[dir="rtl"] #main.pn-legal .card :is(th, td) { text-align: start !important; }
[dir="rtl"] #main.pn-legal .legal-table :is(th, td) { padding-inline: var(--pn-space-4); }
[dir="rtl"] #main.pn-legal .legal-table :is(th, td):first-child { padding-inline-start: 0; }
[dir="rtl"] #main.pn-legal .legal-table :is(th, td):last-child { padding-inline-end: 0; }

/* Legal translations may return a bare table without the English class.
 * Keep columns readable in its own scrollport instead of crushing each word. */
#main.pn-legal .card > table {
  display: block;
  max-inline-size: 100%;
  overflow-x: auto;
}

#main.pn-legal :focus-visible {
  outline: var(--pn-outline-width) solid var(--text);
  outline-offset: var(--pn-outline-width);
}

@media (max-width: 520px) {
  #main.pn-legal { --pn-document-title: 1.75rem; }
  #main.pn-legal > .hero { padding: var(--pn-space-2) var(--pn-space-4); }
  #main.pn-legal .breadcrumb-nav { padding-block: 0; margin-bottom: 0; }
  #main.pn-legal .breadcrumb { flex-wrap: nowrap; }
  #main.pn-legal .breadcrumb li:first-child { flex: none; }
  #main.pn-legal .breadcrumb li[aria-current] { min-inline-size: 0; }
}

@media (max-width: 380px) {
  #main.pn-legal { --pn-document-title: 1.5rem; }
  #main.pn-legal h1 { font-weight: 700; line-height: 1.2; }
  #main.pn-legal > .hero { padding-block-start: 0; padding-inline: var(--pn-space-2); }
}