html,
body {
	overflow-x: hidden;
	height: 100%;
}
body {
	font-family: "Figtree", sans-serif;
	font-size: 1rem;
	font-weight: 400;
	line-height: 1.5;
	color: #212529;
	text-align: left;
	background-color: #fff;
}

a {
	color: #1742f5;
	text-decoration: none;
}

section {
	padding: 1.5rem;
}

.container-fluid {
	padding-left: 0;
	padding-right: 0;
}

.section-header {
	color: #1742f5;
	text-transform: uppercase;
	font-weight: 600;
	font-size: 2rem;
}

/* Start custom styles -JD */
.section-title {
	color: #1742f5;
	font-weight: 600;
	font-size: 1.5rem;
}
.custom-hr {
	height: 1.3px;
	color: #1742f5;
	background-color: #1742f5;
	margin: 0.5rem 0;
	opacity: 1;
}
.light-background {
	background-color: #f4f4f4;
}

/* Accordion */
.accordion_one h4 {
	font-size: 21px;
	line-height: 24px;
}
.accordion_one p {
	margin-top: 1rem;
}
.accordion_one .accordion .accordion-item button.collapsed {
	display: block;
	padding: 12px 30px;
	border: none;
	background: #f4f4f4;
	/* background: linear-gradient(45deg, rgba(0, 105, 170, 1) 20%, #0098d6 100%); */
	background: linear-gradient(to right, #1742f5, #070d63);
	color: #fff;
	margin-bottom: 10px;
	height: 48px;
	border-radius: 0.25rem;
	box-shadow: none;
}
.accordion_one .accordion .accordion-item button {
	display: block;
	padding: 12px 30px;
	background: linear-gradient(26deg, #070d63 30%, #1742f5);
	/* background: linear-gradient(26deg, #04325b 30%, #17a2b8c4); */
	/* background-image: linear-gradient(51deg, #0069AA, #17a2b8bf ); */
	color: #fff;
	height: 48px;
	border-radius: 0.25rem;
	border: none;
	box-shadow: none;
}
.accordion-item {
	border: 0;
}
.accordion-body {
	padding: 1rem;
	/*z-index: 2;*/
	color: #212529;
	border-bottom-right-radius: 0.25rem;
	border-bottom-left-radius: 0.25rem;
	margin-bottom: 10px;
	background: #fff;
	border: 1px solid silver;
}

.accordion_one .accordion-item button:after,
.accordion_one .accordion .accordion-item button.collapsed:after {
	font-family: "FontAwesome";
	font-size: 15px;
	width: 36px;
	height: 48px;
	line-height: 48px;
	text-align: center;
	background: #f1f1f1;
	float: left;
	margin-left: -31px;
	margin-top: -12px;
	margin-right: 15px;
	color: #000000;
	border: 1px solid silver;
}
.accordion_one .accordion .accordion-item button:after {
	content: "\2212";
}
.accordion_one .accordion .accordion-item button.collapsed:after {
	content: "\2b";
}
/* End custom styles -JD */

.section-divider {
	border: 1.5px solid #0069aa;
	opacity: 0.5 !important;
}

.navbar {
	background-color: white;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	padding: 0;
	height: 70px;
}

/* Mobile navbar background */
@media (max-width: 991.98px) {
	.navbar-collapse {
		background-color: #fff;
		margin-top: 0.5rem;
		padding: 0.5rem 0;
		border-radius: 0.375rem;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	}
}

.nav-link {
	color: #333;
	font-weight: 500;
	padding: 0.5rem 1rem;
}

.nav-link:hover {
	color: #0069aa;
}

.jumbotron {
	/* margin-top: 70px; */
	background-size: contain !important;
	background-repeat: no-repeat !important;
	background-position: 95% !important;
	color: #fff;
	aspect-ratio: 16 / 3;
	/* min-height: 350px; */
}

.header-content {
	display: flex;
	height: 100%;
	align-items: center;
}

.header-content a {
	color: #fff !important;
	/* font-style: italic; */
}

/* Back to top button */
#back-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	display: none;
	padding-top: 15px;
	padding: 11px 0;
	background: #fff;
	border: 1px solid #1742f5;
	color: #1742f5;
}
#back-to-top:hover {
	background: #1742f5;
	color: #fff;
	transition: 0.15s ease-in-out;
}

/* Certifications Page Enhanced Styles */
.certification-banner {
	position: relative;
	overflow: hidden;
}

/* .certification-banner::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(
		135deg,
		rgba(0, 40, 85, 0.8),
		rgba(0, 99, 163, 0.6)
	);
	z-index: 1;
} */

.certification-banner .container {
	z-index: 2;
	position: relative;
}

.filter-section {
	border-radius: 12px !important;
	border: 1px solid #e3e6f0;
	background: white;
}

.filter-section .filter-header {
	border-bottom: 2px solid #f1f3f4;
	padding-bottom: 1rem;
}

.form-check-input:checked {
	background-color: #0069aa;
	border-color: #0069aa;
}

.form-check-label {
	cursor: pointer;
	transition: color 0.2s ease;
}

