/**
 * Charitable PayPal Commerce Gateway Styles
 *
 * Styles for PayPal buttons and Card Fields (ACDC) integration.
 *
 * @package Charitable/Gateways/PayPal Commerce
 * @since   1.9.0
 */

/* Container */
#charitable-paypal-commerce-container {
	position: relative;
	margin: 20px 0;
}

#charitable-paypal-commerce-container.processing {
	pointer-events: none;
	opacity: 0.7;
}

/* Payment Wrapper */
.charitable-paypal-payment-wrapper {
	width: 100%;
}

/* Payment Method Tabs */
.charitable-paypal-payment-tabs {
	display: flex;
	gap: 10px;
	margin-bottom: 20px;
	border-bottom: 2px solid #e5e5e5;
	padding-bottom: 0;
}

.charitable-paypal-payment-method-tab {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px 20px;
	background: transparent;
	border: none;
	border-bottom: 2px solid transparent;
	margin-bottom: -2px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	color: #666;
	transition: none;
}

.charitable-paypal-payment-method-tab:hover {
	color: #333;
	background: transparent;
}

.charitable-paypal-payment-method-tab.active {
	color: #0070ba;
	border-bottom-color: #0070ba;
}

.charitable-paypal-payment-method-tab .tab-icon {
	width: 24px;
	height: 16px;
	display: inline-block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.charitable-paypal-payment-method-tab .tab-icon.paypal-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23003087' d='M7.076 21.337H2.47a.641.641 0 0 1-.633-.74L4.944 3.72a.777.777 0 0 1 .766-.66h7.394c2.613 0 4.46.662 5.49 1.968.47.594.77 1.27.904 2.013.14.77.116 1.69-.072 2.81l-.01.055v.485l.378.214c.318.18.572.38.77.602.368.41.608.92.714 1.52.108.613.082 1.34-.08 2.16-.185.94-.49 1.76-.907 2.44a4.954 4.954 0 0 1-1.41 1.49c-.548.384-1.188.66-1.91.82-.7.16-1.483.24-2.34.24h-.555a1.68 1.68 0 0 0-1.66 1.42l-.04.218-.63 3.99-.03.14c-.03.21-.07.34-.14.44a.627.627 0 0 1-.507.26H7.076z'/%3E%3Cpath fill='%230070e0' d='M19.54 7.966c-.01.06-.02.12-.04.18-1.17 5.94-5.19 7.99-10.32 7.99H6.55a1.27 1.27 0 0 0-1.26 1.08l-.89 5.59-.25 1.59c-.07.43.26.81.7.81h4.07a1.12 1.12 0 0 0 1.1-.94l.05-.23.87-5.51.06-.31c.08-.48.49-.82.98-.82h.62c4.01 0 7.15-1.63 8.07-6.33.38-1.97.19-3.61-.81-4.77a3.98 3.98 0 0 0-1.16-.95z'/%3E%3C/svg%3E");
}

.charitable-paypal-payment-method-tab .tab-icon.card-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='4' width='22' height='16' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='1' y1='10' x2='23' y2='10'%3E%3C/line%3E%3C/svg%3E");
}

.charitable-paypal-payment-method-tab.active .tab-icon.card-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230070ba' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='4' width='22' height='16' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='1' y1='10' x2='23' y2='10'%3E%3C/line%3E%3C/svg%3E");
}

.charitable-paypal-payment-method-tab .tab-icon.apple-pay-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23666'%3E%3Cpath d='M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z'/%3E%3C/svg%3E");
}

.charitable-paypal-payment-method-tab.active .tab-icon.apple-pay-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230070ba'%3E%3Cpath d='M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z'/%3E%3C/svg%3E");
}

