.sy-pac {
	margin: 0 0 24px;
}

.sy-pac-card {
	max-width: 720px;
	padding: 20px;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	background: #fff;
}

.sy-pac-label {
	display: block;
	margin-bottom: 10px;
	font-weight: 600;
}

.sy-pac-row {
	display: flex;
	gap: 10px;
	align-items: stretch;
}

.sy-pac-input {
	flex: 1;
	min-width: 0;
	padding: 11px 13px;
	border: 1px solid #cbd5e1;
	border-radius: 6px;
}

.sy-pac-button {
	padding: 11px 18px;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
}

.sy-pac-button:disabled {
	cursor: wait;
	opacity: .65;
}

.sy-pac-message {
	margin-top: 10px;
	min-height: 20px;
}

.sy-pac-success {
	font-weight: 600;
}

.sy-pac-error {
	font-weight: 600;
}

@media (max-width: 600px) {
	.sy-pac-row {
		flex-direction: column;
	}

	.sy-pac-button {
		width: 100%;
	}
}


.sy-pac-bookly-hidden {
	display: none !important;
}

/* Prevent the Bookly form from being usable/visible before code verification.
 * This is intentionally scoped to the Pursukoon access-code block and nearby
 * Bookly markup. JS still controls the verified state.
 */
.sy-pac[data-verified="0"] ~ .bookly-form,
.sy-pac[data-verified="0"] ~ .bookly-form-container,
.sy-pac[data-verified="0"] ~ div .bookly-form {
	display: none !important;
}

.form-card:has(.sy-pac[data-verified="0"]) .bookly-form,
.form-card:has(.sy-pac[data-verified="0"]) .bookly-form-container {
	display: none !important;
}