/* Übergangs-CSS aus dem Colibri-Zusatz-CSS. Nur auf Seiten geladen, die diese Klassen enthalten.
   Entfällt, sobald die alten Partner-Schnipsel in Phase 3 durch Produktboxen ersetzt sind. */

/* Alte Amazon-/Partner-Schnipsel */
.list-group { display: flex; flex-direction: column; margin: 0 0 1rem; }
.list-group-item {
	position: relative; display: block; padding: 10px 15px; margin-bottom: -1px;
	background-color: #fff; border: 1px solid #ddd; color: inherit;
}
button.list-group-item { width: 100%; font-size: 1rem; cursor: pointer; }
a.list-group-item { text-decoration: none; }
a.list-group-item:hover { background: var(--sw-akzent-hell, #f6eaf4); }

.affiliate-container {
	position: relative; box-sizing: border-box; width: 100%;
	margin: 20px 0; padding-bottom: 30px; text-align: center;
}
.affiliate-image { display: block; max-width: 100%; height: auto; margin: 0 auto; }
.affiliate-label {
	position: absolute; right: 10px; bottom: 5px; padding: 2px 4px; border-radius: 2px;
	background: rgba(255, 255, 255, 0.9); color: #999; font-size: 12px; cursor: pointer;
}
.affiliate-label:hover { color: #a02e95; }

/* Größen- und Farbwahl auf /der-schultueten-rohling/ */
.schultueten-container { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-start; }
.schultueten-container img {
	width: 100px; height: 100px; object-fit: cover; cursor: pointer;
	border: 2px solid transparent; border-radius: 8px; transition: border-color 0.2s;
}
.schultueten-container img.active { border-color: #a02e95; }
.groessen-liste { display: none; margin-top: 15px; }
.groessen-liste.active { display: block; }
.groessen-liste ul { list-style: none; padding: 0; }
.groessen-liste li { margin: 5px 0; }
.groessen-liste a { color: #a02e95; text-decoration: none; }
.groessen-liste a:hover { text-decoration: underline; }

/* Terminanfrage auf /termin/ */
.termin-form {
	max-width: 500px; margin: 40px auto; padding: 32px; border-radius: 20px;
	background: rgba(160, 46, 149, 0.12); box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
}
.termin-title { margin-bottom: 8px; color: #a02e95; font-size: 1.8rem; font-weight: 700; }
.termin-subtext { margin-bottom: 24px; color: #7e2275; font-size: 0.95rem; }
.termin-group { margin-bottom: 18px; }
.termin-group label { display: block; margin-bottom: 8px; color: #2d3748; font-weight: 700; }
.termin-group input, .termin-group textarea {
	width: 100%; padding: 14px; border: 2px solid #e2e8f0; border-radius: 10px;
	background: #fff; font-size: 1rem; transition: 0.2s;
}
.termin-group input:focus, .termin-group textarea:focus {
	outline: none; border-color: #a02e95; box-shadow: 0 0 0 3px rgba(160, 46, 149, 0.15);
}
.termin-required { margin-left: 4px; color: #a02e95; }
.termin-checkbox { display: flex; margin: 6px 20px 15px; }
.termin-checkbox-row { display: flex; align-items: flex-start; gap: 10px; }
.termin-checkbox input { margin: 8px 10px 0 0; transform: scale(1.3); }
.termin-hinweis {
	margin-top: 8px; padding: 10px 12px; border-left: 4px solid #a02e95; border-radius: 8px;
	background: #f8fafc; color: #718096; font-size: 0.9rem;
}
.termin-feedback { margin-top: 20px; padding: 14px; border-radius: 10px; font-size: 1rem; text-align: center; }
.termin-success { background: #f0fff4; color: #276749; border: 2px solid #68d391; }
.termin-error { background: #fff5f5; color: #c53030; border: 2px solid #feb2b2; }
.termin-warnung { margin: 16px; padding: 10px 14px; border: 1px solid #feb2b2; border-radius: 8px; background: #fff5f5; color: #c53030; font-size: 0.95rem; }
.termin-btn {
	display: block; width: 100%; padding: 14px 20px; border: 0; border-radius: 999px; cursor: pointer;
	background: #a02e95; color: #fff; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
	transition: background-color 0.2s;
}
.termin-btn:hover { background: #7e2275; }