.charitable-paypal-payment-method-tab .tab-icon.google-pay-icon {
	width: 48px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 16'%3E%3Cpath fill='%234285F4' d='M19.26 6.68c0 1.48-.58 2.86-1.63 3.9-1.05 1.04-2.43 1.62-3.91 1.62s-2.86-.58-3.91-1.62c-1.05-1.04-1.63-2.42-1.63-3.9s.58-2.86 1.63-3.9c1.05-1.04 2.43-1.62 3.91-1.62s2.86.58 3.91 1.62c1.05 1.04 1.63 2.42 1.63 3.9z'/%3E%3Cpath fill='%23EA4335' d='M13.72 4.12c-.81 0-1.54.32-2.08.85-.54.53-.86 1.26-.86 2.07 0 .81.32 1.54.86 2.07.54.53 1.27.85 2.08.85s1.54-.32 2.08-.85c.54-.53.86-1.26.86-2.07 0-.81-.32-1.54-.86-2.07-.54-.53-1.27-.85-2.08-.85z'/%3E%3Cpath fill='%23FBBC04' d='M26.44 6.68c0-.81-.32-1.54-.86-2.07-.54-.53-1.27-.85-2.08-.85-.81 0-1.54.32-2.08.85-.54.53-.86 1.26-.86 2.07 0 .81.32 1.54.86 2.07.54.53 1.27.85 2.08.85.81 0 1.54-.32 2.08-.85.54-.53.86-1.26.86-2.07z'/%3E%3Cpath fill='%2334A853' d='M33.16 6.68c0-.81-.32-1.54-.86-2.07-.54-.53-1.27-.85-2.08-.85-.81 0-1.54.32-2.08.85-.54.53-.86 1.26-.86 2.07 0 .81.32 1.54.86 2.07.54.53 1.27.85 2.08.85.81 0 1.54-.32 2.08-.85.54-.53.86-1.26.86-2.07z'/%3E%3C/svg%3E");
}

.charitable-paypal-payment-method-tab.active .tab-icon.google-pay-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 16'%3E%3Cpath fill='%234285F4' d='M19.26 6.68c0 1.48-.58 2.86-1.63 3.9-1.05 1.04-2.43 1.62-3.91 1.62s-2.86-.58-3.91-1.62c-1.05-1.04-1.63-2.42-1.63-3.9s.58-2.86 1.63-3.9c1.05-1.04 2.43-1.62 3.91-1.62s2.86.58 3.91 1.62c1.05 1.04 1.63 2.42 1.63 3.9z'/%3E%3Cpath fill='%23EA4335' d='M13.72 4.12c-.81 0-1.54.32-2.08.85-.54.53-.86 1.26-.86 2.07 0 .81.32 1.54.86 2.07.54.53 1.27.85 2.08.85s1.54-.32 2.08-.85c.54-.53.86-1.26.86-2.07 0-.81-.32-1.54-.86-2.07-.54-.53-1.27-.85-2.08-.85z'/%3E%3Cpath fill='%23FBBC04' d='M26.44 6.68c0-.81-.32-1.54-.86-2.07-.54-.53-1.27-.85-2.08-.85-.81 0-1.54.32-2.08.85-.54.53-.86 1.26-.86 2.07 0 .81.32 1.54.86 2.07.54.53 1.27.85 2.08.85.81 0 1.54-.32 2.08-.85.54-.53.86-1.26.86-2.07z'/%3E%3Cpath fill='%2334A853' d='M33.16 6.68c0-.81-.32-1.54-.86-2.07-.54-.53-1.27-.85-2.08-.85-.81 0-1.54.32-2.08.85-.54.53-.86 1.26-.86 2.07 0 .81.32 1.54.86 2.07.54.53 1.27.85 2.08.85.81 0 1.54-.32 2.08-.85.54-.53.86-1.26.86-2.07z'/%3E%3C/svg%3E");
}

/* Payment Panes */
.charitable-paypal-pane {
	display: none;
}

.charitable-paypal-pane.active {
	display: block;
}

/* PayPal Buttons Pane */
.charitable-paypal-buttons-pane {
	min-height: 150px;
	width: 100%;
}

/* Match PayPal SDK button container sizing */
.charitable-paypal-payment-wrapper {
	min-width: 300px;
	max-width: 750px;
}

@media only screen and (min-width: 500px) {
	.charitable-paypal-payment-wrapper {
		min-width: 500px;
		max-width: 750px;
	}
}

.charitable-paypal-buttons-pane + .charitable-notice.charitable-notice-info,
.charitable-paypal-card-pane + .charitable-notice.charitable-notice-info,
.charitable-paypal-pane + .charitable-notice.charitable-notice-info,
.charitable-notice.charitable-notice-info {
	min-width: 300px;
	max-width: 750px;
}

@media only screen and (min-width: 500px) {
	.charitable-paypal-buttons-pane + .charitable-notice.charitable-notice-info,
	.charitable-paypal-card-pane + .charitable-notice.charitable-notice-info,
	.charitable-paypal-pane + .charitable-notice.charitable-notice-info,
	.charitable-notice.charitable-notice-info {
		min-width: 500px;
		max-width: 750px;
	}
}

