/* Global transparent theme with #05EE88 accent */
:root {
  --bg-primary: #0f1419;
  --bg-secondary: #1a1f2e;
  /* Globaler Glas/Gradient-Hintergrund mit SEHR hoher Transparenz (Hintergrundbilder durchscheinen) */
  --bg-card: linear-gradient(180deg, rgba(5,238,136,0.008) 0%, rgba(0,0,0,0.25) 100%);
  --text-primary: #ffffff;
  --text-secondary: #b8bcc8;
  --accent-green: #05EE88;
  --accent-gold: #ffd700;
  --border-color: rgba(5,238,136,0.08);
  --hover-bg: rgba(5, 238, 136, 0.06);
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Verhindert weißen Flash beim Laden */
html {
  background: #0C1117;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  /* Fallback statisches Bild + Dynamisches System */
  background: linear-gradient(0deg, rgba(15,20,25,0.7), rgba(15,20,25,0.7)), url('/assets/bilder/BG.png') center/cover no-repeat fixed;
  color: var(--text-primary);
  line-height: 1.6;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 0; /* Body auf z-index 0, damit -1 dahinter ist */
}

/* Main Content über dem Hintergrund */
main {
  position: relative;
  z-index: 1;
  flex: 1;
}

/* Header wie Original */
.site-header {
  position: sticky;
  top: 0;
  z-index: 1000; /* Über allem (inkl. Dynamic BG) */
  background: var(--bg-card);
  border-bottom: 1px solid var(--border-color);
  padding: 1rem 0;
  box-shadow: 0 2px 10px rgba(0,0,0,0.25);
  backdrop-filter: blur(24px) saturate(220%);
  -webkit-backdrop-filter: blur(24px) saturate(220%);
}

/* Header-Inhalt auf Content-Breite beschränken (wie main) */
.site-header > div {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 2rem;
}

.site-header h1 {
  color: var(--accent-green);
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 0.5rem;
  text-align: center;
}

.brand{display:flex;align-items:center;gap:8px;justify-content:center}
.brand-logo-bar{display:flex;align-items:center;justify-content:center;margin-top:6px}
.brand-logo{height:44px;width:auto;display:inline-block;transform:translate(-2.0cm, -1cm);animation:logo-rot 24s linear infinite reverse;transform-origin:center}

@keyframes logo-rot {
  0% { transform: rotateY(0deg); }
  50% { transform: rotateY(180deg); }
  100% { transform: rotateY(360deg); }
}

.site-header nav {
  display: flex;
  gap: 2rem;
  justify-content: center;
}

.site-header nav a {
  color: var(--text-secondary);
  text-decoration: none;
  font-weight: 500;
  padding: 0.5rem 0;
  border-bottom: 2px solid transparent;
  transition: all 0.3s ease;
}

.site-header nav a:hover,
.site-header nav a.active {
  color: var(--accent-green);
  border-bottom-color: var(--accent-green);
}

/* Main Content */
main {
  flex: 1;
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem;
  width: 100%;
}

/* Hero Section */
.hero {
  background: var(--bg-card);
  padding: 3rem 2rem;
  border-radius: 12px;
  margin-bottom: 2rem;
  text-align: center;
  border: 1px solid var(--border-color);
  backdrop-filter: blur(24px) saturate(220%);
  -webkit-backdrop-filter: blur(24px) saturate(220%);
}

.hero h1 {
  font-size: 2.5rem;
  color: var(--accent-green);
  margin-bottom: 1rem;
}

.hero p {
  font-size: 1.2rem;
  color: var(--text-secondary);
  max-width: 600px;
  margin: 0 auto;
}

/* Cards/Sections */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.5rem;
  margin: 2rem 0;
}

/* Startseiten-Grid mit festen Bereichen, um die Karten gezielt anzuordnen */
@media (min-width: 900px){
  .home-grid{
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: auto;
    grid-template-areas:
      "server soon"
      "last drivers";
  }
  .home-grid .card-server{ grid-area: server; }
  .home-grid .card-soon{ grid-area: soon; }
  .home-grid .card-last{ grid-area: last; }
  .home-grid .card-drivers{ grid-area: drivers; }
}

/* Feste 3-Spalten-Grid für Events, damit Boxen gleich groß bleiben */
.events-grid { grid-template-columns: repeat(3, minmax(300px, 1fr)); }
@media (max-width: 1100px){ .events-grid { grid-template-columns: repeat(2, minmax(300px, 1fr)); } }
@media (max-width: 768px){ .events-grid { grid-template-columns: 1fr; } }

