/*
 * VERIFIED manual payments (Zelle / Cash App).
 * Colours are derived from currentColor / translucent greys so the panel reads
 * correctly on light and dark themes without overriding theme typography.
 */

.vccp-manual-payment-panel {
	--vccp-line: rgba(127, 127, 127, 0.28);
	--vccp-tint: rgba(127, 127, 127, 0.08);
	--vccp-accent: #1a7f37;
	border: 1px solid var(--vccp-line);
	border-radius: 8px;
	margin: 2rem 0;
	padding: clamp(1rem, 3vw, 1.5rem);
}

.vccp-manual-payment-panel > h2 {
	margin-top: 0;
}

.vccp-manual-payment-panel.is-closed,
.vccp-manual-payment-panel.is-paid {
	background: var(--vccp-tint);
}

.vccp-manual-status.is-reported {
	border-left: 3px solid var(--vccp-accent);
	padding-left: 0.75rem;
}

/* Details list ------------------------------------------------------------ */

.vccp-manual-payment-details {
	display: grid;
	gap: 0;
	margin: 1rem 0 1.25rem;
}

.vccp-manual-payment-details > div {
	align-items: center;
	border-bottom: 1px solid var(--vccp-line);
	display: grid;
	gap: 0.5rem 1rem;
	grid-template-columns: 9rem 1fr;
	padding: 0.7rem 0;
}

.vccp-manual-payment-details > div:first-child {
	border-top: 1px solid var(--vccp-line);
}

.vccp-manual-payment-details dt {
	font-weight: 600;
	margin: 0;
	white-space: nowrap;
}

.vccp-manual-payment-details dd {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	gap: 0.5rem 0.75rem;
	justify-content: space-between;
	margin: 0;
	min-width: 0;
}

.vccp-manual-value {
	min-width: 0;
	overflow-wrap: anywhere;
}

.vccp-manual-value small {
	opacity: 0.7;
	margin-left: 0.35rem;
}

.vccp-manual-payment-details code {
	background: transparent;
	color: inherit;
	font-size: 1.05em;
	font-weight: 700;
	letter-spacing: 0.02em;
	padding: 0;
}

.vccp-manual-payment-details .is-memo code {
	background: var(--vccp-tint);
	border: 1px dashed var(--vccp-line);
	border-radius: 4px;
	font-size: 1.15em;
	padding: 0.15em 0.45em;
}

/* Buttons ----------------------------------------------------------------- */

.vccp-manual-payment-panel .vccp-manual-copy {
	background: transparent;
	border: 1px solid var(--vccp-line);
	border-radius: 4px;
	box-shadow: none;
	color: inherit;
	cursor: pointer;
	font-family: inherit;
	font-weight: 600;
	flex: 0 0 auto;
	font-size: 0.85rem;
	line-height: 1.2;
	min-height: 2.25rem;
	min-width: 4.5rem;
	padding: 0.4rem 0.9rem;
}

.vccp-manual-payment-panel .vccp-manual-copy:hover,
.vccp-manual-payment-panel .vccp-manual-copy:focus-visible {
	background: var(--vccp-tint);
}

.vccp-manual-payment-panel .vccp-manual-copy.is-copied {
	border-color: var(--vccp-accent);
	color: var(--vccp-accent);
}

.vccp-manual-open-app {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
}

.vccp-manual-open-app small {
	opacity: 0.75;
}

/* Steps / notes ----------------------------------------------------------- */

.vccp-manual-steps {
	margin: 0 0 1rem 1.25rem;
	padding: 0;
}

.vccp-manual-steps li {
	margin: 0.3rem 0;
}

.vccp-manual-disclaimer,
.vccp-manual-payment-window,
.vccp-manual-checkout-note,
.vccp-manual-block-help {
	font-size: 0.9em;
	opacity: 0.85;
}

.vccp-manual-disclaimer {
	border-top: 1px solid var(--vccp-line);
	margin-bottom: 0;
	padding-top: 0.9rem;
}

/* Report form ------------------------------------------------------------- */

.vccp-manual-report-form {
	background: var(--vccp-tint);
	border-radius: 6px;
	margin: 1.25rem 0;
	padding: 1rem 1.1rem;
}

.vccp-manual-report-form h3 {
	margin-top: 0;
}

.vccp-manual-report-form input[type="text"] {
	box-sizing: border-box;
	max-width: 28rem;
	width: 100%;
}

.vccp-manual-confirm-row label {
	align-items: flex-start;
	display: flex;
	gap: 0.5rem;
}

.vccp-manual-confirm-row input[type="checkbox"] {
	margin-top: 0.3em;
}

/* Checkout (Classic) ------------------------------------------------------ */

.payment_box .vccp-manual-field input.input-text {
	box-sizing: border-box;
	width: 100%;
}

/* Checkout (Blocks) ------------------------------------------------------- */

.vccp-manual-block-fields > p {
	margin: 0 0 0.75rem;
}

.vccp-manual-block-fields .wc-block-components-text-input {
	margin-top: 0.75rem;
}

.vccp-manual-block-fields .vccp-manual-block-help {
	margin: 0.35rem 0 0.25rem;
}

.vccp-manual-block-fields .vccp-manual-block-ack {
	margin-top: 1rem;
}

/* Fallback (older WooCommerce without ValidatedTextInput). */
.vccp-manual-block-row label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.3rem;
}

.vccp-manual-block-input {
	border: 1px solid var(--vccp-line, rgba(127, 127, 127, 0.4));
	border-radius: 4px;
	box-sizing: border-box;
	font: inherit;
	min-height: 3rem;
	padding: 0.6rem 0.75rem;
	width: 100%;
}

.vccp-manual-block-checkbox {
	align-items: flex-start;
	display: flex;
	gap: 0.5rem;
	margin-top: 1rem;
}

/* Mobile ------------------------------------------------------------------ */

@media (max-width: 560px) {
	.vccp-manual-payment-details > div {
		grid-template-columns: 1fr;
		gap: 0.25rem;
	}

	.vccp-manual-payment-panel .vccp-manual-copy {
		min-height: 2.75rem;
	}
}