@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
	--qlik-grey: rgb(84 86 90);
	--qlik-blue: rgb(25 66 108);
	--qlik-green-rgb: 0, 152, 69;
	--qlik-green: rgb(var(--qlik-green-rgb));
	--qlik-dark-green-rgb: 0, 137, 62;
	--qlik-dark-green: rgb(var(--qlik-dark-green));
	--qlik-ocean: rgb(0 101 128);
	--qlik-sky: rgb(16 207 201);
	--white: rgb(255 255 255);
	--bs-primary: var(--qlik-green);
	--bs-primary-rgb: var(--qlik-green-rgb);
	--bs-body-color: var(--qlik-grey);
	--bs-body-bg: rgb(255,255,255);
	--bs-link-color: var(--qlik-blue);
	--bs-link-color-rgb: 25, 66, 108;
	--bs-link-hover-color: var(--qlik-blue);
	--bs-link-hover-color-rgb: 25, 66, 108;
	--bs-accordion-bg: none;
	--bs-accordion-icon-color: var(--qlik-blue);
	--bs-accordion-active-color: var(--qlik-blue);
	--bs-font-sans-serif: 'Inter', sans-serif;
	--bs-body-font-family: var(--bs-font-sans-serif);
}

/*
	Global
*/
body {
	font-family: 'Inter', sans-serif;
	color: var(--qlik-grey);
	overflow-x: hidden;
}

h2 {
	font-size: 2em;
	font-weight: 500;
	line-height: 1.5;
	color: var(--qlik-blue);
}

h3 {
	font-size: 1.7em;
	font-weight: 500;
	color: var(--qlik-blue);
}

/*
	Focus ring override — remove Bootstrap blue glow
*/
*:focus {
	outline: none;
}

.form-control:focus,
.form-select:focus {
	border-color: var(--qlik-green);
	box-shadow: 0 0 0 0.25rem rgba(var(--qlik-green-rgb), 0.25);
}

.form-check-input:focus {
	border-color: var(--qlik-green);
	box-shadow: 0 0 0 0.25rem rgba(var(--qlik-green-rgb), 0.25);
}

.form-check-input:checked {
	background-color: var(--qlik-green);
	border-color: var(--qlik-green);
}

.btn:focus,
.btn:focus-visible {
	box-shadow: 0 0 0 0.25rem rgba(var(--qlik-green-rgb), 0.25);
}

/*
	Qlik green button
*/
.btn.qlik-green {
	opacity: 1;
	color: var(--white);
	background-color: var(--qlik-green);
	border: 1px solid var(--qlik-green);
}

.btn:hover.qlik-green {
	opacity: .6;
	color: var(--white);
	background-color: var(--qlik-green);
	border: 1px solid var(--qlik-green);
}

/*
	Primary button override
*/
.btn-primary {
	--bs-btn-bg: var(--qlik-green);
	--bs-btn-border-color: var(--qlik-green);
	--bs-btn-hover-bg: var(--qlik-green);
	--bs-btn-hover-border-color: var(--qlik-green);
	--bs-btn-active-bg: var(--qlik-green);
	--bs-btn-active-border-color: var(--qlik-green);
	--bs-btn-disabled-bg: var(--qlik-green);
	--bs-btn-disabled-border-color: var(--qlik-green);
}

.btn-outline-primary {
	color: var(--qlik-blue) !important;
	border-color: var(--qlik-blue) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:active,
.btn-outline-primary.active {
	background-color: var(--qlik-blue) !important;
	border-color: var(--qlik-blue) !important;
	color: var(--white) !important;
}

/*
	Nav tabs — remove Bootstrap blue, use Qlik Green underline
*/
.nav-tabs {
	--bs-nav-tabs-link-active-color: var(--qlik-green);
	--bs-nav-tabs-link-active-border-color: transparent transparent var(--qlik-green);
}

.nav-tabs .nav-link {
	color: var(--qlik-grey);
}

.nav-tabs .nav-link:hover {
	color: var(--qlik-blue);
	border-color: transparent transparent rgba(var(--qlik-green-rgb), 0.3);
}

.nav-tabs .nav-link.active {
	color: var(--qlik-green);
	border-bottom: 2px solid var(--qlik-green);
}

/*
	Accordion
*/
.accordion-button:not(.collapsed) {
	color: var(--qlik-blue);
	background-color: rgba(var(--qlik-green-rgb), 0.05);
	box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}

.accordion-button:focus {
	box-shadow: 0 0 0 0.25rem rgba(var(--qlik-green-rgb), 0.25);
}

/*
	Links
*/
a {
	color: var(--qlik-blue) !important;
	text-decoration: none;
}

a:hover {
	color: var(--qlik-blue) !important;
	opacity: 0.7;
}

a.text-decoration-none:hover {
	opacity: 0.7;
}

a.btn.qlik-green,
a.btn.qlik-green:hover,
a.btn-primary,
a.btn-primary:hover,
a.btn-outline-primary:hover,
a.btn-outline-danger:hover,
a.btn-danger,
a.btn-secondary {
	color: var(--white) !important;
	opacity: 1;
}

/*
	Tables
*/
.table {
	--bs-table-hover-bg: rgba(var(--qlik-green-rgb), 0.04);
}

/*
	Pagination
*/
.pagination {
	--bs-pagination-active-color: #fff !important;
	--bs-pagination-active-bg: var(--qlik-green) !important;
	--bs-pagination-active-border-color: var(--qlik-green) !important;
	--bs-pagination-color: var(--qlik-blue);
	--bs-pagination-hover-color: var(--qlik-blue);
}

/*
	Alerts
*/
.alert-primary {
	--bs-alert-bg: rgba(var(--qlik-green-rgb), 0.1);
	--bs-alert-border-color: rgba(var(--qlik-green-rgb), 0.2);
	--bs-alert-color: var(--qlik-grey);
}

/*
	Badges
*/
.badge.bg-primary {
	background-color: var(--qlik-green) !important;
}

/*
	Spinner
*/
.spinner-border {
	--bs-spinner-color: var(--qlik-green);
}

/*
	Form validation states
*/
.was-validated .form-control:valid,
.form-control.is-valid {
	border-color: var(--qlik-green);
}

.was-validated .form-control:valid:focus,
.form-control.is-valid:focus {
	box-shadow: 0 0 0 0.25rem rgba(var(--qlik-green-rgb), 0.25);
}

/*
	Modal
*/
.modal-header {
	border-bottom-color: #e9ecef;
}

/*
	Impartner Styles
*/
.full-width-background {
	background-repeat: no-repeat;
	position: relative;
	width: 100vw;
	left: calc(-1 * (100vw - 100%) / 2);
}

.hero-banner {
	min-height: 150px;
	color: #000000;
	font-size: 16px;
	background: linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,.3)), url(https://res.cloudinary.com/dl85b34mf/image/upload/v1752672488/bg-header-streak_pmhgtc.png) no-repeat right bottom !important;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 0;
}

.blue-background {
	background: #19426c;
	padding: 40px 0;
}

.white-well {
	border-radius: 20px;
	padding: 20px;
	background: #ffffff;
	box-shadow: 0 30px 45px -30px rgba(50, 50, 93, 0.3);
}

.gray-background {
	background: #f6f7f8;
	padding: 40px 0;
}

.gray-border {
	border: 5px solid #f3f3f3;
}

.qlik-dark-green-text {
	color: var(--qlik-dark-green) !important;
}

/*
	Misc
*/
.no-hover {
	pointer-events: none;
}

input.cert-req-field {
	width: 2em;
	margin: 0;
	padding: 0;
}
