/*
 * Bredtmann design update 2026-11: wider layout on large screens, category cards,
 * collapsible shop filters, FAQ accordion. Loaded after style.css (see inc/bredtmann-2026.php).
 * Rollback: remove the require of inc/bredtmann-2026.php from functions.php.
 */

/* ---------- Wider layout on large monitors (Flatsome default is 1080px) ---------- */
@media (min-width: 1600px) {
	html body .container,
	html body .container-width,
	html body .row:not(.row-collapse):not(.row-full-width) {
		max-width: 1440px;
	}
	/* Shop and category archives: 4 instead of 3 columns */
	.archive .products.large-columns-3 > .col {
		flex-basis: 25%;
		max-width: 25%;
	}
}
@media (min-width: 2200px) {
	html body .container,
	html body .container-width,
	html body .row:not(.row-collapse):not(.row-full-width) {
		max-width: 1680px;
	}
	.archive .products.large-columns-3 > .col {
		flex-basis: 20%;
		max-width: 20%;
	}
}

/* ---------- Category cards ---------- */
.product-category .col-inner {
	height: 100%;
	overflow: hidden;
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 4px 14px rgba(0, 0, 0, .06);
	transition: transform .25s ease, box-shadow .25s ease;
}
.product-category .col-inner:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, .14);
}
.product-category .box-image img {
	transition: transform .6s ease;
}
.product-category .col-inner:hover .box-image img {
	transform: scale(1.05);
}

/* Shop page ("push" style): label sits below the image instead of overlapping it */
.product-category .box-push .box-text {
	max-width: none;
	margin: 0;
	padding: 14px 12px 16px;
	background: #fff;
}
.product-category .box-push .header-title {
	margin-bottom: 2px;
	color: #222;
	font-size: .95em;
	letter-spacing: .06em;
}
.product-category .box-push .count {
	color: #8a8a8a;
	font-size: .7em;
	letter-spacing: .04em;
	opacity: 1;
}

/* Home page ("overlay" style): readable label on a bottom gradient */
.product-category .box-overlay .overlay {
	background: linear-gradient(to top, rgba(0, 0, 0, .75) 0%, rgba(0, 0, 0, .25) 38%, rgba(0, 0, 0, 0) 62%) !important;
	opacity: 1 !important;
}
.product-category .box-overlay .box-text {
	padding: 0 1.1em 1em;
	text-align: left;
}
.product-category .box-overlay .header-title {
	margin: 0;
	font-size: clamp(.85rem, 1.05vw, 1.2rem);
	letter-spacing: .08em;
	overflow-wrap: anywhere;
	hyphens: auto;
}
.product-category .box-overlay .count {
	display: none;
}

/* ---------- Shop sidebar: collapsible filter widgets (bredtmann-2026.js) ---------- */
.bt-collapsible > .widget-title {
	position: relative;
	padding-right: 24px;
	cursor: pointer;
	user-select: none;
}
.bt-collapsible > .widget-title::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 4px;
	width: 7px;
	height: 7px;
	margin-top: -6px;
	border-right: 2px solid #999;
	border-bottom: 2px solid #999;
	transform: rotate(45deg);
	transition: transform .2s ease;
}
.bt-collapsible.is-collapsed > .widget-title::after {
	margin-top: -3px;
	transform: rotate(-45deg);
}
.bt-collapsible.is-collapsed > :not(.widget-title):not(.is-divider) {
	display: none;
}

/* ---------- FAQ page ---------- */
#content {
	color: #333;
}
.ahl {
	display: block;
	margin-bottom: .4em;
	color: #333;
	font-size: 1.05em;
}
#questions {
	margin-bottom: 2em;
}
.ab {
	margin-bottom: 2em;
	padding: 1.4em 2em .6em;
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	background: #fff;
}
.ab > h2.mq {
	margin: 0 0 .4em;
	font-size: 1.35em;
}
.ab img {
	display: inline-block;
	border-radius: 4px;
}
.a {
	margin: 0;
	padding: 0 0 1em;
	border-bottom: 1px solid #eee;
}
.a:last-child {
	border-bottom: 0;
}

/* Enhanced (JS) mode: search, category chips, accordion */
.faq-enhanced #questions {
	display: none;
}
.faq-tools {
	margin: 0 0 2em;
}
.faq-search {
	display: flex;
	gap: 10px;
	align-items: center;
	margin-bottom: 1em;
}
.faq-search input[type="search"] {
	flex: 1;
	height: 48px;
	margin: 0;
	padding: 0 16px;
	border: 1px solid #ccc;
	border-radius: 6px;
	box-shadow: none;
	font-size: 1.05em;
}
.faq-search input[type="search"]:focus {
	border-color: #446084;
	box-shadow: 0 0 0 3px rgba(68, 96, 132, .15);
}
.faq-search button {
	height: 48px;
	margin: 0;
	white-space: nowrap;
}
.faq-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.faq-chips a {
	padding: 5px 14px;
	border: 1px solid #ddd;
	border-radius: 999px;
	color: #333;
	font-size: .85em;
	line-height: 1.4;
	transition: background .15s, border-color .15s;
}
.faq-chips a:hover {
	border-color: #446084;
	background: #f3f6fa;
}
.faq-empty {
	padding: 1.2em 1.5em;
	border-radius: 6px;
	background: #f6f6f6;
}
.faq-enhanced .a {
	padding: 0;
}
.faq-enhanced .a > h3.aq {
	position: relative;
	margin: 0;
	padding: .9em 2.2em .9em 0;
	font-size: 1.05em;
	cursor: pointer;
}
.faq-enhanced .a > h3.aq:hover {
	color: #446084;
}
.faq-enhanced .a > h3.aq::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 6px;
	width: 9px;
	height: 9px;
	margin-top: -7px;
	border-right: 2px solid #999;
	border-bottom: 2px solid #999;
	transform: rotate(45deg);
	transition: transform .2s ease;
}
.faq-enhanced .a.is-open > h3.aq::after {
	margin-top: -2px;
	transform: rotate(-135deg);
}
.faq-enhanced .a > .faq-body {
	padding: 0 0 1.2em;
}
.faq-enhanced .a:not(.is-open) > .faq-body {
	display: none;
}
.faq-enhanced .a.is-hidden,
.faq-enhanced .ab.is-hidden {
	display: none;
}
@media (min-width: 1600px) {
	.faq-enhanced .entry-content,
	.faq-enhanced #content .col-inner {
		max-width: 1100px;
		margin-left: auto;
		margin-right: auto;
	}
}

/* Home: some air between the category grid and the footer */
.home #content {
	padding-bottom: 3em;
}

/* FAQ: "Alle aufklappen" in the brand colour, stacked toolbar on phones */
.faq-search .button.is-outline {
	border-color: #446084;
	color: #446084;
}
.faq-search .button.is-outline:hover {
	background: #446084;
	color: #fff;
}
@media (max-width: 549px) {
	.faq-search {
		flex-direction: column;
		align-items: stretch;
	}
	.faq-search input[type="search"] {
		flex: none;
		width: 100%;
	}
	.ab {
		padding: 1em 1em .4em;
	}
	.faq-chips a {
		font-size: .8em;
	}
}
