.ubuntu-light {
	font-family: "Ubuntu", sans-serif;
	font-weight: 300;
	font-style: normal;
}

.ubuntu-regular {
	font-family: "Ubuntu", sans-serif;
	font-weight: 400;
	font-style: normal;
}

.ubuntu-medium {
	font-family: "Ubuntu", sans-serif;
	font-weight: 500;
	font-style: normal;
}

.ubuntu-bold {
	font-family: "Ubuntu", sans-serif;
	font-weight: 700;
	font-style: normal;
}

.ubuntu-light-italic {
	font-family: "Ubuntu", sans-serif;
	font-weight: 300;
	font-style: italic;
}

.ubuntu-regular-italic {
	font-family: "Ubuntu", sans-serif;
	font-weight: 400;
	font-style: italic;
}

.ubuntu-medium-italic {
	font-family: "Ubuntu", sans-serif;
	font-weight: 500;
	font-style: italic;
}

.ubuntu-bold-italic {
	font-family: "Ubuntu", sans-serif;
	font-weight: 700;
	font-style: italic;
}







.row {
	margin: auto;
}

.navbar-dark {
	/*background-color: #01579B !important;*/
	background-color: #0072bc !important;
}

.navbar-dark .navbar-nav .nav-link {
	color: rgba(255, 255, 255, .7);
}

#intro {
	padding: 0px;
	margin: 0px;
	padding-top: 50px;
	background: #0086DD;
	background: -webkit-linear-gradient(to top, #0086DD, #0072bc);
	background: linear-gradient(to top, #0086DD, #0072bc);


}

#intro_text,
#api_text,
#bulk_text {
	padding: 30px;
	padding-top: 60px;
	text-align: center;
	/*background-color: #0072bc;*/
	background: linear-gradient(90deg, #0072BC, #0180D2, #0180D2);
	border-radius: 20px;
	box-shadow: 0px 20px 16px rgb(180, 180, 180);
	color: rgb(200, 200, 200) !important;
}

#api_text,
#bulk_text {
	padding-top: 15px;
	color: rgb(240, 240, 240) !important;
}

#intro_text h1 {
	text-align: center;
	padding: 30px;
	font-size: 50px;
	color: rgb(245, 245, 245);
}

#intro_text p {
	text-align: center;
	padding: 30px;
	font-size: 20px;
}

#intro_text a {
	margin: 20px;
	padding: 20px;
	min-width: 50%;
}


#about p {
	padding: 30px;
	font-size: 18px;
}

#features {
	padding-top: 50px;
	padding-bottom: 100px;
}

.card_icon {
	text-align: center;
}

.card_icon img {
	max-width: 80px;
	margin: auto;
}

.card_title {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	padding: 5px;
}

.card_text {
	text-align: center;
	padding: 5px;
}

#pricing {
	/*
	background-image: url('../img/pricing_bg.png');
	background-size: cover;
	*/
}

.pricing_container {
	padding-top: 50px;
	padding-bottom: 50px;
	background-color: #f8f9fa;
	color: rgb(240, 240, 240);
}

.pricing_card {
	margin: 0px;
	background-color: #fff;
	border-radius: 15px;
	cursor: pointer;
	box-shadow: 8px 10px 16px rgb(200, 200, 200);
}

