/* === Kickerbay – Global Theme (auth.css) =============================== */
/* Farb-/UI-Tokens: überall gleich benutzen */
:root{
  /* Grundfarben */
  --kb-bg:#0a0f17;
  --kb-fg:#e6edf3;

  /* Surface/Border */
  --kb-card-bg:rgba(255,255,255,.04);
  --kb-border:1px solid rgba(255,255,255,.12);

  /* Textabstufungen */
  --kb-ink:#f2f6ff;
  --kb-ink-muted:#a8b5c6;

  /* Akzente */
  --kb-primary:#3b82f6;    /* Blau (Buttons) */
  --kb-success:#10b981;    /* Grün */
  --kb-warning:#eab308;    /* Gelb */
  --kb-error:#ef4444;      /* Rot */

  /* Layout */
  --kb-radius:18px;
  --kb-radius-sm:12px;
  --kb-shadow:0 12px 30px rgba(0,0,0,.45);
}

/* Baseline */
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  background:var(--kb-bg);
  color:var(--kb-fg);
  font:16px/1.6 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Inter, "SF Pro Display", sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}

/* Karten / Container */
.card{
  background:var(--kb-card-bg);
  border:var(--kb-border);
  border-radius:var(--kb-radius-sm);
}

/* Typographie-Helfer */
h1,h2,h3,h4,strong{ color:var(--kb-ink); }
.muted, .meta{ color:var(--kb-ink-muted); }

/* Buttons (Standard + Chip) */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  border:0; border-radius:10px; cursor:pointer; user-select:none;
  padding:10px 12px; min-height:44px;
  background:var(--kb-primary); color:#081018; font-weight:800;
}
.btn:hover{ filter:brightness(1.05); }
.btn:active{ transform:translateY(1px); }

.btn.chip{
  min-height:36px; padding:8px 12px; line-height:1;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);
  color:#eef4ff;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);
}
.btn.chip:hover{ background:rgba(255,255,255,.12); }

/* Sound-Chip Zustände (optional) */
#btnSound.muted{
  background:rgba(148,163,184,.15);
  border-color:rgba(148,163,184,.35);
  color:#dbe5f5;
}
#btnSound:not(.muted){
  background:rgba(234,179,8,.15);
  border-color:rgba(234,179,8,.35);
  color:#fff9db;
}

/* Inputs */
input[type="text"], input[type="email"], input[type="password"], textarea, select{
  width:100%;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.04);
  color:var(--kb-ink);
  border-radius:12px;
  padding:12px 14px;
  outline:none;
}
::placeholder{ color:#9aa7b3; }

/* Links */
a{ color:#93c5fd; text-decoration:none; }
a:hover{ text-decoration:underline; }

/* Avatare */
.avatar{ width:36px; height:36px; border-radius:999px; object-fit:cover;
  border:1px solid rgba(255,255,255,.18); }

/* Poll-Karte (angepinnt) dunkelgrün, gut lesbar */
.poll-sticky{
  background:#0f2e23;                            /* Dark Green Surface */
  border:1px solid rgba(16,185,129,.35);         /* success-Grün Border */
  color:var(--kb-ink);
  border-radius:var(--kb-radius-sm);
}

/* ====== Login/Neon (kompatibel zu deinem bisherigen Markup) ========= */
body.kb-bg{
  min-height:100vh; display:grid; place-items:center;
  background:#0a0f17 url("/assets/img/kb_login_bg.png") center/cover no-repeat fixed;
  color:var(--kb-fg);
}

.kb-card{
  width:min(92vw, 520px);
  padding:26px 22px 22px;
  background: rgba(10,12,18,0.78);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border-radius: var(--kb-radius);
  box-shadow: var(--kb-shadow);
  position:relative;
}

.kb-title{
  font-weight:900; font-size: clamp(24px, 6vw, 32px); text-align:center; margin:0 0 12px;
  background: linear-gradient(90deg,#22d3ee,#3b82f6,#a78bfa,#f472b6,#f59e0b,#22d3ee);
  background-size: 220% 100%; background-position:0% 50%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  text-shadow:0 0 6px rgba(34,211,238,.7), 0 0 14px rgba(59,130,246,.6);
}

.kb-input{ composes: input from none; } /* (No-op: nur zur Lesbarkeit) */
.kb-input{
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:var(--kb-ink);
  border-radius:12px;
  padding:12px 14px;
  margin:8px 0 10px;
}
.kb-input::placeholder{ color:#9aa7b3; }

.kb-btn{
  width:100%;
  border:0; border-radius:12px; padding:12px 16px;
  color:#0a0f17; font-weight:800; cursor:pointer;
  background:linear-gradient(90deg,var(--kb-success),var(--kb-primary));
}

.kb-msg{
  margin:8px 0 6px; padding:10px 12px; border-radius:10px; font-size:.95rem;
}
.kb-msg.ok { background:rgba(16,185,129,.12); border:1px solid rgba(16,185,129,.35); }
.kb-msg.err{ background:rgba(239,68,68,.12);  border:1px solid rgba(239,68,68,.35); }

.kb-back{ text-align:center; margin-top:10px; }
.kb-back a{ color:#93c5fd; text-decoration:none; }
