/* ═══════════════════════════════════════════════════════════════════════════
   Bioladen — Bewertungen  (Frontend-Styles)
   Farbwelt: warmes Bio-Grün + Gold-Sterne. Keine externen Abhängigkeiten.
   ═══════════════════════════════════════════════════════════════════════════ */

.bio-bew-wrap {
	--bio-green: #5a7d2a;
	--bio-green-dark: #3f5a1d;
	--bio-gold: #e6a817;
	--bio-gray: #777;
	--bio-border: #e4e4e0;
	--bio-bg: #faf9f5;
	max-width: 760px;
	margin: 2rem auto;
	font-family: inherit;
	color: #2a2a2a;
}

/* ── Hinweise ───────────────────────────────────────────────────────────── */
.bio-bew-notice {
	padding: .9rem 1.1rem;
	border-radius: 8px;
	margin-bottom: 1.4rem;
	font-size: .95rem;
}
.bio-bew-notice.success { background: #edf5e1; border: 1px solid #cfe3a8; color: #3f5a1d; }
.bio-bew-notice.error   { background: #fdeceb; border: 1px solid #f3c2bd; color: #a23b2e; }

/* ── Zusammenfassung ────────────────────────────────────────────────────── */
.bio-bew-summary {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	padding: 1.2rem 1.4rem;
	background: var(--bio-bg);
	border: 1px solid var(--bio-border);
	border-radius: 12px;
	margin-bottom: 1.6rem;
}
.bio-bew-avg {
	font-size: 2.8rem;
	font-weight: 700;
	line-height: 1;
	color: var(--bio-green-dark);
}
.bio-bew-avg-meta { display: flex; flex-direction: column; gap: .25rem; }
.bio-bew-count { font-size: .9rem; color: var(--bio-gray); }
.bio-bew-empty { margin: 0; color: var(--bio-gray); font-style: italic; }

/* ── Sterne-Anzeige ─────────────────────────────────────────────────────── */
.bio-bew-stars { display: inline-flex; font-size: 1.15rem; line-height: 1; letter-spacing: 1px; }
.bio-bew-star.full,
.bio-bew-star.half { color: var(--bio-gold); }
.bio-bew-star.empty { color: #d8d6cf; }
.bio-bew-star.half {
	position: relative;
	color: #d8d6cf;
}
.bio-bew-star.half::before {
	content: "★";
	position: absolute;
	left: 0;
	width: 50%;
	overflow: hidden;
	color: var(--bio-gold);
}

/* ── Liste ──────────────────────────────────────────────────────────────── */
.bio-bew-list { list-style: none; margin: 0 0 2rem; padding: 0; }
.bio-bew-item {
	padding: 1.1rem 0;
	border-bottom: 1px solid var(--bio-border);
}
.bio-bew-item:last-child { border-bottom: none; }
.bio-bew-item-head {
	display: flex;
	align-items: center;
	gap: .7rem;
	flex-wrap: wrap;
	margin-bottom: .4rem;
}
.bio-bew-item-name { font-weight: 600; }
.bio-bew-item-date { font-size: .82rem; color: var(--bio-gray); margin-left: auto; }
.bio-bew-item-text { line-height: 1.55; color: #444; }

/* ── Antwort des Inhabers ───────────────────────────────────────────────── */
.bio-bew-reply {
	margin: .7rem 0 0 1.4rem;
	padding: .7rem .9rem;
	background: #f1f5e8;
	border-left: 3px solid var(--bio-green);
	border-radius: 6px;
}
.bio-bew-reply-head {
	font-weight: 600;
	font-size: .85rem;
	color: var(--bio-green-dark);
	margin-bottom: .25rem;
}
.bio-bew-reply-text { line-height: 1.5; color: #444; font-size: .95rem; }

/* ── Formular ───────────────────────────────────────────────────────────── */
.bio-bew-form {
	background: var(--bio-bg);
	border: 1px solid var(--bio-border);
	border-radius: 12px;
	padding: 1.6rem;
}
.bio-bew-form-title { margin: 0 0 1.1rem; font-size: 1.25rem; color: var(--bio-green-dark); }
.bio-bew-field { margin-bottom: 1.1rem; }
.bio-bew-label { display: block; font-weight: 600; margin-bottom: .35rem; font-size: .95rem; }

.bio-bew-form input[type="text"],
.bio-bew-form input[type="email"],
.bio-bew-form textarea {
	width: 100%;
	padding: .65rem .8rem;
	border: 1px solid var(--bio-border);
	border-radius: 8px;
	font: inherit;
	background: #fff;
	box-sizing: border-box;
}
.bio-bew-form input:focus,
.bio-bew-form textarea:focus {
	outline: none;
	border-color: var(--bio-green);
	box-shadow: 0 0 0 3px rgba(90, 125, 42, .15);
}

/* ── Sterne-Auswahl (reines CSS, kein JS) ───────────────────────────────── */
.bio-bew-rating {
	display: inline-flex;
	flex-direction: row-reverse;
	gap: .15rem;
	font-size: 2rem;
	line-height: 1;
}
.bio-bew-rating input { position: absolute; opacity: 0; width: 0; height: 0; }
.bio-bew-rating label {
	color: #d8d6cf;
	cursor: pointer;
	transition: color .12s ease;
	margin: 0;
}
/* Hover + Auswahl färben den Stern und alle danach (= visuell links davon) */
.bio-bew-rating label:hover,
.bio-bew-rating label:hover ~ label,
.bio-bew-rating input:checked ~ label {
	color: var(--bio-gold);
}
.bio-bew-rating input:focus-visible + label {
	outline: 2px solid var(--bio-green);
	outline-offset: 2px;
	border-radius: 4px;
}

/* ── Honeypot ───────────────────────────────────────────────────────────── */
.bio-bew-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ── Button ─────────────────────────────────────────────────────────────── */
.bio-bew-submit {
	background: var(--bio-green);
	color: #fff;
	border: none;
	border-radius: 8px;
	padding: .8rem 1.6rem;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: background .15s ease;
}
.bio-bew-submit:hover { background: var(--bio-green-dark); }
.bio-bew-hint { margin: .7rem 0 0; font-size: .82rem; color: var(--bio-gray); }

/* ── Responsive ─────────────────────────────────────────────────────────── */
@media (max-width: 560px) {
	.bio-bew-summary { flex-direction: column; text-align: center; }
	.bio-bew-item-date { margin-left: 0; width: 100%; }
}