/* Peaky Beans – Simple Points and Rewards (Bohnen-Box) */

.spar-cart-rewards-box {
	--pb-o: #ec702e;
	--pb-od: #b4501c;
	--pb-ink: #141210;
	--pb-line: #e3dbd3;
	--pb-soft: #EFE9E3;
	--pb-sand: #EFE9E3;
	--pb-muted: #6b5f57;
}
body .spar-cart-rewards-box.spar-cart-rewards-box {
	box-sizing: border-box;
	max-width: 1180px;
	margin: 32px auto 32px !important;
	padding: 18px 20px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 16px !important;
	background: #fff !important;
	box-shadow: none !important;
	color: var(--pb-ink) !important;
}
@media (max-width:767px){ body .spar-cart-rewards-box.spar-cart-rewards-box{ margin-top: 20px !important; } }
body .spar-cart-rewards-box *,
body .spar-cart-rewards-box *::before,
body .spar-cart-rewards-box *::after { box-sizing: border-box; }
body .spar-cart-rewards-box,
body .spar-cart-rewards-box *:not(.woocommerce-Price-currencySymbol) { font-family: Inter, system-ui, sans-serif !important; }

/* Kopfzeile: Text links, Bohnen + Button rechts */
body .spar-cart-rewards-box .spar-cart-rewards-header {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	flex-wrap: wrap;
	gap: 12px 20px;
	padding: 0 !important;
	margin: 0 !important;
	background: none !important;
	border: 0 !important;
}
body .spar-cart-rewards-box .spar-cart-rewards-title-section { flex: 1 1 260px; min-width: 0; margin: 0 !important; }
body .spar-cart-rewards-box .spar-cart-rewards-title {
	margin: 0 0 2px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pb-muted) !important;
}
body .spar-cart-rewards-box .spar-cart-earning-message {
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	color: var(--pb-ink) !important;
}
body .spar-cart-rewards-box .spar-cart-rewards-summary {
	display: flex !important;
	align-items: center !important;
	gap: 10px;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
}
body .spar-cart-rewards-box .spar-cart-rewards-points {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	margin: 0 !important;
	padding: 8px 14px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--pb-sand) !important;
	box-shadow: none !important;
}
body .spar-cart-rewards-box .spar-cart-points-number { display: inline-flex; align-items: center; font-size: 16px !important; font-weight: 700 !important; color: var(--pb-ink) !important; }
body .spar-cart-rewards-box .spar-cart-points-label { font-size: 13px !important; font-weight: 600 !important; color: var(--pb-muted) !important; }
body .spar-cart-rewards-box .spar-cart-rewards-actions { margin: 0 !important; }

/* Buttons */
body .spar-cart-rewards-box .spar-redeem-toggle-btn {
	min-height: 38px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 1.5px solid var(--pb-ink) !important;
	border-radius: 10px !important;
	background: var(--pb-ink) !important;
	color: #fff !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	box-shadow: none !important;
	outline-offset: 2px;
	cursor: pointer;
}
body .spar-cart-rewards-box .spar-redeem-toggle-btn:hover { background: var(--pb-o) !important; border-color: var(--pb-o) !important; }
body .spar-cart-rewards-box .spar-redeem-toggle-btn:focus { box-shadow: none !important; }
body .spar-cart-rewards-box .spar-redeem-toggle-btn:focus-visible { outline: 3px solid var(--pb-o) !important; }

