/**
 * Global Styles
 * 
 * Minimal CSS für Basis-Styling.
 * Hauptstyling erfolgt über theme.json und Pattern-spezifisches CSS.
 *
 * @package Hundeschule_TT5_Child
 * @since 1.0.0
 */

/* Box-sizing */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* Base styles with design tokens */
* {
	border-color: var(--border);
	outline-color: var(--ring);
	outline-opacity: 0.5;
}

body {
	background-color: var(--background);
	color: var(--foreground);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Focus-Ring nur bei Tastatur (:focus-visible), nicht nach Maus-Klick */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
.wp-block-button__link:focus:not(:focus-visible),
.wp-element-button:focus:not(:focus-visible),
.wp-block-navigation-item__content:focus:not(:focus-visible),
summary:focus:not(:focus-visible) {
	outline: none !important;
	box-shadow: none !important;
}

a:focus-visible,
button:focus-visible,
.wp-block-button__link:focus-visible,
.wp-element-button:focus-visible,
.wp-block-navigation-item__content:focus-visible,
summary:focus-visible {
	outline: 2px solid #f97316 !important;
	outline-offset: 2px !important;
}

/* Typography - Base styles (nur wenn keine Tailwind-Klassen vorhanden) */
:where(:not(:has([class*=' text-']), :not(:has([class^='text-'])))) {
	h1 {
		font-size: var(--text-2xl, 1.5rem);
		font-weight: var(--font-weight-medium, 500);
		line-height: 1.5;
	}

	h2 {
		font-size: var(--text-xl, 1.25rem);
		font-weight: var(--font-weight-medium, 500);
		line-height: 1.5;
	}

	h3 {
		font-size: var(--text-lg, 1.125rem);
		font-weight: var(--font-weight-medium, 500);
		line-height: 1.5;
	}

	h4 {
		font-size: var(--text-base, 1rem);
		font-weight: var(--font-weight-medium, 500);
		line-height: 1.5;
	}

	label {
		font-size: var(--text-base, 1rem);
		font-weight: var(--font-weight-medium, 500);
		line-height: 1.5;
	}

	button {
		font-size: var(--text-base, 1rem);
		font-weight: var(--font-weight-medium, 500);
		line-height: 1.5;
	}

	input {
		font-size: var(--text-base, 1rem);
		font-weight: var(--font-weight-normal, 400);
		line-height: 1.5;
	}
}

/* Details/Summary für späteres FAQ Pattern */
details {
	margin: 1rem 0;
}

summary {
	cursor: pointer;
	font-weight: 500;
	padding: 0.5rem 0;
}

summary:hover {
	text-decoration: underline;
}

details[open] summary {
	margin-bottom: 0.5rem;
}

/* Prefers reduced motion helper */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Utility: Reduced motion class (wird via JS gesetzt) */
.reduced-motion *,
.reduced-motion *::before,
.reduced-motion *::after {
	animation-duration: 0.01ms !important;
	animation-iteration-count: 1 !important;
	transition-duration: 0.01ms !important;
	scroll-behavior: auto !important;
}

/* Marquee Animation */
@keyframes marquee {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-100%);
	}
}

.animate-marquee {
	animation: marquee 30s linear infinite;
}

/* Respect reduced motion for marquee */
@media (prefers-reduced-motion: reduce) {
	.animate-marquee {
		animation: none;
	}
}

.reduced-motion .animate-marquee {
	animation: none;
}

/* Override WordPress Core layout constrained max-width */
.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	max-width: none !important;
}

/* Button font-weight - applies to all buttons */
button,
.wp-block-button__link,
.wp-element-button,
a.wp-block-button__link,
input[type="submit"],
input[type="button"],
input[type="reset"] {
	font-weight: 600 !important;
}

/* Remove unwanted padding on homepage - only for main content */
body.home main {
	margin-top: 0 !important;
}

body.home main .wp-block-group.alignfull.has-global-padding.is-layout-constrained,
body.home main .wp-block-group.alignfull.has-global-padding.is-layout-constrained.wp-block-group-is-layout-constrained,
body.home main.wp-block-group.alignfull.has-global-padding.is-layout-constrained,
body.home main.wp-block-group.alignfull.has-global-padding.is-layout-constrained.wp-block-group-is-layout-constrained {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}


.max-width-1200 {
	max-width: 100vw !important;
	word-break: break-word;
}

@media (min-width: 640px) {
.max-width-1200 {
	max-width: 1200px !important;
}
}

.max-width-640 {
	max-width: 300px !important;
}