/*
Theme Name:   GeneratePress Rodegra
Description:  Child-Theme für rodegra-law.de. Bildet den Aufbau des früheren ProPhoto-Designs nach.
Author:       René Rottmann
Template:     generatepress
Version:      1.0.0
Text Domain:  generatepress-rodegra
*/

/* ---------- Breite wie bisher (820 px) ---------- */
.grid-container {
	max-width: 820px;
}

/* ---------- Farben & Grundschrift (wie ProPhoto, etwas größer für bessere Lesbarkeit) ---------- */
:root {
	--rodegra-navy: #001e34;
	--rodegra-navy-hover: #0d3652;
	--rodegra-text: #000;
	--rodegra-link: #6f6f6f;
	--rodegra-line: #ccc;
}

body {
	background: var(--rodegra-navy);
	color: var(--rodegra-text);
	font-family: Verdana, Tahoma, sans-serif;
	font-size: 13px;
	line-height: 1.6;
}

a,
a:visited {
	color: var(--rodegra-link);
	text-decoration: none;
}

a:hover,
a:focus {
	color: #000;
	text-decoration: underline;
}

/* ---------- Kopfbereich: Logo + Kopfbild ---------- */
.rodegra-header {
	background: transparent;
}

.rodegra-header .inside-header {
	display: block;
	padding: 20px 0 0;
}

.rodegra-logo,
.rodegra-masthead {
	display: block;
	line-height: 0;
}

.rodegra-logo img,
.rodegra-masthead img {
	display: block;
	width: 100%;
	height: auto;
}

/* ---------- Hauptmenü (weiß auf Dunkelblau, wie bisher) ---------- */
.main-navigation,
.main-navigation .inside-navigation {
	background: transparent;
}

.main-navigation .inside-navigation {
	margin: 18px auto 18px;
	padding: 0;
	justify-content: flex-start;
}

.main-navigation .main-nav,
.main-navigation .main-nav > ul {
	justify-content: flex-start;
	margin-right: auto;
}

.main-navigation .main-nav ul li a,
.main-navigation .menu-toggle,
.main-navigation .menu-bar-items {
	color: #fff;
	font-family: Verdana, Tahoma, sans-serif;
	font-size: 12px;
	letter-spacing: 1px;
	line-height: 40px;
	padding-left: 0;
	padding-right: 22px;
}

.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li:focus > a,
.main-navigation .main-nav ul li.sfHover > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
	color: #b5b5b5;
	background: transparent;
}

