/*
Theme Name: Maß genommen
Theme URI: https://mass-genommen.de/
Author: Patrick Michalke
Description: Modernes, schlankes Block-Theme für den Näh-, Reise- und Running-Blog "Maß genommen". Editorial-Look mit viel Weißraum, Fraunces-Serifen für Titel und dem Logo-Hellblau als Akzentfarbe.
Version: 1.0.1
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mass-genommen
Tags: blog, photography, full-site-editing, block-patterns, custom-colors
*/

.mg-kicker {
	font-size: 0.75rem;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--wp--preset--color--muted);
}

/* Meta-Zeile: Kategorie + Datum */
.mg-meta {
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.mg-meta .wp-block-post-date,
.mg-meta .wp-block-post-date a {
	color: var(--wp--preset--color--muted);
	text-decoration: none;
}

.mg-comments-link {
	font-size: 0.78rem;
}
.mg-comments-link a {
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}
.mg-comments-link a:hover {
	text-decoration: underline;
}

.wp-block-post-terms a {
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}
.wp-block-post-terms a:hover {
	text-decoration: underline;
}

/* Beitragskarten im Grid */
.mg-card .wp-block-post-featured-image img {
	transition: transform 0.45s ease, opacity 0.3s ease;
}
.mg-card:hover .wp-block-post-featured-image img {
	transform: scale(1.03);
}
.mg-card .wp-block-post-title a {
	text-decoration: none;
}
.mg-card .wp-block-post-title a:hover {
	color: var(--wp--preset--color--accent);
}

.wp-block-post-title a {
	text-decoration: none;
}
.wp-block-post-title a:hover {
	color: var(--wp--preset--color--accent);
}

/* Navigation: dezente Hover-Farbe */
.wp-block-navigation a:hover {
	color: var(--wp--preset--color--accent);
}

/* ---------- Mobiles Overlay-Menü ---------- */

.wp-block-navigation__responsive-container.is-menu-open {
	padding: 4.5rem 2.25rem 3rem !important;
	overflow-y: auto;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding: 0 !important;
}

/* Alles linksbündig statt der Desktop-Rechtsbündigkeit */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start !important;
	justify-content: flex-start !important;
	text-align: left;
}

/* Gleichmäßige, kompaktere Abstände */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 1.1rem;
}

/* Untermenüs: eingerückt an blauer Linie, etwas kleiner und dezenter */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	margin-top: 0.9rem;
	padding-left: 1.1rem !important;
	border-left: 2px solid #B5D4F4;
	gap: 0.8rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	font-size: 0.75rem;
	color: var(--wp--preset--color--muted);
}

/* Fließtext-Links */
.wp-block-post-content a {
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

/* Alte Posts (Classic Editor): Bilder einfangen */
.wp-block-post-content img {
	max-width: 100%;
	height: auto;
}

/* Alte [gallery]-Shortcodes als sauberes Grid */
.wp-block-post-content .gallery {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 0.75rem;
	margin: 1.5rem 0;
}
.wp-block-post-content .gallery .gallery-item {
	margin: 0;
	width: 100% !important;
}
.wp-block-post-content .gallery img {
	border: none !important;
	width: 100%;
	height: auto;
	object-fit: cover;
}
.wp-block-post-content .gallery .gallery-caption {
	font-size: 0.8rem;
	color: var(--wp--preset--color--muted);
}

/* Galerie-Block: runde Ecken für Bilder */
.wp-block-post-content .wp-block-gallery .wp-block-image img,
.wp-block-post-content > .wp-block-image img {
	border-radius: 8px;
}

/* ---------- Kommentare ---------- */

.wp-block-comments-title {
	margin-bottom: 1.5rem;
}

/* Kommentar-Karte: Textspalte füllt die Breite */
.mg-comment .mg-comment-body {
	flex: 1;
	min-width: 0;
}
.mg-comment .wp-block-avatar img {
	border-radius: 50%;
}

.mg-comment-date,
.mg-comment-date a {
	font-size: 0.78rem;
	color: var(--wp--preset--color--muted);
	text-decoration: none;
}

.mg-reply a {
	font-size: 0.78rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent);
	text-decoration: none;
}
.mg-reply a:hover {
	text-decoration: underline;
}

/* Kommentar-Liste: gleichmäßige Abstände, feine Trennlinien */
.wp-block-comment-template,
.wp-block-comment-template ol {
	list-style: none;
	padding-left: 0;
	margin: 0;
}
.wp-block-comment-template > li {
	padding: 1.75rem 0;
	border-bottom: 1px solid var(--wp--preset--color--line);
}
.wp-block-comment-template > li:first-child {
	padding-top: 0.5rem;
}
.wp-block-comment-template > li:last-child {
	border-bottom: none;
	padding-bottom: 0.5rem;
}

/* Antworten: eingerückt mit blauer Thread-Linie, ohne eigene Trennlinie */
.wp-block-comment-template ol {
	margin-top: 1.5rem;
	padding-left: 1.5rem;
	border-left: 2px solid var(--wp--preset--color--accent-soft);
}
.wp-block-comment-template ol > li {
	padding: 0;
	border-bottom: none;
}
.wp-block-comment-template ol > li + li {
	margin-top: 1.5rem;
}

/* Kommentar-Formular: moderne Felder, Name/E-Mail nebeneinander */
.comment-form {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem 1.25rem;
}
.comment-form > * {
	margin: 0;
}
.comment-form .comment-notes,
.comment-form .comment-form-comment,
.comment-form .comment-form-url,
.comment-form .form-submit,
.comment-form .comment-form-cookies-consent,
.comment-form .akismet_comment_form_privacy_notice {
	grid-column: 1 / -1;
}
@media (max-width: 600px) {
	.comment-form .comment-form-author,
	.comment-form .comment-form-email {
		grid-column: 1 / -1;
	}
}

.comment-form label {
	display: block;
	font-size: 0.8rem;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--muted);
	margin-bottom: 0.3rem;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
	width: 100%;
	padding: 0.65rem 0.85rem;
	font: inherit;
	font-size: 0.95rem;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: 8px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.comment-form input:focus,
.comment-form textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--accent);
	box-shadow: 0 0 0 3px rgba(55, 138, 221, 0.15);
}

.comment-form .comment-notes,
.akismet_comment_form_privacy_notice {
	font-size: 0.78rem !important;
	color: var(--wp--preset--color--muted) !important;
}
.akismet_comment_form_privacy_notice a {
	color: var(--wp--preset--color--muted);
}

.comment-reply-title {
	margin-top: 2.5rem;
	margin-bottom: 0.4rem;
}

.comment-form .form-submit {
	margin-top: 0.25rem;
}

/* Jetpack-Abo-Formular einmitten */
.mg-subscribe .wp-block-jetpack-subscriptions {
	max-width: 420px;
	margin-left: auto;
	margin-right: auto;
}
