/* Christoph 17 – Basisstile, die theme.json nicht abdeckt.
   Nur Rollen-Variablen aus tokens.css verwenden, keine festen Farbwerte. */

/* Keine Rundungen, keine Schatten (Markenregel) */
:where(body) *, :where(body) *::before, :where(body) *::after { border-radius: 0; }
:where(body) :is(.wp-block-button__link, .wp-element-button, img, input, textarea, select) { box-shadow: none; }

/* Fokus gut sichtbar */
:focus-visible { outline: 3px solid var(--c17-focus); outline-offset: 2px; }

/* Links: Abstand der Unterstreichung wie im Entwurf */
a { text-underline-offset: 3px; }

/* Überschriften nie kursiv */
h1, h2, h3, h4, h5, h6 { font-style: normal; }

/* Hilfsklasse Label (Mono, Versalien) – auch für Überschriften im Fußbereich */
.c17-label, :where(h1, h2, h3, h4, h5, h6).c17-label {
	font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: var(--c17-label-size);
	line-height: var(--c17-label-lh); font-weight: var(--c17-label-weight); letter-spacing: 0.12em;
	text-transform: uppercase; color: var(--c17-text-muted); margin: 0;
}

/* ---------- Vorschau-Leiste (nur solange Suchmaschinen ausgeschlossen sind) ---------- */
.c17-vorschau {
	background: var(--c17-warning); color: var(--c17-on-warning); font-family: var(--wp--preset--font-family--ibm-plex-mono);
	font-size: 12px; letter-spacing: .08em; text-transform: uppercase; text-align: center; padding: 6px var(--c17-gutter);
}

/* ---------- Kopfbereich (in beiden Modi dunkel) ---------- */
:root { --c17-kopf-h: 84px; }
@media (max-width: 820px) { :root { --c17-kopf-h: 64px; } }
.wp-site-blocks > header.wp-block-template-part {
	position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 50; margin-block-start: 0;
}
.c17-kopf { --c17-focus: var(--c17-navy-hell); }
.c17-kopf__innen { min-height: var(--c17-kopf-h); gap: var(--c17-space-24); }
.c17-kopf__werkzeuge { gap: var(--c17-space-16); }
.c17-logo { display: block; flex: none; line-height: 0; }
.c17-logo__bild { height: 44px; width: auto; }
@media (max-width: 820px) { .c17-logo__bild { height: 32px; } }

.c17-hauptnavigation { gap: 26px; }
.c17-hauptnavigation .wp-block-navigation-item__content {
	color: var(--c17-weiss); text-decoration: none; font-size: 15px; font-weight: 600;
	letter-spacing: 0.04em; text-transform: uppercase; padding: 8px 0;
}
.c17-hauptnavigation .wp-block-navigation-item__content:hover { color: var(--c17-orange-60); }
.c17-hauptnavigation .wp-block-navigation-item__content[aria-current="page"] { box-shadow: inset 0 -4px 0 var(--c17-brand); }
@media (max-width: 1060px) {
	.c17-hauptnavigation { gap: 18px; }
	.c17-hauptnavigation .wp-block-navigation__container { gap: 18px; }
	.c17-hauptnavigation .wp-block-navigation-item__content { font-size: 14px; }
}
.c17-hauptnavigation .wp-block-navigation__responsive-container-open,
.c17-hauptnavigation .wp-block-navigation__responsive-container-close,
.c17-hell-dunkel {
	width: 44px; height: 44px; place-items: center; padding: 0; border: 0;
	background: transparent; color: var(--c17-weiss); cursor: pointer;
}
.c17-hell-dunkel { display: grid; }
.c17-hauptnavigation .wp-block-navigation__responsive-container-open:hover,
.c17-hell-dunkel:hover { color: var(--c17-orange-60); }
.c17-hell-dunkel svg, .c17-hauptnavigation .wp-block-navigation__responsive-container-open svg { width: 24px; height: 24px; }
.c17-hell-dunkel .c17-icon-sonne { display: none; }
[data-effective-theme="dark"] .c17-hell-dunkel .c17-icon-sonne { display: block; }
[data-effective-theme="dark"] .c17-hell-dunkel .c17-icon-mond { display: none; }