.pricing_title {
	font-weight: bold;
	font-size: 18px;
	text-align: center;
	padding: 15px;
	color: #B3E5FC;
	background-color: #0072BC;
	border-bottom: 0px solid #0072BC;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

.pricing_price {
	font-weight: bold;
	font-size: 40px;
	padding: 15px;
	text-align: center;
	color: #0072BC;
}

.pricing_features {
	color: rgb(30, 30, 30);
	padding: 5px;
	padding-left: 15px;
	min-height: 500px;
	width: 100%;
}

.pricing_features p {
	text-align: center;
}

.pricing_features ul {
	list-style: none;
}

.pricing_features ul li {
	position: relative;
	left: -40px;
	line-height: 3;
	font-size: 12.5px;
}

.pricing_features ul li i {
	color: #0091EA;
}


.price {
	padding: 10px;
	border-radius: 20px;
	background-color: #def2ff;
	width: 100%;

}

.pricing_button {
	text-align: center;
	background-color: #0072BC;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}

.pricing_button a,
.pricing_button .btn {
	padding: 15px;
	color: rgb(200, 200, 200);
	width: 100%;
}

.pricing_button form {
	padding-top: 10px;
}

.pricing_button a:hover,
.pricing_button .btn:hover {
	color: #fff;
	font-weight: bold;
	font-size: 18px;
	transition: all 1s ease;
}

#footer {
	padding: 30px;
	padding-top: 50px;
	padding-bottom: 50px;
	background-color: #333;
	/*background-color: #0072bc;*/
	background: linear-gradient(to top, #0072BC, #0072BC);
	color: rgb(230, 230, 230);
}

#footer p,
#footer a {
	color: rgb(230, 230, 230);
}

.social_icons {
	color: rgb(200, 200, 200);
	font-size: 25px;
	margin: 10px;
}

.social_icons:hover {
	color: rgb(255, 255, 255);
	text-decoration: none;
}

.footer_links {
	margin: 15px;
	color: rgb(200, 200, 200);
}

.footer_links:hover {
	color: rgb(255, 255, 255);
	text-decoration: none;
}

.footer_bottom {
	padding-top: 30px;
}

#registration,
#login,
#forgoted {
	padding: 15px;
	padding-top: 150px;
	padding-bottom: 150px;
	min-height: 90vh;
}

#email_extractor {
	padding: 15px;
	padding-top: 50px;
	padding-bottom: 150px;
	min-height: 90vh;
}

.email_extractor_form,
.email_extracted_form {
	background-color: rgb(255, 255, 255);
	box-shadow: 10px 10px 16px rgb(200, 200, 200);
	border-radius: 15px;
	margin-bottom: 50px;

}

.extrct_btn_container {
	background: linear-gradient(to top, #0072bc, #039BE5);
	padding: 15px;
	border-radius: 15px;
	border-top-right-radius: 0px;
	border-top-left-radius: 0px;
}

.form_extrator_title,
.form_extrated_title {
	border-radius: 15px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	max-width: 80%;
	padding: 15px;
	background: linear-gradient(to top right, #0072bc, #039BE5);
	margin: 0px auto;
	margin-top: -15px;
	color: #fff;
}

#dashboard {
	padding: 15px;
	padding-top: 50px;
	padding-bottom: 100px;
	min-height: 90vh;
}

#api_container {
	min-height: 90vh;
}

.registration_container {
	margin: 30px;
	/*border: 2px solid #01579B;*/
	padding: 30px;
	border-radius: 15px;
	background-color: #fff;
	box-shadow: 0px 0px 16px rgb(200, 200, 200);
}

