@font-face {
	font-family: 'Jost';
	src: url('../assets/fonts/Jost-VariableFont_wght.ttf') format('truetype');
}

@font-face {
	font-family: 'Inter';
	src: url('../assets/fonts/Inter-VariableFont_slnt\,wght.ttf')
		format('truetype');
}

html,
body {
	--dark-grey: #373a36;
	--light-grey: #ebebeb;
	--orange: #fa491a;
	--blue: #00148c;
	--teal: #00bfb3;
	width: 100vw;
	height: 100vh;
	margin: 0 auto;
	padding: 0;
	font-family: 'Inter', sans-serif;
	overflow-y: auto;
	display: flex;
	flex-direction: column;
	color: var(--dark-grey);
}

h1,
h2,
h3,
h4 {
	font-family: 'Jost', sans-serif;
	font-weight: 600;
	color: var(--dark-grey);
}

h1 {
	font-size: 2.5rem;
}

h2 {
	font-size: 1.875rem;
}

h3 {
	font-size: 1.375rem;
	font-weight: 700;
}

a {
	color: var(--blue);
	font-weight: 600;
}

header {
	height: auto;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	margin: 0.75rem 0;
	padding: 0 0.75rem;
}

header a {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	text-decoration: none;
}

header img {
	width: 4.5rem;
	padding: 0 0.4rem 0.13rem 0;
}

header h2 {
	color: var(--dark-grey);
	font-size: 1.25rem;
	font-weight: 700;
	margin-bottom: 0;
}

#loader {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

#loader .spinner-border {
	color: var(--dark-grey);
}

button {
	width: 100%;
	height: 3rem;
	padding: 0.5rem 1rem;
	margin: 1rem 0 1.5rem 0;
	font-family: 'Inter', sans-serif;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.375rem;
	background-color: var(--orange);
	color: white;
	border: none;
	cursor: pointer;
}

.marker__default {
	display: block;
	width: 60px;
	height: 84px;
	background-image: url('../assets/icons/default-marker.png');
	background-size: contain;
	cursor: pointer;
}

.marker__shadow {
	display: block;
	width: 60px;
	height: 84px;
	background-image: url('../assets/icons/shadow-marker.png');
	background-size: contain;
	cursor: pointer;
}

.maplibregl-ctrl {
	border-radius: 0;
	background: none;
}

.maplibregl-ctrl-group:not(:empty) {
	box-shadow: none;
}

.maplibregl-ctrl button {
	background-color: white;
	border: 1px solid var(--dark-grey);
	width: 40px;
	height: 40px;
	margin: 0;
}

.maplibregl-ctrl-group button + button {
	border-top: none;
}

.maplibregl-ctrl button.maplibregl-ctrl-zoom-in .maplibregl-ctrl-icon {
	background-image: url('../assets/icons/zoom-in-icon.svg') !important;
}

.maplibregl-ctrl button.maplibregl-ctrl-zoom-out .maplibregl-ctrl-icon {
	background-image: url('../assets/icons/zoom-out-icon.svg') !important;
}