/* LightMapr - eigenstaendige Seiten (Infoseite, Impressum/Datenschutz als Seite). Farben und Eingabefelder kommen aus app.css (hell/dunkel). */

body.pp-page {
  height: auto;
  min-height: 100%;
  margin: 0;
  font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  color: var(--text);
  background: var(--bg);
  -webkit-text-size-adjust: 100%;
  display: flex;
  flex-direction: column;
}
.pp-page-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));
  background: var(--panel-solid); border-bottom: 1px solid var(--line);
}
.pp-page-brand { display: inline-flex; align-items: center; gap: 8px; font-weight: 650; font-size: 18px; color: var(--text); text-decoration: none; }
.pp-page-nav { display: flex; gap: 6px 18px; flex-wrap: wrap; }
.pp-page-nav a, .pp-page-foot a, .pp-info a:not(.pp-cta) { color: var(--accent); }
.pp-page-main { flex: 1 0 auto; width: 100%; max-width: 780px; margin: 0 auto; padding: 22px 16px 36px; box-sizing: border-box; }
.pp-page-title { font-size: 26px; line-height: 1.25; margin: 6px 0 12px; }
.pp-lead { font-size: 18px; line-height: 1.55; margin: 0 0 14px; }
.pp-cta {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 22px; border-radius: var(--radius);
  background: var(--accent); color: var(--accent-text); font-weight: 600; text-decoration: none;
}
.pp-cta:hover { filter: brightness(1.08); }
.pp-info section { margin-top: 28px; }
.pp-info h2 { font-size: 21px; line-height: 1.3; margin: 0 0 8px; }
.pp-info h3 { font-size: 16px; margin: 16px 0 4px; color: var(--muted); font-weight: 600; }
.pp-info p, .pp-info li { max-width: 68ch; }
.pp-info ul { padding-left: 1.2em; margin: 6px 0; }
.pp-info li { margin: 6px 0; }
.pp-info-dl { margin: 6px 0; }
.pp-info-dl dt { font-weight: 650; margin-top: 12px; }
.pp-info-dl dd { margin: 2px 0 0; color: var(--text); max-width: 68ch; }
.pp-page-foot { flex: none; padding: 14px 16px calc(14px + env(safe-area-inset-bottom)); text-align: center; font-size: 14px; color: var(--muted); border-top: 1px solid var(--line); background: var(--panel-solid); }

/* Impressum/Datenschutz als Seite: dieselben Abschnitte wie im Dialog, ohne dessen Innenabstand */
.pp-page-legal .pp-legal-nav { margin: 0 0 8px; border: 1px solid var(--line); border-radius: 8px; position: static; }
.pp-page-legal .pp-legal-sec { scroll-margin-top: 12px; }
@media (min-width: 640px) { .pp-page-title { font-size: 30px; } }