.btn_submit {
	background-color: #0072bc;
	/*background-image: linear-gradient(to top right, #0072bc, #00c4ff)!important;*/
	background: linear-gradient(to top right, #0072bc, #0288D1) !important;
	color: rgb(240, 240, 240);
	padding: 20px;
	border: 0px;
	transition: all 1s ease;
}

.btn_submit:hover {
	background-color: #01579B;
	background: linear-gradient(to top right, #0091EA, #00B0FF) !important;
	color: rgb(255, 255, 255);

}

.btn_login {
	background-color: #00BFA5;
	color: rgb(255, 255, 255);
	padding: 15px;
}

.btn_login:hover {
	background-color: #1DE9B6;

}

.dashboard_card {
	margin: 0px;
	margin-top: 10px;
	padding: 5px;
	text-align: center;
	background-color: #01579B;
	color: rgb(200, 200, 200);
	border-radius: 5px;
	cursor: pointer;
}

.dashboard_card:hover {
	background-color: #0288D1;
	color: rgb(255, 255, 255);
}

.db_card_icon {
	text-align: center;
	font-size: 18px;
	padding: 5px;
}

.db_card_text {
	text-align: center;
	font-weight: bold;
	font-size: 12px;
}

.chat_container {
	padding: 15px;
}

.chat_container canvas {
	border: 2px solid #01579B;
	border-radius: 5px;
	margin-top: 20px;
}


.btn-submit {
	margin: 15px;
	/*background-color: #01579B;*/
	background: linear-gradient(to top right, #0072bc, #0288D1) !important;
	color: rgb(245, 245, 245);

}

.btn-submit:hover {
	background-color: #01579B;
	color: rgb(255, 255, 255);

}

.stat_container {
	padding: 15px;

	/*background-color: #0091EA;*/
	background-color: #fff;

	margin: 15px;

	color: rgb(80, 80, 80);
	font-weight: bold;
	border-radius: 20px;
	border-left: 6px solid #0091EA;
	border-right: 6px solid #0091EA;
	box-shadow: 5px 15px 16px rgb(150, 150, 150);

	border-bottom-right-radius: 80px;
	border-bottom-left-radius: 80px;
	text-align: center;
}

.stat_container i {
	width: 70px;
	padding: 15px;
	border-radius: 50%;
	background-color: #0091EA;
}

.stat_container .stat_number {
	font-size: 20px;
	font-weight: bold;
	color: #1565C0;
}

.stat_container:hover {
	/*background-color: #00B0FF;*/
}

.stat_container1 {
	padding: 15px;
	padding-bottom: 30px;
	background-color: #0091EA;
	margin: 15px;
	color: rgb(255, 255, 255);
	border-radius: 20px;
	box-shadow: 5px 15px 16px rgb(150, 150, 150);

	border-top-right-radius: 50%;
	border-top-left-radius: 50%;

}

.stat_container1 i {
	padding: 20px;
	border-radius: 50%;

	/*color: #1565C0 ;*/
	color: #fff;
}

.stat_container_containre {
	border-radius: 20px;
	margin: 5px;
	margin-bottom: 20px;
	background-color: #fff;
	box-shadow: 10px 10px 16px rgb(150, 150, 150);
	padding-top: 30px;
	padding-bottom: 30px;
}

.stat_container2_containre {
	border-radius: 20px;
	margin: 5px;
	margin-bottom: 20px;
	background-color: #fff;
	box-shadow: 10px 10px 16px rgb(150, 150, 150);
}

.stat_container2 {
	padding: 15px;
	margin: 15px;
	border-radius: 20px;
	/*background-color: #0091EA;*/
	background-color: #fff;
	border: 1px solid rgb(150, 150, 150);
	color: rgb(100, 100, 100);
	font-weight: bold;
	text-align: center;
}

.profile-form-container {
	padding: 15px;
	/*border: 2px solid #01579B;*/
	background-color: #fff;
	border-radius: 5px;
	margin-top: 40px;
	margin-bottom: 60px;

	box-shadow: 10px 10px 16px rgb(200, 200, 200);
}

.profile_title {
	position: relative;
	/*background-color: #01579B;*/
	background: linear-gradient(to top right, #0072bc, #039BE5);
	padding: 15px;
	line-height: 1;
	color: rgb(255, 255, 255);
	top: -40px;
	width: 50%;
	border-radius: 15px;
	margin: auto;
	min-width: 80%;
}

.terms_section {
	color: rgb(20, 20, 20);
	padding-top: 50px;
	padding-bottom: 50px;
	line-height: 2;
	text-align: justify-all;
}


.code_area {
	padding: 15px;
	background-color: #263238;
	color: #64DD17;
	width: 100%;
}

#coupon_section {
	padding-top: 60px;
	padding-bottom: 60px;
	text-align: center;
}

.coupon_form {
	padding: 15px;
	background-color: #01579B;
	border-radius: 15px;
}

#bulk_verification_section {}

.card_list {
	margin-bottom: 15px;
	padding: 15px;
	background-color: #fff;
	border-radius: 5px;
	color: rgb(240, 240, 240);
	box-shadow: 10px 10px 16px rgb(200, 200, 200);
}

.card_list h5 {
	/*background-color: #0277BD;*/
	background: linear-gradient(to top right, #0072bc, #039BE5);
	padding: 15px;
	text-align: center;
	border-radius: 5px;
}

.progress_bar {
	background: linear-gradient(to top right, #fff, #fff);
}

#existing,
#not_existing,
#network_error,
#phishing_suspect {
	height: 250px;
	overflow-y: auto;
	background-color: rgb(240, 240, 240);
	color: rgb(40, 40, 40);
	text-align: left;
	padding-left: 3px;
}

#exist_emails,
#not_exist_emails,
#network_error_emails,
#phishing_emails {
	padding-top: 10px;

}

#checkout_result {
	min-height: 400px;
	text-align: center;
	padding-top: 80px;
	font-size: 17px;
	line-height: 3;
}

#checkout_result .alert {
	border: 0px;
}

#checkout_result h1 {
	font-size: 50px;
}

