/* Photobox – "Darkroom" Theme
   Palette: Dunkelkammer-Schwarz + Safelight-Rot + warmes Fotopapier-Creme
   Signatur-Element: Filmstreifen mit Lochrand (Sprocket Holes) für Galerie-Karten
*/
@font-face {
  font-family: 'Marquee';
  src: local('Bebas Neue'), local('Oswald');
}

:root{
  --ink:#141216;
  --panel:#1e1a1e;
  --panel-2:#262127;
  --paper:#efe7da;
  --paper-dim:#d9d0c1;
  --safelight:#c1121f;
  --safelight-dim:#8c0d16;
  --flash:#fff8e7;
  --muted:#9c918d;
  --radius:14px;
  --shadow: 0 12px 30px rgba(0,0,0,.45);
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  background: radial-gradient(circle at 50% 0%, #201b20 0%, var(--ink) 60%);
  color: var(--paper);
  font-family: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
  min-height:100vh;
}

h1,h2,h3, .marquee{
  font-family: 'Oswald', 'Bebas Neue', 'Arial Narrow', sans-serif;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-weight: 600;
}

a{color: var(--paper);}

.container{max-width:1100px;margin:0 auto;padding:24px;}

/* Top bar with safelight glow */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 24px;border-bottom:1px solid #322a30;
  background: linear-gradient(180deg, rgba(193,18,31,.08), transparent);
}
.topbar .brand{font-size:1.1rem; letter-spacing:2px;}
.topbar .brand em{color:var(--safelight); font-style:normal;}