.main-navigation .main-nav ul li[class*="current-menu-"] > a {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Untermenü schwarz wie bisher */
.main-navigation .main-nav ul ul {
	background: #000;
	width: 180px;
}

.main-navigation .main-nav ul ul li a {
	font-size: 11px;
	line-height: 1.4;
	padding: 9px 14px;
	color: #fff;
}

.main-navigation .main-nav ul ul li:hover > a {
	background: #1a1a1a;
	color: #fff;
}

/* Suche im Menü (Lupe statt Suchfeld – moderner, gleiche Position rechts) */
.main-navigation .menu-bar-item > a {
	padding-right: 0;
}

.navigation-search input[type="search"],
.navigation-search input[type="search"]:focus {
	background: var(--rodegra-navy);
	color: #fff;
}

/* ---------- Weiße Inhaltsbox mit Seitenleiste ---------- */
.site.grid-container,
.one-container .container {
	background: #fff;
}

.one-container .site-content {
	padding: 25px 0 30px;
}

.one-container.right-sidebar .site-main {
	margin-right: 0;
}

.one-container .inside-article {
	padding: 0 30px;
}

.entry-title,
.page-title {
	font-family: Verdana, Tahoma, sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #000;
	padding-bottom: 6px;
	border-bottom: 1px solid var(--rodegra-line);
	margin-bottom: 1.2em;
}

.entry-title a {
	color: #000;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
	font-family: inherit;
	font-weight: 700;
	text-transform: none;
	letter-spacing: 0;
	margin-bottom: .6em;
}

.entry-content h1 { font-size: 160%; }
.entry-content h2 { font-size: 140%; }
.entry-content h3 { font-size: 120%; }
.entry-content h4 { font-size: 110%; }

.entry-meta {
	font-size: 11px;
	color: #777;
}

.entry-content img {
	height: auto;
	max-width: 100%;
}

/* ---------- Rechte Seitenleiste (225 px, Trennlinie links) ---------- */
.sidebar .inside-right-sidebar {
	border-left: 1px solid var(--rodegra-line);
	padding: 0 30px;
}

.one-container .right-sidebar .widget,
.sidebar .widget {
	padding: 0;
	margin-bottom: 15px;
	background: transparent;
	font-size: 11px;
	line-height: 1.5;
}

.sidebar .widget-title,
.sidebar .widget h3 {
	font-family: Verdana, Tahoma, sans-serif;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: .35em;
}

/* Blaue Buttons in der Seitenleiste (wie bisher) */
.rodegra__button,
.rodegra__button:visited {
	display: block;
	background: var(--rodegra-navy);
	color: #fff;
	padding: .35rem 1rem;
	font-size: 1.1rem;
	line-height: 1.25;
	border-radius: 2px;
	text-decoration: none;
	transition: background-color .15s ease;
}

.rodegra__button:hover,
.rodegra__button:focus {
	background: var(--rodegra-navy-hover);
	color: #fff;
	text-decoration: none;
}

/* ---------- Fußbereich ---------- */
.site-footer,
.site-info {
	background: #fff;
	color: #000;
}

.site-info .inside-site-info {
	padding: 0 30px 20px;
	justify-content: center;
}

.copyright-bar {
	font-size: 11px;
	text-align: center;
}

.copyright-bar .sep {
	padding: 0 .5em;
	color: #999;
}

.rodegra-adressleiste {
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	margin-bottom: 30px;
}

.rodegra-adressleiste .grid-container {
	background: var(--rodegra-navy);
	border: 1px solid #fff;
	border-top: 0;
	padding: 18px 10px;
	text-align: center;
}

.rodegra-adressleiste span + span::before {
	content: "|";
	padding: 0 .45em;
}

.rodegra-adressleiste a,
.rodegra-adressleiste a:visited {
	color: #fff;
}

/* ---------- Handy & Tablet ---------- */
@media (max-width: 768px) {
	.rodegra-header .inside-header {
		padding-top: 0;
	}

	.main-navigation .inside-navigation {
		margin: 0;
	}

	.main-navigation .menu-toggle,
	.main-navigation .main-nav ul li a {
		padding-left: 20px;
	}

	.main-navigation.toggled .main-nav ul ul {
		width: auto;
	}

	.one-container .inside-article {
		padding: 0 20px;
	}

	.sidebar .inside-right-sidebar {
		border-left: 0;
		border-top: 1px solid var(--rodegra-line);
		padding: 20px 20px 0;
	}

	.rodegra-adressleiste .grid-container {
		border-left: 0;
		border-right: 0;
	}

	.rodegra-adressleiste span {
		display: block;
	}

	.rodegra-adressleiste span + span::before {
		content: none;
	}
}

/* ---------- Ergänzungen ---------- */

/* Suchfeld im Menü erst nach Klick auf die Lupe einblenden */
.main-navigation .navigation-search {
	position: absolute;
	left: -99999px;
	top: 0;
	width: 100%;
	z-index: 20;
	pointer-events: none;
	visibility: hidden;
	opacity: 0;
	transition: opacity .1s ease-in-out;
}

.main-navigation .navigation-search.nav-search-active {
	left: 0;
	right: 0;
	pointer-events: auto;
	visibility: visible;
	opacity: 1;
}

.main-navigation .navigation-search input[type="search"] {
	width: 100%;
	height: 100%;
	border: 0;
	border-bottom: 1px solid #fff;
	padding: 0 40px 0 0;
	font-size: 13px;
}

.main-navigation .inside-navigation {
	position: relative;
	margin: 8px auto;
}

/* Volle 820 px nutzen: Seitenleiste wieder 225 px Inhaltsbreite */
.site.grid-container,
.site-footer .grid-container {
	padding-left: 0;
	padding-right: 0;
}

@media (min-width: 769px) {
	.right-sidebar .content-area {
		width: 65.25%;
	}

	.right-sidebar .is-right-sidebar {
		width: 34.75%;
	}
}

/* Menü bündig mit der Inhaltsbox wie bisher */
@media (min-width: 769px) {
	.main-navigation.grid-container,
	.nav-below-header .main-navigation .inside-navigation.grid-container {
		padding-left: 0;
		padding-right: 0;
	}
}

/* Adressleiste: gleichmäßige Trenner */
.rodegra-adressleiste .grid-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: .2em 0;
}

