/* ==========================================================================
   Mattgold – Theme-Styles auf Basis von Bootstrap 5.3
   Bootstrap wird über seine CSS-Variablen angepasst; hier nur Overrides
   und WordPress-spezifische Ergänzungen.
   ========================================================================== */

/* Design-Tokens
   -------------------------------------------------------------------------- */
:root,
[data-bs-theme="light"] {
	/* Markenfarben */
	--mg-gold: #b08d3c;          /* dekorativ: Rahmen, Icons */
	--mg-gold-dark: #8f6f2a;     /* Primärfarbe, AA-Kontrast mit Weiß */
	--mg-gold-darker: #7d6024;   /* Hover */
	--mg-gold-darkest: #6f5520;  /* Active */
	--mg-focus-ring: 0 0 0 .25rem rgba(143, 111, 42, .25);

	/* Bootstrap: Primärfarbe */
	--bs-primary: var(--mg-gold-dark);
	--bs-primary-rgb: 143, 111, 42;
	--bs-primary-text-emphasis: #3a2d11;
	--bs-primary-bg-subtle: #f4ede0;
	--bs-primary-border-subtle: #e2d4b4;

	/* Bootstrap: Links */
	--bs-link-color: var(--mg-gold-dark);
	--bs-link-color-rgb: 143, 111, 42;
	--bs-link-hover-color: var(--mg-gold-darkest);
	--bs-link-hover-color-rgb: 111, 85, 32;

	/* Bootstrap: Typografie */
	--bs-font-sans-serif: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--bs-body-color: #1d1d1f;
	--bs-body-color-rgb: 29, 29, 31;
	--bs-emphasis-color: #000;
	--bs-heading-color: #111;

	/* Bootstrap: Fokus */
	--bs-focus-ring-color: rgba(143, 111, 42, .25);
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
	font-weight: 700;
	letter-spacing: -.01em;
}

/* Bootstrap-Komponenten in Markenfarbe
   -------------------------------------------------------------------------- */
.btn-primary {
	--bs-btn-bg: var(--mg-gold-dark);
	--bs-btn-border-color: var(--mg-gold-dark);
	--bs-btn-hover-bg: var(--mg-gold-darker);
	--bs-btn-hover-border-color: var(--mg-gold-darker);
	--bs-btn-focus-shadow-rgb: 143, 111, 42;
	--bs-btn-active-bg: var(--mg-gold-darkest);
	--bs-btn-active-border-color: var(--mg-gold-darkest);
	--bs-btn-disabled-bg: var(--mg-gold-dark);
	--bs-btn-disabled-border-color: var(--mg-gold-dark);
}

.btn-outline-primary {
	--bs-btn-color: var(--mg-gold-dark);
	--bs-btn-border-color: var(--mg-gold-dark);
	--bs-btn-hover-bg: var(--mg-gold-dark);
	--bs-btn-hover-border-color: var(--mg-gold-dark);
	--bs-btn-focus-shadow-rgb: 143, 111, 42;
	--bs-btn-active-bg: var(--mg-gold-darkest);
	--bs-btn-active-border-color: var(--mg-gold-darkest);
	--bs-btn-disabled-color: var(--mg-gold-dark);
	--bs-btn-disabled-border-color: var(--mg-gold-dark);
}

.navbar {
	--bs-navbar-hover-color: var(--mg-gold-dark);
	--bs-navbar-active-color: var(--mg-gold-dark);
	--bs-navbar-toggler-focus-width: .25rem;
}
.navbar-toggler:focus { box-shadow: var(--mg-focus-ring); }
.navbar .nav-link { font-weight: 500; }
.custom-logo { max-height: 48px; width: auto; }

.dropdown-menu {
	--bs-dropdown-link-active-bg: var(--mg-gold-dark);
	--bs-dropdown-border-color: var(--bs-border-color-translucent);
}

.pagination {
	--bs-pagination-color: var(--mg-gold-dark);
	--bs-pagination-hover-color: var(--mg-gold-darkest);
	--bs-pagination-focus-color: var(--mg-gold-darkest);
	--bs-pagination-focus-box-shadow: var(--mg-focus-ring);
	--bs-pagination-active-bg: var(--mg-gold-dark);
	--bs-pagination-active-border-color: var(--mg-gold-dark);
}

.form-control:focus,
.form-select:focus {
	border-color: #c7b07a;
	box-shadow: var(--mg-focus-ring);
}
.form-check-input:checked {
	background-color: var(--mg-gold-dark);
	border-color: var(--mg-gold-dark);
}
.form-check-input:focus {
	border-color: #c7b07a;
	box-shadow: var(--mg-focus-ring);
}

