/* PPC Form: popup, spinner, ITI overrides. All scoped to .ppc-form-root to avoid conflicts. */
.ppc-form-root {
    text-align: center;
}
.ppc-form-root .ppc-form-trigger-btn {
    display: flex;
    margin: 0 auto;
}
/* ----- Trigger button ----- */
.ppc-form-root .ppc-form-trigger-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 16px 32px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
	border: none;
	border-radius: 10px;
	cursor: pointer;
	text-transform: none;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
	box-shadow: 0 4px 14px rgba(37, 99, 235, 0.35);
	transition: transform 0.15s, box-shadow 0.2s, background 0.2s;
	letter-spacing: 0.3px;
}
.ppc-form-root .ppc-form-trigger-btn:hover {
	background: linear-gradient(135deg, #1d4ed8 0%, #1e3a8a 100%);
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(37, 99, 235, 0.45);
}
.ppc-form-root .ppc-form-trigger-btn:active {
	transform: translateY(0);
}
.ppc-form-root .ppc-form-trigger-icon {
	font-size: 18px;
}

/* ----- Modal overlay ----- */
.ppc-form-root .ppc-form-popup,
body > .ppc-form-popup {
	position: fixed !important;
	inset: 0 !important;
	z-index: 999999;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 20px;
	box-sizing: border-box;
	opacity: 0;
	transition: opacity 0.25s ease;
	pointer-events: none;
}
.ppc-form-root .ppc-form-popup.ppc-form-popup-open,
body > .ppc-form-popup.ppc-form-popup-open {
	display: flex;
	opacity: 1;
	pointer-events: auto;
}

/* Backdrop */
.ppc-form-root .ppc-form-popup-backdrop,
body > .ppc-form-popup .ppc-form-popup-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.55);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}

