/* navbar-offen.css — NEUER Baustein (UNIVERSAL §21 Regel 2/4), NICHT in die App eingebunden.
   „Offene Navbar": Die Leiste hat die Farbe der Seite (kein Navy-Streifen), keine Trennlinie, keinen Schatten.
   Die Knöpfe stehen frei, ohne Rahmen; damit man sie trotzdem sieht, tragen sie Farbe:
     · Login          — Schrift in der Akzentfarbe, bei Überfahren eine helle Fläche
     · Sign Up        — gefüllt in der Akzentfarbe, weiße Schrift (Hauptknopf)
     · Sprachwahl     — dunkle Schrift auf heller Fläche, ohne Rahmen
   Überschreibt den Block „BRAND NAVY OVERRIDE" (css/navbar.css, ab Zeile 2026). Wirkt NUR mit <html data-navbar="offen">;
   als letztes Stylesheet laden. Nutzt nur Tokens der aktiven Farbwelt (--bg-base, --accent, --text-*).
   Gesehen im Mockup: mockups/mockup-kirsch-gross.html, mockup-sw-gross.html */

:root[data-navbar="offen"] .nav,
:root[data-navbar="offen"] .unified-navbar,
:root[data-navbar="offen"] .lang-nav {
    background: var(--bg-base);
    border-bottom: 0;
    box-shadow: none;
}

/* Logo und Links */
:root[data-navbar="offen"] .unified-brand-name,
:root[data-navbar="offen"] .lang-nav-brand-name,
:root[data-navbar="offen"] .unified-logo { color: var(--text-primary); }
:root[data-navbar="offen"] .unified-nav-link,
:root[data-navbar="offen"] .nav-link { color: var(--text-secondary); }
:root[data-navbar="offen"] .unified-nav-link:hover,
:root[data-navbar="offen"] .unified-nav-link.active,
:root[data-navbar="offen"] .nav-link:hover { color: var(--text-primary); }
:root[data-navbar="offen"] .unified-nav-link.active::after { background: var(--accent); }

/* Eingeloggte Navbar (Klassen .lang-nav-*): gleiche Regeln wie oben */
:root[data-navbar="offen"] .lang-nav .lang-nav-link,
:root[data-navbar="offen"] .lang-nav a.lang-nav-link,
:root[data-navbar="offen"] .lang-nav button.lang-nav-link { color: var(--text-secondary); }
:root[data-navbar="offen"] .lang-nav .lang-nav-link:hover,
:root[data-navbar="offen"] .lang-nav .lang-nav-link.is-active,
:root[data-navbar="offen"] .lang-nav .lang-nav-link.active { color: var(--text-primary); }
:root[data-navbar="offen"] .lang-nav .lang-nav-link.is-active::after,
:root[data-navbar="offen"] .lang-nav .lang-nav-link.active::after { background: var(--accent); }
:root[data-navbar="offen"] .lang-nav .lang-nav-link--logout { color: var(--text-muted); }
:root[data-navbar="offen"] .lang-nav .lang-nav-btn,
:root[data-navbar="offen"] .lang-nav a.lang-nav-btn,
:root[data-navbar="offen"] .lang-nav button.lang-nav-btn {
    background: var(--bg-subtle);
    border: 0;
    color: var(--text-primary);
}
/* Hover: leichter Farbton der Schriftfarbe statt --border-default (im S/W-Design ist der schwarz wie die Schrift → Text unsichtbar). */
:root[data-navbar="offen"] .lang-nav .lang-nav-btn:hover {
    background: color-mix(in srgb, var(--text-primary) 12%, var(--bg-subtle));
    color: var(--text-primary);
}
:root[data-navbar="offen"] .lang-nav .lang-nav-btn.primary { background: var(--accent); color: var(--text-on-accent); }

/* Knöpfe: alle ohne Rahmen */
:root[data-navbar="offen"] .unified-action-item,
:root[data-navbar="offen"] .language-switcher-btn {
    border: 0;
    box-shadow: none;
}
:root[data-navbar="offen"] .unified-action-item {
    background: transparent;
    color: var(--accent);
    font-weight: 600;
}
:root[data-navbar="offen"] .unified-action-item:hover { background: var(--bg-subtle); color: var(--accent-hover); }
:root[data-navbar="offen"] .unified-action-item.primary {
    background: var(--accent);
    color: var(--text-on-accent);
}
:root[data-navbar="offen"] .unified-action-item.primary:hover { background: var(--accent-hover); color: var(--text-on-accent); }

:root[data-navbar="offen"] .language-switcher-btn {
    background: var(--bg-subtle);
    color: var(--text-primary);
}
:root[data-navbar="offen"] .language-switcher-btn:hover { background: var(--border-default); }

/* Hamburger (Handy) ohne Rahmen, Striche in Textfarbe */
:root[data-navbar="offen"] .navbar-hamburger { border: 0; }
:root[data-navbar="offen"] .navbar-hamburger-bar { background: var(--text-primary); }