/*
 * Vanquish Deposits for WooCommerce — customer pages.
 * No colours of our own: the theme's text colour (currentColor) and
 * transparencies, so light and dark themes both work. Buttons use the theme's
 * classes (button, wp-element-button).
 */

/* Product page: "How would you like to pay?" */
.vandp-choice { margin: 0 0 1.25em; }
.vandp-choice__options { margin: 0; padding: 0; border: 0; min-width: 0; }
.vandp-choice__legend { margin: 0 0 .5em; padding: 0; font-weight: 600; }
.vandp-choice__option {
	display: flex;
	gap: .6em;
	align-items: flex-start;
	margin: 0 0 .5em;
	padding: .75em .9em;
	border: 1px solid;
	border-color: color-mix(in srgb, currentColor 25%, transparent);
	border-radius: 6px;
	cursor: pointer;
	line-height: 1.4;
}
.vandp-choice__option:has(input:checked) {
	border-color: currentColor;
	box-shadow: inset 0 0 0 1px currentColor;
	background: color-mix(in srgb, currentColor 5%, transparent);
}
.vandp-choice__option:focus-within { outline: 2px solid currentColor; outline-offset: 2px; }
.vandp-choice__option input { margin: .25em 0 0; flex: none; }
.vandp-choice__text { display: flex; flex-direction: column; gap: .15em; }
.vandp-choice__hint,
.vandp-choice__note,
.vandp-choice__express,
.vandp-tax { opacity: .75; font-size: .9em; }
.vandp-tax { font-weight: normal; }
.vandp-choice__line { margin: 0 0 .5em; }
.vandp-choice__note { margin: .25em 0 0; }
.vandp-choice__express { margin: 5px 0 0; clear: both; font-weight: 600; font-style: italic; opacity: .85; }
/* Right after the add-to-cart form: themes give the form a large bottom margin. */
form.cart + .vandp-choice__express,
.woocommerce div.product form.cart + .vandp-choice__express { margin-top: -1em; }

/* Classic checkout: PayPal Payments' disabled buttons, replaced by its "Proceed to PayPal" (checkout-classic.js). */
.ppc-button-wrapper.vandp-hidden { display: none !important; }

/* Cart and classic checkout: Due today / Due later rows. */
.vandp-due-today th,
.vandp-due-today td { font-size: 1.1em; }
.vandp-due-later th,
.vandp-due-later td { font-weight: normal; }

/* Our box before "Place order" (classic) and under the payment methods (blocks). */
.vandp-due-box {
	margin: 1em 0;
	padding: .9em 1em;
	border: 1px solid;
	border-color: color-mix(in srgb, currentColor 25%, transparent);
	border-radius: 6px;
	line-height: 1.5;
}
.vandp-due-box__row { display: flex; justify-content: space-between; gap: 1em; }
.vandp-due-box__row--today { font-weight: 700; font-size: 1.1em; }
.vandp-due-box__text { margin: .4em 0 0; }
.vandp-due-box__text[hidden] { display: none; }
/* Phones: the order summary is collapsed, so the box repeats the split (03d). */
.vandp-due-box__mobile { display: none; }
@media (max-width: 699px) {
	.vandp-due-box__mobile { display: block; }
}
.vandp-order-meta { margin-top: .5em; }
/* Block cart and checkout: WooCommerce gives the slot no side padding (".slot-wrapper > * > *"): line up with the totals above (16px). */
.wc-block-components-totals-wrapper.slot-wrapper .vandp-order-meta { margin-top: 0; padding: 12px 16px; }
.vandp-order-meta__row { display: flex; justify-content: space-between; gap: 1em; padding: .25em 0; }
.vandp-order-meta__row--today { font-weight: 700; font-size: 1.1em; }
.vandp-order-meta__note { margin: .4em 0 0; opacity: .75; font-size: .9em; }

/* Payments box (thank-you page, My account, Pay now). */
.vandp-payments { margin: 0 0 2em; }
.vandp-payments__badge {
	display: inline-block;
	padding: 0 .5em;
	border-radius: 4px;
	font-size: .875em;
	line-height: 1.7;
	white-space: nowrap;
	border: 1px solid transparent;
}
.vandp-payments__row--paid .vandp-payments__badge { background: color-mix(in srgb, currentColor 10%, transparent); }
.vandp-payments__row--due .vandp-payments__badge,
.vandp-payments__row--awaiting .vandp-payments__badge { border: 2px solid currentColor; }
.vandp-payments__row--overdue .vandp-payments__badge,
.vandp-payments__row--failed .vandp-payments__badge { border: 2px solid currentColor; font-weight: 700; }
.vandp-payments__row--scheduled .vandp-payments__badge { border-color: color-mix(in srgb, currentColor 40%, transparent); }
.vandp-payments__row--refunded .vandp-payments__badge,
.vandp-payments__row--partially_refunded .vandp-payments__badge,
.vandp-payments__row--cancelled .vandp-payments__badge { border: 1px dashed currentColor; }
.vandp-payments__when { display: block; opacity: .75; font-size: .875em; }
.vandp-payments__amount { text-align: right; white-space: nowrap; }
.vandp-payments__action { text-align: right; }
@media (max-width: 599px) {
	.vandp-payments__table tr { display: grid; grid-template-columns: 1fr auto; gap: .25em .75em; padding: .6em 0; }
	.vandp-payments__table th,
	.vandp-payments__table td { display: block; padding: 0; border: 0; }
	.vandp-payments__action { grid-column: 1 / -1; text-align: left; }
}

/* Premium: "See payment plan" on the product page. */
.vandp-choice__plan { display: inline; }
.vandp-choice__plan summary { display: inline; cursor: pointer; text-decoration: underline; }
.vandp-choice__plan[open] ul { display: block; margin: .4em 0 0 1.2em; padding: 0; }
