/*
Theme Name: akmaker Werkbank
Template: twentytwentyfive
Description: Gestaltung fuer akmaker.de: Farben aus dem akmaker-Logo (Holz, Karamell, Creme, Sechseck), aufgebaut wie eine Werkstattzeichnung mit Masslinien, Stueckliste und Schriftfeld. Die Werkzeuge stehen auf der Startseite und funktionieren dort.
Version: 0.2.0
*/

/* ============================================================
   Schriften — als Dateien mitgeliefert (keine Anfrage an Google).
   Archivo (variabel in Breite und Staerke) und IBM Plex Mono,
   beide SIL Open Font License 1.1; bezogen ueber Fontsource.
   ============================================================ */
@font-face {
  font-family: "Archivo Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url("schriften/archivo-latin-wdth-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2212;
}
@font-face {
  font-family: "Archivo Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  src: url("schriften/archivo-latin-ext-wdth-normal.woff2") format("woff2-variations");
  unicode-range: U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("schriften/ibm-plex-mono-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2212;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("schriften/ibm-plex-mono-latin-ext-400-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url("schriften/ibm-plex-mono-latin-500-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2212;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url("schriften/ibm-plex-mono-latin-ext-500-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url("schriften/ibm-plex-mono-latin-600-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+2074,U+20AC,U+2212;
}
@font-face {
  font-family: "IBM Plex Mono";
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url("schriften/ibm-plex-mono-latin-ext-600-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+1E00-1EFF,U+2020,U+20A0-20AB;
}

/* ============================================================
   Farben — alle aus dem akmaker-Logo gemessen (Pixelzaehlung am
   Logo, 24.09.2026), nicht geschaetzt:
     Umriss/Tusche #3d382c · Sechseck #4c4739 · Creme #ecdbc1
     Sand #dec098 · helles Holz #e1b67e · Karamell #bb7d47
     Holzbraun #a36d3f
   Direkt uebernommen: ink, sand, line, signal, nacht, nacht-text, holz.
   Abgeleitet (sonst zu wenig Kontrast fuer Text): paper (Creme
   aufgehellt), accent/accent-strong/accent-text (Holzbraun abgedunkelt).

   Die NAMEN (ink, paper, muted, line, accent, surface …) bleiben, weil
   Seiteninhalte und die Werkzeuge der Seite sie ansprechen.
   Neu: holz — helles Holz als Akzent auf der Sechseck-Flaeche (nacht).

   Kontraste (WCAG-Formel nachgerechnet, 24.09.2026):
   hell   ink/paper 9,95:1 · ink/sand 8,59:1 · muted/paper 6,54:1
          muted/sand 5,64:1 · accent/paper 5,00:1 · accent-text/paper 5,76:1
          accent-text/sand 4,97:1 · paper auf accent-strong 6,96:1
          (Knoepfe Pool-Rechner, Flasher, Kalkulator) · paper auf accent 5,00:1
          auf-akzent auf signal 5,01:1 · nacht-text/nacht 6,82:1
          holz/nacht 4,94:1 · input-border/paper 3,56:1
   dunkel ink/paper 12,65:1 · muted/paper 8,38:1 · muted/sand 5,69:1
          accent-text/paper 9,15:1 · paper auf accent-strong 9,89:1
          paper auf accent 9,15:1 · auf-akzent auf signal 5,02:1
          nacht-text/nacht 13,79:1 · holz/nacht 9,98:1 · input-border/paper 5,15:1
   ============================================================ */
:root {
  color-scheme: light;
    --wp--preset--color--ink: #3d382c;
    --wp--preset--color--paper: #f5ecdc;
    --wp--preset--color--muted: #5c5242;
    --wp--preset--color--line: #dec098;
    --wp--preset--color--accent: #8a5a2f;
    --wp--preset--color--accent-strong: #6f4622;
    --wp--preset--color--accent-text: #7f5129;
    --wp--preset--color--sand: #ecdbc1;
    --wp--preset--color--surface: #fbf6ec;
    --wp--preset--color--surface-2: #fffaf2;
    --wp--preset--color--signal: #bb7d47;
    --wp--preset--color--auf-akzent: #1f1b14;
    --wp--preset--color--input-border: #8a7a60;
    --wp--preset--color--focus: #7f5129;
    --wp--preset--color--form-error: #b30018;
    --wp--preset--color--notice-warn-bg: #f8e3c4;
    --wp--preset--color--notice-warn-border: #c69356;
    --wp--preset--color--nacht: #4c4739;
    --wp--preset--color--nacht-text: #ecdbc1;
    --wp--preset--color--holz: #e1b67e;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
      --wp--preset--color--ink: #ecdbc1;
      --wp--preset--color--paper: #1e1b15;
      --wp--preset--color--muted: #c4b397;
      --wp--preset--color--line: #4c4739;
      --wp--preset--color--accent: #e1b67e;
      --wp--preset--color--accent-strong: #dec098;
      --wp--preset--color--accent-text: #e1b67e;
      --wp--preset--color--sand: #3d382c;
      --wp--preset--color--surface: #28241c;
      --wp--preset--color--surface-2: #312c23;
      --wp--preset--color--signal: #bb7d47;
      --wp--preset--color--auf-akzent: #1e1b15;
      --wp--preset--color--input-border: #9a8b70;
      --wp--preset--color--focus: #e1b67e;
      --wp--preset--color--form-error: #ff8a75;
      --wp--preset--color--notice-warn-bg: #3a2c17;
      --wp--preset--color--notice-warn-border: #c69356;
      --wp--preset--color--nacht: #14120d;
      --wp--preset--color--nacht-text: #ecdbc1;
      --wp--preset--color--holz: #e1b67e;
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
    --wp--preset--color--ink: #ecdbc1;
    --wp--preset--color--paper: #1e1b15;
    --wp--preset--color--muted: #c4b397;
    --wp--preset--color--line: #4c4739;
    --wp--preset--color--accent: #e1b67e;
    --wp--preset--color--accent-strong: #dec098;
    --wp--preset--color--accent-text: #e1b67e;
    --wp--preset--color--sand: #3d382c;
    --wp--preset--color--surface: #28241c;
    --wp--preset--color--surface-2: #312c23;
    --wp--preset--color--signal: #bb7d47;
    --wp--preset--color--auf-akzent: #1e1b15;
    --wp--preset--color--input-border: #9a8b70;
    --wp--preset--color--focus: #e1b67e;
    --wp--preset--color--form-error: #ff8a75;
    --wp--preset--color--notice-warn-bg: #3a2c17;
    --wp--preset--color--notice-warn-border: #c69356;
    --wp--preset--color--nacht: #14120d;
    --wp--preset--color--nacht-text: #ecdbc1;
    --wp--preset--color--holz: #e1b67e;
}

/* Umschalter hell/dunkel — der Knopf wird von theme-umschalter.js
   neben die Navigation gesetzt. */
.theme-toggle {
  align-items: center;
  align-self: center;
  background: none;
  border: 2px solid var(--wp--preset--color--ink);
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  flex: 0 0 auto;
  font: inherit;
  height: 44px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 44px;
}
.theme-toggle:hover { background: var(--wp--preset--color--sand); }
.theme-toggle .icon-dark { display: none; }
:root[data-theme="dark"] .theme-toggle .icon-dark { display: inline; }
:root[data-theme="dark"] .theme-toggle .icon-hell { display: none; }
/* Dieselbe Bedingung wie die dunkle Palette oben — sonst zeigt der Knopf
   bei dunkler SYSTEMeinstellung das falsche Symbol (Falle vom 28.08.2026). */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .theme-toggle .icon-dark { display: inline; }
  :root:not([data-theme="light"]) .theme-toggle .icon-hell { display: none; }
}

/* Tastatur-Fokus sichtbar machen: Das Eltern-Theme setzt einen Rahmen
   ohne Farbe — in der dunklen Ansicht war er unsichtbar (28.08.2026). */
:where(.wp-site-blocks :focus-visible),
:root :where(.wp-element-button:focus-visible),
:root :where(.wp-block-button__link:focus-visible) {
  outline: 2px solid var(--wp--preset--color--focus);
  outline-offset: 2px;
}

code, kbd, samp, pre {
  overflow-wrap: anywhere;
  word-break: break-word;
}
pre { overflow-x: auto; }