/**
 * Checkout design for automatorplugin.com.
 *
 * The checkout layout comes from the shared Uncanny Custom EDD Checkout plugin,
 * which uncannyowl.com uses too. This file only loads on the Automator checkout,
 * after the plugin's styles, so the other site keeps its own look.
 * Values follow the site's cards, fields and buttons.
 */

/* Plugin variables. */
body.edd-checkout {
	--uo-edd-checkout-background-color: #f6f7f9;
	--uo-edd-checkout-border-radius: 16px;
	--uo-edd-checkout-border-color: #e4e4e4;
	--uo-edd-checkout-button-background: #0b87e8;
	--uo-edd-checkout-button-padding: 6px 20px;
	--uo-edd-checkout-fieldset-legend-font-size: 18px;
	--uo-edd-checkout-field-label-color: #2b2e33;
	--uo-edd-checkout-field-label-font-size: 14px;
	--uo-edd-checkout-field-height: 44px;
	--uo-edd-checkout-summary-font-size-heading: 15px;
	--uo-edd-checkout-pay-button-background: #6bc45a;
	--uo-edd-checkout-pay-button-color: #ffffff;
	--uo-edd-checkout-pay-button-padding: 10px 20px;
	--uo-edd-checkout-pay-button-font-size: 18px;
	--uo-edd-checkout-reviews-color: #676b6f;
	--uo-edd-checkout-checklist-font-size: 15px;
}

/* The account box starts with "Already have an account?": round its top corners like the other boxes. */
body.edd-checkout #edd_register_fields,
body.edd-checkout #edd-login-account-wrap {
	border-top-left-radius: var(--uo-edd-checkout-border-radius);
	border-top-right-radius: var(--uo-edd-checkout-border-radius);
}

/* Section titles: Payment method, Personal, Billing Details, Credit card. */
body.edd-checkout #edd_checkout_form_wrap legend {
	font-weight: 600;
	color: #0d0f12;
}

body.edd-checkout .edd-label {
	font-weight: 600 !important;
}

/* Fields: the same rounded inputs as My Account. The plugin sets these with !important. */
body.edd-checkout .edd-input,
body.edd-checkout .edd-select,
body.edd-checkout #edd-stripe-card-element {
	border: 1px solid #cfcfcf !important;
	border-radius: 10px !important;
	box-shadow: none !important;
	font-size: 16px !important;
	color: #2b2e33 !important;
}

body.edd-checkout #edd-stripe-card-element {
	padding: 12px 14px !important;
}

/* Country and state: our own arrow, with the same space on the right as the text has on the left. */
body.edd-checkout select.edd-select,
body.edd-checkout select.edd-input {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 42px !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23676b6f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 16px 16px;
}

body.edd-checkout .edd-input:focus,
body.edd-checkout .edd-select:focus,
body.edd-checkout #edd-stripe-card-element.StripeElement--focus {
	border-color: #0b87e8 !important;
}

/* Payment method options. */
body.edd-checkout #edd-payment-mode-wrap .edd-gateway-option {
	font-size: 16px;
	font-weight: 600;
}

body.edd-checkout #edd-payment-mode-wrap .edd-gateway-option:first-child {
	border-radius: 10px 10px 0 0;
}

body.edd-checkout #edd-payment-mode-wrap .edd-gateway-option:last-child {
	border-radius: 0 0 10px 10px;
}

/* Google and Facebook: the same pills as Log in and Start free. */
body.edd-checkout .social-login-buttons .social-login-button {
	border-radius: 999px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
}

/* On phones the two buttons sit one under the other, so the text stays on one line. */
@media (max-width: 600px) {
	body.edd-checkout #edd_checkout_login_register .social-login-buttons {
		flex-flow: column;
		gap: 12px;
	}

	body.edd-checkout .social-login-buttons .social-login-button {
		width: 100%;
		box-sizing: border-box;
	}
}

/* "Renew an existing license": a quiet text link instead of a grey button, lined up with the left edge of the boxes below. */
body.edd-checkout .edd-renewal-form--legacy {
	padding-left: 0;
	padding-right: 0;
}

body.edd-checkout .edd-renewal-form--legacy .edd-sl-show-renewal-form {
	padding: 0 !important;
}

body.edd-checkout .edd-sl-show-renewal-form {
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	color: #0790e8;
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
}

body.edd-checkout .edd-sl-show-renewal-form:hover,
body.edd-checkout .edd-sl-show-renewal-form:focus {
	background: none;
	color: #056caf;
	text-decoration: underline;
}

/* "Add Renewal to Cart" in the renewal form: the site's secondary button. */
body.edd-checkout #edd-add-license-renewal-block {
	padding: 6px 20px !important;
	border: 2px solid #0b87e8 !important;
	border-radius: 999px;
	background: #ffffff !important;
	color: #0b87e8 !important;
	font-size: 16px;
	font-weight: 600;
	box-shadow: none;
}

body.edd-checkout #edd-add-license-renewal-block:not([disabled]):hover {
	background: #eaf5fd !important;
	color: #056caf !important;
}

body.edd-checkout #edd-add-license-renewal-block[disabled] {
	opacity: 0.5;
	cursor: not-allowed;
}

/*
 * "... will now automatically renew ...": an information note, not a yellow warning.
 * EDD Recurring prints it at the top of the Complete checkout block, where the plugin
 * removes the padding of every box (with !important) and the block shrinks it to the text.
 */
body.edd-checkout #edd_purchase_submit > .edd-alert:is(.edd-alert-warn, .edd-alert-info) {
	align-self: stretch;
	margin: 0 0 16px !important;
	padding: 12px 16px !important;
	border: 1px solid #cfe6fb;
	border-radius: 10px;
	background: #eaf5fd;
	color: #2b2e33;
}

body.edd-checkout #edd_purchase_submit > .edd-alert:is(.edd-alert-warn, .edd-alert-info) p {
	margin: 0 !important;
	padding: 0;
	font-size: 15px;
	line-height: 1.5;
	color: #2b2e33;
}

/* Complete checkout: the green buy pill. Disabled stays green, only lighter. */
body.edd-checkout #edd-purchase-button {
	border-radius: 999px;
	font-weight: 600;
}

body.edd-checkout #edd-purchase-button:hover {
	background: #579f4a;
	opacity: 1 !important;
}

body.edd-checkout #edd-purchase-button[disabled] {
	background: #6bc45a !important;
	opacity: 0.5;
}

/* Order summary title. */
body.edd-checkout .uo_checkout_summary_content__title {
	font-size: 18px;
	font-weight: 600;
	color: #0d0f12;
}

/* Checklist: the same green check as the rest of the site. */
body.edd-checkout .sidebar-checklist-item__icon {
	background-image: url("https://automatorplugin.com/wp-content/uploads/2026/10/circle-check-duotone-green.svg");
	background-size: 16px 16px;
}

body.edd-checkout .sidebar-checklist-item__text {
	color: #2b2e33;
}