.btn{
  display:inline-block;
  padding:12px 22px;
  border-radius:8px;
  border:none;
  background:var(--safelight);
  color:#fff;
  font-weight:600;
  letter-spacing:.4px;
  cursor:pointer;
  text-decoration:none;
  font-size:1rem;
  transition: transform .12s ease, background .15s ease;
}
.btn:hover{background:var(--safelight-dim); transform: translateY(-1px);}
.btn.secondary{background:var(--panel-2); border:1px solid #3a323a;}
.btn.secondary:hover{background:#312a31;}
.btn.ghost{background:transparent;border:1px solid var(--muted); color:var(--paper);}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;}

.card{
  background:var(--panel);
  border:1px solid #2c262c;
  border-radius:var(--radius);
  padding:24px;
  box-shadow: var(--shadow);
}

label{display:block;font-size:.82rem;color:var(--muted);margin:12px 0 5px;letter-spacing:.3px;}
input,select,textarea{
  width:100%;padding:11px 13px;border-radius:7px;
  border:1px solid #3a323a;background:#0f0d10;color:var(--paper);font-size:.95rem;
}
input:focus,select:focus,textarea:focus{outline:2px solid var(--safelight);}

/* ---- Filmstrip / Sprocket hole gallery card (signature element) ---- */
.filmstrip{
  position:relative;
  background:#0c0a0d;
  border-radius:10px;
  padding:10px 18px;
  overflow:hidden;
}
.filmstrip::before, .filmstrip::after{
  content:"";
  position:absolute; top:0; bottom:0; width:14px;
  background-image: radial-gradient(circle, var(--ink) 3.5px, transparent 3.6px);
  background-size: 14px 22px;
  background-repeat: repeat-y;
  background-position: center;
}
.filmstrip::before{left:0;}
.filmstrip::after{right:0;}
.filmstrip img{display:block;width:100%;border-radius:4px;}

.photo-grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap:20px;
  margin-top:20px;
}
.photo-card{
  background:var(--panel);
  border-radius:12px;
  overflow:hidden;
  border:1px solid #2c262c;
  transition: transform .15s ease;
}
.photo-card:hover{transform: translateY(-3px);}
.photo-card img{width:100%;display:block;aspect-ratio:1/1;object-fit:cover;}
.photo-card video{width:100%;display:block;aspect-ratio:1/1;object-fit:cover;background:#000;}
.photo-card .meta{padding:10px 12px;font-size:.78rem;color:var(--muted);display:flex;justify-content:space-between;align-items:center;}
.photo-actions{display:flex;gap:6px;padding:0 12px 12px;}
.photo-actions button{flex:1;padding:7px;border-radius:6px;border:1px solid #3a323a;background:var(--panel-2);color:var(--paper);font-size:.75rem;cursor:pointer;}
.photo-actions button:hover{background:var(--panel);}
.photo-actions button.liked{background:rgba(193,18,31,.18); border-color:var(--safelight);}
.photo-actions button:disabled{opacity:.6;cursor:default;}
.pb-popover{
  position:relative; margin:0 12px 12px; padding:12px; background:var(--panel-2);
  border:1px solid #3a323a; border-radius:8px;
}
.pb-popover input{margin-top:6px;}

/* ---- Kiosk camera view ---- */
.kiosk-stage{
  max-width:720px;margin:0 auto;text-align:center;
}
.camera-frame{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  background:#000;
  aspect-ratio: 4/3;
  box-shadow: var(--shadow);
  border: 3px solid var(--panel-2);
}
.camera-frame video, .camera-frame canvas{
  width:100%;height:100%;object-fit:cover;display:block;
}
.countdown-overlay{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:8rem; font-family:'Oswald',sans-serif; color:var(--flash);
  text-shadow:0 0 40px rgba(0,0,0,.6);
  background:rgba(0,0,0,.15);
  pointer-events:none;
}
.flash-overlay{
  position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;
}
.flash-overlay.flashing{animation: flashpop .35s ease-out;}
@keyframes flashpop{ 0%{opacity:.95;} 100%{opacity:0;} }

.camera-start-overlay{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  background:rgba(10,8,12,.85); backdrop-filter: blur(2px);
}
.camera-start-btn{
  display:flex; flex-direction:column; align-items:center; gap:12px;
  background:var(--panel-2); border:2px solid var(--safelight); border-radius:16px;
  color:var(--paper); padding:28px 32px; font-size:1rem; font-weight:600; cursor:pointer;
  max-width:80%; text-align:center;
}
.camera-start-btn:hover{ background:var(--panel); }

.filter-strip{
  display:flex;gap:10px;overflow-x:auto;padding:16px 4px;justify-content:center;flex-wrap:wrap;
}
.filter-chip{
  padding:8px 16px;border-radius:20px;border:1px solid #3a323a;background:var(--panel-2);
  color:var(--paper);font-size:.82rem;cursor:pointer;white-space:nowrap;
}
.filter-chip.active{background:var(--safelight);border-color:var(--safelight);}

.shutter-btn{
  width:88px;height:88px;border-radius:50%;
  background:var(--flash);
  border:6px solid var(--safelight);
  cursor:pointer;
  margin:22px auto;display:block;
  transition: transform .1s ease;
}
.shutter-btn:active{transform:scale(.92);}
.shutter-btn.recording{background:var(--safelight); border-color:var(--flash); animation: recpulse 1.2s ease-in-out infinite;}
@keyframes recpulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(193,18,31,.5);} 50%{ box-shadow:0 0 0 14px rgba(193,18,31,0);} }

.rec-indicator{
  position:absolute; top:14px; left:14px; background:rgba(0,0,0,.55); color:#fff;
  padding:5px 12px; border-radius:20px; font-size:.85rem; font-weight:600; letter-spacing:.4px;
  display:flex; align-items:center; gap:6px;
}
.rec-indicator::before{ content:''; }

