/*
Theme Name: grossherzog Logbuch
Description: Schlankes Block-Theme für grossherzog.de im Stil Logbuch: ruhig, redaktionell, Erzählung vorn. Arbeitet mit dem Plugin grossherzog-touren zusammen (Faktenbox, Meine Touren, Startseite, Ähnliche Touren).
Version: 0.1.9
Requires at least: 6.6
Requires PHP: 8.1
Author: Nico Rehmann
License: GPL-2.0-or-later
Text Domain: grossherzog-logbuch
*/

/* Grundlagen */
html { scroll-padding-top: 1rem; }
body { overflow-x: clip; }
img { height: auto; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }

/* Logo */
.gh-logo { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: var(--wp--preset--color--tinte); }
.gh-logo:hover { color: var(--wp--preset--color--moos-dunkel); }
.gh-logo svg { width: 34px; height: 34px; flex: none; }
.gh-logo span { font-family: var(--wp--preset--font-family--logo); font-weight: 700; font-size: 1.75rem; line-height: 1; letter-spacing: -0.01em; }
.gh-logo--gross svg { width: 56px; height: 56px; }
.gh-logo--gross span { font-size: clamp(2.2rem, 6vw, 3.6rem); }

/* Kopf und Navigation */
.gh-kopf { border-bottom: 1px solid var(--wp--preset--color--tinte); }
.gh-kopf .wp-block-navigation a { text-decoration: none; color: var(--wp--preset--color--tinte); }
.gh-kopf .wp-block-navigation a:hover, .gh-kopf .wp-block-navigation a:focus { color: var(--wp--preset--color--moos); }
.gh-kopf .wp-block-navigation .wp-block-navigation__submenu-container { border: 1px solid var(--wp--preset--color--tinte) !important; padding: 6px 0; min-width: 210px !important; }
.gh-kopf .wp-block-navigation .wp-block-navigation__submenu-container a { padding: 8px 16px; text-transform: none; letter-spacing: 0; font-size: 1rem; }
.gh-kopf .current-menu-item > a, .gh-kopf [aria-current="page"] { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; text-decoration-color: var(--wp--preset--color--moos); }
.wp-block-navigation__responsive-container.is-menu-open { padding: 2rem 24px; }

/* Fuß */
.gh-fuss { border-top: 1px solid var(--wp--preset--color--tinte); }
.gh-fuss a { color: var(--wp--preset--color--tinte); }

/* Beitrags-Liste im Logbuch-Stil */
.gh-liste .wp-block-post { border-top: 1px solid var(--wp--preset--color--linie); padding: 18px 0; margin: 0 !important; }
.gh-liste .wp-block-post:last-child { border-bottom: 1px solid var(--wp--preset--color--linie); }
.gh-liste .gh-zeile { display: grid; grid-template-columns: 110px minmax(0, 1fr) 160px; gap: 20px; align-items: center; }
.gh-liste .wp-block-post-date { font-family: var(--wp--preset--font-family--titel); font-style: normal; font-weight: 600; font-size: 0.95rem; }
.gh-liste .wp-block-post-title { font-family: var(--wp--preset--font-family--text); font-weight: 600; font-size: 1.35rem; line-height: 1.3; margin: 0; }
.gh-liste .wp-block-post-title a { text-decoration: none; color: var(--wp--preset--color--tinte); }
.gh-liste .wp-block-post-title a:hover { color: var(--wp--preset--color--moos); }
.gh-liste .wp-block-post-featured-image { margin: 0; }
.gh-liste .wp-block-post-featured-image img { width: 160px; height: 100px; object-fit: cover; }
.gh-liste .wp-block-post-terms { font-size: 0.95rem; color: var(--wp--preset--color--stein); }
.gh-liste .wp-block-post-terms a { color: var(--wp--preset--color--stein); text-decoration: none; }
@media (max-width: 640px) {
	.gh-liste .gh-zeile { grid-template-columns: minmax(0, 1fr) 96px; }
	.gh-liste .gh-zeile > .wp-block-post-date { grid-column: 1 / -1; }
	.gh-liste .wp-block-post-featured-image img { width: 96px; height: 64px; }
}

