.dfp-wrap { max-width: 100%; }
.dfp-form { --dfp-gap-x: 16px; --dfp-gap-y: 16px; box-sizing: border-box; }
.dfp-form *, .dfp-form *::before, .dfp-form *::after { box-sizing: border-box; }

.dfp-fields { display: flex; flex-wrap: wrap; gap: var(--dfp-gap-y) var(--dfp-gap-x); }
.dfp-field { width: 100%; }
.dfp-w-50 { width: calc((100% - var(--dfp-gap-x)) / 2); }
.dfp-w-33 { width: calc((100% - 2 * var(--dfp-gap-x)) / 3); }

.dfp-label { display: block; margin-bottom: 6px; font-weight: 600; }
.dfp-req { color: #d63638; }
.dfp-input {
	display: block; width: 100%; padding: 10px 12px; border: 1px solid #c3c4c7; border-radius: 4px;
	background: #fff; color: inherit; font: inherit; line-height: 1.4;
}
.dfp-input:focus { outline: 2px solid transparent; border-color: #2271b1; box-shadow: 0 0 0 1px #2271b1; }
textarea.dfp-input { resize: vertical; }
.dfp-choices { --dfp-choice-gap: 12px; display: flex; flex-wrap: wrap; gap: 8px var(--dfp-choice-gap); }
.dfp-choices .dfp-choice { width: 100%; }
.dfp-choices.dfp-ow-50 .dfp-choice { width: calc((100% - var(--dfp-choice-gap)) / 2); }
.dfp-choices.dfp-ow-33 .dfp-choice { width: calc((100% - 2 * var(--dfp-choice-gap)) / 3); }
.dfp-choices.dfp-ow-25 .dfp-choice { width: calc((100% - 3 * var(--dfp-choice-gap)) / 4); }
.dfp-choices.dfp-ow-auto .dfp-choice { width: auto; }
.dfp-choice.is-out { opacity: .5; cursor: not-allowed; }
.dfp-qty { max-width: 140px; }
.dfp-choice { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 400; }
.dfp-help { display: block; margin-top: 4px; opacity: .7; }
.dfp-heading { margin: 0; }
.dfp-paragraph p:last-child { margin-bottom: 0; }

.dfp-has-error .dfp-input { border-color: #d63638; }
.dfp-error { display: block; margin-top: 4px; color: #d63638; font-size: .9em; }

.dfp-type-hidden { display: none; }
.dfp-logic-hidden { display: none !important; }
.dfp-continue { margin-left: 8px; }
.dfp-hp { position: absolute !important; left: -9999px !important; height: 0; overflow: hidden; }

.dfp-payment { margin-top: 24px; padding: 16px; border: 1px solid #dcdcde; border-radius: 6px; background: #f9fafb; }
.dfp-payment-title { margin: 0 0 12px; }
.dfp-total-row { display: flex; justify-content: space-between; align-items: center; font-size: 1.1em; margin-bottom: 12px; }
.dfp-gateway-list { list-style: none; margin: 0; padding: 0; }
.dfp-gateway { margin: 0 0 8px; padding: 10px 12px; background: #fff; border: 1px solid #dcdcde; border-radius: 4px; }
.dfp-gateway-label { display: flex; align-items: center; gap: 8px; cursor: pointer; font-weight: 600; }
.dfp-gateway-label img { max-height: 24px; width: auto; }
.dfp-gw-box { margin-top: 8px; font-size: .95em; opacity: .85; }
.dfp-muted { opacity: .7; }

.dfp-actions { margin-top: 20px; display: flex; }
.dfp-submit {
	cursor: pointer; padding: 12px 28px; border: 0; border-radius: 4px; background: #2271b1; color: #fff;
	font: inherit; font-weight: 600; transition: background .15s, opacity .15s;
}
.dfp-submit:hover { background: #135e96; }
.dfp-submit:disabled { opacity: .6; cursor: wait; }

.dfp-messages:not(:empty) { margin-top: 16px; padding: 12px 14px; border-radius: 4px; }
.dfp-msg-success { background: #d1f0dc; color: #0a5c2b; }
.dfp-msg-error { background: #f8d7da; color: #842029; }
.dfp-notice { padding: 10px 12px; background: #fcf0c8; border-radius: 4px; }

@media (max-width: 600px) {
	.dfp-w-50, .dfp-w-33 { width: 100%; }
	.dfp-choices[class*="dfp-ow-"]:not(.dfp-ow-auto) .dfp-choice { width: 100%; }
}

.dfp-file { padding: 8px; }
