/* Design wie piehberz-it.de (WordPress-Theme "Twenty Twenty-Four" mit eigener Palette).
   Schriften liegen lokal unter assets/fonts (SIL Open Font License), kein Nachladen von Google. */
@font-face { font-family: "Inter"; src: url("fonts/inter-variable.woff2") format("woff2");
             font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Cardo"; src: url("fonts/cardo-400.woff2") format("woff2");
             font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Cardo"; src: url("fonts/cardo-400-italic.woff2") format("woff2");
             font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "Cardo"; src: url("fonts/cardo-700.woff2") format("woff2");
             font-weight: 700; font-style: normal; font-display: swap; }

/* Farbpalette der Website */
:root {
  --pb-akzent-blau: #003b5c;     /* custom-akzent-blau */
  --pb-markenfarbe: #00adee;     /* custom-markenfarbe */
  --pb-grafik: #37b6e2;          /* custom-grafik */
  --pb-hintergrund: #e6f4fa;     /* custom-hintergrund */
  --pb-text: #0f172a;            /* custom-textfarbe */

  --md-text-font: "Inter";
  --md-code-font: ui-monospace, SFMono-Regular, Consolas, monospace;
}

[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--pb-markenfarbe);   /* Kopfzeile in der Markenfarbe */
  --md-primary-fg-color--light: var(--pb-grafik);
  --md-primary-fg-color--dark: var(--pb-akzent-blau);
  --md-primary-bg-color: #ffffff;
  --md-accent-fg-color: var(--pb-markenfarbe);
  --md-accent-fg-color--transparent: rgba(0, 173, 238, 0.1);
  --md-default-bg-color: var(--pb-hintergrund);
  --md-default-fg-color: var(--pb-text);
  --md-typeset-color: var(--pb-text);
  --md-typeset-a-color: var(--pb-akzent-blau);
  --md-code-bg-color: #d6ecf6;
  --md-footer-bg-color: var(--pb-akzent-blau);
  --md-footer-bg-color--dark: #002a42;
}

[data-md-color-scheme="slate"] {
  --md-primary-fg-color: var(--pb-akzent-blau);
  --md-primary-fg-color--light: #0b5a85;
  --md-primary-fg-color--dark: #002a42;
  --md-accent-fg-color: var(--pb-grafik);
  --md-accent-fg-color--transparent: rgba(55, 182, 226, 0.1);
  --md-typeset-a-color: var(--pb-grafik);
  --md-footer-bg-color: #002a42;
}

/* Überschriften in Cardo wie auf der Website */
.md-typeset h1, .md-typeset h2, .md-typeset h3, .md-typeset h4 {
  font-family: "Cardo", Georgia, serif;
  font-weight: 400;
  line-height: 1.2;
}
.md-typeset h1, .md-typeset h2 { color: var(--md-typeset-color); }
.md-header__title { font-family: "Cardo", Georgia, serif; font-size: 1.05rem; }

/* Videos aus der Mediathek: volle Breite, nie über den Rand */
.md-typeset video {
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 6px;
  background: #000;
  margin: 0.8em 0;
}

/* Zitatblöcke als Hinweiskasten (wie bisher in BetterDocs) */
.md-typeset blockquote {
  border-left: 4px solid var(--md-primary-fg-color);
  background: var(--md-code-bg-color);
  color: var(--md-typeset-color);
  padding: 0.6em 1em;
  border-radius: 0 6px 6px 0;
}

/* Tabellen: lange Inhalte umbrechen */
.md-typeset table:not([class]) td {
  vertical-align: top;
}

/* Neuerungen: Etikett vor jedem Eintrag wie im Programm (neuerungen.md, Klasse an der Überschrift) */
.md-typeset h3.neu::before, .md-typeset h3.aenderung::before, .md-typeset h3.fix::before,
.md-typeset h3.update::before, .md-typeset h3.wichtig::before {
  display: inline-block;
  margin-right: 0.5em;
  padding: 0.1em 0.45em;
  border-radius: 3px;
  color: #fff;
  font-family: Arial, sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  vertical-align: middle;
}
.md-typeset h3.neu::before { content: "NEU"; background: #28a745; }
.md-typeset h3.aenderung::before { content: "ÄNDERUNG"; background: #6f42c1; }
.md-typeset h3.fix::before { content: "FIX"; background: #dc3545; }
.md-typeset h3.update::before { content: "UPDATE"; background: #007bff; }
.md-typeset h3.wichtig::before { content: "WICHTIG"; background: #b45309; }