/* PIDDÈL temporary landing-page purchase flow — WPCode CSS snippet */

.piddel-qty {
	display: inline-flex !important;
	align-items: center !important;
	gap: 10px !important;
	font-family: inherit;
	vertical-align: middle;
}

.piddel-qty-btn {
	width: 32px !important;
	height: 32px !important;
	min-width: 32px !important;
	border-radius: 999px !important;
	border: 1.5px solid #203B78 !important;
	background: #ffffff !important;
	color: #203B78 !important;
	font-size: 16px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	cursor: pointer;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	margin: 0 !important;
	box-shadow: none !important;
}

.piddel-qty-btn:hover {
	background: rgba( 32, 59, 120, 0.08 ) !important;
}

.piddel-qty-input {
	width: 40px !important;
	min-width: 40px !important;
	max-width: 40px !important;
	text-align: center !important;
	border: 1.5px solid #D2D2D2 !important;
	border-radius: 8px !important;
	padding: 6px 4px !important;
	margin: 0 !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	color: #203B78 !important;
	background: #fff !important;
	box-shadow: none !important;
}

.piddel-price,
.piddel-deposit-note {
	/* Intentionally unstyled — inherits whatever the surrounding Divi Text
	   module already defines (font, size, color, weight) so swapping static
	   text for the shortcode changes nothing visually. */
}

/* Listicle condensed pricing module: option-card selection states.
   The cards are Divi Groups carrying data-piddel-option custom attributes;
   piddel-landing.js toggles .is-selected. These rules override the Group's
   own Divi background/border so the selected state follows the click. */
[data-piddel-option] {
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

[data-piddel-option]:not(.is-selected) {
	background-color: #FFFFFF !important;
	border: 1px solid #D2D2D2 !important;
}

[data-piddel-option].is-selected {
	background-color: rgba( 99, 184, 60, 0.1 ) !important;
	border: 2px solid #63B83C !important;
}

.piddel-radio {
	width: 20px !important;
	height: 20px !important;
	margin: 0 !important;
	accent-color: #63B83C;
	cursor: pointer;
}