#api_container {
	line-height: 2;
}

.side_a {
	text-decoration: none !important;
	color: rgb(50, 50, 50);
}

#exist_emails li,
#not_exist_emails li,
#network_error_emails li {
	position: relative;
	left: -30px;
}

#graphic1,
#integrations_sec {
	text-align: center;

	padding-top: 40px;
	padding-bottom: 40px;

	background-color: #fff;

}

h1 {
	color: #0072bc;
}

.stat_section {
	padding-top: 40px;
	padding-bottom: 40px;
	background-color: rgb(240, 240, 240);
}

.istat_container {
	text-align: center !important;
}

.istat_img {
	position: relative;
	width: 100px;
	margin: auto !important;
}

.istat_title {
	padding-top: 20px;
	padding-bottom: 20px;

}




.center {
	text-align: center;
	margin: auto;
}

.pagination {
	display: inline-block;
	cursor: pointer;
}

.pagination a {
	color: rgb(80, 80, 80) !important;
	float: left;
	padding: 8px 16px;
	text-decoration: none;
	margin: 5px;
}

.pagination a.active {
	background-color: #263238;
	color: rgb(250, 250, 250) !important;
	border-radius: 5px;
}

.pagination a:hover:not(.active) {
	background-color: rgb(120, 120, 120);
	color: rgb(230, 230, 230) !important;
	border-radius: 5px;
}


/************************
Color section
**************************/
/* Basic styling for the dropdown menu */
.dropdown-menu {
	width: auto;
	/* Allows the dropdown to size dynamically */
	max-width: 60vw;
	/* Ensures it doesn’t exceed 90% of the viewport width */
	min-width: 500px;
	/* Set a minimum width for smaller screens */
	padding: 10px;
	/* Add padding for a cleaner look */
	box-sizing: border-box;
	/* Ensures padding is included in width calculation */

	overflow-x: hidden;
}

.dropdown-menu td {
	white-space: normal;
	/* Allows text to wrap */
	overflow-wrap: break-word;
	/* Breaks long words */
}

#modal_lists .modal-dialog {
	max-width: 80%;
}

.modal-dialog-70 {
	max-width: 70%;
}


.text-description {
	color: #002244;
	font-size: 26px !important;
	line-height: 2;
	text-align: center;
}

