/* ============================================================
   BYELINE – VENUE THEMES & NEUTRALE STARTSEITE
   Nur Layout/Farben – keine Funktionsänderungen.
   ============================================================ */

/* ---- Neutrale ByeLine-Startseite (byeline.ch) ---- */
html[data-theme="home"]{
  --bg:#f7f8fc;
  --bg-soft:#eef1f8;
  --card:#ffffff;
  --card-2:#eef2f7;
  --line:rgba(15,23,42,.10);
  --txt:#0f172a;
  --txt-dim:#475569;
  --txt-faint:#94a3b8;
  --aqua:#4f46e5;
  --aqua-bright:#6366f1;
  --blue:#4338ca;
  --violet:#7c3aed;
  --lime:#16a34a;
  --lime-bright:#22c55e;
  --grad:linear-gradient(135deg,#6366f1 0%,#4f46e5 45%,#7c3aed 100%);
  --grad-soft:linear-gradient(135deg,rgba(99,102,241,.10),rgba(79,70,229,.08),rgba(124,58,237,.08));
  --shadow:0 18px 50px rgba(15,23,42,.08);
  --shadow-sm:0 6px 22px rgba(15,23,42,.06);
}
html[data-theme="home"],
html[data-theme="home"] body{
  background:transparent;
}
/* Kein Badi-/Wellen-Feeling auf der Startseite */
html[data-theme="home"] .bg-deco .wave,
html[data-theme="home"] .bg-deco .drop,
html[data-theme="home"] .bg-deco .bubble{
  display:none !important;
}
html[data-theme="home"] .bg-deco{
  background:#f4f5fb;
  z-index:0;
}
html[data-theme="home"] .bg-deco::before,
html[data-theme="home"] .bg-deco::after{
  display:none;
}
html[data-theme="home"] #view-home,
html[data-theme="home"] #view-impressum,
html[data-theme="home"] #view-datenschutz,
html[data-theme="home"] #view-agb,
html[data-theme="home"] #view-login,
html[data-theme="home"] #view-register,
html[data-theme="home"] #view-forgot-password,
html[data-theme="home"] #view-reset-password,
html[data-theme="home"] #view-platform{
  position:relative;
  z-index:1;
}

/* Brand-Layer: nur auf Startseite / Login / Legal */
.bg-brand{display:none;position:absolute;inset:0;overflow:hidden}
html[data-theme="home"] .bg-brand{display:block}