.card {
  background: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  padding: 1.5rem;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  backdrop-filter: blur(24px) saturate(220%);
  -webkit-backdrop-filter: blur(24px) saturate(220%);
  position: relative;
  overflow: hidden;
}

.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(5,238,136,0.22), 0 0 0 1px rgba(5,238,136,0.35) inset;
}

/* Sanftes Dauerblinken für Events, die in < 1h starten */
@keyframes pulse-glow {
  0% { box-shadow: 0 0 0 0 rgba(5,238,136,0.22), 0 0 0 1px rgba(5,238,136,0.30) inset; }
  50% { box-shadow: 0 0 28px 4px rgba(5,238,136,0.35), 0 0 0 1px rgba(5,238,136,0.50) inset; }
  100% { box-shadow: 0 0 0 0 rgba(5,238,136,0.22), 0 0 0 1px rgba(5,238,136,0.30) inset; }
}
.event-soon {
  animation: pulse-glow 1.6s ease-in-out infinite;
}
.event-soon:hover {
  animation-duration: 1.2s;
}

.card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 120% at 50% 0%, rgba(5,238,136,0.18), transparent 60%);
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
}

.card:hover::after {
  opacity: 1;
}

.card h3 {
  color: var(--accent-green);
  margin-bottom: 1rem;
  font-size: 1.3rem;
}

/* Event-Titel über dem Bild */
.event-title{ color: var(--accent-green); margin: 0 0 .35rem 0; font-size: 1.15rem; font-weight: 800; }

.card p {
  color: var(--text-secondary);
  line-height: 1.6;
}

