/* Snake – Widget (Embed-Variante)
 * Laedt NACH pages/snake.css (+ game-toolbar/highscore-panel bei Spielen).
 * Kompakte Raender fuer iframe-Einbindung, Badge-Abstand unten rechts.
 */

body.boza-widget.page-snake {
    padding: 12px;
}

body.boza-widget.page-snake .container {
    max-width: 660px;
    padding: 0;
}

/* Platz fuer die Badge unten rechts */
body.boza-widget.page-snake .main-card {
    margin-bottom: 40px;
}

/* Compact-Modus (?compact=true): Header reduzieren */
body.boza-widget.page-snake.compact .card-header h1 {
    font-size: 1.35em;
}

body.boza-widget.page-snake.compact .card-header p {
    display: none;
}

/* Akzentfarbe (?accent=hex) – gilt fuer Geschwindigkeits-Button + Start-Overlay */
body.boza-widget.page-snake .speed-btn.active,
body.boza-widget.page-snake .start-overlay {
    background: linear-gradient(135deg, var(--c-accent, #667eea) 0%, var(--c-accent-2, #764ba2) 100%);
    color: #fff;
}

/* ==== Drumherum-Anpassung (?card/text/muted/accent) – aktives Canvas bleibt original ==== */

/* Score-Board: Container + Labels */
body.boza-widget.themed.page-snake .score-board {
    background: var(--c-surface, #f0f3ff);
}

body.boza-widget.themed.page-snake .score-label {
    color: var(--c-muted, #7a7a90);
}

/* Punktfarben (gelb/cyan/magenta) bleiben original – sie codieren Spiel-Info */

/* Highscore-Panel: Container + Titel */
body.boza-widget.themed.page-snake .hs-panel {
    background: var(--c-surface, #f0f3ff);
}

body.boza-widget.themed.page-snake .hs-board-title {
    color: var(--c-muted, #7a7a90);
}

/* Highscore-Buttons (immer accent, wenn gesetzt) */
body.boza-widget.page-snake .hs-btn {
    background: linear-gradient(135deg, var(--c-accent, #667eea) 0%, var(--c-accent-2, #764ba2) 100%);
}

/* Mobile-Touch-Steuerung (Buttons) */
body.boza-widget.page-snake .mobile-btn {
    background: var(--c-accent, #667eea);
    border-color: var(--c-accent-2, #764ba2);
    color: var(--c-accent-text, #fff);
}

/* Control-Buttons in der Toolbar: Icons dezent an Akzent binden */
body.boza-widget.page-snake .control-btn:hover {
    color: var(--c-accent, inherit);
}


/* Highscore-Panel: Toggle-Icon an Akzent binden */
body.boza-widget.page-snake .hs-toggle > i:first-child {
    color: var(--c-accent, #667eea);
}

/* Highscore-Buttons: Textfarbe an accentText binden */
body.boza-widget .hs-btn {
    color: var(--c-accent-text, #fff);
}