/* ==========================================================================
   REWE Party & Eventverleih - Frontend Styles (Shop / Buchungstool)
   Alle Styles fuer den Buchungs-Shop-Bereich gehoeren in diese Datei,
   damit style.css des Themes sauber bleibt.
   ========================================================================== */

/* Mietartikel- / Kaufartikel-Karte (JetEngine Listing Item) */
.add-card-available {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 20px;
	width: 100%;
	padding: 16px;
	margin-bottom: 16px;
	background: #ffffff;
	border: 1px solid #e3e3e3;
	border-radius: 12px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.add-card-available img {
	width: 96px;
	height: 96px;
	flex: 0 0 96px;
	object-fit: cover;
	border-radius: 8px;
	background: #f2f2f2;
}

.mietartikel-content {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	gap: 4px !important;
	flex: 1 1 auto;
}

.artikel-title {
	font-size: 18px;
	font-weight: 600;
	line-height: 1.3;
	margin: 0;
	order: -3;
}

.artikel-price {
	font-size: 15px;
	font-weight: 600;
	color: #1a1a1a;
	order: -2;
}

.artikel-availability {
	font-size: 13px;
	color: #2e7d32;
	order: -1;
}

/* Mengen-Stepper */
.qty-wrapper {
	display: flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	order: 2;
	margin-top: 8px;
}

.qty-btn {
	width: 30px;
	height: 30px;
	border: 1px solid #d0d0d0;
	border-radius: 6px;
	background: #f7f7f7;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s ease;
}

.qty-btn:hover {
	background: #ececec;
}

.qty-wrapper input[type="number"] {
	width: 48px;
	height: 30px;
	text-align: center;
	border: 1px solid #d0d0d0;
	border-radius: 6px;
}

/* Aufklappbare Artikel-Infos */
.artikel-info {
	order: 3;
	margin-top: 4px;
}

.artikel-info summary {
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	color: #555555;
	list-style: revert;
}

.artikel-info summary:hover {
	color: #1a1a1a;
}

.artikel-description {
	margin-top: 8px;
	font-size: 13px;
	line-height: 1.5;
	color: #666666;
}

.artikel-description p {
	margin: 0 0 8px;
}

.artikel-description p:last-child {
	margin-bottom: 0;
}

/* Klickflaeche fuer die (visuell versteckte) Checkbox pro Karte korrekt begrenzen */
.jet-form-builder__field-wrap.checkboxes-wrap.checkradio-wrap {
	position: relative;
	display: block;
	width: 100%;
}


/* ============================================================
   Zum-Warenkorb-hinzufuegen: unsichtbaren Checkbox-Overlay
   (JetFormBuilder Default-CSS) deaktivieren, damit Klicks auf
   Button und Mengen-Stepper wieder durchkommen.
   ============================================================ */
.jet-form-builder__field-label.for-checkbox {
	pointer-events: none !important;
}

/* "Zum Warenkorb hinzufuegen" Button */
.add-to-cart-btn {
	order: 3;
	margin-top: 10px;
	padding: 10px 18px;
	background: #2e7d32;
	color: #ffffff;
	border: none;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 0.15s ease, opacity 0.15s ease;
}

.add-to-cart-btn:hover {
	background: #256428;
}

.add-to-cart-btn:disabled,
.add-to-cart-btn.is-loading {
	opacity: 0.65;
	cursor: default;
}

.add-to-cart-btn.is-added {
	background: #1b5e20;
}

.add-to-cart-btn.is-added::after {
	content: ' ✓';
}

.add-to-cart-btn.rewe-btn-error {
	background: #c62828;
}

/* ============================================================
   Warenkorb-Widget (gruppiert: Mietartikel / Zusatzartikel)
   ============================================================ */
.rewe-warenkorb-widget {
	width: 100%;
}

.rewe-warenkorb-toggle {
	border: 1px solid #e3e3e3;
	border-radius: 12px;
	background: #ffffff;
	margin-bottom: 20px;
	overflow: hidden;
}

.rewe-warenkorb-toggle > summary {
	list-style: none;
	cursor: pointer;
	padding: 14px 18px;
	font-size: 15px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.rewe-warenkorb-toggle > summary::-webkit-details-marker {
	display: none;
}

.rewe-warenkorb-toggle > summary::after {
	content: '▾';
	font-size: 12px;
	color: #666666;
}

.rewe-warenkorb-toggle[open] > summary::after {
	content: '▴';
}

.rewe-warenkorb-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 6px;
	margin-left: 8px;
	background: #2e7d32;
	color: #ffffff;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 700;
}

.rewe-warenkorb-panel {
	padding: 0 18px 18px;
}

.rewe-warenkorb-gruppe {
	margin-top: 12px;
}

.rewe-warenkorb-gruppe-titel {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: #666666;
	margin: 0 0 8px;
}

.rewe-warenkorb-liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.rewe-warenkorb-item {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
	padding: 6px 0;
	border-bottom: 1px solid #f0f0f0;
}

.rewe-warenkorb-item-name {
	flex: 1 1 auto;
}

.rewe-warenkorb-item-qty {
	color: #666666;
	white-space: nowrap;
}

.rewe-warenkorb-item-remove {
	background: none;
	border: none;
	color: #999999;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
	padding: 2px 4px;
}

.rewe-warenkorb-item-remove:hover {
	color: #c62828;
}

.rewe-warenkorb-empty {
	padding: 18px;
	color: #999999;
	font-size: 14px;
}


/* ==== Eigene Steps-Navigation (Buchungsformular, Ersatz fuer native JFB-Pagination) ==== */
.rewe-step {
	display: none;
}
.rewe-step.is-active {
	display: block;
}
.rewe-step-next,
.rewe-step-prev {
	cursor: pointer;
}
#jet_abaf_field.rewe-field-error {
	border-color: #d63638 !important;
	box-shadow: 0 0 0 1px #d63638;
}