/* Accordion (FAQs) */
.accordion {
	--bs-accordion-active-color: var(--mg-gold-dark);
	--bs-accordion-active-bg: transparent;
	--bs-accordion-btn-focus-box-shadow: var(--mg-focus-ring);
	--bs-accordion-btn-padding-x: 0;
	--bs-accordion-body-padding-x: 0;
	--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238f6f2a' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.accordion-flush > .accordion-item:first-child { border-top: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color); }
.accordion-flush > .accordion-item:last-child { border-bottom: var(--bs-accordion-border-width) solid var(--bs-accordion-border-color); }
.accordion-body > :last-child { margin-bottom: 0; }
.accordion-item:target .accordion-button { color: var(--mg-gold-dark); }

/* Bootstrap-Ergänzung: Seitenverhältnis 3:2 */
.ratio-3x2 { --bs-aspect-ratio: 66.6667%; }

/* Karten & Kacheln
   -------------------------------------------------------------------------- */
.card-hover,
.tile {
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card-hover:hover,
.card-hover:focus-within {
	transform: translateY(-2px);
	box-shadow: var(--bs-box-shadow) !important;
}
.card-hover:hover .card-title,
.tile:hover .card-title { color: var(--mg-gold-dark); }

.tile:hover,
.tile:focus-within {
	border-color: var(--mg-gold);
	transform: translateY(-2px);
	box-shadow: var(--bs-box-shadow);
}
.tile__arrow { transition: transform .2s ease; }
.tile:hover .tile__arrow { transform: translateX(4px); }

.card:focus-within { outline: 2px solid var(--mg-gold-dark); outline-offset: 2px; }
.card .stretched-link:focus-visible { outline: none; }

@media (prefers-reduced-motion: reduce) {
	.card-hover, .tile, .tile__arrow { transition: none; }
	.card-hover:hover, .tile:hover { transform: none; }
}

/* Footer
   -------------------------------------------------------------------------- */
.footer-menu .nav-link { padding: 0 .75rem; color: inherit; }
.footer-menu .nav-item:last-child .nav-link { padding-right: 0; }
.footer-menu .nav-link:hover { color: var(--mg-gold-dark); }

/* Beitragsnavigation (the_post_navigation)
   -------------------------------------------------------------------------- */
.post-navigation .nav-links { display: flex; justify-content: space-between; gap: 1.5rem; }
.post-navigation a { text-decoration: none; font-weight: 600; }
.post-navigation .nav-next { margin-left: auto; text-align: right; }

/* WordPress-Kernklassen
   -------------------------------------------------------------------------- */
.screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.entry-content > .alignwide { max-width: calc(100% + 8rem); margin-inline: -4rem; }
@media (max-width: 991.98px) { .entry-content > .alignwide { max-width: 100%; margin-inline: 0; } }
.entry-content > .alignfull { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); }
.alignleft { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter { display: block; margin-inline: auto; }

.wp-caption-text,
.wp-element-caption { font-size: .875em; color: var(--bs-secondary-color); margin-top: .5rem; }

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

/* Block-Buttons wie Bootstrap-Buttons */
.wp-block-button__link {
	display: inline-block;
	padding: .5rem 1.25rem;
	font-weight: 500;
	color: #fff;
	background-color: var(--mg-gold-dark);
	border: 1px solid var(--mg-gold-dark);
	border-radius: var(--bs-border-radius);
	text-decoration: none;
	transition: background-color .15s ease, border-color .15s ease;
}
.wp-block-button__link:hover { color: #fff; background-color: var(--mg-gold-darker); border-color: var(--mg-gold-darker); }
.wp-block-button__link:focus-visible { box-shadow: var(--mg-focus-ring); outline: none; }
.is-style-outline > .wp-block-button__link { color: var(--mg-gold-dark); background: transparent; }
.is-style-outline > .wp-block-button__link:hover { color: #fff; background: var(--mg-gold-dark); }

/* Contact Form 7 (Formular nutzt Bootstrap-Klassen, siehe docs/cf7-projektanfrage.md)
   -------------------------------------------------------------------------- */
.wpcf7-form-control-wrap { display: block; }

.wpcf7 .wpcf7-not-valid { border-color: var(--bs-form-invalid-border-color); }
.wpcf7 .wpcf7-not-valid:focus { box-shadow: 0 0 0 .25rem rgba(var(--bs-danger-rgb), .25); }
.wpcf7-not-valid-tip {
	display: block;
	margin-top: .25rem;
	font-size: .875em;
	color: var(--bs-form-invalid-color);
}

.wpcf7-checkbox,
.wpcf7-radio { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; }
.wpcf7-list-item { margin: 0; }
.wpcf7-list-item label { display: inline-flex; gap: .5rem; align-items: center; cursor: pointer; }
.wpcf7-acceptance .wpcf7-list-item label { align-items: flex-start; }
.wpcf7 input[type="checkbox"],
.wpcf7 input[type="radio"] {
	width: 1.1em;
	height: 1.1em;
	margin-top: .2em;
	accent-color: var(--mg-gold-dark);
	flex-shrink: 0;
}

.wpcf7 form .wpcf7-response-output {
	margin: 1.5rem 0 0;
	padding: .75rem 1rem;
	border: var(--bs-border-width) solid var(--bs-border-color);
	border-radius: var(--bs-border-radius);
}
.wpcf7 form.sent .wpcf7-response-output {
	color: var(--bs-success-text-emphasis);
	background: var(--bs-success-bg-subtle);
	border-color: var(--bs-success-border-subtle);
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	color: var(--bs-warning-text-emphasis);
	background: var(--bs-warning-bg-subtle);
	border-color: var(--bs-warning-border-subtle);
}
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
	color: var(--bs-danger-text-emphasis);
	background: var(--bs-danger-bg-subtle);
	border-color: var(--bs-danger-border-subtle);
}