/*
Theme Name: AutoSell Shop Theme
Theme URI: https://digital-stratege.de/
Author: digital-stratege.de
Author URI: https://digital-stratege.de/
Description: Schlankes Shop-Theme für AutoSell Commerce -- Bildheader mit auswählbarem Motiv, über den AutoSell-Commerce-Einrichtungsassistenten einstellbares Farbschema, dreispaltiger Footer. Funktioniert eigenständig, entfaltet die volle Wirkung (Farbschema, Header-Motiv) zusammen mit dem AutoSell-Commerce-Plugin.
Version: 1.2.1
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.7
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: autosell-shop-theme
*/

/* ──────────────────────────────────────────────────────────────────────
 * Grundgerüst: CSS-Variablen (Fallback-Werte -- die eigentlichen Werte
 * kommen, sofern das AutoSell-Commerce-Plugin aktiv ist und Farben im
 * Einrichtungsassistenten gesetzt wurden, per inline <style> aus
 * inc/colors.php on top of :root, siehe wpac_theme_head_styles()).
 * ────────────────────────────────────────────────────────────────────── */
:root{
	--wpac-color-primary: #1a5276;
	--wpac-color-primary-dark: #154360;
	--wpac-color-primary-light: #eaf1f8;
	--wpac-color-accent: #186a3b;
	--wpac-color-on-primary: #ffffff;
	--wpac-color-text: #2b2b2b;
	--wpac-color-text-muted: #5a5a5a;
	--wpac-color-border: #e2e2e2;
	--wpac-color-bg: #ffffff;
	--wpac-font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--wpac-max-width: 1180px;
}

/* Bewusst KEINE Google-Fonts-Einbindung -- externe Font-CDNs laden bei
   jedem Seitenaufruf personenbezogene Daten (IP-Adresse) an einen
   Drittanbieter, was ohne Einwilligung DSGVO-relevant ist (siehe u.a.
   LG München I, Az. 3 O 17493/20). Systemschriften vermeiden das Problem
   von vornherein und sparen zusätzlich eine Anfrage. */

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
	margin:0;
	font-family:var(--wpac-font-body);
	color:var(--wpac-color-text);
	background:var(--wpac-color-bg);
	line-height:1.6;
}
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--wpac-color-primary); }
h1,h2,h3,h4,h5,h6{ line-height:1.25; color:var(--wpac-color-text); }
ul.wpac-unstyled{ list-style:none; margin:0; padding:0; }

/* ── Barrierefreiheit (BFSG): Skip-Link + sichtbarer Fokus ──
 * Ein vollständiger Barrierefreiheits-Check der Plugin-Templates (Cart-
 * Drawer, Wizard, Tabs) folgt separat -- dieses Grundgerüst liefert die
 * theme-seitigen Basics, die jede Seite betreffen. */
.screen-reader-text{
	position:absolute !important;
	width:1px; height:1px; overflow:hidden;
	clip:rect(1px,1px,1px,1px);
	white-space:nowrap;
}
.wpac-skip-link{
	position:absolute; top:-100px; left:0;
	background:var(--wpac-color-primary); color:var(--wpac-color-on-primary);
	padding:10px 18px; z-index:10000; text-decoration:none;
}
.wpac-skip-link:focus{
	position:fixed; top:8px; left:8px;
	width:auto; height:auto; clip:auto; overflow:visible;
}
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible{
	outline:3px solid var(--wpac-color-accent);
	outline-offset:2px;
}

/* ── Layout-Container ── */
.wpac-container{ max-width:var(--wpac-max-width); margin:0 auto; padding:0 24px; }