/* Card Fields Pane */
.charitable-paypal-card-pane {
	padding: 10px 0;
}

/* Apple Pay Pane */
.charitable-paypal-applepay-pane {
	padding: 20px 0;
}

.charitable-apple-pay-container {
	min-height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Google Pay Pane */
.charitable-paypal-googlepay-pane {
	padding: 20px 0;
}

.charitable-google-pay-container {
	min-height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Apple Pay Button */
.charitable-apple-pay-button {
	width: 100%;
	max-width: 320px;
	height: 50px;
	background: #000;
	border: none;
	border-radius: 8px;
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	-webkit-appearance: none;
}

.charitable-apple-pay-button:hover {
	background: #333;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.charitable-apple-pay-button:active {
	transform: translateY(0);
}

.charitable-apple-pay-button .apple-pay-logo {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 20px;
	height: 20px;
	margin-right: 8px;
	display: inline-block;
}

.charitable-apple-pay-button .apple-pay-text {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 500;
	letter-spacing: 0.3px;
	font-size: 16px;
	color: white;
}

/* Google Pay Button */
.charitable-google-pay-button {
	width: 100%;
	max-width: 320px;
	height: 50px;
	background: #fff;
	border: 1px solid #dadce0;
	border-radius: 8px;
	color: #3c4043;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.charitable-google-pay-button:hover {
	background: #f8f9fa;
	border-color: #c1c7cd;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.charitable-google-pay-button:active {
	transform: translateY(0);
}

.charitable-google-pay-button .google-pay-logo {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 16'%3E%3Cpath fill='%234285F4' d='M15.41 7.35c0 1.19-.46 2.29-1.3 3.12-.84.83-1.94 1.3-3.13 1.3s-2.29-.47-3.13-1.3c-.84-.83-1.3-1.93-1.3-3.12s.46-2.29 1.3-3.12c.84-.83 1.94-1.3 3.13-1.3s2.29.47 3.13 1.3c.84.83 1.3 1.93 1.3 3.12z'/%3E%3Cpath fill='%23EA4335' d='M10.98 3.93c-.65 0-1.23.26-1.66.68-.43.42-.69 1.01-.69 1.66 0 .65.26 1.24.69 1.66.43.42 1.01.68 1.66.68s1.23-.26 1.66-.68c.43-.42.69-1.01.69-1.66 0-.65-.26-1.24-.69-1.66-.43-.42-1.01-.68-1.66-.68z'/%3E%3Cpath fill='%23FBBC04' d='M21.15 7.35c0-.65-.26-1.24-.69-1.66-.43-.42-1.01-.68-1.66-.68-.65 0-1.23.26-1.66.68-.43.42-.69 1.01-.69 1.66 0 .65.26 1.24.69 1.66.43.42 1.01.68 1.66.68.65 0 1.23-.26 1.66-.68.43-.42.69-1.01.69-1.66z'/%3E%3Cpath fill='%2334A853' d='M26.53 7.35c0-.65-.26-1.24-.69-1.66-.43-.42-1.01-.68-1.66-.68-.65 0-1.23.26-1.66.68-.43.42-.69 1.01-.69 1.66 0 .65.26 1.24.69 1.66.43.42 1.01.68 1.66.68.65 0 1.23-.26 1.66-.68.43-.42.69-1.01.69-1.66z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 73px;
	min-height: 37px;
	margin-right: 8px;
	display: inline-block;
}

.charitable-google-pay-button .google-pay-text {
	font-family: 'Google Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-weight: 500;
	font-size: 14px;
	color: #3c4043;
}

/* Card Form */
.charitable-paypal-card-form {
	max-width: 100%;
}

.charitable-paypal-card-field-wrapper {
	margin-bottom: 16px;
	/* Reset theme fieldset/legend styles */
	border: none !important;
	padding: 0 !important;
	margin-inline: 0 !important;
	min-inline-size: 0 !important;
}

.charitable-paypal-card-field-wrapper label {
	display: block !important;
	position: static !important;
	float: none !important;
	margin-bottom: 6px !important;
	margin-top: 0 !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	color: #333 !important;
	background: none !important;
	transform: none !important;
	line-height: 1.4 !important;
	padding: 0 !important;
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto;
	white-space: nowrap;
	width: auto !important;
	max-width: none !important;
	/* Reset legend-in-fieldset behavior */
	border: none !important;
	clip: auto !important;
	overflow: visible !important;
}

.charitable-paypal-card-field {
	/* Minimal styling — let PayPal SDK iframes handle their own look */
	background: #fff;
	padding: 0 !important;
	margin: 0;
	overflow: hidden;
}

.charitable-paypal-card-field iframe {
	display: block !important;
	margin: 0 0 0 -5px !important;
	padding: 0 !important;
	border: none !important;
}

/* Card Row (Expiry + CVV) */
.charitable-paypal-card-row {
	display: flex;
	gap: 16px;
}

.charitable-paypal-card-row .charitable-paypal-card-field-wrapper {
	flex: 1;
}

.charitable-paypal-card-expiry {
	flex: 1.2 !important;
}

.charitable-paypal-card-cvv {
	flex: 0.8 !important;
}

/* Card Name Input */
.charitable-paypal-card-name-input {
	width: 100% !important;
	max-width: 100% !important;
	height: 44px;
	padding: 10px 12px;
	border: 1px solid #d2d5db;
	border-radius: 4px;
	font-size: 16px;
	font-family: inherit;
	color: #333;
	box-sizing: border-box;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.charitable-paypal-card-name-input:focus {
	outline: none;
	border-color: #0070ba;
	box-shadow: 0 0 0 2px rgba(0, 112, 186, 0.1);
}

.charitable-paypal-card-name-input::placeholder {
	color: #999;
}

/* Card Submit Button */
.charitable-paypal-card-submit-wrapper {
	margin-top: 20px;
}

.charitable-paypal-card-submit {
	width: 100%;
	padding: 14px 20px;
	background: #0070ba;
	color: #fff;
	border: none;
	border-radius: 4px;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	transition: background 0.2s ease;
}

.charitable-paypal-card-submit:hover {
	background: #005c99;
}

.charitable-paypal-card-submit:disabled,
.charitable-paypal-card-submit.processing {
	background: #ccc;
	cursor: not-allowed;
}

/* Card Errors */
.charitable-paypal-card-errors {
	margin-top: 15px;
	display: none;
}

.charitable-paypal-card-errors .charitable-notice {
	margin: 0;
	padding: 12px 15px;
	background: #fdf2f2;
	border: 1px solid #f5c6cb;
	border-radius: 4px;
	color: #721c24;
	font-size: 14px;
}

/* Processing Overlay */
.charitable-paypal-processing {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255, 255, 255, 0.8);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100;
}

.charitable-paypal-processing span {
	padding: 15px 25px;
	background: #fff;
	border-radius: 4px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	font-size: 14px;
	color: #333;
}

/* Success Notice */
.charitable-notice.charitable-notice-success {
	padding: 15px;
	background: #d4edda;
	border: 1px solid #c3e6cb;
	border-radius: 4px;
	color: #155724;
	font-size: 14px;
}

/* ===== VAULTING STYLES ===== */

/* Vaulting Section */
.charitable-vaulting-section {
	margin: 15px 0;
	padding: 15px;
	background: #f9f9f9;
	border-radius: 6px;
	border: 1px solid #e5e5e5;
}

/* Vault Option */
.charitable-vault-option {
	margin: 15px 0;
	padding: 12px 15px;
	background: #f0f7fc;
	border: 1px solid #d1e7f4;
	border-radius: 6px;
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.charitable-vault-option input[type="checkbox"] {
	margin: 1px 0 0 0;
	flex-shrink: 0;
	transform: scale(1.1);
}

.charitable-vault-option label {
	margin: -2px 0 0 4px;
	font-weight: 500;
	color: #333;
	cursor: pointer;
}

.charitable-vault-option small {
	display: block;
	margin-top: 6px;
	font-size: 12px;
	color: #666;
	font-weight: 400;
}

/* Saved Methods Section */
.charitable-saved-methods-section {
	margin: 20px 0;
	padding: 20px;
	background: #fff;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
}

.charitable-saved-methods-section h4 {
	margin: 0 0 15px 0;
	font-size: 16px;
	font-weight: 600;
	color: #333;
}

/* Saved Methods List */
.charitable-saved-methods-list {
	margin-top: 0;
}

.charitable-saved-method {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 12px 15px;
	margin-bottom: 10px;
	background: #fafafa;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
	transition: all 0.2s ease;
}

.charitable-saved-method:hover {
	background: #f0f7fc;
	border-color: #d1e7f4;
}

.charitable-saved-method input[type="radio"] {
	margin-right: 12px;
	transform: scale(1.1);
}

.charitable-saved-method label {
	flex: 1;
	margin: 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 8px;
}

.charitable-saved-method .method-type {
	font-weight: 600;
	color: #333;
}

.charitable-saved-method .method-details {
	color: #666;
	font-size: 14px;
}

.charitable-saved-method .method-default {
	color: #0070ba;
	font-size: 12px;
	font-weight: 500;
}

.charitable-saved-method .method-badge {
	display: inline-block;
	padding: 2px 8px;
	background: #e7f3ff;
	color: #0070ba;
	border: 1px solid #b3d9ff;
	border-radius: 10px;
	font-size: 11px;
	font-weight: 600;
}

.charitable-use-new-method {
	background: #f8f8f8 !important;
	border-style: dashed !important;
}

.charitable-saved-method .method-actions {
	display: flex;
	gap: 8px;
	margin-left: 12px;
}

.charitable-saved-method .method-actions button {
	padding: 6px 12px;
	font-size: 12px;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: all 0.2s ease;
	font-weight: 500;
}

.charitable-set-default-payment-method {
	background: #f0f7fc;
	color: #0070ba;
	border: 1px solid #d1e7f4 !important;
}

.charitable-set-default-payment-method:hover {
	background: #e1f0fc;
	color: #005c99;
}

.charitable-delete-payment-method {
	background: #fdf2f2;
	color: #c0392b;
	border: 1px solid #f5c6cb !important;
}

.charitable-delete-payment-method:hover {
	background: #f8d7da;
	color: #a71e2a;
}

/* Recurring Vault Notice */
.charitable-notice.charitable-notice-info {
	background: #e7f3ff;
	border: 1px solid #b3d9ff;
	border-left: 4px solid #0073aa;
	color: #0073aa;
	padding: 12px 15px;
	border-radius: 4px;
	margin: 15px 0;
}

.charitable-notice.charitable-notice-info p {
	margin: 0;
	font-size: 14px;
	line-height: 1.4;
}

/* Vault Success Messages */
.charitable-vaulting-success {
	background: #d4edda;
	border: 1px solid #c3e6cb;
	border-left: 4px solid #28a745;
	color: #155724;
	padding: 12px 15px;
	border-radius: 4px;
	margin: 15px 0;
	font-size: 14px;
}

/* Vault Error Messages */
.charitable-vaulting-error {
	background: #fdf2f2;
	border: 1px solid #f5c6cb;
	border-left: 4px solid #dc3545;
	color: #721c24;
	padding: 12px 15px;
	border-radius: 4px;
	margin: 15px 0;
	font-size: 14px;
}

/* Loading States for Vaulting */
.charitable-saved-methods-section.loading {
	opacity: 0.6;
	pointer-events: none;
	position: relative;
}

.charitable-saved-methods-section.loading::after {
	content: "Loading...";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(255, 255, 255, 0.9);
	padding: 10px 20px;
	border-radius: 4px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	font-size: 14px;
	color: #333;
}

/* Payment Method Icons */
.charitable-saved-method .method-icon {
	width: 24px;
	height: 18px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	margin-right: 8px;
}

.charitable-saved-method .method-icon.paypal-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23003087' d='M7.076 21.337H2.47a.641.641 0 0 1-.633-.74L4.944 3.72a.777.777 0 0 1 .766-.66h7.394c2.613 0 4.46.662 5.49 1.968.47.594.77 1.27.904 2.013.14.77.116 1.69-.072 2.81l-.01.055v.485l.378.214c.318.18.572.38.77.602.368.41.608.92.714 1.52.108.613.082 1.34-.08 2.16-.185.94-.49 1.76-.907 2.44a4.954 4.954 0 0 1-1.41 1.49c-.548.384-1.188.66-1.91.82-.7.16-1.483.24-2.34.24h-.555a1.68 1.68 0 0 0-1.66 1.42l-.04.218-.63 3.99-.03.14c-.03.21-.07.34-.14.44a.627.627 0 0 1-.507.26H7.076z'/%3E%3Cpath fill='%230070e0' d='M19.54 7.966c-.01.06-.02.12-.04.18-1.17 5.94-5.19 7.99-10.32 7.99H6.55a1.27 1.27 0 0 0-1.26 1.08l-.89 5.59-.25 1.59c-.07.43.26.81.7.81h4.07a1.12 1.12 0 0 0 1.1-.94l.05-.23.87-5.51.06-.31c.08-.48.49-.82.98-.82h.62c4.01 0 7.15-1.63 8.07-6.33.38-1.97.19-3.61-.81-4.77a3.98 3.98 0 0 0-1.16-.95z'/%3E%3C/svg%3E");
}

.charitable-saved-method .method-icon.card-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23666' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1' y='4' width='22' height='16' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='1' y1='10' x2='23' y2='10'%3E%3C/line%3E%3C/svg%3E");
}

.charitable-saved-method .method-icon.venmo-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233D95CE'%3E%3Cpath d='M19.14 2c.95 0 1.57.4 1.97.84.4.43.69 1.07.69 2.05 0 2.22-2.09 6.27-3.91 8.8L14.4 22h-3.8l-1.7-12.8h3.6l.8 9.5c1.1-1.9 2.4-4.7 2.4-6.8 0-.9-.3-1.4-.8-1.4-.2 0-.4.1-.6.2l-.6-2.8c.5-.3 1.3-.6 2.2-.6 1.3 0 2.3.7 2.3 2.2 0 1.8-.9 4.2-1.8 6.1h.1l1.6-13.5H19.14z'/%3E%3C/svg%3E");
}

