/**
 * Bezugsquellen.
 *
 * Farbwelt wie im uebrigen Plugin: Gold #A09060 fuer Akzente, warmes
 * Nahschwarz #26231D fuer Flaechen. Klassennamen ohne Umlaute.
 */

.gcbq-block,
.gcbq-kacheln,
.gcbq-rueck,
.gcbq-sieger {
	--gc-gold: #a09060;
	--gc-gold-dunkel: #857748;
	--gc-gold-hell: #f6f2e7;
	--gc-dunkel: #26231d;
	--gc-text: #1a1a1a;
	--gc-leise: #6e6e73;
	--gc-linie: #e4e2dc;
	--gc-flaeche: #f8f7f4;

	font-size: 15px;
	line-height: 1.55;
	color: var(--gc-text);
	box-sizing: border-box;
}

.gcbq-block *,
.gcbq-kacheln *,
.gcbq-rueck *,
.gcbq-sieger * {
	box-sizing: border-box;
}

/* ================================================================
 * Tabellenblock
 * ============================================================= */

.gcbq-block {
	margin: 0 0 2.4em;
}

.gcbq-block__kopf {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.5em 0.8em;
	margin-bottom: 0.7em;
	padding-bottom: 0.5em;
	border-bottom: 2px solid var(--gc-gold);
}

.gcbq-block__titel {
	margin: 0;
	padding: 0;
	font-size: 1.25em;
	font-weight: 700;
	color: var(--gc-text);
}

.gcbq-block__zahl {
	padding: 0.1em 0.55em;
	border-radius: 100px;
	background: var(--gc-gold-hell);
	color: var(--gc-gold-dunkel);
	font-size: 12px;
	font-weight: 700;
}

.gcbq-block__stand {
	margin-left: auto;
	font-size: 12px;
	color: var(--gc-leise);
}

.gcbq-block__info {
	margin: 0 0 0.8em;
	padding: 0.7em 0.9em;
	background: var(--gc-flaeche);
	border-left: 3px solid var(--gc-linie);
	border-radius: 0 6px 6px 0;
	font-size: 13.5px;
	color: var(--gc-leise);
}

.gcbq-block--ausgelistet {
	opacity: 0.85;
}

/* ---- Tabelle ---- */

.gcbq-tabelle-huelle {
	overflow-x: auto;
	border: 1px solid var(--gc-linie);
	border-radius: 10px;
}

.gcbq-tabelle {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-size: 14px;
}

.gcbq-tabelle thead th {
	padding: 0.7em 0.9em;
	border: 0;
	border-bottom: 1px solid var(--gc-linie);
	background: var(--gc-dunkel);
	color: #e8dfc7;
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	text-align: left;
	white-space: nowrap;
}

.gcbq-tabelle tbody td {
	padding: 0.7em 0.9em;
	border: 0;
	border-bottom: 1px solid #f0efeb;
	vertical-align: middle;
}

.gcbq-tabelle tbody tr:last-child td {
	border-bottom: 0;
}

.gcbq-tabelle tbody tr:hover {
	background: var(--gc-gold-hell);
}

.gcbq-tabelle__link {
	font-weight: 600;
	color: var(--gc-text);
	text-decoration: none;
	border-bottom: 1px solid var(--gc-gold);
}

.gcbq-tabelle__link:hover {
	color: var(--gc-gold-dunkel);
}

.gcbq-tabelle__klartext {
	font-weight: 600;
	color: var(--gc-text);
}

.gcbq-tabelle__stand {
	display: block;
	font-size: 11px;
	color: var(--gc-leise);
}