/* Aufklapp-Bereich */
body .spar-cart-rewards-box .spar-cart-rewards-dropdown {
	margin: 16px 0 0 !important;
	padding: 16px 0 0 !important;
	border: 0 !important;
	border-top: 1px solid var(--pb-line) !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

/* Tabs als Segment-Schalter */
body .spar-cart-rewards-box .spar-dropdown-tabs {
	display: flex !important;
	gap: 4px;
	margin: 0 0 16px !important;
	padding: 4px !important;
	border: 0 !important;
	border-radius: 12px !important;
	background: var(--pb-sand) !important;
}
body .spar-cart-rewards-box .spar-dropdown-tab {
	flex: 1 1 0;
	min-height: 38px !important;
	margin: 0 !important;
	padding: 0 10px !important;
	border: 0 !important;
	border-radius: 9px !important;
	background: transparent !important;
	color: var(--pb-ink) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	box-shadow: none !important;
	outline: none !important;
	cursor: pointer;
}
body .spar-cart-rewards-box .spar-dropdown-tab:hover { background: rgba(20, 18, 16, 0.06) !important; }
body .spar-cart-rewards-box .spar-dropdown-tab.active,
body .spar-cart-rewards-box .spar-dropdown-tab.active:hover { background: var(--pb-ink) !important; color: #fff !important; }
body .spar-cart-rewards-box .spar-dropdown-tab:focus-visible { outline: 3px solid var(--pb-o) !important; outline-offset: 1px; }
body .spar-cart-rewards-box .spar-dropdown-tab::after,
body .spar-cart-rewards-box .spar-dropdown-tab::before { display: none !important; }

body .spar-cart-rewards-box .spar-dropdown-content,
body .spar-cart-rewards-box .spar-dropdown-tab-content {
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	overflow: visible !important;
}

/* Prämien-Karten */
body .spar-cart-rewards-box .spar-rewards-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 10px;
	margin: 0 !important;
	padding: 0 !important;
}
body .spar-cart-rewards-box .spar-reward-item {
	display: flex !important;
	flex-direction: column;
	justify-content: space-between;
	gap: 12px;
	margin: 0 !important;
	padding: 16px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 12px !important;
	background: #fff !important;
	box-shadow: none !important;
	opacity: 1 !important;
}
body .spar-cart-rewards-box .spar-reward-item:not(.disabled) { border-color: var(--pb-o) !important; background: var(--pb-soft) !important; }
body .spar-cart-rewards-box .spar-reward-info { display: flex; flex-direction: column; gap: 2px; }
body .spar-cart-rewards-box .spar-reward-name { font-size: 16px !important; font-weight: 700 !important; color: var(--pb-ink) !important; }
body .spar-cart-rewards-box .spar-reward-cost { font-size: 13px !important; font-weight: 700 !important; color: var(--pb-od) !important; }
body .spar-cart-rewards-box .spar-reward-value,
body .spar-cart-rewards-box .spar-reward-value .amount { font-size: 13px !important; font-weight: 500 !important; color: var(--pb-muted) !important; }
body .spar-cart-rewards-box .spar-redeem-btn {
	width: 100%;
	min-height: 38px !important;
	margin: 0 !important;
	padding: 0 12px !important;
	border: 0 !important;
	border-radius: 9px !important;
	background: var(--pb-o) !important;
	color: #fff !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	box-shadow: none !important;
	cursor: pointer;
}
body .spar-cart-rewards-box .spar-redeem-btn:hover { background: var(--pb-od) !important; }
body .spar-cart-rewards-box .spar-redeem-btn:disabled,
body .spar-cart-rewards-box .spar-redeem-btn[disabled] {
	background: var(--pb-sand) !important;
	color: var(--pb-muted) !important;
	cursor: default;
}

/* Leerer Zustand */
body .spar-cart-rewards-box .spar-cart-empty-state { padding: 18px 0 6px !important; text-align: center; }
body .spar-cart-rewards-box .spar-cart-empty-icon { opacity: 0.5; filter: grayscale(1); }
body .spar-cart-rewards-box .spar-cart-empty-title { font-size: 14px !important; font-weight: 600 !important; color: var(--pb-muted) !important; }

/* Punkterabatt mit Schieberegler (ohne Querscrollen) */
body .spar-cart-rewards-box .spar-points-discount-panel,
body .spar-cart-rewards-box .spar-redeem-compact,
body .spar-cart-rewards-box .spar-redeem-panel {
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	overflow: visible !important;
}
body .spar-cart-rewards-box .spar-redeem-header { margin: 0 0 10px !important; font-size: 14px !important; font-weight: 700 !important; color: var(--pb-ink) !important; }
body .spar-cart-rewards-box .spar-panel-row {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	min-width: 0;
}
body .spar-cart-rewards-box .spar-redeem-slider { flex: 1 1 200px; min-width: 0; width: auto !important; accent-color: var(--pb-o); }
body .spar-cart-rewards-box .spar-panel-right { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
body .spar-cart-rewards-box .spar-redeem-input {
	width: 90px !important;
	height: 40px !important;
	padding: 0 10px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 9px !important;
	background: #fff !important;
	color: var(--pb-ink) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	text-align: center;
}
body .spar-cart-rewards-box .spar-redeem-actions {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: 12px !important;
}
body .spar-cart-rewards-box .spar-discount-box {
	display: inline-flex !important;
	align-items: baseline;
	gap: 6px;
	padding: 9px 14px !important;
	border: 0 !important;
	border-radius: 9px !important;
	background: var(--pb-sand) !important;
	color: var(--pb-ink) !important;
}
body .spar-cart-rewards-box .spar-redeem-value-label { font-size: 13px !important; font-weight: 600 !important; color: var(--pb-muted) !important; }
body .spar-cart-rewards-box .spar-redeem-value { font-size: 16px !important; font-weight: 700 !important; color: var(--pb-ink) !important; }
body .spar-cart-rewards-box .spar-redeem-apply-btn {
	min-height: 40px !important;
	margin: 0 !important;
	padding: 0 16px !important;
	border: 0 !important;
	border-radius: 9px !important;
	background: var(--pb-o) !important;
	color: #fff !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	white-space: normal;
	box-shadow: none !important;
	cursor: pointer;
}
body .spar-cart-rewards-box .spar-redeem-apply-btn:hover { background: var(--pb-od) !important; }
body .spar-cart-rewards-box .spar-redeem-apply-btn:disabled { background: #d9cfc6 !important; color: #fff !important; cursor: default; }

/* Bohnen-Zeile in "Deine Bestellung" (Kasse) – bleibt innerhalb der Spalte */
.wp-block-woocommerce-checkout .spar-redeem-compact,
.wp-block-woocommerce-checkout .spar-redeem-compact * { box-sizing: border-box; }
.wp-block-woocommerce-checkout .spar-redeem-compact {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	padding: 4px 0 0 !important;
	border: 0 !important;
	background: none !important;
	overflow: hidden;
	font-size: 14px !important;
}
.wp-block-woocommerce-checkout .spar-compact-row {
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 10px;
	width: 100%;
	text-align: left !important;
}
.wp-block-woocommerce-checkout .spar-compact-left { flex: 1 1 auto; min-width: 0; }
.wp-block-woocommerce-checkout .spar-compact-toggle-btn { flex: 0 0 auto; margin: 0 !important; }
.wp-block-woocommerce-checkout .spar-caret { border-top-color: #141210 !important; color: #141210 !important; }
.wp-block-woocommerce-checkout .spar-compact-left { font-size: 14px !important; font-weight: 700 !important; color: #141210 !important; }
.wp-block-woocommerce-checkout .spar-compact-toggle-btn {
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	color: #141210 !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-decoration: underline;
	text-underline-offset: 3px;
	text-transform: none !important;
	box-shadow: none !important;
}
.wp-block-woocommerce-checkout .spar-redeem-panel {
	display: flex !important;
	flex-direction: column !important;
	align-items: stretch !important;
	gap: 0 !important;
	width: 100% !important;
	margin-top: 12px !important;
	padding: 0 !important;
}
.wp-block-woocommerce-checkout .spar-panel-row { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; gap: 10px; width: 100% !important; margin: 0 !important; }
.wp-block-woocommerce-checkout .spar-redeem-slider { flex: 1 1 auto !important; min-width: 60px !important; width: auto !important; margin: 0 !important; accent-color: #ec702e; }
.wp-block-woocommerce-checkout .spar-panel-right { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.wp-block-woocommerce-checkout .spar-redeem-input {
	width: 76px !important;
	height: 38px !important;
	padding: 0 8px !important;
	border: 1.5px solid #ddd4cb !important;
	border-radius: 8px !important;
	background: #fff !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	text-align: center;
}
.wp-block-woocommerce-checkout .spar-redeem-actions { display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 8px; width: 100% !important; margin: 10px 0 0 !important; position: static !important; }
.wp-block-woocommerce-checkout .spar-discount-box {
	display: flex !important;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px;
	width: 100%;
	padding: 9px 12px !important;
	border: 0 !important;
	border-radius: 8px !important;
	background: #fff !important;
	color: #141210 !important;
}
.wp-block-woocommerce-checkout .spar-redeem-value-label { font-size: 13px !important; font-weight: 600 !important; color: #6b5f57 !important; }
.wp-block-woocommerce-checkout .spar-redeem-value { font-size: 15px !important; font-weight: 700 !important; color: #141210 !important; }
.wp-block-woocommerce-checkout .spar-redeem-buttons { width: 100%; }
.wp-block-woocommerce-checkout .spar-redeem-apply-btn {
	width: 100% !important;
	min-height: 40px !important;
	margin: 0 !important;
	padding: 8px 12px !important;
	border: 0 !important;
	border-radius: 8px !important;
	background: #ec702e !important;
	color: #fff !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-transform: none !important;
	white-space: normal !important;
	box-shadow: none !important;
}
.wp-block-woocommerce-checkout .spar-redeem-apply-btn:disabled { background: #d9cfc6 !important; }

@media (max-width: 600px) {
	/* SPAR stellt den Kopf mobil auf Spalte – dann wäre die Textspalte 260px hoch */
	body .spar-cart-rewards-box .spar-cart-rewards-header { flex-direction: row !important; align-items: center !important; }
	body .spar-cart-rewards-box .spar-cart-rewards-title-section { flex: 0 0 100% !important; height: auto !important; }
	body .spar-cart-rewards-box .spar-cart-rewards-summary { display: flex !important; flex-direction: row !important; align-items: center !important; justify-content: space-between !important; flex-wrap: nowrap !important; gap: 10px; width: 100%; }
	body .spar-cart-rewards-box.spar-cart-rewards-box { padding: 16px !important; }
	body .spar-cart-rewards-box .spar-dropdown-tab { font-size: 12px !important; padding: 0 6px !important; }
	body .spar-cart-rewards-box .spar-cart-rewards-summary { width: 100%; justify-content: space-between; }
}

/* =====================================================================
   Peaky Beans – Bohnen-Seite im Kundenkonto
   Simple Points and Rewards, Markup .spar-rewards-dashboard

   Das Plugin liefert das Markup, geaendert wird hier nur das Aussehen.
   Alle Regeln haengen an .spar-rewards-dashboard, damit sie die Box in
   Warenkorb und Kasse weiter oben in dieser Datei nicht beruehren.
   ===================================================================== */

.spar-rewards-dashboard {
	--pb-o: #ec702e;
	--pb-od: #b4501c;
	--pb-ink: #141210;
	--pb-line: #e3dbd3;
	--pb-soft: #EFE9E3;
	--pb-sand: #EFE9E3;
	--pb-muted: #6b5f57;
}

body .spar-rewards-dashboard,
body .spar-rewards-dashboard *:not(.woocommerce-Price-currencySymbol) {
	font-family: Inter, system-ui, sans-serif !important;
	box-sizing: border-box;
}

/* ---------------------------------------------------------------------
   Ueberblick: Verfuegbare und gesammelte Bohnen
   --------------------------------------------------------------------- */

body .spar-rewards-dashboard .spar-rewards-overview {
	margin: 0 0 28px !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
}
/* Das Plugin gibt hier leere Elemente aus, wenn in den Einstellungen
   kein Titel gepflegt ist — die wuerden sonst Luft erzeugen. */
body .spar-rewards-dashboard .spar-rewards-overview h2:empty,
body .spar-rewards-dashboard .spar-overview-subtitle:empty { display: none !important; }

body .spar-rewards-dashboard .spar-rewards-overview h2 {
	margin: 0 0 6px !important;
	font-size: 24px !important;
	font-weight: 800 !important;
	line-height: 1.2 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-overview-subtitle {
	margin: 0 0 18px !important;
	font-size: 15px !important;
	color: var(--pb-muted) !important;
}

body .spar-rewards-dashboard .spar-rewards-stats {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
}
body .spar-rewards-dashboard .spar-rewards-stat {
	margin: 0 !important;
	padding: 20px 22px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 16px !important;
	background: #fff !important;
	box-shadow: none !important;
	text-align: left !important;
}
/* Die erste Kachel traegt den einloesbaren Stand — die bekommt Farbe. */
body .spar-rewards-dashboard .spar-rewards-stat:first-child {
	background: var(--pb-soft) !important;
	border-color: var(--pb-o) !important;
}
body .spar-rewards-dashboard .spar-rewards-stat-number-row { margin: 0 !important; }
body .spar-rewards-dashboard .spar-rewards-stat-number {
	display: block !important;
	font-size: 34px !important;
	font-weight: 900 !important;
	line-height: 1.1 !important;
	letter-spacing: -0.02em;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-rewards-stat-label {
	margin-top: 8px !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pb-muted) !important;
}
body .spar-rewards-dashboard .spar-rewards-stat-sublabel {
	margin-top: 2px !important;
	font-size: 13px !important;
	color: var(--pb-muted) !important;
	opacity: 0.85;
}

/* ---------------------------------------------------------------------
   Reiter
   --------------------------------------------------------------------- */

body .spar-rewards-dashboard .spar-tabs-nav {
	display: flex !important;
	gap: 4px;
	margin: 0 0 22px !important;
	padding: 0 0 1px !important;
	border-bottom: 1.5px solid var(--pb-line) !important;
	background: none !important;
	overflow-x: auto;
}
body .spar-rewards-dashboard .spar-tab-nav {
	flex: 0 0 auto;
	margin: 0 !important;
	padding: 11px 16px !important;
	border: 0 !important;
	border-bottom: 3px solid transparent !important;
	border-radius: 0 !important;
	background: none !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: var(--pb-muted) !important;
	cursor: pointer;
	white-space: nowrap;
	box-shadow: none !important;
	transition: color .15s ease, border-color .15s ease;
}
body .spar-rewards-dashboard .spar-tab-nav:hover { color: var(--pb-ink) !important; }
body .spar-rewards-dashboard .spar-tab-nav.is-active {
	color: var(--pb-ink) !important;
	border-bottom-color: var(--pb-o) !important;
}
body .spar-rewards-dashboard .spar-tabs-select {
	width: 100% !important;
	margin: 0 0 20px !important;
	padding: 11px 14px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 10px !important;
	background: #fff !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: var(--pb-ink) !important;
}

/* ---------------------------------------------------------------------
   Ueberschriften in den Reitern
   --------------------------------------------------------------------- */

body .spar-rewards-dashboard .spar-redeem-title,
body .spar-rewards-dashboard .spar-pd-heading {
	margin: 0 0 4px !important;
	font-size: 18px !important;
	font-weight: 800 !important;
	line-height: 1.3 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-pd-heading { margin-top: 34px !important; }
body .spar-rewards-dashboard .spar-redeem-intro {
	margin: 0 0 18px !important;
	font-size: 15px !important;
	line-height: 1.55 !important;
	color: var(--pb-muted) !important;
}

/* ---------------------------------------------------------------------
   Bohnen sammeln
   --------------------------------------------------------------------- */

/* Eine Zeile je Moeglichkeit — der Titel links, die Bohnen rechts.
   Nebeneinander wird der Titel dreizeilig und der Fortschrittstext
   rutscht unter den Namen. */
body .spar-rewards-dashboard .spar-earn-grid {
	display: grid !important;
	grid-template-columns: 1fr;
	gap: 10px;
	float: none !important;
}
body .spar-rewards-dashboard .spar-box-full {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 16px;
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	padding: 16px 18px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 14px !important;
	background: #fff !important;
	box-shadow: none !important;
}
body .spar-rewards-dashboard .spar-box-full > div:first-child {
	flex: 1 1 auto;
	display: flex !important;
	align-items: center !important;
	gap: 10px;
	min-width: 0;
	font-size: 15px !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-earn-fa-icon {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	flex: 0 0 34px;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: var(--pb-sand) !important;
	color: var(--pb-o) !important;
	font-size: 15px !important;
}
body .spar-rewards-dashboard .spar-box-full strong {
	font-weight: 700 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-points-info {
	flex: 0 1 auto;
	max-width: 55%;
	text-align: right !important;
	font-size: 15px !important;
	font-weight: 800 !important;
	color: var(--pb-ink) !important;
	white-space: nowrap;
}
body .spar-rewards-dashboard .spar-spend-progress {
	margin-top: 4px !important;
	font-size: 12px !important;
	font-weight: 500 !important;
	opacity: 1 !important;
	color: var(--pb-muted) !important;
	white-space: normal;
}

/* ---------------------------------------------------------------------
   Bohnen einloesen: Praemienkarten
   --------------------------------------------------------------------- */

body .spar-rewards-dashboard .spar-redeem-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 14px;
	float: none !important;
}
body .spar-rewards-dashboard .spar-redeem-grid .spar-box {
	display: flex !important;
	flex-direction: column;
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	padding: 22px 20px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 16px !important;
	background: #fff !important;
	box-shadow: none !important;
	text-align: left !important;
}
body .spar-rewards-dashboard .spar-redeem-grid .spar-box > div:first-child {
	height: auto !important;
	margin: 0 0 12px !important;
	font-size: 0 !important;
}
body .spar-rewards-dashboard .spar-reward-icon {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: var(--pb-sand) !important;
	color: var(--pb-o) !important;
	-webkit-text-fill-color: var(--pb-o) !important;
	background-image: none !important;
	font-size: 18px !important;
}
body .spar-rewards-dashboard .spar-redeem-grid .spar-box h4 {
	margin: 0 0 10px !important;
	font-size: 17px !important;
	font-weight: 800 !important;
	line-height: 1.25 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-redeem-cost {
	display: inline-flex !important;
	align-items: center;
	margin: 0 0 8px !important;
	padding: 5px 11px !important;
	border-radius: 999px;
	background: var(--pb-soft) !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	color: var(--pb-od) !important;
	align-self: flex-start;
}
body .spar-rewards-dashboard .spar-redeem-grid .spar-box p {
	margin: 0 0 6px !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	color: var(--pb-muted) !important;
}
body .spar-rewards-dashboard .spar-redeem-grid .spar-box .woocommerce-Price-amount {
	font-weight: 700 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-redemption-button {
	margin: 16px 0 0 !important;
	padding: 0 !important;
}
body .spar-rewards-dashboard .spar-redemption-button .button {
	display: block !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 12px 16px !important;
	border: 0 !important;
	border-radius: 10px !important;
	background: var(--pb-o) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	text-align: center !important;
	text-transform: none !important;
	text-decoration: none !important;
	box-shadow: none !important;
}
body .spar-rewards-dashboard .spar-redemption-button .button:hover { background: var(--pb-od) !important; }
body .spar-rewards-dashboard .spar-redemption-button .button.disabled,
body .spar-rewards-dashboard .spar-redemption-button .button[disabled] {
	background: var(--pb-sand) !important;
	color: var(--pb-muted) !important;
	cursor: default;
}
/* Das Plugin dimmt die ganze Zeile auf 50 Prozent — dadurch wird der
   Hinweis darueber unleserlich. Wir zeigen den Zustand ueber die Farbe. */
body .spar-rewards-dashboard .spar-redemption-button[style] { opacity: 1 !important; }

/* ---------------------------------------------------------------------
   Punkterabatt mit Schieberegler
   --------------------------------------------------------------------- */

body .spar-rewards-dashboard .spar-redeem-rate,
body .spar-rewards-dashboard .spar-redeem-worth {
	margin: 0 0 4px !important;
	font-size: 14px !important;
	color: var(--pb-muted) !important;
}
body .spar-rewards-dashboard .spar-redeem-worth { margin-bottom: 16px !important; }

body .spar-rewards-dashboard .spar-redeem-compact {
	margin: 0 !important;
	padding: 20px 22px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 16px !important;
	background: var(--pb-soft) !important;
	box-shadow: none !important;
}
body .spar-rewards-dashboard .spar-redeem-header {
	margin: 0 0 14px !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-panel-row {
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap;
	gap: 14px;
}
body .spar-rewards-dashboard .spar-redeem-slider {
	flex: 1 1 220px;
	min-width: 0;
	width: auto !important;
	accent-color: var(--pb-o);
}
body .spar-rewards-dashboard .spar-panel-right {
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap;
	gap: 10px;
}
body .spar-rewards-dashboard .spar-redeem-input {
	width: 92px !important;
	margin: 0 !important;
	padding: 9px 11px !important;
	border: 1.5px solid var(--pb-line) !important;
	border-radius: 10px !important;
	background: #fff !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-discount-box {
	display: flex !important;
	align-items: baseline;
	gap: 7px;
	padding: 8px 13px !important;
	border-radius: 10px;
	background: #fff !important;
	border: 1.5px solid var(--pb-line) !important;
}
body .spar-rewards-dashboard .spar-redeem-value-label {
	font-size: 13px !important;
	font-weight: 600 !important;
	color: var(--pb-muted) !important;
}
body .spar-rewards-dashboard .spar-redeem-value {
	font-size: 16px !important;
	font-weight: 800 !important;
	color: var(--pb-ink) !important;
}
body .spar-rewards-dashboard .spar-redeem-apply-btn {
	margin: 0 !important;
	padding: 11px 18px !important;
	border: 0 !important;
	border-radius: 10px !important;
	background: var(--pb-o) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	text-transform: none !important;
	box-shadow: none !important;
}
body .spar-rewards-dashboard .spar-redeem-apply-btn:hover { background: var(--pb-od) !important; }
body .spar-rewards-dashboard .spar-redeem-apply-btn:disabled,
body .spar-rewards-dashboard .spar-redeem-apply-btn[disabled] {
	background: #d9cfc6 !important;
	color: #fff !important;
	cursor: default;
}

/* ---------------------------------------------------------------------
   Bohnen-Symbol
   --------------------------------------------------------------------- */

body .spar-rewards-dashboard .spar-points-icon {
	width: 0.95em !important;
	height: 0.95em !important;
	margin-right: 0.3em !important;
	vertical-align: -0.1em !important;
}

/* ---------------------------------------------------------------------
   Schmale Bildschirme
   --------------------------------------------------------------------- */

@media (max-width: 600px) {
	body .spar-rewards-dashboard .spar-rewards-stats { grid-template-columns: 1fr; }
	body .spar-rewards-dashboard .spar-rewards-stat { padding: 16px 18px !important; }
	body .spar-rewards-dashboard .spar-rewards-stat-number { font-size: 30px !important; }
	body .spar-rewards-dashboard .spar-box-full { flex-direction: column; align-items: flex-start !important; gap: 10px; }
	body .spar-rewards-dashboard .spar-points-info { text-align: left !important; }
	body .spar-rewards-dashboard .spar-panel-right { width: 100%; }
	body .spar-rewards-dashboard .spar-redeem-apply-btn { flex: 1 1 100%; }
}

/* ---------------------------------------------------------------------
   Korrekturen gegen Theme und fehlende Symbolschrift
   --------------------------------------------------------------------- */

/* Hello Elementor gibt Buttons volle Breite. Dadurch war jeder Reiter so
   breit wie der ganze Kasten und nur der erste sichtbar, der Rest lag
   hinter einer Bildlaufleiste. */
body .spar-rewards-dashboard .spar-tabs-nav .spar-tab-nav {
	display: inline-flex !important;
	align-items: center;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	flex: 0 0 auto !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	line-height: 1.2 !important;
}
body .spar-rewards-dashboard .spar-tabs-nav { scrollbar-width: none; }
body .spar-rewards-dashboard .spar-tabs-nav::-webkit-scrollbar { height: 0; }

/* Die Auswahlliste ist der Ersatz fuer schmale Bildschirme und hat auf
   dem Rechner nichts zu suchen. */
body .spar-rewards-dashboard .spar-tabs-mobile { display: none !important; }
@media (max-width: 720px) {
	body .spar-rewards-dashboard .spar-tabs-nav { display: none !important; }
	body .spar-rewards-dashboard .spar-tabs-mobile { display: block !important; }
}

/* Font Awesome wird auf der Seite nicht geladen. Statt leerer Kaesten
   lieber gar kein Symbol — die Zeilen lesen sich auch so. */
body .spar-rewards-dashboard .spar-earn-fa-icon { display: none !important; }

/* Bei den Praemien ersetzen wir das fehlende Symbol durch die Bohne. */
body .spar-rewards-dashboard .spar-reward-icon {
	position: static !important;
	float: none !important;
	font-size: 0 !important;
}
body .spar-rewards-dashboard .spar-reward-icon::before {
	content: "";
	display: block;
	width: 24px;
	height: 24px;
	background: url("https://peakybeans.de/wp-content/uploads/2026/08/peaky-bohne-512.png") center / contain no-repeat;
}

/* "Erledigt" statt eines grünen Balkens, wo das Symbol fehlt. */
body .spar-rewards-dashboard .spar-box-full span[style*="green"] {
	margin-left: 0 !important;
	padding: 3px 9px;
	border-radius: 999px;
	background: #e8f3e8;
	color: #2f6b36 !important;
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
}
body .spar-rewards-dashboard .spar-box-full span[style*="green"] i { display: none !important; }
body .spar-rewards-dashboard .spar-box-full span[style*="green"]::before { content: "Erledigt"; }

/* Auch der Rabatt-Knopf wird vom Theme auf volle Breite gezogen und
   springt dadurch unter den Schieberegler. */
body .spar-rewards-dashboard .spar-redeem-apply-btn {
	width: auto !important;
	flex: 0 0 auto !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}
@media (max-width: 600px) {
	body .spar-rewards-dashboard .spar-redeem-apply-btn { width: 100% !important; flex: 1 1 100% !important; }
}