.features_card1,
.features_card2,
.features_card3,
.features_card4,
.features_card5,
.features_card6 {
	padding: 15px;
	/*background-color: #0072bc;*/
	background: linear-gradient(90deg, #0072BC, #0180D2, #0180D2);
	margin: 0px;
	border-radius: 50%;
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
	box-shadow: 6px 5px 16px rgb(180, 180, 180);
	height: 250px;
	color: rgb(240, 240, 240);
}

.features_card1 {
	margin-top: -70px;
}

.features_card2 {
	margin-top: 0px;
}

.features_card3 {
	margin-top: 70px;
}

.features_card4 {
	margin-top: 0px;
}

.features_card5 {
	margin-top: 70px;
}

.features_card6 {
	margin-top: 140px;
}


.features_card:hover {
	/*background-color: #B3E5FC;*/
}


#notif_container,
.nav_drpdwn {

	max-height: 50vh;
	overflow-y: auto;
	text-align: center;
	border-radius: 15px;
}

/* Additional styling for smaller screens */
@media (max-width: 768px) {
	.dropdown-menu {
		max-width: 80vw;
		/* Limit width to 80% of viewport on smaller devices */
	}

	#modal_lists .modal-dialog {
		max-width: 90%;
	}

	.text-description {
		color: #002244;
		font-size: 18px;
	}


	.features_card1,
	.features_card2,
	.features_card3,
	.features_card4,
	.features_card5,
	.features_card6 {
		margin-bottom: 30px;
		margin-top: 0px;
	}

	.modal-dialog-70 {
		max-width: 90%;
	}
}

/* Additional styling for extra small screens */
@media (max-width: 480px) {
	.dropdown-menu {
		width: 100%;
		/* Full width on very small screens */
		max-width: none;
		/* Remove max-width constraint */
	}

	#modal_lists .modal-dialog {
		max-width: 100%;
	}

	.text-description {
		color: #002244;
		font-size: 16px;
	}

	.features_card1,
	.features_card2,
	.features_card3,
	.features_card4,
	.features_card5,
	.features_card6 {
		margin-bottom: 30px;
		margin-top: 0px;
	}

	.modal-dialog-70 {
		max-width: 100%;
	}

	#notif_container,
	.nav_drpdwn {
		min-width: 100%;
		max-width: 100%;
		width: 100%;
	}
}

body {
	font-family: Merriweather;
	background-color: rgba(235, 235, 235, .9);
}

.big_title {
	color: rgb(255, 255, 255);
	font-size: 50px !important;
}

.slogan {
	color: rgb(235, 235, 235);
	/*color: #002244 ;*/
	font-size: 18px;
	text-align: justify-all;
	line-height: 2;
}

.btn,
.close,
input,
button {
	box-shadow: unset !important;
	border-radius: 7px;
	border: 0px;
}

.btn {
	/*box-shadow: 2px 4px 6px rgb(200,200,200) !important;*/
}

.btn-warning {
	background-color: #E65100;
	color: #fff;
	border: 0px;
}

.btn.btn-warning:hover,
.btn.btn-warning:focus,
.btn.btn-warning:active {
	background-color: #FF6D00 !important;
	border: 0px;
}

.btn:hover,
.btn:focus,
.btn:active {
	color: rgb(220, 220, 220) !important;
	border: 0px;
}

button.close:focus,
button.close:active {
	border: 0px !important;
	box-shadow: unset !important;
}

.btn-primary {
	background-color: #3B71CA !important;
	border-color: transparent;
	color: rgb(240, 240, 240);
}

.btn-secondary {
	background-color: #4F4F4F !important;
	border-color: transparent;
	color: rgb(240, 240, 240);
}

.btn-success {
	background-color: #00796B !important;
	border-color: transparent;
	color: rgb(240, 240, 240);
}

.bg-success {
	background-color: #00BFA5 !important;
}

.btn-danger {
	background-color: #B71C1C !important;
}



.bg-primary {
	background-color: #1565C0 !important;
}

.bg-dark {
	background-color: #262626 !important;
}

.btn-login {
	background-color: #80D8FF;
}


.charts_container {
	background-color: rgb(255, 255, 255);
	border-radius: 15px;
	box-shadow: 10px 10px 16px rgb(200, 200, 200);
}

table {
	width: 100%;
}

th {
	font-size: 13px;
}