.form-check-label:hover {
	color: #0069aa !important;
}

/* Level Color Classes */
.level-bronze {
	background: linear-gradient(135deg, #cd7f32, #b8860b);
	border-color: #b8860b;
}

.level-silver {
	background: linear-gradient(135deg, #c0c0c0, #a8a8a8);
	border-color: #a8a8a8;
}

.level-gold {
	background: linear-gradient(135deg, #ffd700, #ffa500);
	border-color: #ffa500;
}

.level-default {
	background: linear-gradient(135deg, #6c757d, #5a6268);
	border-color: #5a6268;
}

/* Level Badge Mini */
.level-badge-mini {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	border: 2px solid rgba(255, 255, 255, 0.5);
}

.level-badge {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
}

.level-essentials {
	background-color: #cd7f32;
}

.level-practitioner {
	background-color: #c0c0c0;
}

.level-mastery {
	background-color: #ffd700;
}

/* Certification Cards */
.certification-card {
	transition: all 0.3s ease;
	border-radius: 12px !important;
}

.hover-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important;
}

.certification-card .card-header {
	border-radius: 12px 12px 0 0 !important;
	border: none;
}

.certification-card .card-body {
	border-radius: 0 0 12px 12px;
}

.product-tag .badge {
	font-size: 0.75rem;
	border-radius: 20px;
}

.certification-card .btn {
	border-radius: 8px;
	transition: all 0.2s ease;
}

.certification-card .btn:hover {
	transform: translateY(-1px);
}

/* Results Header */
.results-header {
	background: white;
	padding: 1.5rem;
	border-radius: 12px;
	border: 1px solid #e3e6f0;
	margin-bottom: 2rem;
}

/* Search Input Styling */
.search-container .input-group-text {
	border-radius: 8px 0 0 8px;
}

.search-container .form-control {
	border-radius: 8px;
}

.search-container .form-control:focus {
	border-color: #0069aa;
	box-shadow: 0 0 0 0.2rem rgba(0, 105, 170, 0.25);
}

/* Loading Animation */
#loader {
	padding: 3rem 0;
}

#loader .spinner-border {
	border-width: 3px;
}

.search-container {
	max-width: 100%;
	margin-bottom: 1rem;
}

.search-and-header .search-container {
	margin-bottom: 1rem;
}

.search-and-header .input-group {
	width: 100%;
	max-width: none;
}

.filter-group {
	margin-bottom: 20px;
}

.filter-head {
	font-size: 18px;
	font-weight: 700;
	margin: 2rem 0 0.85rem 0;
}

.header-hr {
	height: 1.3px;
	color: #1742f5;
	background-color: #1742f5;
	border: 0;
	margin: 0.5rem 0;
	opacity: 1;
}

.exam-header {
	color: #1742f5;
	font-weight: 600;
	font-size: 1.5rem;
}

.chev-img {
	width: 40px;
	height: 40px;
	opacity: 0.8;
}

.content p {
	font-size: 1.1rem;
}

/* Mobile navbar background */
@media (max-width: 991.98px) {
	.navbar-collapse {
		background-color: #fff;
		margin-top: 0.5rem;
		padding: 0.5rem 0;
		border-radius: 0.375rem;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	}
}
/* Certification Page Responsive Styles */
@media (max-width: 768px) {
	.certification-banner {
		min-height: 150px !important;
	}

	.certification-banner h1 {
		font-size: 2rem !important;
	}

	.filter-section {
		margin-bottom: 2rem;
	}

	.results-header {
		text-align: center;
	}

	.results-header .d-flex {
		flex-direction: column !important;
	}

	.results-header #results-count {
		margin-top: 1rem;
		align-self: center;
	}

	.search-and-header .input-group {
		max-width: 100%;
	}
}

@media (max-width: 576px) {
	.navbar-brand img {
		width: 100px;
	}
	.jumbotron {
		padding-top: 1.5rem;
	}
	.banner-image {
		padding-bottom: 1.5rem;
	}

	.certification-card .row.g-2 {
		--bs-gutter-x: 0.5rem;
	}

	.certification-card .btn-sm {
		font-size: 0.75rem;
		padding: 0.375rem 0.5rem;
	}
}

/* Badge overlay for jumbotron -JD */
.badge-overlay {
	position: absolute;
	bottom: 5px;
	right: 130px;
	z-index: 10;
}

.badge-overlay-img {
	max-height: 140px;
	height: auto;
	transition: opacity 0.3s ease;
	filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

.badge-overlay-img:hover {
	opacity: 1;
}

/* Responsive badge overlay for mobile only */
@media (max-width: 768px) {
	.badge-overlay {
		bottom: 5px;
		right: 150px;
	}
}

/* @media (max-width: 576px) {
  .badge-overlay {
    bottom: 10px;
    right: 10px;
  }

  .badge-overlay-img {
    width: 60px;
  }
} */

.jumbotron {
	position: relative;
}

/*New branding guidelines*/
.fontColorPrimary {
	color: #1742f5 !important;
}

.backgroundColorPrimary {
	background-color: #1742f5 !important;
}