/* ── Ankündigungsleiste (oberhalb des Headers, siehe inc/announcement-bar.php) ── */
.wpac-announcement-bar{
	background:var(--wpac-announcement-bg, var(--wpac-color-primary));
	color:var(--wpac-announcement-fg, #fff);
}
.wpac-announcement-bar-inner{
	display:flex; align-items:center; justify-content:center; gap:16px;
	padding:9px 24px; position:relative;
}
.wpac-announcement-text{ margin:0; font-size:.92em; font-weight:600; text-align:center; }
.wpac-announcement-link{
	color:inherit; text-decoration:underline; font-weight:700; margin-left:8px; white-space:nowrap;
}
.wpac-announcement-close{
	position:absolute; right:16px; top:50%; transform:translateY(-50%);
	background:transparent; border:none; color:inherit; opacity:.8;
	font-size:1.3em; line-height:1; cursor:pointer; padding:2px 6px;
}
.wpac-announcement-close:hover{ opacity:1; }
.wpac-announcement-bar.wpac-hidden{ display:none; }

/* ── Header ── */
.wpac-site-header{ border-bottom:1px solid var(--wpac-color-border); position:relative; }
.wpac-site-header-image{
	background-size:cover;
	background-position:center;
	background-color:var(--wpac-color-primary);
}
.wpac-site-header-inner{
	max-width:var(--wpac-max-width);
	margin:0 auto;
	padding:22px 24px;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:24px;
	min-height:64px;
	background:linear-gradient(to bottom, rgba(0,0,0,.15), rgba(0,0,0,.35));
}
/* Auf Innenseiten (keine Startseite) bewusst kein großes Hero-Bild -- schlanke,
   einfarbige Kopfzeile in der Primärfarbe, damit das Bild ein Startseiten-Blickfang
   bleibt statt sich auf jeder Unterseite zu wiederholen. */
.wpac-site-header--inner .wpac-site-header-inner{
	padding:16px 24px;
	min-height:56px;
	background:linear-gradient(to bottom, rgba(0,0,0,.06), rgba(0,0,0,.12));
}
.wpac-site-branding{ display:flex; align-items:center; }
.wpac-site-title{
	font-size:1.5em; font-weight:700;
	color:#fff; text-decoration:none;
	text-shadow:0 1px 3px rgba(0,0,0,.4);
}
.wpac-site-branding .custom-logo{ max-height:64px; width:auto; }

/* ── Kategorien im Header (siehe inc/category-nav.php) ── */
.wpac-header-category-nav{
	background:#fff;
	border-top:1px solid rgba(255,255,255,.25);
}
.wpac-header-category-list{
	display:flex; flex-wrap:wrap; justify-content:center; gap:6px;
	max-width:var(--wpac-max-width); margin:0 auto; padding:0 24px;
}
.wpac-header-category-item{ position:relative; }
.wpac-header-category-link{
	display:block; padding:12px 16px; color:var(--wpac-color-text); text-decoration:none;
	font-weight:600; font-size:.95em; border-bottom:2px solid transparent;
}
.wpac-header-category-link:hover,
.wpac-header-category-item:focus-within .wpac-header-category-link{
	color:var(--wpac-color-primary); border-bottom-color:var(--wpac-color-primary);
}
.wpac-header-category-item.has-panel .wpac-header-category-panel{
	display:none;
	position:absolute; left:50%; top:100%; transform:translateX(-50%);
	z-index:40; width:min(90vw, 640px);
	background:#fff; border:1px solid var(--wpac-color-border); border-radius:0 0 10px 10px;
	box-shadow:0 16px 32px rgba(0,0,0,.15);
}
.wpac-header-category-item.has-panel:hover .wpac-header-category-panel,
.wpac-header-category-item.has-panel:focus-within .wpac-header-category-panel{
	display:block;
}
.wpac-header-category-panel-inner{
	display:flex; align-items:stretch; gap:24px; padding:24px; max-width:none;
}
.wpac-header-category-panel-image{ flex:0 0 220px; }
.wpac-header-category-panel-image img{ border-radius:8px; width:100%; height:150px; object-fit:cover; }
.wpac-header-category-panel-text{ flex:1 1 auto; display:flex; flex-direction:column; justify-content:center; text-align:left; }
.wpac-header-category-panel-eyebrow{
	margin:0 0 6px; font-size:.75em; font-weight:700; letter-spacing:.06em;
	color:var(--wpac-color-text-muted);
}
.wpac-header-category-panel-desc{ margin:0 0 14px; color:var(--wpac-color-text); }
.wpac-header-category-panel-cta{ align-self:flex-start; }

@media (max-width:820px){
	.wpac-header-category-list{ justify-content:flex-start; overflow-x:auto; }
	.wpac-header-category-panel{ display:none !important; } /* kein Hover auf Touch -- Panel entfällt, Link bleibt */
}

.wpac-main-nav{ position:relative; }
.wpac-nav-toggle{
	display:none;
	background:rgba(255,255,255,.15);
	border:1px solid rgba(255,255,255,.5);
	color:#fff;
	border-radius:6px;
	padding:8px 14px;
	font-size:1.2em;
	cursor:pointer;
}
#wpac-primary-menu{
	list-style:none; margin:0; padding:0;
	display:flex; gap:26px; flex-wrap:wrap;
}
#wpac-primary-menu a{
	color:#fff; text-decoration:none; font-weight:600;
	text-shadow:0 1px 3px rgba(0,0,0,.4);
	padding:6px 2px;
	border-bottom:2px solid transparent;
}
#wpac-primary-menu a:hover,
#wpac-primary-menu a:focus-visible{ border-bottom-color:#fff; }
#wpac-primary-menu .current-menu-item > a{ border-bottom-color:#fff; }

@media (max-width:720px){
	.wpac-nav-toggle{ display:block; }
	#wpac-primary-menu{
		display:none;
		flex-direction:column;
		position:absolute; top:100%; right:0;
		background:var(--wpac-color-primary-dark);
		padding:14px 20px; border-radius:0 0 8px 8px;
		min-width:220px; gap:12px;
		box-shadow:0 6px 16px rgba(0,0,0,.25);
	}
	#wpac-primary-menu.wpac-open{ display:flex; }
}

/* ── Content ── */
.wpac-page-wrap{ max-width:var(--wpac-max-width); margin:0 auto; padding:36px 24px 60px; }
.wpac-page-title{ margin-top:0; }
.wpac-article-content{ line-height:1.7; }

/* ── Footer ── */
.wpac-site-footer{
	background:#f7f9fb;
	border-top:1px solid var(--wpac-color-border);
	margin-top:48px;
}
.wpac-footer-columns{
	max-width:var(--wpac-max-width);
	margin:0 auto;
	padding:40px 24px;
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:32px;
}
.wpac-footer-widget-title{
	margin:0 0 12px;
	font-size:1.05em;
	color:var(--wpac-color-primary);
}
.wpac-footer-widget{ margin-bottom:20px; }
.wpac-footer-legal-links{ list-style:none; margin:0; padding:0; }
.wpac-footer-legal-links li{ margin-bottom:6px; }
.wpac-footer-legal-links a{ color:var(--wpac-color-text-muted); text-decoration:none; }
.wpac-footer-legal-links a:hover{ color:var(--wpac-color-primary); text-decoration:underline; }
.wpac-footer-badge{
	display:inline-block; margin:0 6px 6px 0; padding:4px 10px;
	background:#fff; border:1px solid var(--wpac-color-border); border-radius:14px;
	font-size:.82em; color:var(--wpac-color-text-muted);
}
.wpac-footer-bottom{
	border-top:1px solid var(--wpac-color-border);
	padding:16px 24px;
	text-align:center;
	font-size:.85em;
	color:var(--wpac-color-text-muted);
}

@media (max-width:820px){
	.wpac-footer-columns{ grid-template-columns:1fr; }
}