/* Einzelbeitrag */
.gh-kicker { font-family: var(--wp--preset--font-family--titel); font-weight: 600; font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.08em; }
.gh-kicker a { color: var(--wp--preset--color--moos); text-decoration: none; }
.single .wp-block-post-content > p:first-of-type { margin-top: 0; }
.wp-block-post-content figure { margin-block: 2rem; }

/* Komoot-Karte groß unter dem Text */
.wp-block-post-content .embed-privacy-container.embed-www-komoot-com,
.wp-block-post-content iframe[src*="komoot"] {
	width: min(1140px, calc(100vw - 48px)) !important;
	max-width: none !important;
	position: relative;
	left: 50%;
	transform: translateX(-50%);
}
.wp-block-post-content .embed-privacy-container.embed-www-komoot-com { aspect-ratio: auto !important; }
.wp-block-post-content .embed-www-komoot-com .embed-privacy-overlay { min-height: 640px; display: flex; align-items: center; justify-content: center; }
.wp-block-post-content iframe[src*="komoot"] { height: 720px !important; display: block; border: 0; }
@media (max-width: 640px) {
	.wp-block-post-content iframe[src*="komoot"] { height: 560px !important; }
	.wp-block-post-content .embed-www-komoot-com .embed-privacy-overlay { min-height: 480px; }
}

/* Plugin grossherzog-touren: Faktenbox im Logbuch-Stil */
.gh-fakten { border: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--wp--preset--color--tinte) !important; border-bottom: 1px solid var(--wp--preset--color--tinte) !important; padding: 18px 0 !important; margin: 0 0 2rem !important; font-size: 1rem !important; }
.gh-fakten dl { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)) !important; text-align: center; }
.gh-fakten dt { font-family: var(--wp--preset--font-family--titel); font-size: 0.72rem !important; color: var(--wp--preset--color--stein); opacity: 1 !important; }
.gh-fakten dd { font-family: var(--wp--preset--font-family--titel); font-weight: 800 !important; font-size: 1.3rem; line-height: 1.25; }
.gh-fakten dd a { color: var(--wp--preset--color--tinte); }
.gh-fakten__idee { background: var(--wp--preset--color--nebel); padding: 14px 18px; font-size: 1.05rem !important; line-height: 1.55; }
.gh-etappen ul { justify-content: center; }
.gh-etappen a, .gh-etappen span { border-radius: 0 !important; border-color: var(--wp--preset--color--tinte) !important; font-family: var(--wp--preset--font-family--titel); font-weight: 600; }
.gh-etappen [aria-current] { background: var(--wp--preset--color--tinte) !important; color: var(--wp--preset--color--papier); }
@media (max-width: 480px) { .gh-fakten dl { grid-template-columns: 1fr 1fr !important; } }

/* Plugin: Kacheln (Tourenideen, Startseite, Ähnliche Touren) */
.gh-ts__liste { gap: 28px !important; }
.gh-ts__bild { border-radius: 0 !important; }
.gh-ts__titel { font-family: var(--wp--preset--font-family--text); font-size: 1.2rem; color: var(--wp--preset--color--tinte); }
.gh-ts__karte a:hover .gh-ts__titel { color: var(--wp--preset--color--moos); }
.gh-ts__meta { font-size: 0.95rem !important; }
.gh-ts__form { border-radius: 0 !important; border: 0 !important; border-top: 1px solid var(--wp--preset--color--tinte) !important; border-bottom: 1px solid var(--wp--preset--color--tinte) !important; padding: 16px 0 !important; }
.gh-ts__feld label { font-family: var(--wp--preset--font-family--titel); text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.75rem !important; }
.gh-ts__feld select { font-family: inherit; font-size: 1rem; padding: 8px; border: 1px solid var(--wp--preset--color--tinte); border-radius: 0; background: var(--wp--preset--color--papier); }
.gh-ts__aktion button { font-family: var(--wp--preset--font-family--titel); font-weight: 600; background: var(--wp--preset--color--tinte); color: var(--wp--preset--color--papier); border: 0; padding: 10px 20px; }
.gh-ts__seiten a, .gh-ts__seiten span { border-radius: 0 !important; }
.gh-aehnlich { border-top-color: var(--wp--preset--color--tinte) !important; }
.gh-aehnlich h2, .gh-start__block h2 { font-family: var(--wp--preset--font-family--titel); font-weight: 800; }
.gh-aehnlich, .gh-ts, .gh-start { font-size: 1.05rem; }
.single .gh-aehnlich { width: min(1140px, calc(100vw - 48px)); position: relative; left: 50%; transform: translateX(-50%); }