.bg-brand-mesh{
  position:absolute;inset:-20%;
  background:
    radial-gradient(45% 40% at 18% 22%, rgba(99,102,241,.34), transparent 70%),
    radial-gradient(40% 38% at 82% 18%, rgba(124,58,237,.28), transparent 68%),
    radial-gradient(50% 45% at 55% 78%, rgba(67,56,202,.16), transparent 72%),
    radial-gradient(35% 30% at 70% 55%, rgba(34,211,238,.08), transparent 70%),
    linear-gradient(165deg, #eef0ff 0%, #f7f5ff 42%, #f8fafc 100%);
  animation:brandMesh 22s ease-in-out infinite alternate;
}
@keyframes brandMesh{
  0%{transform:translate(0,0) scale(1) rotate(0deg)}
  50%{transform:translate(-2%,1.5%) scale(1.04) rotate(1deg)}
  100%{transform:translate(2%,-1%) scale(1.06) rotate(-1deg)}
}

.bg-brand-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(79,70,229,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(79,70,229,.045) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 75% 65% at 50% 35%, #000 20%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse 75% 65% at 50% 35%, #000 20%, transparent 75%);
  animation:brandGrid 30s linear infinite;
  opacity:.9;
}
@keyframes brandGrid{
  from{transform:translateY(0)}
  to{transform:translateY(-56px)}
}

.bg-brand-orb{
  position:absolute;border-radius:50%;
  filter:blur(4px);
}
.bg-brand-orb.o1{
  width:min(42vw,420px);height:min(42vw,420px);
  top:4%;left:-6%;
  background:radial-gradient(circle,rgba(99,102,241,.35) 0%,rgba(99,102,241,.08) 45%,transparent 70%);
  animation:brandOrbA 16s ease-in-out infinite alternate;
}
.bg-brand-orb.o2{
  width:min(36vw,380px);height:min(36vw,380px);
  top:8%;right:-4%;
  background:radial-gradient(circle,rgba(124,58,237,.32) 0%,rgba(124,58,237,.07) 48%,transparent 70%);
  animation:brandOrbB 19s ease-in-out infinite alternate;
}
.bg-brand-orb.o3{
  width:min(48vw,520px);height:min(48vw,520px);
  bottom:-12%;left:28%;
  background:radial-gradient(circle,rgba(34,211,238,.14) 0%,rgba(79,70,229,.10) 40%,transparent 70%);
  animation:brandOrbC 21s ease-in-out infinite alternate;
}
@keyframes brandOrbA{
  0%{transform:translate(0,0) scale(1)}
  100%{transform:translate(8%,6%) scale(1.12)}
}
@keyframes brandOrbB{
  0%{transform:translate(0,0) scale(1)}
  100%{transform:translate(-10%,8%) scale(1.08)}
}
@keyframes brandOrbC{
  0%{transform:translate(0,0) scale(1)}
  100%{transform:translate(-4%,-8%) scale(1.15)}
}

.bg-brand-beam{
  position:absolute;top:-20%;left:35%;
  width:30%;height:140%;
  background:linear-gradient(105deg, transparent 35%, rgba(255,255,255,.45) 48%, rgba(167,139,250,.18) 52%, transparent 65%);
  transform:rotate(18deg);
  animation:brandBeam 12s ease-in-out infinite;
  opacity:.55;
  pointer-events:none;
}
@keyframes brandBeam{
  0%,100%{transform:translateX(-30%) rotate(18deg);opacity:.25}
  50%{transform:translateX(40%) rotate(18deg);opacity:.6}
}

/* Schwebende Logo-Marken (Wiedererkennung) */
.bg-brand-mark{
  position:absolute;
  border-radius:18%;
  background:linear-gradient(145deg,#6366f1,#4f46e5 45%,#7c3aed);
  box-shadow:0 12px 40px rgba(79,70,229,.22);
  opacity:.14;
}
.bg-brand-mark::after{
  content:"";position:absolute;inset:22% 24% 24% 22%;
  border:2.5px solid rgba(255,255,255,.9);border-radius:12%;
}
.bg-brand-mark.m1{width:72px;height:72px;top:14%;left:7%;animation:brandFloat 9s ease-in-out infinite;opacity:.18}
.bg-brand-mark.m2{width:48px;height:48px;top:22%;right:10%;animation:brandFloat 11s ease-in-out infinite reverse;animation-delay:1s;opacity:.14}
.bg-brand-mark.m3{width:36px;height:36px;top:58%;left:12%;animation:brandFloat 10s ease-in-out infinite;animation-delay:2s;opacity:.12}
.bg-brand-mark.m4{width:56px;height:56px;bottom:18%;right:14%;animation:brandFloat 13s ease-in-out infinite reverse;animation-delay:.5s;opacity:.16}
.bg-brand-mark.m5{width:28px;height:28px;top:42%;right:24%;animation:brandFloat 8s ease-in-out infinite;animation-delay:1.5s;opacity:.2;border-radius:22%}
@keyframes brandFloat{
  0%,100%{transform:translateY(0) rotate(-6deg)}
  50%{transform:translateY(-18px) rotate(8deg)}
}

.bg-brand-ring{
  position:absolute;border-radius:50%;
  border:1.5px solid rgba(99,102,241,.18);
  box-shadow:inset 0 0 40px rgba(124,58,237,.06);
}
.bg-brand-ring.r1{
  width:min(55vw,460px);height:min(55vw,460px);
  top:18%;left:50%;transform:translateX(-50%);
  animation:brandRing 20s linear infinite;
}
.bg-brand-ring.r2{
  width:min(38vw,300px);height:min(38vw,300px);
  top:28%;left:50%;transform:translateX(-50%);
  border-color:rgba(124,58,237,.14);
  animation:brandRing 14s linear infinite reverse;
}
@keyframes brandRing{
  from{transform:translateX(-50%) rotate(0deg) scale(1)}
  to{transform:translateX(-50%) rotate(360deg) scale(1.04)}
}

@media (prefers-reduced-motion: reduce){
  .bg-brand-mesh,.bg-brand-grid,.bg-brand-orb,
  .bg-brand-beam,.bg-brand-mark,.bg-brand-ring{animation:none}
}

/* Marken-Logo: Vista B-Mark (transparent, violettes B + graue Linie) */
.logo-mark--brand{
  width:1.85rem;height:1.85rem;border-radius:0;
  background:transparent url("/icons/byeline-logo.svg") center / contain no-repeat;
  box-shadow:none;
  flex-shrink:0;
  position:relative;
}

/* ---- Badi: crisp poolside (cool teal, kein Splash-Kitsch) ---- */
html[data-theme="badi"]{
  --bg:#f7fafc;
  --bg-soft:#eef5f8;
  --card:#ffffff;
  --card-2:#e8f2f6;
  --line:rgba(15,55,70,.10);
  --txt:#0b1f28;
  --txt-dim:#3d5a68;
  --txt-faint:#7a93a0;
  --aqua:#0e7490;
  --aqua-bright:#06b6d4;
  --blue:#1d4ed8;
  --violet:#0f766e;
  --lime:#4d7c0f;
  --lime-bright:#65a30d;
  --grad:linear-gradient(135deg,#06b6d4 0%,#0e7490 55%,#155e75 100%);
  --grad-soft:linear-gradient(135deg,rgba(6,182,212,.10),rgba(14,116,144,.07));
  --shadow:0 16px 40px rgba(15,55,70,.08);
  --shadow-sm:0 4px 16px rgba(15,55,70,.05);
  --shell-chrome:rgba(247,250,252,.92);
  --venue-shell-bg:linear-gradient(165deg,#eef7fa 0%,#e4f1f6 42%,#d7ebf2 100%);
  --venue-overlay:rgba(247,250,252,.96);
  --font-display:'Syne',system-ui,sans-serif;
  --font-head:'Outfit',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --on-accent:#ffffff;
}
html[data-theme="badi"] .bg-deco{
  background:var(--venue-shell-bg);
}
html[data-theme="badi"] .bg-deco .drop,
html[data-theme="badi"] .bg-deco .bubble{display:none}
html[data-theme="badi"] .bg-deco::before{
  animation:none;
  opacity:.85;
  background:
    radial-gradient(ellipse 90% 55% at 100% -5%, rgba(6,182,212,.22), transparent 58%),
    radial-gradient(ellipse 70% 50% at 0% 25%, rgba(14,116,144,.12), transparent 52%),
    radial-gradient(ellipse 50% 35% at 50% 100%, rgba(34,211,238,.08), transparent 55%);
}
html[data-theme="badi"] .bg-deco::after{
  animation:venueGlow 18s ease-in-out infinite alternate;
  background:
    radial-gradient(620px 360px at 88% -4%,rgba(6,182,212,.18),transparent 62%),
    radial-gradient(460px 300px at -6% 18%,rgba(14,116,144,.12),transparent 60%),
    radial-gradient(280px 200px at 60% 70%,rgba(255,255,255,.35),transparent 70%);
}
html[data-theme="badi"] .bg-deco .wave{opacity:.35}
html[data-theme="badi"] .btn-primary,
html[data-theme="badi"] .lang-btn.on,
html[data-theme="badi"] .chip.on{color:var(--on-accent)}
/* Plus-Buttons: solid statt Verlauf – auf kleinem Kreis sonst fleckig */
html[data-theme="badi"] .qty-btn.plus,
html[data-theme="badi"] #view-gast .qty-btn.plus{
  background:var(--aqua);
  color:var(--on-accent);
  border-color:transparent;
  box-shadow:0 8px 18px color-mix(in srgb, var(--aqua) 28%, transparent);
}

/* ---- Restaurant: refined stone & bronze ---- */
html[data-theme="restaurant"]{
  --bg:#f6f4f1;
  --bg-soft:#eeebe6;
  --card:#fffcfa;
  --card-2:#ebe6df;
  --line:rgba(40,32,24,.10);
  --txt:#1c1917;
  --txt-dim:#57534e;
  --txt-faint:#a8a29e;
  --aqua:#9a3412;
  --aqua-bright:#b45309;
  --blue:#78350f;
  --violet:#44403c;
  --lime:#4d7c0f;
  --lime-bright:#65a30d;
  --grad:linear-gradient(135deg,#b45309 0%,#9a3412 55%,#7c2d12 100%);
  --grad-soft:linear-gradient(135deg,rgba(180,83,9,.08),rgba(154,52,18,.05));
  --shadow:0 16px 40px rgba(28,25,23,.07);
  --shadow-sm:0 4px 16px rgba(28,25,23,.04);
  --shell-chrome:rgba(246,244,241,.94);
  --venue-shell-bg:linear-gradient(165deg,#f3efe9 0%,#ebe4db 55%,#e4dbd0 100%);
  --venue-overlay:rgba(246,244,241,.96);
  --font-display:'Fraunces',Georgia,serif;
  --font-head:'DM Sans',system-ui,sans-serif;
  --font-body:'DM Sans',system-ui,sans-serif;
  --on-accent:#ffffff;
}
html[data-theme="restaurant"] .bg-deco{
  background:var(--venue-shell-bg);
}
html[data-theme="restaurant"] .bg-deco .wave,
html[data-theme="restaurant"] .bg-deco .drop,
html[data-theme="restaurant"] .bg-deco .bubble{display:none}
html[data-theme="restaurant"] .bg-deco::before{
  animation:none;
  background:
    linear-gradient(180deg, rgba(28,25,23,.04) 0%, transparent 42%),
    radial-gradient(ellipse 75% 50% at 100% 0%, rgba(180,83,9,.12), transparent 55%),
    radial-gradient(ellipse 45% 35% at 10% 80%, rgba(120,53,15,.06), transparent 60%);
}
html[data-theme="restaurant"] .bg-deco::after{
  animation:venueGlow 20s ease-in-out infinite alternate;
  background:
    radial-gradient(540px 320px at 92% -6%,rgba(180,83,9,.14),transparent 60%),
    radial-gradient(420px 280px at -4% 40%,rgba(68,64,60,.06),transparent 55%),
    radial-gradient(240px 180px at 40% 90%,rgba(255,248,240,.4),transparent 70%);
}
html[data-theme="restaurant"] .btn-primary,
html[data-theme="restaurant"] .lang-btn.on,
html[data-theme="restaurant"] .chip.on,
html[data-theme="restaurant"] .qty-btn.plus{color:var(--on-accent)}

/* ---- Skihütte: alpine graphite & ice ---- */
html[data-theme="skihuette"]{
  --bg:#f4f6f8;
  --bg-soft:#e8eef3;
  --card:#ffffff;
  --card-2:#e2e9f0;
  --line:rgba(15,35,50,.10);
  --txt:#0f172a;
  --txt-dim:#334155;
  --txt-faint:#64748b;
  --aqua:#0f4c5c;
  --aqua-bright:#155e75;
  --blue:#1e3a5f;
  --violet:#334155;
  --lime:#166534;
  --lime-bright:#15803d;
  --grad:linear-gradient(135deg,#155e75 0%,#0f4c5c 50%,#1e3a5f 100%);
  --grad-soft:linear-gradient(135deg,rgba(21,94,117,.08),rgba(30,58,95,.05));
  --shadow:0 16px 40px rgba(15,35,50,.08);
  --shadow-sm:0 4px 16px rgba(15,35,50,.05);
  --shell-chrome:rgba(244,246,248,.94);
  --venue-shell-bg:linear-gradient(165deg,#eef2f6 0%,#e2eaf1 50%,#d4e0eb 100%);
  --venue-overlay:rgba(244,246,248,.96);
  --font-display:'Bricolage Grotesque',system-ui,sans-serif;
  --font-head:'Manrope',system-ui,sans-serif;
  --font-body:'Manrope',system-ui,sans-serif;
  --on-accent:#ffffff;
}
html[data-theme="skihuette"] .bg-deco{
  background:var(--venue-shell-bg);
}
html[data-theme="skihuette"] .bg-deco .wave,
html[data-theme="skihuette"] .bg-deco .drop,
html[data-theme="skihuette"] .bg-deco .bubble{display:none}
html[data-theme="skihuette"] .bg-deco::before{
  animation:none;
  background:
    linear-gradient(115deg, transparent 38%, rgba(255,255,255,.7) 48%, transparent 58%),
    radial-gradient(ellipse 60% 45% at 0% 0%, rgba(21,94,117,.14), transparent 55%),
    radial-gradient(ellipse 40% 30% at 100% 60%, rgba(148,163,184,.2), transparent 60%);
}
html[data-theme="skihuette"] .bg-deco::after{
  animation:venueGlow 22s ease-in-out infinite alternate;
  background:
    radial-gradient(520px 300px at 90% 0%,rgba(148,163,184,.28),transparent 58%),
    radial-gradient(380px 260px at 10% 80%,rgba(15,76,92,.1),transparent 55%),
    radial-gradient(220px 160px at 55% 30%,rgba(255,255,255,.45),transparent 70%);
}
html[data-theme="skihuette"] .btn-primary,
html[data-theme="skihuette"] .lang-btn.on,
html[data-theme="skihuette"] .chip.on,
html[data-theme="skihuette"] .qty-btn.plus{color:var(--on-accent)}

/* ---- Spielhalle: urban graphite & electric cyan ---- */
html[data-theme="spielhalle"]{
  --bg:#f3f4f6;
  --bg-soft:#e5e7eb;
  --card:#fafafa;
  --card-2:#e8eaee;
  --line:rgba(15,23,42,.10);
  --txt:#0a0a0b;
  --txt-dim:#3f3f46;
  --txt-faint:#71717a;
  --aqua:#0891b2;
  --aqua-bright:#22d3ee;
  --blue:#0e7490;
  --violet:#18181b;
  --lime:#65a30d;
  --lime-bright:#84cc16;
  --grad:linear-gradient(135deg,#22d3ee 0%,#0891b2 50%,#0e7490 100%);
  --grad-soft:linear-gradient(135deg,rgba(34,211,238,.10),rgba(8,145,178,.06));
  --shadow:0 16px 40px rgba(10,10,11,.08);
  --shadow-sm:0 4px 16px rgba(10,10,11,.05);
  --shell-chrome:rgba(243,244,246,.94);
  --venue-shell-bg:linear-gradient(165deg,#eceef2 0%,#e2e5eb 55%,#d5dae3 100%);
  --venue-overlay:rgba(243,244,246,.96);
  --font-display:'Syne',system-ui,sans-serif;
  --font-head:'Outfit',system-ui,sans-serif;
  --font-body:'Outfit',system-ui,sans-serif;
  --on-accent:#0a0a0b;
}
html[data-theme="spielhalle"] body{background:var(--bg);color:var(--txt)}
html[data-theme="spielhalle"] .bg-deco{background:var(--venue-shell-bg)}
html[data-theme="spielhalle"] .bg-deco .wave,
html[data-theme="spielhalle"] .bg-deco .drop,
html[data-theme="spielhalle"] .bg-deco .bubble{display:none}
html[data-theme="spielhalle"] .bg-deco::before{
  animation:none;
  background:
    linear-gradient(rgba(8,145,178,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(8,145,178,.055) 1px, transparent 1px);
  background-size:40px 40px;
  mask-image:radial-gradient(ellipse 85% 65% at 50% 15%, #000 12%, transparent 72%);
  -webkit-mask-image:radial-gradient(ellipse 85% 65% at 50% 15%, #000 12%, transparent 72%);
}
html[data-theme="spielhalle"] .bg-deco::after{
  animation:venueGlow 16s ease-in-out infinite alternate;
  background:
    radial-gradient(540px 320px at 80% -8%,rgba(34,211,238,.2),transparent 55%),
    radial-gradient(400px 280px at 0% 70%,rgba(24,24,27,.08),transparent 50%),
    radial-gradient(200px 160px at 70% 40%,rgba(34,211,238,.1),transparent 65%);
}
html[data-theme="spielhalle"] .btn-primary{color:var(--on-accent)}
html[data-theme="spielhalle"] .btn-ghost{
  background:rgba(255,255,255,.78);border-color:rgba(15,23,42,.12);color:var(--txt);
}
html[data-theme="spielhalle"] .card,
html[data-theme="spielhalle"] .glass{background:var(--card);border-color:var(--line)}
html[data-theme="spielhalle"] input,
html[data-theme="spielhalle"] select,
html[data-theme="spielhalle"] textarea{
  background:#fff;color:var(--txt);border-color:var(--line);
}
html[data-theme="spielhalle"] .nav{background:rgba(250,250,250,.94);border-color:var(--line)}

/* ---- Imbiss: street-food charcoal & vermillion ---- */
html[data-theme="imbiss"]{
  --bg:#f7f5f3;
  --bg-soft:#efebe7;
  --card:#ffffff;
  --card-2:#ebe4de;
  --line:rgba(28,25,23,.10);
  --txt:#1c1917;
  --txt-dim:#57534e;
  --txt-faint:#a8a29e;
  --aqua:#c2410c;
  --aqua-bright:#ea580c;
  --blue:#9a3412;
  --violet:#292524;
  --lime:#4d7c0f;
  --lime-bright:#65a30d;
  --grad:linear-gradient(135deg,#ea580c 0%,#c2410c 55%,#9a3412 100%);
  --grad-soft:linear-gradient(135deg,rgba(234,88,12,.09),rgba(194,65,12,.05));
  --shadow:0 16px 40px rgba(28,25,23,.08);
  --shadow-sm:0 4px 16px rgba(28,25,23,.05);
  --shell-chrome:rgba(247,245,243,.94);
  --venue-shell-bg:linear-gradient(165deg,#f4efe9 0%,#ebe3da 55%,#e2d6c8 100%);
  --venue-overlay:rgba(247,245,243,.96);
  --font-display:'Barlow Condensed',system-ui,sans-serif;
  --font-head:'Space Grotesk',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --on-accent:#ffffff;
}
html[data-theme="imbiss"] .bg-deco{
  background:var(--venue-shell-bg);
}
html[data-theme="imbiss"] .bg-deco .wave,
html[data-theme="imbiss"] .bg-deco .drop,
html[data-theme="imbiss"] .bg-deco .bubble{display:none}
html[data-theme="imbiss"] .bg-deco::before{
  animation:none;
  background:
    radial-gradient(ellipse 70% 45% at 100% 0%, rgba(234,88,12,.16), transparent 55%),
    radial-gradient(ellipse 55% 40% at 0% 100%, rgba(41,37,36,.07), transparent 50%),
    radial-gradient(ellipse 40% 30% at 40% 20%, rgba(251,146,60,.1), transparent 60%);
}
html[data-theme="imbiss"] .bg-deco::after{
  animation:venueGlow 17s ease-in-out infinite alternate;
  background:
    radial-gradient(540px 320px at 90% -6%,rgba(234,88,12,.16),transparent 58%),
    radial-gradient(380px 260px at -4% 50%,rgba(28,25,23,.06),transparent 55%),
    radial-gradient(220px 160px at 50% 80%,rgba(255,237,213,.45),transparent 70%);
}
html[data-theme="imbiss"] .btn-primary{color:var(--on-accent)}
html[data-theme="imbiss"] .btn-ghost{
  background:rgba(255,255,255,.78);border-color:rgba(28,25,23,.12);color:var(--txt);
}
html[data-theme="imbiss"] .card,
html[data-theme="imbiss"] .glass{background:var(--card);border-color:var(--line)}
html[data-theme="imbiss"] input,
html[data-theme="imbiss"] select,
html[data-theme="imbiss"] textarea{
  background:#fff;color:var(--txt);border-color:var(--line);
}
html[data-theme="imbiss"] .nav{background:rgba(255,255,255,.92);border-color:var(--line)}
html[data-theme="imbiss"] .lang-btn.on,
html[data-theme="imbiss"] .chip.on,
html[data-theme="imbiss"] .qty-btn.plus{color:var(--on-accent)}

@keyframes venueGlow{
  0%{transform:translate(0,0) scale(1);opacity:.85}
  100%{transform:translate(-2%,2%) scale(1.04);opacity:1}
}
@media (prefers-reduced-motion: reduce){
  html[data-theme="badi"] .bg-deco::after,
  html[data-theme="restaurant"] .bg-deco::after,
  html[data-theme="skihuette"] .bg-deco::after,
  html[data-theme="spielhalle"] .bg-deco::after,
  html[data-theme="imbiss"] .bg-deco::after{animation:none}
  .bg-sil{animation:none}
}

/* ---- Theme-Silhouetten (dezent, unten) ---- */
.bg-silhouettes{
  position:absolute;inset:auto 0 0 0;height:min(42vh,340px);
  pointer-events:none;overflow:hidden;z-index:0;
}
.bg-sil{
  display:none;position:absolute;left:50%;bottom:-2%;
  width:min(1200px,155%);height:108%;
  transform:translateX(-50%);
  color:var(--txt,#0b1f28);fill:currentColor;
  opacity:.07;
  will-change:transform;
  animation:silDrift 36s ease-in-out infinite;
}
html[data-theme="badi"] .bg-sil--badi{display:block;color:#0e7490;opacity:.13;animation-duration:40s}
html[data-theme="restaurant"] .bg-sil--restaurant{display:block;color:#7c2d12;opacity:.12;animation-duration:44s;animation-direction:reverse}
html[data-theme="skihuette"] .bg-sil--skihuette{display:block;color:#0f4c5c;opacity:.13;animation-duration:48s}
html[data-theme="spielhalle"] .bg-sil--spielhalle{display:block;color:#0891b2;opacity:.12;animation-duration:34s;animation-direction:reverse}
html[data-theme="imbiss"] .bg-sil--imbiss{display:block;color:#9a3412;opacity:.13;animation-duration:38s}
html[data-theme="home"] .bg-silhouettes{display:none}
@keyframes silDrift{
  0%{transform:translateX(-54%) translateY(4px) scale(1)}
  25%{transform:translateX(-48%) translateY(-10px) scale(1.02)}
  50%{transform:translateX(-46%) translateY(2px) scale(1.03)}
  75%{transform:translateX(-52%) translateY(-8px) scale(1.015)}
  100%{transform:translateX(-54%) translateY(4px) scale(1)}
}

/* Gast: Theme-Hintergrund + Silhouetten durchscheinen lassen */
html[data-theme="badi"] #view-gast,
html[data-theme="restaurant"] #view-gast,
html[data-theme="skihuette"] #view-gast,
html[data-theme="spielhalle"] #view-gast,
html[data-theme="imbiss"] #view-gast{
  background:transparent;
}

/* Venue-Themes: Hintergrund-Deko durchscheinen lassen (nicht nur Startseite) */
html[data-theme="badi"] body,
html[data-theme="restaurant"] body,
html[data-theme="skihuette"] body,
html[data-theme="spielhalle"] body,
html[data-theme="imbiss"] body{
  background:transparent;
}

/* ---- Betreiber-UI: Dashboard-Header (alle Themes) ---- */
html[data-theme="badi"] .admin-top,
html[data-theme="badi"] .admin-tabs,
html[data-theme="restaurant"] .admin-top,
html[data-theme="restaurant"] .admin-tabs,
html[data-theme="skihuette"] .admin-top,
html[data-theme="skihuette"] .admin-tabs,
html[data-theme="spielhalle"] .admin-top,
html[data-theme="spielhalle"] .admin-tabs,
html[data-theme="imbiss"] .admin-top,
html[data-theme="imbiss"] .admin-tabs{
  background:var(--shell-chrome);
  border-color:var(--line);
}

/* ---- Küchen-Monitor: Theme-Hintergrund (bg-deco ist aus) ---- */
html.kitchen-mode[data-theme="badi"],
html.kitchen-mode[data-theme="badi"] body,
html.kitchen-mode[data-theme="badi"] #view-kitchen.active{
  background:var(--venue-shell-bg);
}
html.kitchen-mode[data-theme="restaurant"],
html.kitchen-mode[data-theme="restaurant"] body,
html.kitchen-mode[data-theme="restaurant"] #view-kitchen.active{
  background:var(--venue-shell-bg);
}
html.kitchen-mode[data-theme="skihuette"],
html.kitchen-mode[data-theme="skihuette"] body,
html.kitchen-mode[data-theme="skihuette"] #view-kitchen.active{
  background:var(--venue-shell-bg);
}
html.kitchen-mode[data-theme="spielhalle"],
html.kitchen-mode[data-theme="spielhalle"] body,
html.kitchen-mode[data-theme="spielhalle"] #view-kitchen.active{
  background:var(--venue-shell-bg);
}
html.kitchen-mode[data-theme="imbiss"],
html.kitchen-mode[data-theme="imbiss"] body,
html.kitchen-mode[data-theme="imbiss"] #view-kitchen.active{
  background:var(--venue-shell-bg);
}
html.kitchen-mode[data-theme="badi"] .tv-login,
html.kitchen-mode[data-theme="restaurant"] .tv-login,
html.kitchen-mode[data-theme="skihuette"] .tv-login,
html.kitchen-mode[data-theme="spielhalle"] .tv-login,
html.kitchen-mode[data-theme="imbiss"] .tv-login{
  background:var(--venue-overlay);
}

/* ---- Startseite: Betreiber-Typen ---- */
.venue-grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:1rem;
}
.venue-card{
  text-align:center;padding:1.35rem 1rem;
  transition:transform .15s,box-shadow .15s;
}
.venue-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.venue-card .venue-ico{font-size:2.2rem;margin-bottom:.55rem;display:block}
.venue-card h3{font-size:1rem;margin-bottom:.35rem}
.venue-card p{font-size:.84rem;color:var(--txt-dim);line-height:1.45}
.venue-theme-badge{font-size:.68rem;vertical-align:middle}
@media (max-width:1100px){
  .venue-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:700px){
  .venue-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:480px){
  .venue-grid{grid-template-columns:1fr}
}

/* ---- TV-Abholbildschirm pro Betreibertyp ---- */
html.tv-mode #view-tv.active{
  background:var(--tv-view-bg, #071525);
}
html.tv-mode[data-theme="badi"],
html.tv-mode[data-theme="badi"] #view-tv.active{
  --tv-view-bg:#0b1f28;
  --tv-overlay:rgba(11,31,40,.96);
  --tv-overlay-soft:rgba(11,31,40,.88);
}
html.tv-mode[data-theme="restaurant"],
html.tv-mode[data-theme="restaurant"] #view-tv.active{
  --tv-view-bg:#1c1917;
  --tv-overlay:rgba(28,25,23,.96);
  --tv-overlay-soft:rgba(28,25,23,.88);
}
html.tv-mode[data-theme="skihuette"],
html.tv-mode[data-theme="skihuette"] #view-tv.active{
  --tv-view-bg:#0f172a;
  --tv-overlay:rgba(15,23,42,.96);
  --tv-overlay-soft:rgba(15,23,42,.88);
}
html.tv-mode[data-theme="spielhalle"],
html.tv-mode[data-theme="spielhalle"] #view-tv.active{
  --tv-view-bg:#0a0a0b;
  --tv-overlay:rgba(10,10,11,.96);
  --tv-overlay-soft:rgba(10,10,11,.88);
}
html.tv-mode[data-theme="imbiss"],
html.tv-mode[data-theme="imbiss"] #view-tv.active{
  --tv-view-bg:#1c1917;
  --tv-overlay:rgba(28,25,23,.96);
  --tv-overlay-soft:rgba(28,25,23,.88);
}

html.tv-mode[data-theme="restaurant"] .tv-col.prep{
  background:rgba(180,83,9,.16);border-color:rgba(180,83,9,.38);
}
html.tv-mode[data-theme="restaurant"] .tv-col.ready{
  background:rgba(180,83,9,.22);border-color:rgba(180,83,9,.5);
}
html.tv-mode[data-theme="restaurant"] .tv-col.ready .tv-num{
  background:#b45309;color:#fff;
  animation:tvpop .5s cubic-bezier(.34,1.5,.64,1),tvglow-restaurant 1.6s ease infinite alternate;
}
@keyframes tvglow-restaurant{
  from{box-shadow:0 0 12px rgba(180,83,9,.35)}
  to{box-shadow:0 0 36px rgba(180,83,9,.6)}
}

html.tv-mode[data-theme="skihuette"] .tv-col.prep{
  background:rgba(21,94,117,.16);border-color:rgba(21,94,117,.35);
}
html.tv-mode[data-theme="skihuette"] .tv-col.ready{
  background:rgba(21,94,117,.22);border-color:rgba(34,211,238,.4);
}
html.tv-mode[data-theme="skihuette"] .tv-col.ready .tv-num{
  background:#155e75;color:#fff;
  animation:tvpop .5s cubic-bezier(.34,1.5,.64,1),tvglow-skihuette 1.6s ease infinite alternate;
}
@keyframes tvglow-skihuette{
  from{box-shadow:0 0 12px rgba(21,94,117,.4)}
  to{box-shadow:0 0 36px rgba(34,211,238,.45)}
}

html.tv-mode[data-theme="spielhalle"] .tv-col.prep{
  background:rgba(8,145,178,.14);border-color:rgba(8,145,178,.35);
}
html.tv-mode[data-theme="spielhalle"] .tv-col.ready{
  background:rgba(34,211,238,.16);border-color:rgba(34,211,238,.45);
}
html.tv-mode[data-theme="spielhalle"] .tv-col.ready .tv-num{
  background:linear-gradient(135deg,#22d3ee,#0891b2);color:#0a0a0b;
  animation:tvpop .5s cubic-bezier(.34,1.5,.64,1),tvglow-spielhalle 1.6s ease infinite alternate;
}
@keyframes tvglow-spielhalle{
  from{box-shadow:0 0 12px rgba(34,211,238,.35)}
  to{box-shadow:0 0 36px rgba(34,211,238,.55)}
}

html.tv-mode[data-theme="imbiss"] .tv-col.prep{
  background:rgba(194,65,12,.14);border-color:rgba(194,65,12,.38);
}
html.tv-mode[data-theme="imbiss"] .tv-col.ready{
  background:rgba(234,88,12,.18);border-color:rgba(234,88,12,.48);
}
html.tv-mode[data-theme="imbiss"] .tv-col.ready .tv-num{
  background:linear-gradient(135deg,#ea580c,#c2410c);color:#fff;
  animation:tvpop .5s cubic-bezier(.34,1.5,.64,1),tvglow-imbiss 1.6s ease infinite alternate;
}
@keyframes tvglow-imbiss{
  from{box-shadow:0 0 12px rgba(234,88,12,.4)}
  to{box-shadow:0 0 36px rgba(194,65,12,.6)}
}

html.tv-mode[data-theme="spielhalle"] .tv-login-inner,
html.tv-mode[data-theme="spielhalle"] .tv-fs-prompt-inner,
html.tv-mode[data-theme="spielhalle"] .tv-not-configured-inner{
  background:var(--card);border-color:var(--line);
}
html.tv-mode[data-theme="spielhalle"] .tv-numpad button{
  background:var(--card-2);border:1px solid var(--line);
}

html.tv-mode[data-theme="restaurant"] .tv-table,
html.tv-mode[data-theme="skihuette"] .tv-table,
html.tv-mode[data-theme="spielhalle"] .tv-table,
html.tv-mode[data-theme="imbiss"] .tv-table{
  color:var(--txt-dim);
}

/* ---- Gast-Speisekarte pro Betreibertyp (Poster-Mockup) ---- */
html[data-theme="badi"]{
  --gast-page-bg:transparent;
  --gast-chips-bg:rgba(232,241,245,.9);
  --gast-header-bg:rgba(232,241,245,.92);
  --gast-news-accent:#0e7490;
  --gast-banner-bg:#fff;
  --gast-banner-border:transparent;
  --gast-counter-bg:rgba(14,116,144,.08);
}
html[data-theme="restaurant"]{
  --gast-page-bg:transparent;
  --gast-chips-bg:rgba(239,235,230,.9);
  --gast-header-bg:rgba(239,235,230,.92);
  --gast-news-accent:#9a3412;
  --gast-banner-bg:#fff;
  --gast-banner-border:transparent;
  --gast-counter-bg:rgba(154,52,18,.07);
}
html[data-theme="skihuette"]{
  --gast-page-bg:transparent;
  --gast-chips-bg:rgba(231,238,243,.9);
  --gast-header-bg:rgba(231,238,243,.92);
  --gast-news-accent:#155e75;
  --gast-banner-bg:#fff;
  --gast-banner-border:transparent;
  --gast-counter-bg:rgba(21,94,117,.07);
}
html[data-theme="spielhalle"]{
  --gast-page-bg:transparent;
  --gast-chips-bg:rgba(232,234,238,.9);
  --gast-header-bg:rgba(232,234,238,.92);
  --gast-news-accent:#0891b2;
  --gast-banner-bg:#fff;
  --gast-banner-border:transparent;
  --gast-counter-bg:rgba(8,145,178,.07);
}
html[data-theme="imbiss"]{
  --gast-page-bg:transparent;
  --gast-chips-bg:rgba(239,233,228,.9);
  --gast-header-bg:rgba(239,233,228,.92);
  --gast-news-accent:#c2410c;
  --gast-banner-bg:#fff;
  --gast-banner-border:transparent;
  --gast-counter-bg:rgba(194,65,12,.07);
}

#view-gast{font-family:var(--font-body)}
#view-gast .gast-badi-name,
#view-gast .menu-cat-title,
#view-gast .mi-price{
  font-family:var(--font-display, var(--font-head));
}
/* powered by ByeLine: Original-Brand-Violett, nicht Venue-Akzent */
#view-gast .gast-powered-text strong{color:#640ff9}
#view-gast .gast-legal-links a:hover{color:var(--aqua)}
#view-gast .news-card .nc-tag{background:var(--gast-news-accent, var(--aqua));color:#fff}
#view-gast .chip.on{
  background:var(--grad);color:var(--on-accent,#fff);border-color:transparent;
}
#view-gast .qty-btn.plus{
  background:var(--grad);color:var(--on-accent,#fff);border-color:transparent;
}
#view-gast .mi-price{color:var(--aqua)}
#view-gast .cart-bar-inner{
  background:var(--grad);color:var(--on-accent,#fff);
  box-shadow:0 14px 36px color-mix(in srgb, var(--aqua) 35%, transparent);
}
#view-gast .cart-bar-inner .cb-count{background:#0b1f28;color:#fff}
#view-gast .g-counter-bar{background:var(--gast-counter-bg)}

html[data-theme="restaurant"] #view-gast .gast-badi-name,
html[data-theme="restaurant"] #view-gast .menu-cat-title{font-weight:600;letter-spacing:-.03em}
html[data-theme="imbiss"] #view-gast .gast-badi-name,
html[data-theme="imbiss"] #view-gast .menu-cat-title{text-transform:uppercase;letter-spacing:-.02em}
html[data-theme="spielhalle"] #view-gast .chip.on,
html[data-theme="spielhalle"] #view-gast .qty-btn.plus{color:var(--on-accent)}
html[data-theme="spielhalle"] #view-gast .cart-bar-inner .cb-count{
  background:rgba(10,10,11,.9);color:#22d3ee;
}
html[data-theme="imbiss"] #view-gast .menu-item.has-photo .mi-media{
  flex-basis:60px;width:60px;height:60px;
}

/* TV-Modus: Hintergrund + html/body an Betreibertyp koppeln */
html.tv-mode,
html.tv-mode body{background:var(--tv-view-bg, #071525)}