/* Event-Metadaten untereinander */
.event-meta{
  color: var(--text-secondary);
  font-size: 0.95rem;
  line-height: 1.5;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
/* Label/Value-Zeile mit Ellipsis bei langen Inhalten */
.meta-row{ display:flex; gap:6px; align-items:baseline; }
.meta-label{ flex:0 0 auto; font-weight:700; }
.meta-value{ flex:1 1 auto; min-width:0; }
.truncate{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* Hilfsklasse: verhindert Zeilenumbruch */
.nowrap{ white-space: nowrap; }
@media (max-width: 768px){
  .event-meta{ font-size: 0.9rem; }
}

/* Tabellen wie Original */
.table-container {
  background: var(--bg-card);
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--border-color);
  margin: 1.5rem 0;
  backdrop-filter: blur(24px) saturate(220%);
  -webkit-backdrop-filter: blur(24px) saturate(220%);
}

.table-header {
  background: linear-gradient(180deg, rgba(5,238,136,0.05) 0, rgba(255,255,255,0.10) 60%);
  padding: 1rem 1.5rem;
  border-bottom: 1px solid var(--border-color);
}

.table-header h2 {
  color: var(--accent-green);
  font-size: 1.5rem;
  margin: 0;
}

table {
  width: 100%;
  border-collapse: collapse;
  background: transparent;
}

th, td {
  padding: 1rem 1.5rem;
  text-align: left;
  border-bottom: 1px solid var(--border-color);
}

th {
  background: linear-gradient(180deg, rgba(5,238,136,0.03) 0, rgba(255,255,255,0.06) 60%);
  color: var(--accent-green);
  font-weight: 600;
  text-transform: uppercase;
  font-size: 0.85rem;
  letter-spacing: 0.5px;
  backdrop-filter: blur(20px) saturate(210%);
  -webkit-backdrop-filter: blur(20px) saturate(210%);
}

tbody tr {
  transition: background-color 0.2s ease;
  background: transparent;
}

tbody tr:hover {
  background: linear-gradient(90deg, rgba(5,238,136,0.10) 0%, rgba(5,238,136,0.00) 80%);
  box-shadow: inset 0 0 0 1px rgba(5,238,136,0.30);
}
/* Bei Vorhandensein spezieller Zellen diese mitbetonen */
tbody tr:hover .col-fahrer strong { color: var(--accent-green); text-shadow: 0 0 6px rgba(5,238,136,0.45); }
tbody tr:hover .pos-pill { border-color: rgba(5,238,136,0.60); }
/* Delta Styles */
.delta { font-weight: 600; color: #b8bcc8; }
.delta.pos { color: #00e676; }
.delta.neg { color: #ff5252; }

/* Badges */
.badge {
  display: inline-block;
  padding: 0.2rem 0.5rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.3px;
  border: 1px solid rgba(255,255,255,0.12);
  backdrop-filter: blur(4px);
}
.badge-pace-low { background: rgba(29,185,84,0.12); color: #7dd3a7; }
.badge-pace-mid { background: rgba(29,185,84,0.18); color: #57c88f; }
.badge-pace-high { background: rgba(29,185,84,0.25); color: #1db954; }
.badge-pace-elite { background: rgba(255,215,0,0.22); color: #ffd700; }

.badge-score-sting { background: rgba(255,82,82,0.18); color: #ff8686; }
.badge-score-swarm { background: rgba(255,193,7,0.18); color: #ffde7a; }
.badge-score-hive { background: rgba(29,185,84,0.18); color: #57c88f; }
.badge-score-queen { background: rgba(29,185,84,0.28); color: #1db954; }

/* Positions-Pill wie in sessions.php */
.pos-pill{
  display:inline-block;
  min-width:28px;
  padding:2px 8px;
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.10);
  font-weight:700;
}
.pos-cell{display:flex;align-items:center;gap:8px}

/* Medaillen (Top 3) wie in sessions.php */
.medal{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;font-weight:800;color:#111;border:1px solid rgba(0,0,0,0.16);box-shadow:inset 0 0 6px rgba(0,0,0,0.10), 0 0 6px rgba(0,0,0,0.10)}
.medal.gold{background:#d4af37}
.medal.silver{background:#c0c0c0}
.medal.bronze{background:#cd7f32}

/* Numerischer Pager */
.pager{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:10px}
.pager a{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;border:1px solid var(--border-color);text-decoration:none;color:#fff;font-weight:800;font-size:12px;background:rgba(5,238,136,0.06)}
.pager a.active{background:rgba(5,238,136,0.22);border-color:var(--accent-green)}
.pager .dots{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;color:var(--text-secondary)}

/* Pace-Klassen (Mythos..Zelle) – passend zu sessions.php */
.badge-pace-zelle{background:#374151;color:#9ca3af;border-color:#4b5563}
.badge-pace-wabe{background:#065f46;color:#10b981;border-color:#059669}
.badge-pace-sammler{background:linear-gradient(135deg,#6d4c41,#cd7f32);color:#1b1b1b;border-color:#a97142}
.badge-pace-waechter{background:linear-gradient(135deg,#9e9e9e,#c0c0c0);color:#111;border-color:#a9a9a9}
.badge-pace-krone{background:linear-gradient(135deg,#b8860b,#ffd700);color:#111;border-color:#d4af37}
.badge-pace-regent{background:linear-gradient(135deg,#5b21b6,#8b5cf6);color:#f3e8ff;border-color:#7c3aed}
.badge-pace-souveraen{background:linear-gradient(135deg,#7f1d1d,#ef4444);color:#fee2e2;border-color:#b91c1c}
.badge-pace-mythos{background:linear-gradient(135deg,#0ea5e9,#2563eb);color:#e0f2fe;border-color:#1d4ed8}

/* Safety-Klassen (Queen/Hive/Swarm/Sting) – passend zu sessions.php */
.badge-safety-queen{background:#8B5CF6;color:#fff;border-color:#7C3AED}
.badge-safety-hive{background:#10B981;color:#052e2b;border-color:#059669}
.badge-safety-swarm{background:#F59E0B;color:#4a2a00;border-color:#D97706}
.badge-safety-sting{background:#DC2626;color:#fff;border-color:#991B1B}

tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.01);
}

td a {
  color: var(--accent-green);
  text-decoration: none;
  font-weight: 500;
}

td a:hover {
  text-decoration: underline;
}

/* Deutlicher Profil-Link für Fahrernamen */
.driver-link{color:var(--accent-green);font-weight:800;text-decoration:none;position:relative}
.driver-link:hover{text-decoration:underline}
.driver-link::after{content:'↗';font-size:12px;margin-left:6px;opacity:0;transform:translateY(-1px);transition:opacity .2s ease;color:var(--accent-green)}
.driver-link:hover::after{opacity:1}

/* Buttons */
.btn {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background: var(--accent-green);
  color: white;
  text-decoration: none;
  border-radius: 6px;
  font-weight: 500;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
}

.btn:hover {
  background: #16a34a;
  transform: translateY(-1px);
}

.btn-secondary {
  background: rgba(15,30,24,0.25);
  border: 1px solid var(--border-color);
}

.btn-secondary:hover {
  background: var(--bg-card);
}

/* News Section */
.news-grid {
  display: grid;
  gap: 1rem;
}

.news-item {
  background: rgba(20,35,28,0.23);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 1.5rem;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  position: relative;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.news-item::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 120% at 50% 0%, rgba(29,185,84,0.18), transparent 60%);
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
}

.news-item:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(29,185,84,0.22), 0 0 0 1px rgba(29,185,84,0.35) inset;
}

.news-item:hover::after {
  opacity: 1;
}

.news-item h4 {
  color: var(--accent-green);
  margin-bottom: 0.5rem;
}

/* Einheitliche Blog-Cover-Bilder */
.news-cover {
  display: block;
  width: 100%;
  height: 220px; /* kompakter, volle Breite */
  object-fit: cover; /* füllt die gesamte Breite/Höhe aus */
  background: #000; /* Fallback-Hintergrund */
  border-radius: 8px;
  cursor: zoom-in;
}

/* Lightbox für Vollbildanzeige (zeigt das gesamte Bild) */
.lightbox-overlay{
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,0.85);
  display: flex; align-items: center; justify-content: center;
  padding: 2rem;
}
.lightbox-overlay img{
  max-width: 92vw; max-height: 92vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.6);
}
.lightbox-close{
  position: fixed; top: 16px; right: 16px;
  background: rgba(255,255,255,0.1);
  color: #fff; border: 1px solid rgba(255,255,255,0.2);
  padding: 6px 10px; border-radius: 6px; cursor: pointer;
}

.news-item .date {
  color: var(--text-secondary);
  font-size: 0.9rem;
  margin-bottom: 1rem;
}

/* Footer wie Original */
.site-footer {
  background: var(--bg-card);
  border-top: 1px solid var(--border-color);
  padding: 2rem;
  text-align: center;
  color: var(--text-secondary);
  margin-top: auto;
  backdrop-filter: blur(24px) saturate(220%);
  -webkit-backdrop-filter: blur(24px) saturate(220%);
}

.site-footer p {
  margin: 0;
}

.site-footer a {
  color: var(--accent-green);
  text-decoration: none;
}

.site-footer a:hover {
  text-decoration: underline;
}

/* Responsive für Tablets und Handys */
@media (max-width: 1024px) {
  .site-header {
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
  }
  
  .site-header nav {
    flex-wrap: wrap;
    justify-content: center !important;
    gap: 1rem;
  }
  
  .site-header nav .brand-logo {
    height: 32px !important;
  }
  
  .columns {
    flex-direction: column;
  }
  
  .tracks-box {
    flex: 1 1 auto;
    margin-bottom: 1rem;
  }
  
  .dashboard-box {
    flex: 1 1 auto;
  }
}

/* Rating-Benachrichtigungen */
@keyframes bell-ring {
  0%, 100% { transform: rotate(0deg); }
  10%, 30%, 50%, 70%, 90% { transform: rotate(-10deg); }
  20%, 40%, 60%, 80% { transform: rotate(10deg); }
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.3); }
}

@media (max-width: 768px) {
  .site-header {
    flex-direction: column !important;
    align-items: center !important;
    padding: 1rem !important;
    gap: 0.75rem !important;
  }
  
  .brand-logo {
    display: none !important;
  }
  
  .header-right {
    order: 2;
    flex-direction: column-reverse !important;
    gap: 8px !important;
    margin: 0 !important;
  }
  
  #mobile-menu-toggle {
    display: block !important;
    height: 40px;
    padding: 8px 14px !important;
  }
  
  .steam-login-area {
    display: flex !important;
    margin-left: 60px;
  }
  
  .steam-login-area a,
  .steam-login-area > div {
    width: 100%;
    max-width: 280px;
    justify-content: center;
  }
  
  .steam-login-area a {
    flex-direction: row !important;
    gap: 8px !important;
  }
  
  .steam-login-area img[src*="steam_login"] {
    height: 32px !important;
  }
  
  #main-nav {
    display: none !important;
    position: fixed;
    top: 60px;
    left: 0;
    right: 0;
    background: rgba(11,15,19,0.98);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 2px solid rgba(5,238,136,0.3);
    flex-direction: column !important;
    padding: 0.5rem;
    gap: 0 !important;
    z-index: 1000;
    box-shadow: 0 8px 24px rgba(0,0,0,0.6);
    max-height: 80vh;
    overflow-y: auto;
  }
  
  #main-nav.mobile-open {
    display: flex !important;
  }
  
  #main-nav a {
    padding: 1rem 1.5rem;
    border-bottom: 1px solid rgba(5,238,136,0.15);
    width: 100%;
    text-align: left;
    font-size: 15px;
    font-weight: 600;
    color: #fff !important;
  }
  
  #main-nav a:hover {
    background: rgba(5,238,136,0.1);
  }
  
  #main-nav a:last-child {
    border-bottom: none;
  }
  
  main {
    padding: 0.5rem;
  }
  
  .hero {
    padding: 1.5rem 1rem;
  }
  
  .hero h1 {
    font-size: 1.8rem;
  }
  
  .hero h2 {
    font-size: 1.2rem;
  }
  
  .hero p {
    font-size: 0.95rem;
  }
  
  .card-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  
  .home-grid {
    grid-template-columns: 1fr;
  }
  
  .kpi-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  
  .table-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .dashboard-scroller {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  .results-table {
    min-width: 800px;
    font-size: 10px;
    display: block;
  }
  
  .results-table thead,
  .results-table tbody {
    display: table;
    width: 100%;
    table-layout: fixed;
  }
  
  .results-table th,
  .results-table td {
    padding: 4px 2px;
    font-size: 10px;
  }
  
  /* Scrollbar-Hinweis für Tabellen */
  .dashboard-scroller::after {
    content: '← Swipe →';
    display: block;
    text-align: center;
    color: var(--text-secondary);
    font-size: 10px;
    padding: 4px;
    opacity: 0.5;
  }
  
  th, td {
    padding: 0.5rem 0.25rem;
    font-size: 12px;
  }
  
  .badge {
    font-size: 10px;
    padding: 3px 6px;
  }
  
  .pos-pill {
    min-width: 24px;
    padding: 2px 6px;
    font-size: 12px;
  }
  
  /* Chat für Mobile kleiner */
  #chat-widget {
    width: calc(100vw - 40px) !important;
    max-width: 320px !important;
    height: 350px !important;
    bottom: 10px !important;
    right: 10px !important;
  }
  
  /* Steam Login in Header kleiner */
  .site-header nav > a[href="/steam_login.php"] img {
    height: 28px !important;
  }
}

/* Event-Cover – visuell hervorgehoben in Kacheln */
.event-cover-wrap{
  position: relative;
  width: 100%;
  height: 220px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}
.event-highlight{ outline:2px solid var(--accent-green); box-shadow: 0 0 0 3px rgba(5,238,136,0.25); }
.event-cover-wrap::after{
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.00) 50%, rgba(0,0,0,0.25) 100%);
  pointer-events: none;
}
.event-cover{
  width: 100%; height: 100%; object-fit: cover; display:block;
  transform: scale(1.0);
  transition: transform .5s ease;
}
.card:hover .event-cover{ transform: scale(1.05); }

@media (max-width: 768px){
  .event-cover-wrap{ height: 160px; }
}

/* Overlay-Label im Bild */
.event-cover-tag{
  position: absolute;
  left: 8px; bottom: 8px;
  background: rgba(0,0,0,0.45);
  backdrop-filter: blur(4px);
  color: #fff;
  padding: 6px 10px;
  border-radius: 6px;
  font-weight: 700;
  font-size: .92rem;
  line-height: 1.2;
  max-width: calc(100% - 16px);
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
}

/* Eventname oben links im Bild (grün) */
.event-cover-title{
  position: absolute;
  left: 8px; top: 8px;
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(4px);
  color: var(--accent-green);
  padding: 6px 10px;
  border-radius: 6px;
  font-weight: 800;
  font-size: 1rem;
  line-height: 1.2;
  max-width: calc(100% - 16px);
  text-shadow: 0 1px 2px rgba(0,0,0,0.6);
}

/* Anmeldeleiste */
.event-register {
  margin-top: 10px;
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.event-register input[type="number"],
.event-register input[type="text"]{
  background: rgba(0,0,0,0.25);
  border: 1px solid var(--border-color);
  color: #fff;
  border-radius: 6px;
  padding: 6px 8px;
}
.event-register .small-note{ color: var(--text-secondary); font-size: .85rem; }
.btn-danger{ background:#ef4444; border:1px solid rgba(239,68,68,.35); }
.btn-danger:hover{ background:#dc2626; }

/* Badge für sichtbares Server-Passwort */
.pw-badge{
  display:inline-block;
  background:#ef4444;
  color:#ffffff;
  padding:2px 8px;
  border-radius:6px;
  border:1px solid rgba(239,68,68,0.35);
  font-weight:800;
}