.charitable-saved-method .method-icon.apple-pay-icon {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Cpath d='M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z'/%3E%3C/svg%3E");
}

/* Responsive Vaulting Styles */
@media (max-width: 768px) {
	.charitable-saved-method {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.charitable-saved-method label {
		width: 100%;
	}

	.charitable-saved-method .method-actions {
		margin-left: 0;
		align-self: flex-end;
	}

	.charitable-vaulting-section,
	.charitable-saved-methods-section {
		padding: 15px 12px;
	}
}

@media (max-width: 480px) {
	.charitable-saved-method .method-actions {
		flex-direction: column;
		width: 100%;
		gap: 6px;
	}

	.charitable-saved-method .method-actions button {
		width: 100%;
		padding: 8px 12px;
	}
}

/* Theme override — ensure all elements inside the PayPal container respect full width */
#charitable-paypal-commerce-container,
#charitable-paypal-commerce-container * {
	box-sizing: border-box;
}

#charitable-paypal-commerce-container .charitable-paypal-payment-wrapper {
	width: 100% !important;
	max-width: 750px !important;
}

/* Responsive */
@media (max-width: 480px) {
	.charitable-paypal-payment-tabs {
		flex-direction: column;
		gap: 0;
	}

	.charitable-paypal-payment-method-tab {
		width: 100%;
		justify-content: center;
		border-bottom: 1px solid #e5e5e5;
		margin-bottom: 0;
	}

	.charitable-paypal-payment-method-tab.active {
		background: transparent;
		border-bottom-color: #e5e5e5;
	}

	.charitable-paypal-card-row {
		flex-direction: column;
		gap: 0;
	}

	.charitable-paypal-card-row .charitable-paypal-card-field-wrapper {
		flex: 1 !important;
	}
}

/* Fix: zoid injects a full-size __detect_close__ iframe inside each card field container.
 * The zoid CSS rule `> iframe { width: 100%; height: 100% }` makes it cover the real
 * card field iframe, blocking all pointer events. Set pointer-events: none so clicks
 * pass through to the actual PayPal card field iframe underneath. */
iframe[name^="__detect_close"] {
	pointer-events: none !important;
}

/* Subscription redirect button - shown in place of PayPal SDK buttons for recurring subscriptions */
.charitable-paypal-subscription-redirect {
	padding: 4px 0;
}

.charitable-paypal-subscribe-btn {
	display: block;
	width: 100%;
	padding: 13px 20px;
	background-color: #ffc439;
	border: 1px solid #f5b83d;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 600;
	color: #111;
	cursor: pointer;
	text-align: center;
	transition: background-color 0.2s;
}

.charitable-paypal-subscribe-btn:hover {
	background-color: #f5b83d;
}