@media (max-width: 768px) {
	.rodegra-adressleiste .grid-container {
		flex-direction: column;
		align-items: center;
	}
}

/* Lupe rechtsbündig mit der Inhaltsbox */
.main-navigation .menu-bar-items,
.main-navigation .menu-bar-item > a {
	padding-right: 0;
}

/* =========================================================
   Beitragsübersichten & Einzelbeiträge (wie ProPhoto)
   ========================================================= */

/* Senkrechte Trennlinie über die volle Höhe */
@media (min-width: 769px) {
	.right-sidebar .content-area {
		border-right: 1px solid var(--rodegra-line);
	}

	.sidebar .inside-right-sidebar {
		border-left: 0;
	}
}

/* Archiv-Überschrift: klein, eingerückt, ohne Linie */
.page-header {
	padding: 0 30px;
	margin-bottom: 20px;
}

.page-header .page-title {
	font-size: 13px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 1px;
	border-bottom: 0;
	padding-bottom: 0;
	margin-bottom: 0;
}

/* Beitragskopf: Titel links, Datums-Kästchen rechts, gemeinsame Linie darunter */
.post .entry-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 10px;
	border-bottom: 1px solid var(--rodegra-line);
	padding-bottom: 6px;
}

.post .entry-header .entry-title {
	border-bottom: 0;
	padding-bottom: 0;
	margin-bottom: 0;
	line-height: 1.2;
}

.rodegra-date {
	flex: 0 0 43px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	text-align: center;
	text-transform: uppercase;
	color: #666;
	line-height: 1;
}

.rodegra-date span {
	display: block;
}

.rodegra-date__month {
	letter-spacing: 2px;
}

.rodegra-date__day {
	font-size: 23px;
	font-weight: 700;
	color: #555;
	margin: 2px 0 1px;
}

.rodegra-date__year {
	font-size: 9px;
	letter-spacing: 1px;
}

/* Text direkt unter dem Kopf */
.post .entry-content:not(:first-child),
.post .entry-summary:not(:first-child) {
	margin-top: 1.2em;
}

/* Kategorie / Schlagwörter klein unter dem Beitrag */
footer.entry-meta {
	font-size: 10px;
	line-height: 1.6;
	margin-top: 1em;
}

/* Dicker blauer Strich zwischen den Beiträgen der Übersicht */
.blog .site-main > article,
.archive .site-main > article,
.search .site-main > article {
	border-bottom: 4px solid var(--rodegra-navy);
	padding-bottom: 18px;
	margin-bottom: 18px;
}

.one-container.blog .post:not(:last-child):not(.is-loop-template-item),
.one-container.archive .post:not(:last-child):not(.is-loop-template-item),
.one-container.search .post:not(:last-child):not(.is-loop-template-item) {
	padding-bottom: 18px;
}