/* Modal card */
.ppc-form-root .ppc-form-popup-inner,
body > .ppc-form-popup .ppc-form-popup-inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: 440px;
	max-height: 90vh;
	overflow-y: auto;
	background: #ffffff;
	border-radius: 16px;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
	padding: 32px 28px 24px;
	animation: ppc-modal-enter 0.3s ease;
}
@keyframes ppc-modal-enter {
	from { opacity: 0; transform: translateY(20px) scale(0.97); }
	to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Close button */
.ppc-form-root .ppc-form-popup-close,
body > .ppc-form-popup .ppc-form-popup-close {
	position: absolute;
	top: 14px;
	right: 14px;
	width: 36px;
	height: 36px;
	padding: 0;
	font-size: 22px;
	line-height: 36px;
	text-align: center;
	color: #9ca3af;
	background: #f3f4f6;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	transition: background 0.15s, color 0.15s;
}
.ppc-form-root .ppc-form-popup-close:hover,
body > .ppc-form-popup .ppc-form-popup-close:hover {
	background: #e5e7eb;
	color: #374151;
}

/* Heading */
.ppc-form-root .ppc-form-heading,
body > .ppc-form-popup .ppc-form-heading {
	font-size: 22px;
	font-weight: 800;
	color: #111827;
	margin: 0 0 4px 0;
	line-height: 1.3;
	text-align: center;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* Subheading */
.ppc-form-root .ppc-form-subheading,
body > .ppc-form-popup .ppc-form-subheading {
	font-size: 14px;
	color: #6b7280;
	text-align: center;
	margin: 0 0 20px 0;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* Disclaimer */
.ppc-form-root .ppc-form-disclaimer,
body > .ppc-form-popup .ppc-form-disclaimer {
	font-size: 11px;
	color: #9ca3af;
	text-align: center;
	margin-top: 14px;
	line-height: 1.5;
}
.ppc-form-root .ppc-form-disclaimer a,
body > .ppc-form-popup .ppc-form-disclaimer a {
	color: #6b7280;
	text-decoration: underline;
	transition: color 0.15s;
}
.ppc-form-root .ppc-form-disclaimer a:hover,
body > .ppc-form-popup .ppc-form-disclaimer a:hover {
	color: #374151;
}

/* ----- Flag sprites via CDN ----- */
.ppc-form-root .iti__flag,
body > .ppc-form-popup .iti__flag {
	background-image: url("https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.17/img/flags.png") !important;
	background-repeat: no-repeat !important;
	background-color: transparent !important;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
	.ppc-form-root .iti__flag,
	body > .ppc-form-popup .iti__flag {
		background-image: url("https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.17/img/flags@2x.png") !important;
		background-size: 5652px 15px !important;
	}
}


.intgrtn-input-holder{
	margin: 10px 0px !important;
}
.intgrtn-btn-submit-holder button{
	background-color: blue;
}
/* ----- ITI overrides ----- */
.ppc-form-root .iti,
body > .ppc-form-popup .iti { color: #000; position: relative; }
.ppc-form-root .intgrtn-input-holder-phone,
body > .ppc-form-popup .intgrtn-input-holder-phone { position: relative !important; width: 100%; }
.ppc-form-root .intgrtn-input-holder-phone .phonelist,
.ppc-form-root .intgrtn-input-holder-phone .ppc-form-phone-input,
body > .ppc-form-popup .intgrtn-input-holder-phone .phonelist,
body > .ppc-form-popup .intgrtn-input-holder-phone .ppc-form-phone-input {
	padding-left: 90px !important; width: 100% !important; box-sizing: border-box !important; z-index: auto !important;
}
.ppc-form-root .iti.iti--allow-dropdown,
body > .ppc-form-popup .iti.iti--allow-dropdown { width: 100% !important; position: relative !important; }
.ppc-form-root .iti.iti--allow-dropdown.iti--separate-dial-code,
body > .ppc-form-popup .iti.iti--allow-dropdown.iti--separate-dial-code { width: 100% !important; }
.ppc-form-root .iti--separate-dial-code .iti__flag-container,
body > .ppc-form-popup .iti--separate-dial-code .iti__flag-container {
	position: absolute !important; left: 0 !important; right: auto !important; top: 0 !important; bottom: 0 !important;
	z-index: 10 !important; width: 90px !important;
}
.ppc-form-root .iti--separate-dial-code .iti__selected-flag,
body > .ppc-form-popup .iti--separate-dial-code .iti__selected-flag {
	display: flex !important; align-items: center !important; padding: 0 6px !important; height: 100% !important;
	white-space: nowrap !important; width: 80px !important; max-width: 80px !important; min-width: 80px !important; flex-shrink: 0 !important;
}
.ppc-form-root .iti__selected-flag,
body > .ppc-form-popup .iti__selected-flag {
	width: 80px !important; max-width: 80px !important;
	cursor: pointer !important;
	background-color: #f3f4f6;
	border-radius: 10px 0 0 10px;
	transition: background-color 0.15s;
}
.ppc-form-root .iti__selected-flag:hover,
body > .ppc-form-popup .iti__selected-flag:hover { background-color: #e5e7eb; }
.ppc-form-root .iti--separate-dial-code .iti__selected-dial-code,
body > .ppc-form-popup .iti--separate-dial-code .iti__selected-dial-code { padding-left: 4px !important; color: #374151 !important; font-size: 14px !important; font-weight: 500 !important; }
.ppc-form-root .iti--separate-dial-code input.phonelist,
.ppc-form-root .iti--separate-dial-code input[type="tel"],
.ppc-form-root .iti--separate-dial-code input,
body > .ppc-form-popup .iti--separate-dial-code input.phonelist,
body > .ppc-form-popup .iti--separate-dial-code input[type="tel"],
body > .ppc-form-popup .iti--separate-dial-code input {
	padding-left: 90px !important; width: 100% !important; box-sizing: border-box !important;
}
.ppc-form-root .iti input,
body > .ppc-form-popup .iti input {
	z-index: 0 !important;
	padding-left: 90px !important;
}
.ppc-form-root .iti__country-list,
body > .ppc-form-popup .iti__country-list { z-index: 10002 !important; position: absolute !important; display: block !important; visibility: visible !important; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.15); }
.ppc-form-root .iti--container,
body > .ppc-form-popup .iti--container { z-index: 10003 !important; }
.ppc-form-root .iti__country,
body > .ppc-form-popup .iti__country { cursor: pointer !important; }
.ppc-form-root .iti__flag-container,
body > .ppc-form-popup .iti__flag-container { z-index: 10 !important; }
.ppc-form-root .iti__flag,
body > .ppc-form-popup .iti__flag { position: relative; z-index: 10 !important; }
.ppc-form-root .signup-form-wrapper,
body > .ppc-form-popup .signup-form-wrapper { position: relative; z-index: 1; overflow: visible !important; }
.ppc-form-root .intgrtn-input-holder-phone,
.ppc-form-root .iti.iti--allow-dropdown,
body > .ppc-form-popup .intgrtn-input-holder-phone,
body > .ppc-form-popup .iti.iti--allow-dropdown { overflow: visible !important; }

/* ----- Spinner overlay ----- */
.ppc-form-root .ppc-form-wrapper,
body > .ppc-form-popup .ppc-form-wrapper { position: relative; }
.ppc-form-root .ppc-form-spinner,
body > .ppc-form-popup .ppc-form-spinner {
	position: absolute;
	inset: 0;
	z-index: 5;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 12px;
	background-color: rgba(255, 255, 255, 0.92);
	border-radius: 12px;
	backdrop-filter: blur(2px);
}
.ppc-form-root .ppc-form-lds-roller,
body > .ppc-form-popup .ppc-form-lds-roller { display: inline-block; position: relative; width: 64px; height: 64px; }
.ppc-form-root .ppc-form-lds-roller div,
body > .ppc-form-popup .ppc-form-lds-roller div {
	animation: ppc-form-lds-roller 1.2s cubic-bezier(0.5,0,0.5,1) infinite;
	transform-origin: 32px 32px;
}
.ppc-form-root .ppc-form-lds-roller div:after,
body > .ppc-form-popup .ppc-form-lds-roller div:after {
	content: " ";
	display: block;
	position: absolute;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: #2563eb;
	margin: -3px 0 0 -3px;
}
.ppc-form-root .ppc-form-lds-roller div:nth-child(1),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(1) { animation-delay: -36ms; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(1):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(1):after { top: 50px; left: 50px; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(2),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(2) { animation-delay: -72ms; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(2):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(2):after { top: 54px; left: 45px; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(3),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(3) { animation-delay: -108ms; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(3):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(3):after { top: 57px; left: 38px; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(4),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(4) { animation-delay: -144ms; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(4):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(4):after { top: 58px; left: 32px; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(5),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(5) { animation-delay: -0.18s; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(5):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(5):after { top: 57px; left: 25px; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(6),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(6) { animation-delay: -216ms; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(6):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(6):after { top: 54px; left: 19px; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(7),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(7) { animation-delay: -252ms; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(7):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(7):after { top: 50px; left: 14px; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(8),
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(8) { animation-delay: -288ms; }
.ppc-form-root .ppc-form-lds-roller div:nth-child(8):after,
body > .ppc-form-popup .ppc-form-lds-roller div:nth-child(8):after { top: 45px; left: 10px; }
@keyframes ppc-form-lds-roller {
	0% { transform: rotate(0); }
	100% { transform: rotate(360deg); }
}
.ppc-form-root .ppc-form-spinner-text,
body > .ppc-form-popup .ppc-form-spinner-text {
	color: #6b7280;
	font-size: 14px;
	font-weight: 500;
}

/* Message box */
.ppc-form-root .ppc-form-message,
body > .ppc-form-popup .ppc-form-message {
	padding: 12px 16px;
	border-radius: 8px;
	margin-bottom: 12px;
	text-align: center;
	font-size: 14px;
	font-weight: 500;
}

/* ----- Responsive ----- */
@media (max-width: 480px) {
	.ppc-form-root .ppc-form-popup-inner,
	body > .ppc-form-popup .ppc-form-popup-inner {
		padding: 24px 20px 20px;
		border-radius: 12px;
	}
	.ppc-form-root .ppc-form-heading,
	body > .ppc-form-popup .ppc-form-heading {
		font-size: 19px;
	}
	.ppc-form-root .ppc-form-trigger-btn {
		padding: 14px 24px;
		font-size: 15px;
	}
}
