/*
Theme Name: DSKI Child
Theme URI: https://dski.de/
Description: Child-Theme für den DSKI-Relaunch (Hello Elementor Basis). Institut-Stil, Performance- und SEO-Hooks.
Author: Grafikbude / DSKI
Template: hello-elementor
Version: 1.0.4
Requires at least: 6.4
Requires PHP: 8.1
Text Domain: dski-child
*/

/* Zusätzliches Styling minimal halten – Hauptdesign in Elementor Global Styles */

:root {
	/* Markenfarben dski.de (Avada / Logo 4c) */
	--dski-color-primary: #e30014;
	--dski-color-primary-dark: #191919;
	--dski-color-accent: #e30014;
	--dski-color-accent-hover: #7a000c;
	--dski-color-highlight: #fdd314;
	--dski-color-text: #191919;
	--dski-color-muted: #707070;
	--dski-color-bg: #f2f2f2;
	--dski-color-border: #eaeaea;
	--dski-color-white: #ffffff;
	--dski-font-sans: "Fira Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--dski-radius: 6px;
	--dski-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

body {
	font-family: var(--dski-font-sans);
	color: var(--dski-color-text);
}

/* Header-System: Topbar + kontextabhängiges Menü */
.dski-site-topbar .dski-area-switches {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0.5rem;
}

.dski-site-topbar .dski-area-switch {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 0.45rem 0.95rem;
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.08);
	color: rgba(255, 255, 255, 0.86);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1;
	text-decoration: none;
	transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
}

.dski-site-topbar .dski-area-switch:hover,
.dski-site-topbar .dski-area-switch:focus-visible {
	border-color: rgba(255, 255, 255, 0.4);
	background: rgba(255, 255, 255, 0.16);
	color: var(--dski-color-white);
}

body.dski-area-hundehalter .dski-area-switch--hundehalter,
body.dski-area-fachbereich .dski-area-switch--fachbereich {
	border-color: var(--dski-color-white);
	background: var(--dski-color-white);
	color: var(--dski-color-primary-dark);
}

.dski-site-header .dski-nav-menu--fachbereich,
body.dski-area-fachbereich .dski-site-header .dski-nav-menu--hundehalter,
body.dski-area-hundehalter .dski-site-header .dski-nav-menu--fachbereich {
	display: none;
}

body.dski-area-fachbereich .dski-site-header .dski-nav-menu--fachbereich {
	display: block;
}

.dski-site-header .dski-menu-stack .elementor-widget-wrap {
	align-content: center;
}

.dski-site-header .dski-menu-stack .elementor-widget-nav-menu {
	margin-bottom: 0;
}

.dski-site-header .dski-menu-stack .elementor-nav-menu {
	justify-content: flex-end;
}

.dski-site-header .dski-header-cta .elementor-widget-container,
.dski-site-header .dski-header-cta .elementor-button-wrapper {
	display: flex;
	justify-content: flex-end;
}

.dski-site-header .dski-header-cta .elementor-button {
	white-space: nowrap;
}

/* WooCommerce: schlanke Buttons an Institut-Farben anlehnen */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	background-color: var(--dski-color-accent);
	color: #fff;
	border-radius: var(--dski-radius);
	font-weight: 600;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background-color: var(--dski-color-accent-hover);
	color: #fff;
}

/* Conversion-Band (falls als HTML-Klasse genutzt) */
.dski-cta-band {
	background: var(--dski-color-primary);
	color: var(--dski-color-white);
	padding: 2.5rem 1.5rem;
	text-align: center;
}

.dski-cta-band a.button {
	background: var(--dski-color-accent);
}

/* Navigation: Probe-Test hervorheben (docs/menus.md) */
.menu-item-probe-test > a {
	font-weight: 700;
	color: var(--dski-color-primary) !important;
}

@media (max-width: 1024px) {
	.dski-site-topbar .dski-area-switches {
		justify-content: flex-start;
		flex-wrap: wrap;
	}

	.dski-site-header .dski-menu-stack .elementor-nav-menu {
		justify-content: flex-start;
	}

	.dski-site-header .dski-header-cta .elementor-widget-container,
	.dski-site-header .dski-header-cta .elementor-button-wrapper {
		justify-content: flex-start;
	}
}

/* WCAG 2.4.1 – Skip-Link */
.dski-skip-link {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
	z-index: 100000;
	padding: 12px 20px;
	background: var(--dski-color-primary-dark);
	color: #fff;
	font-weight: 600;
	text-decoration: none;
	border-radius: var(--dski-radius);
}

.dski-skip-link:focus,
.dski-skip-link:focus-visible {
	left: 12px;
	top: 12px;
	width: auto;
	height: auto;
	outline: 3px solid var(--dski-color-accent);
	outline-offset: 2px;
}

/* WCAG 2.3.3 – Animationen reduzieren */
@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;
	}
}

/* Barrierefreiheit: Fokus sichtbar (WCAG 2.4.7) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--dski-color-accent);
	outline-offset: 2px;
}

/* Kontrast Text auf hellem Grund – min. 4.5:1 mit #1e293b auf #f8fafc ✓ */

/* FAQ details – bessere Tastatur-Nutzung */
.dski-faq__item summary {
	cursor: pointer;
	padding: 0.75rem 0;
}

.dski-faq__item summary:focus-visible {
	outline: 2px solid var(--dski-color-accent);
}