/* Seitenzahlen klein und zentriert: 1 2 vor » */
.paging-navigation {
	padding: 1.2em 30px 0;
	text-align: center;
	font-size: 11px;
}

.paging-navigation .nav-previous,
.paging-navigation .nav-next {
	display: none;
}

.paging-navigation .nav-links {
	justify-content: center;
}

.paging-navigation .page-numbers {
	color: #000;
	padding: 0 .5em;
}

.paging-navigation .page-numbers.current {
	font-weight: 700;
}

.paging-navigation .page-numbers:hover {
	color: #999;
	text-decoration: none;
}

/* Vor/Zurück-Links unter Einzelbeiträgen */
.post-navigation {
	font-size: 11px;
}

@media (max-width: 768px) {
	.page-header {
		padding: 0 20px;
	}
}

/* Grauer Fußbereich unter Einzelbeiträgen: Archiv / Kategorien / Seiten */
.site-footer .footer-widgets {
	background: #e8e8e8;
	color: #000;
	font-size: 11px;
}

.site-footer .footer-widgets .inside-footer-widgets {
	padding: 30px 30px 20px;
}

.footer-widgets .widget {
	background: transparent;
	padding: 0;
}

.footer-widgets .widget-title {
	font-family: Verdana, Tahoma, sans-serif;
	font-size: 11px;
	font-weight: 400;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin-bottom: .4em;
}

.footer-widgets .widget ul {
	list-style: disc;
	margin-left: 1.5em;
}

.footer-widgets .widget ul li {
	padding: 0;
	margin: 0 0 .1em;
	line-height: 1.5;
}

.footer-widgets .widget ul li a {
	color: var(--rodegra-link);
}

.single-post .site-info .inside-site-info {
	padding-top: 20px;
}

.footer-widgets .widget ul li {
	list-style: disc outside;
}

.site-footer .footer-widgets-container,
.site-footer .footer-widgets .inside-footer-widgets {
	padding-top: 20px;
}

/* =========================================================
   Überschriften wie bei ProPhoto: 14 px fett, ohne Sperrung
   ========================================================= */
.entry-title,
.post .entry-header .entry-title {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: normal;
	line-height: 1.15;
}

.entry-title a:hover {
	color: #999;
	text-decoration: none;
}

/* =========================================================
   Kontakt-Bereich zum Aufklappen
   ========================================================= */
.rodegra-kontakt-panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows .35s ease;
	background: #fff;
}

.rodegra-kontakt-panel.is-open {
	grid-template-rows: 1fr;
}

.rodegra-kontakt-panel__clip {
	overflow: hidden;
	min-height: 0;
}

.rodegra-kontakt-panel__inner {
	position: relative;
	padding: 25px 30px 20px;
	border-bottom: 1px solid var(--rodegra-line);
	opacity: 0;
	transition: opacity .35s ease;
}

.rodegra-kontakt-panel.is-open .rodegra-kontakt-panel__inner {
	opacity: 1;
}

.rodegra-kontakt-panel .entry-content {
	margin: 0;
}

.rodegra-kontakt-panel .entry-content > *:last-child {
	margin-bottom: 0;
}

.rodegra-kontakt-panel__close {
	position: absolute;
	top: 12px;
	right: 18px;
	background: transparent;
	border: 0;
	color: #666;
	font-size: 22px;
	line-height: 1;
	padding: 4px 8px;
	cursor: pointer;
}

.rodegra-kontakt-panel__close:hover,
.rodegra-kontakt-panel__close:focus {
	background: transparent;
	color: #000;
}

.main-navigation .main-nav ul li a.rodegra-kontakt-toggle.is-active {
	color: #b5b5b5;
	text-decoration: underline;
	text-underline-offset: 4px;
}

@media (max-width: 768px) {
	.rodegra-kontakt-panel__inner {
		padding: 20px 20px 15px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rodegra-kontakt-panel,
	.rodegra-kontakt-panel__inner {
		transition: none;
	}
}