.mode-tabs{
  display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:18px;
}
.mode-tab{
  padding:10px 18px; border-radius:24px; border:1px solid #3a323a; background:var(--panel-2);
  color:var(--muted); font-size:.85rem; font-weight:600; cursor:pointer; letter-spacing:.3px;
}
.mode-tab.active{ background:var(--safelight); border-color:var(--safelight); color:#fff; }

/* ---- Kiosk-Startbildschirm (Übersicht) ---- */
.home-grid{
  display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:16px; max-width:600px; margin:20px auto 0;
}
.home-tile{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
  padding:30px 16px; border-radius:16px; border:1px solid #3a323a; background:var(--panel);
  color:var(--paper); text-decoration:none; cursor:pointer; font-family:inherit;
  transition: transform .12s ease, border-color .15s ease;
}
.home-tile:hover{ transform: translateY(-2px); border-color:var(--safelight); }
.home-tile-icon{ font-size:2.2rem; }
.home-tile-label{ font-size:.88rem; font-weight:600; letter-spacing:.3px; text-align:center; }

/* ---- Sticker-Editor ---- */
.editor-stage{
  position:relative; max-width:520px; margin:0 auto; border-radius:14px; overflow:hidden;
  border:3px solid var(--panel-2); background:#000; touch-action:none;
}
.editor-stage img{ width:100%; display:block; }
.sticker-el{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  font-size:44px; line-height:1; cursor:grab; user-select:none; touch-action:none;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.5));
  padding:4px;
}
.sticker-el.text-sticker{
  font-family:'Oswald',sans-serif; font-size:32px; color:#fff; font-weight:700;
  text-shadow:0 2px 8px rgba(0,0,0,.7); white-space:nowrap;
}
.sticker-el .sticker-remove{
  position:absolute; top:-10px; right:-10px; width:22px; height:22px; border-radius:50%;
  background:var(--safelight); color:#fff; font-size:13px; line-height:22px; text-align:center;
  display:none;
}
.sticker-el.selected .sticker-remove{ display:block; }
.sticker-palette{
  display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin:16px 0 4px;
}
.sticker-btn{
  width:46px; height:46px; border-radius:10px; border:1px solid #3a323a; background:var(--panel-2);
  font-size:22px; cursor:pointer;
}
.sticker-btn:hover{ background:var(--panel); }

