/**
 * Stripe and PayPal checkout presentation.
 *
 * Payment-provider fields stay on the official WooCommerce gateway screen;
 * this file only styles the StayRent gateway selector and setup state.
 */

.srm-payment-options {
	display: grid;
	gap: 12px;
}

.srm-payment-options > label {
	display: grid;
	grid-template-columns: auto 76px minmax(0, 1fr);
	align-items: center;
	gap: 14px;
	min-height: 88px;
	padding: 16px;
	border: 1px solid var(--srm-line, #e7e3e8);
	border-radius: 16px;
	background: var(--srm-paper, #fff);
	cursor: pointer;
	transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

.srm-payment-options > label:hover,
.srm-payment-options > label:has(input:checked) {
	border-color: var(--srm-brand, #d92d4d);
	box-shadow: 0 12px 30px rgba(43, 21, 40, .09);
	transform: translateY(-1px);
}

.srm-payment-options > label:focus-within {
	outline: 3px solid rgba(217, 45, 77, .2);
	outline-offset: 2px;
}

.srm-payment-options input[type="radio"] {
	width: 20px;
	height: 20px;
	margin: 0;
	accent-color: var(--srm-brand, #d92d4d);
}

.srm-payment-options > label > span:last-child {
	display: grid;
	gap: 3px;
	min-width: 0;
}

.srm-payment-options strong,
.srm-payment-options small {
	display: block;
}

.srm-payment-options small {
	color: var(--srm-ink-soft, #625d68);
	line-height: 1.5;
}

.srm-payment-brand {
	display: inline-grid;
	width: 76px;
	height: 38px;
	place-items: center;
	border-radius: 10px;
	color: #fff;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: -.02em;
}

.srm-payment-brand-stripe {
	background: linear-gradient(135deg, #635bff, #7a73ff);
}

.srm-payment-brand-paypal {
	background: linear-gradient(135deg, #003087 0 68%, #0070e0 68% 84%, #f2ba36 84%);
}

.srm-payment-options > label.is-disabled {
	background: #f8f7f8;
	cursor: not-allowed;
	opacity: .64;
	transform: none;
}

.srm-payment-options > label.is-disabled:hover {
	border-color: var(--srm-line, #e7e3e8);
	box-shadow: none;
	transform: none;
}

.srm-checkout-alert {
	margin: 14px 0 0;
	padding: 14px 16px;
	border: 1px solid #f2c2ca;
	border-radius: 12px;
	background: #fff7f8;
	color: #7f1d34;
	font-size: 13px;
	font-weight: 650;
	line-height: 1.55;
}

.srm-checkout-form .srm-button:disabled {
	box-shadow: none;
	cursor: not-allowed;
	opacity: .55;
	transform: none;
}

@media (max-width: 520px) {
	.srm-payment-options > label {
		grid-template-columns: auto minmax(0, 1fr);
		gap: 10px 12px;
	}

	.srm-payment-brand,
	.srm-payment-options > label > span:last-child {
		grid-column: 2;
	}
}