* { box-sizing: border-box; }
body { margin: 0; font-family: "Segoe UI", Arial, sans-serif; background: #f4f6fa; color: #1d2433; transition: background 0.3s, color 0.3s; }
img { max-width: 100%; }

/* --- DARK MODE --- */
body.dark-mode { background: #1a1a1a; color: #e0e0e0; }
body.dark-mode .hero, body.dark-mode .presentation-header, body.dark-mode .search, body.dark-mode .card, body.dark-mode .winner-card, body.dark-mode .admin-box, body.dark-mode .dashboard-card, body.dark-mode .login-box { background: #2d2d2d !important; color: #ffffff !important; }
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, body.dark-mode p { color: #ffffff !important; }
body.dark-mode .ticket { color: #ffffff !important; }
body.dark-mode .ticket.waiting { color: #999 !important; }

/* --- HEADER --- */
.hero, .presentation-header { text-align: center; padding: 40px 20px; background: white; }
.logo { width: 280px !important; margin-bottom: 20px; }
.hero h1, .presentation-header h1 { font-size: clamp(32px, 5vw, 55px); margin: 10px; }

/* --- SUCHE --- */
.search { max-width: 900px; margin: 30px auto; padding: 30px; background: white; border-radius: 25px; box-shadow: 0 10px 30px rgba(0,0,0,.08); }
input { width: 100%; padding: 16px; border-radius: 15px; border: 1px solid #ccc; font-size: 18px; margin: 8px 0; }
button { padding: 15px 25px; border: none; border-radius: 15px; cursor: pointer; font-size: 18px; background: #1b4d89; color: white; }

/* --- GEWINNERKARTEN --- */
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; padding: 20px; }
.card, .winner-card { background: white; border-radius: 25px; padding: 30px; text-align: center; box-shadow: 0 8px 25px rgba(0,0,0,.08); }
.card h3 { font-size: 1.4rem; margin: 0 0 15px 0; line-height: 1.3; }
.ticket { font-size: 24px !important; font-weight: 700; margin-top: 15px; color: #333; }
.ticket.waiting { font-size: 18px !important; color: #666; font-style: italic; }

/* --- ADMIN & SONSTIGES --- */
.admin { min-height: 100vh; }
.admin-header { display: flex; justify-content: space-between; align-items: center; padding: 25px; background: white; }
.admin-box { max-width: 900px; margin: 30px auto; padding: 30px; background: white; border-radius: 25px; }
.dashboard-card { display: inline-block; width: 280px; margin: 15px; padding: 30px; background: white; border-radius: 25px; text-align: center; }

/* --- BEAMER DESIGN --- */
.presentation { background: #1a1a1a !important; color: white; min-height: 100vh; padding: 20px; }
.beamer-logo { width: 200px !important; margin-bottom: 15px; }
.beamer-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important; gap: 20px !important; width: 100% !important; margin-top: 20px; }
.hero-box { grid-column: 1 / -1 !important; background: #fff8e1 !important; color: #1d2433 !important; padding: 30px !important; border-radius: 25px !important; border: 6px solid #ffc107 !important; text-align: center !important; margin-bottom: 20px !important; }
.beamer-card-item { background: white !important; color: #1d2433 !important; border-radius: 20px !important; padding: 20px !important; text-align: center !important; box-shadow: 0 8px 20px rgba(0,0,0,0.3) !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }

/* --- STIL FÜR OFFENE PREISE (BEAMER & ÖFFENTLICH) --- */
.beamer-card-item.is-open, .card.is-open {
    border: 3px dashed #888 !important;
    background: #f0f0f0 !important;
}

@media(max-width:700px){
    .admin-header { flex-direction:column; gap:15px; }
    .dashboard-card { width:90%; }
}