.modal-header {
	border: 0px;
	padding: 10px;
	padding-bottom: 0px;
	/*background-color: #3B71CA;*/
	background: linear-gradient(to top right, #0072bc, #039BE5);
}

.modal-title {
	color: rgb(240, 240, 240);
}

.close,
.close:focus,
.close:active,
.close:hover {
	text-shadow: unset !important;
	box-shadow: unset !important;
	border: none !important;
	outline: none !important;
	/* Remove the outline on focus */
}

.close:focus-visible {
	outline: none !important;
}

.modal-header .close {
	margin: 5px;
	margin-top: 2px;
	margin-bottom: 0px;
	padding: 5px;
}

button .close:focus {
	box-shadow: unset !important;
	border: 0px;
	outline: unset !important;
}

.nav-tabs {
	border: 0px;
}

.nav-tabs .nav-link {

	border-radius: 20px !important
}

.nav-tabs .nav-link.active {
	background-color: #fcfcfc !important;
	color: #002449 !important;
}

.nav-link {
	border: 0px !important;
	text-decoration: none;
	color: rgb(240, 240, 240);
}

.nav-link:hover {
	border: 0px !important;
	color: rgb(220, 220, 220);
}

.alert-success {
	/*background: linear-gradient(to top right, #B9F6CA, #aceabd);*/
	background-color: #64FFDA;
	border: 0px;
	border-top: 5px solid #00BFA5;

}

.alert-danger {
	background-color: #EF9A9A;
	border: 0px;
	border-top: 5px solid #B71C1C;
}

.alert-info {
	background-color: #B2EBF2;
	border: 0px;
	border-top: 5px solid #006064;
}

#back_integ {
	display: none;
}





.domain_form_container,
.domain-form-container {
	margin: 15px;
	padding: 15px;
	background-color: rgb(255, 255, 255);
	border-radius: 15px;
	box-shadow: 10px 10px 16px rgb(200, 200, 200);
}

.domain-form-container {
	padding: 15px;
	margin-top: 20px;
}

/*
.domain_fg_1{
	width: 70%;
}
.domain_fg_2{
	width: 30%;
}
*/

.form-inline .form-group input {
	padding: 10px;
	width: 100%;
	border-radius: 0px;
	border-bottom: 0px solid rgb(200, 200, 200);
}

.form-inline .form-group input:focus {
	outline: 0;
	border: 0px;
	box-shadow: unset;
	border-radius: 0px;
	transition: all 1s ease;

}

.domain-submit {
	margin: 0px;
	background-color: #01579B;
	color: rgb(200, 200, 200);

	border-radius: 10px !important;
}

.domain-submit:hover {
	color: rgb(255, 255, 255);
}









.fade-in {
	opacity: 0;
	animation: fadeIn 2s ease-in-out forwards;
}

