/*
|--------------------------------------------------------------------------
| Flashify Lead Popup
|--------------------------------------------------------------------------
*/

.flashify-lead-popup{
	position:fixed;
	inset:0;
	z-index:999999;
	display:none;
	align-items:center;
	justify-content:center;
	padding:20px;
	box-sizing:border-box;
}

.flashify-lead-popup.active{
	display:flex;
}

/*
|--------------------------------------------------------------------------
| Overlay
|--------------------------------------------------------------------------
*/

.flashify-lead-overlay{
	position:absolute;
	inset:0;
	background:rgba(0,0,0,.72);
	backdrop-filter:blur(8px);
	-webkit-backdrop-filter:blur(8px);
}

/*
|--------------------------------------------------------------------------
| Wrapper
|--------------------------------------------------------------------------
*/

.flashify-lead-wrapper{
	position:relative;
	width:100%;
	max-width:720px;
	background:#ffffff;
	border-radius:24px;
	padding:40px;
	box-shadow:0 30px 80px rgba(0,0,0,.25);
	z-index:2;
	overflow:visible;
}

/*
|--------------------------------------------------------------------------
| Close
|--------------------------------------------------------------------------
*/

.flashify-lead-close{
    position: absolute !important;
    top: 14px !important;
    right: 14px !important;
    display: grid !important;
    width: 38px !important;
    height: 38px !important;
    place-items: center !important;
    padding: 0 !important;
    color: #FFFFFF !important;
   background: #0e3a5c !important;
    border: 0 !important;
    border-radius: 50% !important;
    font-size: 24px !important;
    line-height: 1 !important;
    cursor: pointer !important;
}

.flashify-lead-close:hover{
	background:#0A6BFF;
	color:#fff;
}
 .flashify-lead-close:hover{ background: var(--nca-blue); transform: rotate(90deg); }
 .flashify-lead-close:hoverfocus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
  }
/*
|--------------------------------------------------------------------------
| Header
|--------------------------------------------------------------------------
*/

.flashify-lead-header{
	margin-bottom:30px;
}

.flashify-lead-tag{
	display:inline-flex;
	align-items:center;
	padding:8px 16px;
	background:#EAF3FF;
	color:#0A6BFF;
	border-radius:999px;
	font-size:13px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	margin-bottom:18px;
}

.flashify-lead-title-row{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:20px;
	flex-wrap:wrap;
	margin-bottom:18px;
}

.flashify-lead-title-row h2{
	margin:0;
	font-size:38px;
	font-weight:700;
	line-height:1.2;
	color:#0F172A;
}

.flashify-coupon-code{
	padding:10px 18px;
	border-radius:12px;
	background:#08a9ca;
	color:#fff;
	font-size:15px;
	font-weight:700;
	white-space:nowrap;
	width:40%;
	text-align:center;
}

.flashify-lead-header p{
	margin:0;
	font-size:16px;
	line-height:1.7;
	color:#6B7280;
	max-width:560px;
}

/*
|--------------------------------------------------------------------------
| Form
|--------------------------------------------------------------------------
*/

.flashify-row{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:20px;
	margin-bottom:25px;
}

.flashify-field label{
	display:block;
	margin-bottom:10px;
	font-size:14px;
	font-weight:600;
	color:#111827;
}

.flashify-field label span{
	color:#E11D48;
}

.flashify-field input{
	width:100%;
	height:58px;
	padding:0 18px;
	border:1px solid #D9DEE6;
	border-radius:14px;
	font-size:16px;
	background:#fff;
	transition:.25s;
	box-sizing:border-box;
}

.flashify-field input:focus{
	outline:none;
	border-color:#0A6BFF;
	box-shadow:0 0 0 4px rgba(10,107,255,.12);
}

/*
|--------------------------------------------------------------------------
| ITI
|--------------------------------------------------------------------------
*/

.iti{

	width:100%;

}

.iti__country-container{

	z-index:999999;

}

.iti__dropdown-content,
.iti__country-list{

	z-index:999999 !important;
	 position:absolute;
	width: 308px !important;
}

/*
|--------------------------------------------------------------------------
| Button
|--------------------------------------------------------------------------
*/

.flashify-claim-button{
	width:100% !important;
	height:58px !important;
	border:none !important;
	border-radius:14px !important;
	background:#08a9ca !important;
	color:#fff !important;
	font-size:17px !important;
	font-weight:700 !important;
	cursor:pointer !important;
	transition:.25s !important;
}

.flashify-claim-button:hover{
	       background: #0E3A5C;
			border-color: #0E3A5C;
}

.flashify-claim-button:disabled{
	opacity:.65 !important;
	cursor:not-allowed !important;
}

/*
|--------------------------------------------------------------------------
| Messages
|--------------------------------------------------------------------------
*/

.flashify-lead-message{
	display:none;
	margin-bottom:20px;
	padding:14px 18px;
	border-radius:12px;
	font-size:15px;
	font-weight:500;
}

.flashify-lead-message.success{
	display:block;
	background:#E9F9EE;
	color:#118D42;
}

.flashify-lead-message.error{
	display:block;
	background:#FCECEC;
	color:#D92D20;
}

/*
|--------------------------------------------------------------------------
| Loading
|--------------------------------------------------------------------------
*/

.flashify-claim-button.loading{
	position:relative;
	color:transparent;
}

.flashify-claim-button.loading:after{
	content:"";
	position:absolute;
	left:50%;
	top:50%;
	width:20px;
	height:20px;
	margin-left:-10px;
	margin-top:-10px;
	border:2px solid rgba(255,255,255,.35);
	border-top-color:#fff;
	border-radius:50%;
	animation:flashify-spin .8s linear infinite;
}

@keyframes flashify-spin{

	from{
		transform:rotate(0deg);
	}

	to{
		transform:rotate(360deg);
	}

}
input#flashify-phone {
    border-radius: 10px !important;
   
}
input#flashify-email {
    border-radius: 10px !important;
}
/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width:768px){

	.flashify-lead-wrapper{
		padding:30px 22px;
		border-radius:20px;
	}

	.flashify-row{
		grid-template-columns:1fr;
		gap:18px;
	}

	.flashify-lead-title-row{
		flex-direction:column;
		align-items:flex-start;
	}

	.flashify-lead-title-row h2{
		font-size:28px;
	}

	.flashify-coupon-code{
		font-size:14px;
	}

	.flashify-lead-header p{
		font-size:15px;
	}

}