/* ---- Slider-Captcha ("Objektiv scharfstellen") ---- */
.pb-slider-captcha{ margin-top:16px; }
.pb-slider-captcha label{ margin-bottom:8px; }
.pb-slider-track{
  position:relative; height:48px; border-radius:24px; background:#0f0d10;
  border:1px solid #3a323a; overflow:hidden;
}
.pb-slider-fill{
  position:absolute; top:0; left:0; bottom:0; width:0%; background:rgba(193,18,31,.18);
  transition: width .05s linear;
}
.pb-slider-target{
  position:absolute; top:0; bottom:0; width:26px; margin-left:-13px;
  background:rgba(255,248,231,.12); border-left:1px dashed rgba(255,248,231,.4); border-right:1px dashed rgba(255,248,231,.4);
}
.pb-slider-handle{
  position:absolute; top:3px; left:3px; width:42px; height:42px; border-radius:50%;
  background:var(--panel-2); border:2px solid var(--safelight); color:var(--paper);
  display:flex; align-items:center; justify-content:center; font-size:1.2rem;
  cursor:grab; touch-action:none; user-select:none; transition: left .05s linear, border-color .2s ease;
}
.pb-slider-handle:active{ cursor:grabbing; }
.pb-slider-captcha.solved .pb-slider-handle{ border-color:#6fd88a; background:#12331a; }
.pb-slider-captcha.solved .pb-slider-fill{ background:rgba(111,216,138,.25); }
.pb-slider-status{ margin-top:8px; font-size:.8rem; }
.pb-slider-captcha.solved .pb-slider-status{ color:#6fd88a; }

.qr-box{
  display:inline-block;background:var(--paper);padding:14px;border-radius:10px;margin-top:14px;
}

.badge{
  display:inline-block;padding:3px 10px;border-radius:20px;font-size:.72rem;font-weight:600;letter-spacing:.4px;
}
.badge.active{background:#1c3a24;color:#6fd88a;}
.badge.expired{background:#3a1c1c;color:#e08787;}

.muted{color:var(--muted);}
.center{text-align:center;}
.stack{display:flex;flex-direction:column;gap:10px;}
.row{display:flex;gap:12px;align-items:center;}
.row.between{justify-content:space-between;}

table{width:100%;border-collapse:collapse;margin-top:16px;}
th,td{text-align:left;padding:11px 10px;border-bottom:1px solid #2c262c;font-size:.9rem;}
th{color:var(--muted);font-weight:600;text-transform:uppercase;font-size:.72rem;letter-spacing:.5px;}

.flash-msg{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:.9rem;color:var(--flash);}
.flash-msg.error{background:#3a1216;border:1px solid var(--safelight);}
.flash-msg.success{background:#12331a;border:1px solid #2e8b45;}

@media (max-width: 640px){
  .container{padding:16px;}
  .countdown-overlay{font-size:5rem;}

  /* Grundabstände & Typografie kompakter */
  .card{padding:18px;}
  h1{font-size:1.5rem;}
  h2{font-size:1.25rem;}
  h3{font-size:1.05rem;}

  /* Topbar: bricht sauber um statt zu quetschen */
  .topbar{padding:12px 16px; flex-wrap:wrap; gap:10px;}
  .topbar .brand{font-size:1rem;}
  .row{flex-wrap:wrap;}

  /* Buttons: etwas kompakter, bleiben aber gut antippbar (min. 44px Höhe) */
  .btn{padding:11px 18px; font-size:.92rem;}

  /* Home-Kacheln: kleiner minmax, damit auch 320px-Screens 2 Spalten schaffen */
  .home-grid{grid-template-columns:repeat(auto-fit, minmax(105px, 1fr)); gap:10px; max-width:100%;}
  .home-tile{padding:20px 10px; gap:8px;}
  .home-tile-icon{font-size:1.8rem;}
  .home-tile-label{font-size:.78rem;}

  /* Kamera-Bereich randlos, Bedienelemente kompakter */
  .camera-frame{border-width:2px;}
  .camera-start-btn{padding:20px 22px; font-size:.9rem;}
  .shutter-btn{width:72px; height:72px; border-width:4px;}
  .mode-tab{padding:8px 13px; font-size:.78rem;}
  .filter-chip{padding:7px 13px; font-size:.76rem;}
  .filter-strip{gap:7px; padding:12px 2px;}

  /* Sticker-Editor: volle Breite, kleinere Sticker-Buttons */
  .editor-stage{max-width:100%;}
  .sticker-btn{width:40px; height:40px; font-size:19px;}
  .sticker-palette{gap:7px;}

  /* Foto-Raster: eine Spalte auf sehr schmalen Screens, Aktionsleiste kompakter */
  .photo-grid{grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:12px;}
  .photo-actions{flex-wrap:wrap;}
  .photo-actions button{min-width:64px; padding:8px 4px;}

  /* Popover (Mail/QR/Kommentare) randlos in Karten */
  .pb-popover{margin:0 8px 8px;}

  /* Admin-Tabellen: horizontal scrollbar statt Zerquetschen */
  table{display:block; overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch;}
  th,td{padding:9px 8px; font-size:.82rem;}

  /* Admin-Nav: gleichmäßiger umbrechend */
  .admin-nav{gap:4px;}
  .admin-nav a{padding:8px 12px; font-size:.82rem;}

  /* Editor-/Kamera-Auswahl-Zeile */
  #cameraSelectRow select{max-width:200px;}

  /* Slider-Captcha etwas kompakter */
  .pb-slider-track{height:44px;}
  .pb-slider-handle{width:38px; height:38px;}
}

@media (max-width: 380px){
  .home-grid{grid-template-columns:repeat(auto-fit, minmax(92px, 1fr)); gap:8px;}
  .home-tile{padding:16px 8px;}
  .home-tile-icon{font-size:1.5rem;}
  .home-tile-label{font-size:.72rem;}
  .shutter-btn{width:64px; height:64px;}
  .marquee, h1.marquee{font-size:1.3rem;}
}

/* ============================================================
   THEME VARIANTEN – werden per body-Klasse aktiviert
   (Basis oben = "darkroom", Standard-/Fallback-Theme)
   ============================================================ */

/* --- Classic Hochzeit: warmes Creme, Gold-Akzent, serifige Eleganz --- */
body.theme-classic{
  --ink:#2b2420;
  --panel:#fffaf0;
  --panel-2:#f3e9d8;
  --paper:#2b2420;
  --safelight:#8a5a26;
  --safelight-dim:#6e4419;
  --flash:#fffdf7;
  --muted:#6b5642;
  background: radial-gradient(circle at 50% 0%, #fff6e6 0%, #f7ecd9 60%);
}
body.theme-classic h1,body.theme-classic h2,body.theme-classic h3,body.theme-classic .marquee{
  font-family: Georgia, 'Times New Roman', serif;
  text-transform: none;
  letter-spacing: .5px;
  font-weight: 500;
}
body.theme-classic .btn{ color:#fff; }
body.theme-classic .btn.secondary, body.theme-classic .btn.ghost{ color:var(--paper); }
body.theme-classic .filmstrip{ background:#efe4cc; }
body.theme-classic .filmstrip::before, body.theme-classic .filmstrip::after{
  background-image: radial-gradient(circle, #d8c9a8 3.5px, transparent 3.6px);
}
body.theme-classic .camera-frame{ border-color:#e4d4b0; }
body.theme-classic .filter-chip{ background:#f3e9d8; border-color:#e0d0ac; color:#2b2420; }
body.theme-classic .filter-chip.active{ background:var(--safelight); border-color:var(--safelight); color:#fff; }
body.theme-classic input, body.theme-classic select, body.theme-classic textarea{
  background:#fffdf7; color:var(--paper); border-color:#e0d0ac;
}

/* --- Party Neon: Schwarzlicht, Magenta/Cyan --- */
body.theme-party{
  --ink:#0a0612;
  --panel:#150c22;
  --panel-2:#1d1130;
  --paper:#f2e9ff;
  --safelight:#ff2fb0;
  --safelight-dim:#c91d88;
  --flash:#eafcff;
  --muted:#a596c9;
  background: radial-gradient(circle at 50% 0%, #1c0f30 0%, #0a0612 65%);
}
body.theme-party h1,body.theme-party h2,body.theme-party h3,body.theme-party .marquee{
  font-family: 'Oswald','Arial Narrow',sans-serif;
  letter-spacing: 2px;
}
body.theme-party .btn{ box-shadow: 0 0 18px rgba(255,47,176,.55); }
body.theme-party .shutter-btn{ border-color: var(--safelight); box-shadow: 0 0 30px rgba(255,47,176,.6); }
body.theme-party .camera-frame{ border-color:#2e1f47; box-shadow: 0 0 40px rgba(0,220,255,.15), var(--shadow); }
body.theme-party .filter-chip.active{ box-shadow: 0 0 14px rgba(255,47,176,.6); }
body.theme-party .topbar{ background: linear-gradient(180deg, rgba(0,220,255,.08), transparent); }

/* --- Pastell (Baby-/Gender-Reveal-Partys): sanftes Rosa/Flieder --- */
body.theme-pastell{
  --ink:#4a3b4a;
  --panel:#fffbfe;
  --panel-2:#fbe8f3;
  --paper:#4a3b4a;
  --safelight:#a8447f;
  --safelight-dim:#8a366a;
  --flash:#fffdfc;
  --muted:#7a6478;
  background: radial-gradient(circle at 50% 0%, #fdf3fa 0%, #f5eefb 60%);
}
body.theme-pastell h1,body.theme-pastell h2,body.theme-pastell h3,body.theme-pastell .marquee{
  font-family: 'Segoe UI', system-ui, sans-serif; text-transform:none; letter-spacing:.3px; font-weight:700;
}
body.theme-pastell .btn{ color:#fff; }
body.theme-pastell .btn.secondary, body.theme-pastell .btn.ghost{ color:var(--paper); }
body.theme-pastell input, body.theme-pastell select, body.theme-pastell textarea{ background:#fffdfc; color:var(--paper); border-color:#eccbdf; }
body.theme-pastell .filmstrip{ background:#fbe8f3; }
body.theme-pastell .filmstrip::before, body.theme-pastell .filmstrip::after{
  background-image: radial-gradient(circle, #f0c9e0 3.5px, transparent 3.6px);
}
body.theme-pastell .camera-frame{ border-color:#f0c9e0; }
body.theme-pastell .filter-chip{ background:#fbe8f3; border-color:#eccbdf; color:#4a3b4a; }
body.theme-pastell .filter-chip.active{ background:var(--safelight); border-color:var(--safelight); color:#fff; }

/* --- Corporate (Firmenevent): klar, professionell, Blau/Grau --- */
body.theme-corporate{
  --ink:#1f2937;
  --panel:#ffffff;
  --panel-2:#eef1f6;
  --paper:#1f2937;
  --safelight:#2554c7;
  --safelight-dim:#1c3f9e;
  --flash:#ffffff;
  --muted:#56606e;
  background: #f4f6f9;
}
body.theme-corporate h1,body.theme-corporate h2,body.theme-corporate h3,body.theme-corporate .marquee{
  font-family: 'Segoe UI', system-ui, sans-serif; text-transform:none; letter-spacing:0; font-weight:700;
}
body.theme-corporate .btn{ color:#fff; }
body.theme-corporate .btn.secondary, body.theme-corporate .btn.ghost{ color:var(--paper); }
body.theme-corporate input, body.theme-corporate select, body.theme-corporate textarea{ background:#fff; color:var(--paper); border-color:#d5dae2; }
body.theme-corporate .card{ box-shadow:0 4px 16px rgba(31,41,55,.08); }
body.theme-corporate .filmstrip{ background:#eef1f6; }
body.theme-corporate .filmstrip::before, body.theme-corporate .filmstrip::after{
  background-image: radial-gradient(circle, #d5dae2 3.5px, transparent 3.6px);
}
body.theme-corporate .camera-frame{ border-color:#d5dae2; }
body.theme-corporate .filter-chip{ background:#eef1f6; border-color:#d5dae2; color:#1f2937; }
body.theme-corporate .filter-chip.active{ background:var(--safelight); border-color:var(--safelight); color:#fff; }

/* --- Geburtstag Bunt: fröhlich, warmes Creme + Pink-Akzent --- */
body.theme-geburtstag{
  --ink:#2c2013;
  --panel:#fffdf7;
  --panel-2:#fff0e0;
  --paper:#2c2013;
  --safelight:#c73566;
  --safelight-dim:#a12851;
  --flash:#fffefa;
  --muted:#6e5c46;
  background: radial-gradient(circle at 50% 0%, #fff8ec 0%, #fef0f5 60%);
}
body.theme-geburtstag h1,body.theme-geburtstag h2,body.theme-geburtstag h3,body.theme-geburtstag .marquee{
  font-family: 'Segoe UI', system-ui, sans-serif; text-transform:none; letter-spacing:.3px; font-weight:800;
}
body.theme-geburtstag .btn{ color:#fff; }
body.theme-geburtstag .btn.secondary, body.theme-geburtstag .btn.ghost{ color:var(--paper); }
body.theme-geburtstag input, body.theme-geburtstag select, body.theme-geburtstag textarea{ background:#fffefa; color:var(--paper); border-color:#f0d9b8; }
body.theme-geburtstag .filmstrip{ background:#fff0e0; }
body.theme-geburtstag .filmstrip::before, body.theme-geburtstag .filmstrip::after{
  background-image: radial-gradient(circle, #f5d9c2 3.5px, transparent 3.6px);
}
body.theme-geburtstag .camera-frame{ border-color:#f5d9c2; }
body.theme-geburtstag .filter-chip{ background:#fff0e0; border-color:#f5d9c2; color:#2c2013; }
body.theme-geburtstag .filter-chip.active{ background:var(--safelight); border-color:var(--safelight); color:#fff; }

/* --- Boho/Herbst: erdig, Terrakotta/Salbei, rustikal --- */
body.theme-boho{
  --ink:#3a2e22;
  --panel:#faf3ea;
  --panel-2:#f0e4d3;
  --paper:#3a2e22;
  --safelight:#8c4a26;
  --safelight-dim:#703a1d;
  --flash:#fdf9f3;
  --muted:#665542;
  background: radial-gradient(circle at 50% 0%, #f7ecdd 0%, #efe3d0 60%);
}
body.theme-boho h1,body.theme-boho h2,body.theme-boho h3,body.theme-boho .marquee{
  font-family: Georgia, 'Times New Roman', serif; text-transform:none; letter-spacing:.4px; font-weight:500;
}
body.theme-boho .btn{ color:#fff; }
body.theme-boho .btn.secondary, body.theme-boho .btn.ghost{ color:var(--paper); }
body.theme-boho input, body.theme-boho select, body.theme-boho textarea{ background:#fdf9f3; color:var(--paper); border-color:#e0cfb0; }
body.theme-boho .filmstrip{ background:#f0e4d3; }
body.theme-boho .filmstrip::before, body.theme-boho .filmstrip::after{
  background-image: radial-gradient(circle, #ddc9a8 3.5px, transparent 3.6px);
}
body.theme-boho .camera-frame{ border-color:#ddc9a8; }
body.theme-boho .filter-chip{ background:#f0e4d3; border-color:#e0cfb0; color:#3a2e22; }
body.theme-boho .filter-chip.active{ background:var(--safelight); border-color:var(--safelight); color:#fff; }

/* --- Weihnachten: dunkles Tannengrün, Gold/Rot-Akzente --- */
body.theme-weihnachten{
  --ink:#0f1f16;
  --panel:#16281c;
  --panel-2:#1e3527;
  --paper:#f3ead9;
  --safelight:#c2273d;
  --safelight-dim:#9c1e30;
  --flash:#fff8ec;
  --muted:#9db3a2;
  background: radial-gradient(circle at 50% 0%, #1a2f21 0%, #0f1f16 65%);
}
body.theme-weihnachten h1,body.theme-weihnachten h2,body.theme-weihnachten h3,body.theme-weihnachten .marquee{
  font-family: Georgia, 'Times New Roman', serif; letter-spacing:.8px; font-weight:600;
}
body.theme-weihnachten .btn{ box-shadow:0 0 16px rgba(194,39,61,.4); }
body.theme-weihnachten .camera-frame{ border-color:#2a4432; }
body.theme-weihnachten .filter-chip.active{ box-shadow:0 0 10px rgba(194,39,61,.5); }

/* ============================================================
   LIVE GALERIE-WALL (Beamer/Bildschirm-Slideshow)
   ============================================================ */
.wall-body{ margin:0; height:100vh; overflow:hidden; background:#000; }
.wall-stage{
  position:relative; width:100vw; height:100vh;
  display:flex; align-items:center; justify-content:center;
}
.wall-stage img{
  max-width:92vw; max-height:88vh; object-fit:contain;
  border-radius:16px; box-shadow: 0 30px 80px rgba(0,0,0,.6);
  opacity:0; position:absolute;
  transition: opacity 1.1s ease;
}
.wall-stage img.visible{ opacity:1; }
.wall-heading{
  position:absolute; top:28px; left:0; right:0; text-align:center;
  font-family:'Oswald',sans-serif; letter-spacing:3px; font-size:1.3rem;
  color:var(--flash); text-shadow:0 2px 12px rgba(0,0,0,.6); z-index:5;
}
.wall-qr-hint{
  position:absolute; bottom:24px; right:28px; display:flex; align-items:center; gap:12px;
  background:rgba(0,0,0,.5); padding:10px 16px; border-radius:12px; z-index:5;
}
.wall-qr-hint canvas{ border-radius:6px; }
.wall-qr-hint span{ color:var(--paper); font-size:.85rem; }
.wall-empty{ color:var(--muted); font-family:'Oswald',sans-serif; letter-spacing:2px; font-size:1.4rem; }

/* Split-Screen (duo) Layout */
.wall-duo .wall-stage{ gap:3vw; }
.wall-stage .wall-slot{
  position:static;
  max-width:44vw; max-height:82vh; object-fit:contain;
  border-radius:16px; box-shadow: 0 30px 80px rgba(0,0,0,.6);
  opacity:0; transition: opacity .5s ease;
}
.wall-stage .wall-slot.visible{ opacity:1; }
.wall-slot-left{ transform: translateX(-2vw); }
.wall-slot-right{ transform: translateX(2vw); }