/* Anmelden / Konto-Menü (E83) */
.c17-konto { position: relative; flex: none; }
.c17-konto--anmelden, .c17-konto__knopf {
	display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0;
	background: transparent; color: var(--c17-weiss); cursor: pointer;
}
.c17-konto--anmelden svg { width: 24px; height: 24px; }
.c17-konto--anmelden:hover { color: var(--c17-orange-60); }
.c17-konto__kreis {
	display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
	background: var(--c17-brand); color: var(--c17-nacht); font: 600 14px/1 var(--wp--preset--font-family--barlow); letter-spacing: .02em;
}
.c17-konto__knopf:hover .c17-konto__kreis, .c17-konto__knopf[aria-expanded="true"] .c17-konto__kreis { box-shadow: 0 0 0 3px var(--c17-weiss); }
.c17-konto__menue {
	position: absolute; right: 0; top: calc(100% + 12px); z-index: 60; width: 280px;
	background: var(--c17-bg); color: var(--c17-text); border: 1px solid var(--c17-line);
	box-shadow: 0 12px 32px rgba(14, 22, 30, .3); --c17-focus: var(--c17-navy);
}
.c17-konto__menue[hidden] { display: none; }
.c17-konto__wer { margin: 0; padding: 14px 16px 10px; border-bottom: 1px solid var(--c17-line); font-size: 14px; color: var(--c17-text-muted); }
.c17-konto__wer strong { display: block; color: var(--c17-text); font-size: 16px; overflow-wrap: anywhere; }
.c17-konto__liste { list-style: none; margin: 0; padding: 6px 0; }
.c17-konto__link {
	display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px;
	color: var(--c17-text); text-decoration: none; font-weight: 600; font-size: 15px;
}
.c17-konto__link svg { width: 18px; height: 18px; flex: none; color: var(--c17-accent-text); }
.c17-konto__link:hover { background: var(--c17-surface); }
.c17-konto__link[aria-current="page"] { box-shadow: inset 4px 0 0 var(--c17-brand); }
.c17-konto__link--ab { color: var(--c17-accent-text); border-top: 1px solid var(--c17-line); margin-top: 6px; }
@media (max-width: 820px) {
	.c17-konto { position: static; }
	.c17-konto__menue { position: absolute; left: 0; right: 0; top: 100%; width: auto; border-width: 0 0 1px; }
	.c17-konto__link { min-height: 48px; }
}

/* Umbruch auf das mobile Menü bei 820 px wie im Entwurf (WordPress-Standard wäre 600 px) */
@media (min-width: 600px) and (max-width: 820px) {
	.c17-hauptnavigation .wp-block-navigation__responsive-container-open:not(.always-shown) { display: grid; }
	.c17-hauptnavigation .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}
/* Geöffnetes mobiles Menü: Einträge untereinander mit Trennlinien */
.c17-hauptnavigation .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--c17-space-16) var(--c17-gutter) var(--c17-space-24);
}
.c17-hauptnavigation .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: var(--c17-space-48); }
.c17-hauptnavigation .is-menu-open .wp-block-navigation__container { gap: 0; width: 100%; align-items: stretch; }
.c17-hauptnavigation .is-menu-open .wp-block-navigation-item { width: 100%; }
.c17-hauptnavigation .is-menu-open .wp-block-navigation-item__content {
	display: block; width: 100%; font-size: 18px; padding: 14px 0; border-bottom: 1px solid var(--c17-grau-700);
}
.c17-hauptnavigation .is-menu-open .wp-block-navigation-item__content[aria-current="page"] {
	box-shadow: inset 4px 0 0 var(--c17-brand); padding-left: 16px;
}

/* ---------- Fußbereich (in beiden Modi dunkel) ---------- */
.wp-site-blocks > footer.wp-block-template-part { margin-block-start: 0; }
.c17-fuss {
	--c17-focus: var(--c17-navy-hell);
	color: var(--c17-grau-200); font-size: 15px;
	padding-top: var(--c17-space-64); padding-bottom: var(--c17-space-32);
}
.c17-fuss__raster.c17-fuss__raster { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--c17-space-32); }
.c17-fuss__spalte { gap: 8px; align-items: flex-start; }
.c17-fuss__spalte > * { margin: 0; }
.c17-fuss .c17-label { color: var(--c17-grau-400); margin-bottom: 4px; }
.c17-fuss a { color: var(--c17-grau-200); text-decoration: none; }
.c17-fuss a:hover { color: var(--c17-orange-60); text-decoration: underline; }
.c17-fuss .c17-fuss__akzent a { color: var(--c17-orange-60); text-decoration: underline; }
.c17-logo--fuss .c17-logo__bild { height: 40px; margin-bottom: 6px; }
.c17-fuss__basis {
	margin-top: var(--c17-space-48); padding-top: 20px; border-top: 1px solid var(--c17-grau-700);
	font-family: var(--wp--preset--font-family--ibm-plex-mono); font-size: 12px; letter-spacing: .08em;
	text-transform: uppercase; color: var(--c17-grau-400); gap: var(--c17-space-16);
}
.c17-fuss__basis p { margin: 0; }
.c17-fuss__basis p:last-child { text-transform: none; }

@media (prefers-reduced-motion: no-preference) {
	.c17-hauptnavigation .wp-block-navigation-item__content, .c17-hell-dunkel { transition: color .15s; }
}
