/* Supple BWM Products Payments: layout for the product payment strip and pop-ups.
   Class names and layout follow bwmachinery.com.au (product.css, product-new.css, dev.css); colours and
   typography are left to the theme. */

.moreinfo_div { width: 100%; clear: both; display: flex; flex-wrap: wrap; gap: 12px 0; margin: 16px 0 24px; }
.moreinfo_div dl { width: 50%; display: flex; align-items: center; margin: 0; }
.moreinfo_div.single_payment dl { width: 100%; }
.moreinfo_div dl dt { margin: 0 15px 0 0; display: flex; align-items: center; min-height: 42px; }
.moreinfo_div dl dt img { max-height: 42px; width: auto; }
.moreinfo_div dl dd { margin: 0; font-size: 14px; line-height: 1.3; }
.moreinfo_div .moreinfo,
.moreinfo_div dd a { display: block; margin: 5px 0 0; padding: 0; border: 0; background: none; font: inherit; font-size: 14px; color: #3e9400; text-decoration: underline; cursor: pointer; }

/* position, inset and margin restate the browser's modal centring, which theme resets can undo. */
.supple-bwmp-dialog { position: fixed; inset: 0; margin: auto; height: fit-content; padding: 0; border: 0; border-radius: 6px; width: min(760px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; }
.supple-bwmp-dialog::backdrop { background: rgba(0, 0, 0, 0.6); }
.supple-bwmp-dialog__inner { position: relative; padding: 24px; }
.supple-bwmp-dialog__close { position: absolute; top: 8px; right: 12px; border: 0; background: none; font-size: 28px; line-height: 1; cursor: pointer; }

.supple-bwmp-dialog .zip_content_container { width: 100%; text-align: center; margin: 12px 0; }
.supple-bwmp-dialog .top-logo-container { text-align: center; width: 100%; margin-bottom: 20px; }
.supple-bwmp-dialog .top-logo-container img { width: 170px; height: auto; }
.supple-bwmp-dialog .usp-container { display: flex; flex-direction: row; justify-content: center; padding-top: 20px; }
.supple-bwmp-dialog .info-snippet-container { display: flex; flex-direction: column; max-width: 33.33%; align-items: center; margin: 0 10px; }
.supple-bwmp-dialog .usp-img-container,
.supple-bwmp-dialog .usp-text-container { width: 100%; text-align: center; }
.supple-bwmp-dialog .usp-img-container img { width: 38px; height: auto; }
.supple-bwmp-dialog h6 { margin: 0; padding: 1em 0 0.583em; font-size: 1.2em; line-height: 1.25em; font-weight: 600; }
.supple-bwmp-dialog .usp-text { font-size: 16px; line-height: 26px; }
.supple-bwmp-dialog .text-bold { font-weight: 500; }
.supple-bwmp-dialog .flex-row-centered { display: flex; flex-direction: row; justify-content: center; align-items: center; padding-top: 20px; }
.supple-bwmp-dialog .margin-right-1 { margin-right: 24px; }
.supple-bwmp-dialog .footer-img-container { height: 30px; }
.supple-bwmp-dialog .footer-img-container img { height: 100%; width: auto; }
.supple-bwmp-dialog .terms-container { display: flex; align-items: center; justify-content: center; padding-top: 10px; }
.supple-bwmp-dialog .terms { font-size: 12px; text-align: center; max-width: 600px; line-height: 20px; }

@media (max-width: 767px) {
	.moreinfo_div dl { width: 100%; }
	.supple-bwmp-dialog .usp-container { flex-wrap: wrap; }
	.supple-bwmp-dialog .info-snippet-container { flex-direction: row; max-width: 100%; margin-bottom: 20px; }
	.supple-bwmp-dialog .usp-img-container { width: 40px; }
	.supple-bwmp-dialog .usp-text-container { flex: 1; text-align: left; }
	.supple-bwmp-dialog h6 { padding: 0; text-align: left; }
}
