/* CHKiosk – geteilte Schriften, Post-it-Farben & Bildfilter fürs Schwarze Brett.
   Klassen-/Variablennamen entsprechen den `key`s aus server/pinboard.js
   (FONTS / COLORS / FILTERS) und werden von Display UND Handy-Seite genutzt. */

@font-face {
  font-family: 'Permanent Marker';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/permanent-marker.woff2') format('woff2');
}
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/caveat.woff2') format('woff2');
}
@font-face {
  font-family: 'Patrick Hand';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/patrick-hand.woff2') format('woff2');
}
@font-face {
  font-family: 'Special Elite';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/special-elite.woff2') format('woff2');
}

/* Schriftarten (Notiz-Text) */
.pbf-marker { font-family: 'Permanent Marker', cursive; }
.pbf-hand { font-family: 'Caveat', cursive; font-weight: 600; }
.pbf-neat { font-family: 'Patrick Hand', cursive; }
.pbf-type { font-family: 'Special Elite', 'Courier New', monospace; }
.pbf-clean { font-family: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif; }

/* Post-it-Farben (Hintergrund + dunklere Kante für Schatten/Falz) */
:root {
  --pbc-yellow: #fde68a; --pbe-yellow: #eab308;
  --pbc-pink: #fbcfe8; --pbe-pink: #ec4899;
  --pbc-blue: #bfdbfe; --pbe-blue: #3b82f6;
  --pbc-green: #bbf7d0; --pbe-green: #22c55e;
  --pbc-orange: #fed7aa; --pbe-orange: #f97316;
  --pbc-purple: #e9d5ff; --pbe-purple: #a855f7;
}
.pbc-yellow { background: var(--pbc-yellow); }
.pbc-pink { background: var(--pbc-pink); }
.pbc-blue { background: var(--pbc-blue); }
.pbc-green { background: var(--pbc-green); }
.pbc-orange { background: var(--pbc-orange); }
.pbc-purple { background: var(--pbc-purple); }

/* Bildfilter */
.pbflt-none { filter: none; }
.pbflt-grayscale { filter: grayscale(1); }
.pbflt-sepia { filter: sepia(0.75); }
.pbflt-warm { filter: sepia(0.35) saturate(1.4) hue-rotate(-10deg) brightness(1.03); }
.pbflt-cool { filter: saturate(1.1) hue-rotate(15deg) brightness(1.02); }
.pbflt-contrast { filter: contrast(1.3) saturate(1.2); }
.pbflt-polaroid { filter: sepia(0.15) contrast(1.05) brightness(1.02); }