.fade-top {
	position: relative;
	top: -500px;
	animation: fadetop 0.8s ease-in-out forwards;
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes fadetop {
	from {
		top: -500px;
	}

	to {
		top: 0px;
	}
}


.fade-box {
	position: relative;
	animation: fade-in-out 2s infinite;
	/* Apply animation */
}

/* Define keyframes for infinite fade effect */
@keyframes fade-in-out {

	0%,
	100% {
		opacity: 0.8;
		/* Fully transparent */
		top: -10px;
	}

	50% {
		opacity: 1;
		/* Fully visible */
		top: 0px;
	}
}

.integrations_card {
	background-color: #fff;
	border-radius: 15px;
	box-shadow: 10px 10px 16px rgb(200, 200, 200);
	background: linear-gradient(to top right, #0072bc, #039BE5);
	color: #fff;
	margin-bottom: 30px;
}

.integrations_platform {
	position: relative;
	padding: 15px;
	border-radius: 20px;
	border-top-right-radius: 0px;
	border-top-left-radius: 0px;
	background-color: #fff;
	top: 0px;
	max-width: 80%;
	margin: auto;
	max-height: 80px;
	/*background: linear-gradient(to top right, #0072bc, #039BE5);*/


}

.integrations_elements {
	padding: 15px;
	padding-bottom: 0px;
	text-align: left;
}

.integrations_ps {
	color: #0072bc;
}

.integrations_btns {
	padding: 15px;
	background-color: #fff;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
}





























.opts_cards {
	width: 100%;
	padding: 0px;
	border-radius: 15px;
	background-color: rgb(255, 255, 255);
	box-shadow: 10px 10px 16px rgb(230, 230, 230);
	cursor: pointer;

}

.opts_cards:hover {
	background-color: rgb(250, 250, 250);
}

.opts_title {
	padding: 15px;
	cursor: pointer;
}

.opts_image {
	padding: 15px;
	cursor: pointer;
	border-radius: 50%;
	background-color: #fff;
	min-height: 120px;
}

.opts_image img {
	margin: auto;
}

.check_optsc {
	padding: 15px;
	border-radius: 15px;
	background-color: transparent;
	color: rgb(80, 80, 80);
}

.form-check-input:not(:checked)~.check_optsc {
	padding: 15px;
	border-radius: 15px;
	background-color: transparent;
}

.form-check-input:not(:checked)+.check_optsc {
	padding: 15px;
	border-radius: 15px;
	background-color: transparent;
}

.form-check-input:checked~.check_optsc {
	color: #fff;
	padding: 15px;
	border-radius: 15px;
	background-color: #01579B;
}

.check_optsc_anim {
	color: rgb(80, 80, 80);
	background-image: -webkit-linear-gradient(45deg, #01579B 50%, transparent 50%);
	background-image: linear-gradient(45deg, #01579B 50%, transparent 50%);
	background-position: 100%;
	background-size: 400%;
	-webkit-transition: 600ms ease-in-out;
	transition: 600ms ease-in-out;
}

.check_optsc_anim:hover {
	color: #fff;
	background-position: 0;
}

















/* This makes the card the positioning parent for the badge */
.pricing_card {
	position: relative;
	overflow: hidden;
	/* This is key to creating the ribbon effect */
}

/* The Badge Design */
.best-value-badge {
	position: absolute;
	top: 20px;
	right: -30px;
	background: #28a745;
	/* A vibrant green for "value" */
	color: #fff;
	width: 140px;
	padding: 8px 0;
	text-align: center;
	font-size: 0.9rem;
	font-weight: bold;
	font-family: 'Ubuntu', sans-serif;
	/* To match your site's font */
	text-transform: uppercase;
	letter-spacing: 1px;
	transform: rotate(45deg);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
	z-index: 10;
}














/* AI Model Switcher Styles */
.ai-model-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 15px;
	margin-top: 10px;
}

.ai-model-card {
	position: relative;
	display: flex;
	align-items: center;
	border: 2px solid #e9ecef;
	border-radius: 10px;
	padding: 15px;
	cursor: pointer;
	transition: all 0.3s ease;
	background: #fff;
}

/* Hide the actual radio button */
.ai-model-card input[type="radio"] {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

/* Hover State */
.ai-model-card:hover {
	border-color: #adb5bd;
	transform: translateY(-2px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

/* Selected State */
.ai-model-card:has(input:checked),
.ai-model-card.active {
	/* Fallback for older browsers if needed */
	border-color: #007bff;
	/* Primary Color */
	background-color: #f8fbff;
	box-shadow: 0 0 0 1px #007bff;
}

.model-icon {
	font-size: 24px;
	margin-right: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background: #f1f3f5;
	border-radius: 8px;
	color: #495057;
}

.ai-model-card input:checked~.model-icon {
	background: #007bff;
	color: #fff;
}

.model-info {
	display: flex;
	flex-direction: column;
}

.model-name {
	font-weight: 700;
	font-size: 14px;
	color: #343a40;
}

.model-desc {
	font-size: 11px;
	color: #868e96;
	margin-top: 2px;
}

/* Optional: Add a 'Recommended' badge */
.badge-rec {
	position: absolute;
	top: -10px;
	right: 10px;
	background: #28a745;
	color: white;
	font-size: 10px;
	padding: 2px 6px;
	border-radius: 4px;
	font-weight: 600;
}