/* Startseite */
.gh-start__chips a { border-radius: 0 !important; border-color: var(--wp--preset--color--tinte) !important; color: var(--wp--preset--color--tinte); text-decoration: none; font-family: var(--wp--preset--font-family--titel); }
.gh-start__chips a:hover { background: var(--wp--preset--color--tinte); color: var(--wp--preset--color--papier); }
.gh-start__regionen a { border-radius: 0 !important; border-color: var(--wp--preset--color--tinte) !important; color: var(--wp--preset--color--tinte); }
.gh-start__ratgeber a { color: var(--wp--preset--color--tinte); }
.gh-start__ratgeber img { border-radius: 0 !important; }

/* Kommentare */
.wp-block-comments { border-top: 1px solid var(--wp--preset--color--tinte); padding-top: 1.5rem; }

/* Barrierefreiheit */
a:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible { outline: 3px solid var(--wp--preset--color--moos); outline-offset: 2px; }

/* Suche im Kopf */
.gh-kopf .wp-block-search__button { background: transparent; color: var(--wp--preset--color--tinte); border: 1px solid var(--wp--preset--color--tinte); padding: 6px; }
.gh-kopf .wp-block-search__button:hover { background: var(--wp--preset--color--tinte); color: var(--wp--preset--color--papier); }
.gh-kopf .wp-block-search__input { border: 1px solid var(--wp--preset--color--tinte); border-radius: 0; font-family: inherit; }

/* Filter: sechs Auswahlfelder in einer Reihe, Knopf und Zurücksetzen gemeinsam darunter */
.gh-ts__form { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)) !important; align-items: end; }
.gh-ts__aktion { grid-column: 1 / -1; display: flex !important; flex-wrap: wrap; align-items: center; gap: 12px 28px !important; margin-top: 4px; }
.gh-ts__aktion a { font-size: 1rem; }

/* Faktenbox: Region(en) im Raster, doppelt breit, je Region eine Zeile */
.gh-fakten dl > .gh-fakten__region { grid-column: span 2 !important; }
.gh-fakten .gh-fakten__region dd { overflow-wrap: normal; hyphens: none; }
.gh-fakten .gh-region { display: block; }
.gh-fakten .gh-region + .gh-region { margin-top: 4px; }
.gh-fakten .gh-fakten__region dd a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.gh-fakten dl > .gh-fakten__region:has(.gh-region + .gh-region) { grid-column: span 3 !important; }
@media (max-width: 700px) { .gh-fakten dl > .gh-fakten__region, .gh-fakten dl > .gh-fakten__region:has(.gh-region + .gh-region) { grid-column: 1 / -1 !important; } }

/* Faktenbox: eine Schriftgröße für alle Werte, Reise wie Region doppelt breit */
.gh-fakten dd { font-size: 1.15rem !important; font-weight: 700 !important; line-height: 1.4 !important; }
.gh-fakten dl > .gh-fakten__reise { grid-column: span 2 !important; }
@media (max-width: 700px) { .gh-fakten dl > .gh-fakten__reise { grid-column: 1 / -1 !important; } }