/* === GCBoK Header-Styles (2-zeilig, barrierefrei) === */ /* === Header Hintergrund (Light-Mode: Indigo-Ton wie Footer, aufgehellt) === */ header.site-header.site-header--gcbok { display: flex !important; flex-direction: column !important; padding: 0 !important; background: linear-gradient(180deg, #F0EDE8 0%, #E8E4DD 100%) !important; border-bottom: none !important; /* Glow-Abschluss-Linie: subtiler grüner Schein */ box-shadow: inset 0 -2px 0 rgba(10,127,92,0.08), 0 2px 12px rgba(15,27,51,0.04), 0 1px 0 rgba(15,27,51,0.06) !important; } header.site-header--gcbok .site-header__inner { display: none !important; } header.site-header--gcbok .site-header__row--brand { display: flex !important; flex-direction: row !important; justify-content: flex-start !important; align-items: center !important; gap: 0.5rem !important; padding: 0.5rem 1rem !important; width: 100% !important; max-width: 1200px !important; margin: 0 auto !important; box-sizing: border-box !important; } header.site-header--gcbok .site-header__row--brand .brand { margin-right: auto; } header.site-header--gcbok .site-header__row--nav { display: flex !important; flex-wrap: wrap !important; gap: 0.25rem !important; padding: 0.25rem 1rem !important; border-top: 1px solid rgba(15,27,51,0.08) !important; width: 100% !important; max-width: 1200px !important; margin: 0 auto !important; box-sizing: border-box !important; } header.site-header--gcbok .nav-gcbok__link { padding: 0.375rem 0.625rem !important; font-size: 0.8125rem !important; font-weight: 500 !important; text-decoration: none !important; border-radius: var(--radius) !important; color: #0F1B33 !important; white-space: nowrap !important; display: inline-block !important; } header.site-header--gcbok .nav-gcbok__link:hover, header.site-header--gcbok .nav-gcbok__link:focus { background: rgba(10,127,92,0.1) !important; color: #0A7F5C !important; } header.site-header--gcbok .nav-gcbok__link:focus-visible { outline: 2px solid #0A7F5C !important; outline-offset: 2px !important; } header.site-header--gcbok .brand__name { font-size: 1.125rem !important; font-weight: 700 !important; color: #0F1B33 !important; } header.site-header--gcbok .brand__suffix { font-size: 0.6875rem !important; color: #6b7280 !important; margin-left: 0.375rem !important; font-weight: 400 !important; } header.site-header--gcbok .lang-switcher { margin-left: auto !important; } @media (max-width: 768px) { header.site-header--gcbok .site-header__row--nav { overflow-x: auto !important; flex-wrap: nowrap !important; -webkit-overflow-scrolling: touch !important; } header.site-header--gcbok .nav-gcbok__link { white-space: nowrap !important; } header.site-header--gcbok .brand__suffix { display: none !important; } } /* Mermaid: GitCover-Backbone als horizontaler Balken, kein Zeilenumbruch */ .mermaid .node.coverBar .nodeLabel, .mermaid .node.coverBar foreignObject div, .mermaid .node.coverBar span.nodeLabel { white-space: nowrap !important; } .mermaid .node.coverBar rect { rx: 6; ry: 6; } /* Header Actions (Icon-Buttons: Bottom, Theme, Language) */ header.site-header--gcbok .hdr-actions { display: flex !important; align-items: center !important; gap: 0.375rem !important; } header.site-header--gcbok .hdr-btn { display: flex !important; align-items: center !important; justify-content: center !important; width: 2rem !important; height: 2rem !important; padding: 0 !important; color: #0F1B33 !important; background: transparent !important; border: 1px solid rgba(15,27,51,0.1) !important; border-radius: var(--radius) !important; cursor: pointer !important; text-decoration: none !important; transition: background 0.15s, border-color 0.15s !important; } header.site-header--gcbok .hdr-btn:hover, header.site-header--gcbok .hdr-btn:focus { background: rgba(10,127,92,0.1) !important; border-color: rgba(10,127,92,0.3) !important; color: #0A7F5C !important; } header.site-header--gcbok .hdr-btn:focus-visible { outline: 2px solid #0A7F5C !important; outline-offset: 2px !important; } /* Theme-Toggle: Sonne im Dark-Mode, Mond im Light-Mode */ :root[data-theme="dark"] header.site-header--gcbok .hdr-btn { color: #E2E8F0 !important; border-color: rgba(255,255,255,0.1) !important; } :root[data-theme="dark"] header.site-header--gcbok .hdr-btn__sun { display: block; } :root[data-theme="dark"] header.site-header--gcbok .hdr-btn__moon { display: none; } :root:not([data-theme="dark"]) header.site-header--gcbok .hdr-btn__sun { display: none; } :root:not([data-theme="dark"]) header.site-header--gcbok .hdr-btn__moon { display: block; } /* Sprach-Dropdown — position:absolute, keine height-change am Parent */ header.site-header--gcbok .lang-dropdown { position: relative; } header.site-header--gcbok .lang-dropdown__menu { position: absolute; top: calc(100% + 0.25rem); right: 0; min-width: 8rem; background: #FFFFFF; border: 1px solid rgba(15,27,51,0.1); border-radius: var(--radius); box-shadow: 0 4px 16px rgba(0,0,0,0.12); padding: 0.25rem; list-style: none; margin: 0; z-index: 100; opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity 0.15s, transform 0.15s, visibility 0.15s; } header.site-header--gcbok .lang-dropdown--open .lang-dropdown__menu { opacity: 1; visibility: visible; transform: translateY(0); } header.site-header--gcbok .lang-dropdown__menu a { display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 0.375rem 0.5rem !important; font-size: 0.8125rem !important; color: #0F1B33 !important; text-decoration: none !important; border-radius: var(--radius) !important; } header.site-header--gcbok .lang-dropdown__menu a:hover, header.site-header--gcbok .lang-dropdown__menu a:focus { background: rgba(10,127,92,0.1) !important; } header.site-header--gcbok .lang-dropdown__code { font-size: 0.6875rem !important; color: #6B7280 !important; font-weight: 600 !important; } /* Dark-Mode fuer Dropdown + Header-Buttons */ :root[data-theme="dark"] header.site-header--gcbok .lang-dropdown__menu { background: #1E293B; border-color: rgba(255,255,255,0.12); } :root[data-theme="dark"] header.site-header--gcbok .lang-dropdown__menu a { color: #E2E8F0 !important; } :root[data-theme="dark"] header.site-header--gcbok .lang-dropdown__menu a:hover, :root[data-theme="dark"] header.site-header--gcbok .lang-dropdown__menu a:focus { background: rgba(10,127,92,0.2) !important; } :root[data-theme="dark"] header.site-header--gcbok .lang-dropdown__code { color: #94A3B8 !important; } /* Remove old lang-switcher */ header.site-header--gcbok .lang-switcher { display: none !important; }