.gcbq-marke {
	display: inline-block;
	margin-left: 0.4em;
	padding: 0.12em 0.5em;
	border-radius: 100px;
	font-size: 9.5px;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.gcbq-marke--test {
	background: var(--gc-gold);
	color: #fff;
}

.gcbq-marke--offen {
	background: var(--gc-flaeche);
	color: var(--gc-gold-dunkel);
}

.gcbq-leer {
	color: #bdbdc4;
	font-size: 13px;
}

.gcbq__hinweis {
	padding: 1em;
	background: var(--gc-flaeche);
	border-radius: 10px;
	color: #6e6e73;
}

/* ================================================================
 * Kacheln
 * ============================================================= */

.gcbq-kacheln {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1em;
	margin: 1.4em 0;
}

.gcbq-kachel {
	display: flex;
	flex-direction: column;
	gap: 0.7em;
	padding: 1.1em;
	border: 1px solid var(--gc-linie);
	border-radius: 12px;
	background: #fff;
	text-decoration: none;
	color: inherit;
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.gcbq-kachel:hover {
	transform: translateY(-3px);
	border-color: var(--gc-gold);
	box-shadow: 0 12px 26px rgba(38, 35, 29, 0.12);
}

.gcbq-kachel__logo {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 62px;
}

.gcbq-kachel__logo img {
	max-width: 100%;
	max-height: 62px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.gcbq-kachel__ersatz {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--gc-dunkel);
	color: #e8dfc7;
	font-size: 19px;
	font-weight: 700;
	text-transform: uppercase;
}

.gcbq-kachel__text {
	display: flex;
	flex-direction: column;
	gap: 0.2em;
}

.gcbq-kachel__name {
	font-size: 15.5px;
	font-weight: 700;
}

.gcbq-kachel__kurz {
	font-size: 12.5px;
	line-height: 1.4;
	color: var(--gc-leise);
}

.gcbq-kachel__zahl {
	margin-top: 0.25em;
	font-size: 11.5px;
	font-weight: 700;
	color: var(--gc-gold-dunkel);
}

/* ================================================================
 * Testsieger
 * ============================================================= */

.gcbq-sieger {
	position: relative;
	margin: 1.6em 0;
	padding: 1.4em 1.5em;
	border: 1px solid var(--gc-gold);
	border-radius: 12px;
	background: linear-gradient(150deg, #fdfbf6 0%, var(--gc-gold-hell) 100%);
}

.gcbq-sieger__label {
	display: inline-block;
	margin-bottom: 0.5em;
	padding: 0.2em 0.7em;
	border-radius: 100px;
	background: var(--gc-gold);
	color: #fff;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.gcbq-sieger__titel {
	margin: 0 0 0.4em;
	padding: 0;
	font-size: 1.35em;
	line-height: 1.3;
}

.gcbq-sieger__titel a {
	color: var(--gc-text);
	text-decoration: none;
}

.gcbq-sieger__titel a:hover {
	color: var(--gc-gold-dunkel);
}

.gcbq-sieger__zeile {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em 1em;
	margin-bottom: 0.7em;
	font-size: 13.5px;
	color: var(--gc-leise);
}

.gcbq-sieger__note {
	padding: 0.2em 0.65em;
	border-radius: 7px;
	background: var(--gc-dunkel);
	color: #e8dfc7;
	font-size: 15px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.gcbq-sieger__text {
	margin: 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--gc-text);
}

/* ================================================================
 * Rueckverweis am Gin
 * ============================================================= */

.gcbq-rueck {
	margin: 2em 0;
	padding: 1.3em 1.4em;
	border: 1px solid var(--gc-linie);
	border-radius: 12px;
	background: var(--gc-flaeche);
}

.gcbq-rueck__titel {
	margin: 0 0 0.9em;
	padding: 0 0 0.5em;
	border-bottom: 2px solid var(--gc-gold);
	font-size: 1.2em;
	font-weight: 700;
}

.gcbq-rueck__liste {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(215px, 1fr));
	gap: 0.7em;
}

.gcbq-rueck__knopf {
	display: flex;
	align-items: center;
	gap: 0.8em;
	padding: 0.8em 0.9em;
	border: 1px solid var(--gc-linie);
	border-radius: 10px;
	background: #fff;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.gcbq-rueck__knopf:hover {
	border-color: var(--gc-gold);
	box-shadow: 0 6px 16px rgba(38, 35, 29, 0.09);
}

.gcbq-rueck__logo {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
}

.gcbq-rueck__logo img {
	max-width: 100%;
	max-height: 44px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.gcbq-rueck__text {
	display: flex;
	flex-direction: column;
	gap: 0.1em;
	min-width: 0;
}

.gcbq-rueck__name {
	font-size: 14.5px;
	font-weight: 700;
}

.gcbq-rueck__preis {
	font-size: 13px;
	font-weight: 600;
	color: var(--gc-gold-dunkel);
}

.gcbq-rueck__stand {
	margin-left: 0.35em;
	font-size: 11px;
	font-weight: 400;
	color: var(--gc-leise);
}

.gcbq-rueck__hinweis {
	font-size: 11.5px;
	line-height: 1.4;
	color: var(--gc-leise);
}

.gcbq-rueck__fuss {
	margin: 0.9em 0 0;
	font-size: 12px;
	line-height: 1.5;
	color: var(--gc-leise);
}

/* ================================================================
 * Schmale Bildschirme
 * ============================================================= */

@media (max-width: 640px) {
	.gcbq-tabelle thead {
		display: none;
	}

	.gcbq-tabelle,
	.gcbq-tabelle tbody,
	.gcbq-tabelle tr,
	.gcbq-tabelle td {
		display: block;
		width: 100%;
	}

	.gcbq-tabelle tr {
		padding: 0.7em 0.9em;
		border-bottom: 1px solid var(--gc-linie);
	}

	.gcbq-tabelle tbody td {
		display: flex;
		justify-content: space-between;
		gap: 1em;
		padding: 0.22em 0;
		border: 0;
	}

	.gcbq-tabelle tbody td::before {
		content: attr(data-titel);
		flex: 0 0 auto;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.05em;
		text-transform: uppercase;
		color: var(--gc-leise);
	}

	.gcbq-tabelle tbody td:first-child {
		display: block;
		margin-bottom: 0.35em;
	}

	.gcbq-tabelle tbody td:first-child::before {
		display: none;
	}

	.gcbq-rueck__liste {
		grid-template-columns: 1fr;
	}
}