/* css för alla sidor 2025 NYA*/
/* alla sidor har egen styling = css-fil */
/* styling av menyerna mm /*
/* style.css */
/* navbar.css */

* {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	text-decoration: none;
	list-style-type: none;
}
html {
	font-size: 62.5%; /* 1rem = 10ox */
	font-family: "Roboto", sans-serif;
	scroll-behavior: smooth;
	/* scroll-snap-type: y mandatory; */
}

body {
	font-size: 1rem;
	font-weight: 400;
	background-color: var(--white);
	/* line-height: 1rem; */
	font-family: "Roboto", sans-serif;
	color: var(--black);
	width: 100%;
	height: 120vh;
	overflow-y: scroll;

	/* background-color: #00ffff; */
}

/* scrollbar */
/* body::-webkit-scrollbar {
	width: 10px;
	scrollbar-width: thin;
	scrollbar-color: rgba(0, 0, 0, 0.3 transparent);
} */
/* body::-webkit-scrollbar-track {
	border-radius: 6px;
	background-color: var(--blue);
	border: 1px solid var(--white);
} */
/* body::-webkit-scrollbar-thumb {
	border-radius: 8px;
	border: 2px solid transparent;
	background-clip: content-box;
	background-color: var(--gold_frame);
} */

/* https://exoticcarcolors.com/car-companies/lamborghini */
:root {
	--vita: #ffffff;
	--blue: #054ae3; /* blu caelum /*
	/*blå linjer meny mm */
	--blue2: #017ef4; /* Blu Nila */
	--blue2Link: #4099f8;
	--white: #ffffff;
	--white-dimed: hsla(0, 0%, 100%, 0.7);
	--whiteNav: #ffffff;
	--grey: #2a2929;
	--gold_frame: #f2c32f; /* Giallo Spica */
	--table_c: #313030;
	--light_gray: #acacae; /* Grigeo Estoque */
	--current: #ffd700;
	--black: #000000;
	--red: #c10001; /* Rosso Bia */
	--wrapper_clr: #00ffff;
	--light_green: #b4e12e; /* Verde Scandal */
	--dark_green: #67c52f; /* Verde Selvans */
	--features_list: #f9f9f9;
	--color-items: #f2f3f6; /* Ferrari Bianco Avus */
	--linear_gradient: linear-gradient(
		135deg,
		var(--blue) 0%,
		var(--blue2) 100%
	);
	--body-background: #ffffcc;
	--hover: #e1e1e2;
	--header-span: calc(clamp(2.8rem, 0.909vw + 2.255rem, 4rem));
	--header-span-small: calc(
		clamp(2rem, 1.961vw + 1.294rem, 2.8rem)
	);
	--h1_fontZ: calc(clamp(1.8rem, 0.658vw + 1.537rem, 2.8rem));
	/* --h1_fontZ: calc(clamp(1.8rem, 1.061vw + 1.164rem, 3rem)); */
	--h1_fontZ-1: calc(clamp(2rem, 4.386vw - 0.368rem, 3rem));
	--h2_fontZ: calc(clamp(1.5rem, 0.592vw + 1.263rem, 2.4rem));
	/* --h2_fontZ: calc(clamp(1.8rem, 0.685vw + 1.43rem, 2.8rem)); */
	--h2_fontZ_sticky: clamp(1rem, 0.8333rem + 0.5333vw, 1.5rem);
	--h3_fontZ: calc(clamp(1.5rem, 0.685vw + 1.13rem, 2.5rem));
	--h3_fontZ2: clamp(1.25rem, 1.2059rem + 0.2353vw, 1.5rem);
	--h4_fontZ: calc(clamp(1.2rem, 0.685vw + 0.83rem, 2.2rem));
	/* --h5_fontZ: clamp(1.05rem, calc(0.1935vw + 1.0065rem), 1.2rem); */
	--h5_fontZ: calc(clamp(1.4rem, 0.347vw + 1.133rem, 1.8rem));
	--pdfer: clamp(0.8rem, calc(0.2581vw + 0.7419rem), 1rem);
	/* --p_fontZ: calc(clamp(1.4rem, 0.671vw + 0.511rem, 2rem)); */
	--p_fontZ: calc(clamp(1.2rem, 0.455vw + 0.927rem, 1.8rem));
	--p_fontZ1: calc(clamp(0.8rem, 0.347vw + 0.533rem, 1.2rem));
	/* --p_fontZ2: calc(clamp(1rem, 0.33vw + 0.733rem, 1.4rem)); */
	--p_fontZ2: calc(clamp(1.2rem, 0.671vw + 0.511rem, 1.8rem));
	--min_size: 320px;
	--top: 4.5rem;
	--header-hight: 10rem;

	/* scrollbar */
	scrollbar-color: var(--blue2) var(--gold_frame);
	scrollbar-width: auto;

	/* landscape width and hight*/
	--min-w: 600px;
	--max-w: 940px;
	--min-h: 300px;
	--max-h: 500px;
}

.darkmode {
	--light_gray: #5e5e5e;
	--vita: #ababab;
	--white: #d5d2d2; /* background color*/
	--whiteNav: #cccccc;
	--white-dimed: hsla(0, 3%, 85%, 0.3);
	--black: #000000; /* text color */
	--blue2: #0202a8; /* nav color */
	--gold_frame: #e5c304;
	--light_green: #c1f524; /* Verde Scandal */
	--red: #fc4747;
	--features_list: #b5b5b5;
	--color-items: #cacbce; /* Ferrari Argento Nurnburgring */
}

nav a {
	/* color: var(--whiteNav); */
	color: var(--white);
	/* color: #0000ff; */
}

a {
	color: var(--blue2);
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

/* start highligt-text */
.highlight {
	background-color: rgb(227, 227, 227); /* färgen du vill använda */
	padding: 0.5rem 0;
}
/* end highligt-text */

/* meny knapparna öppna / stäng */
.fa-solid.fa-bars,
.fa-solid.fa-xmark {
	color: var(--white);
}
nav {
	height: var(--header-hight);
}
.nav__toggle {
	position: relative;
	width: 32px;
	height: 32px;
}
.fa-solid.fa-bars,
.fa-solid.fa-xmark {
	position: absolute;
	width: max-content;
	height: max-content;
	inset: 0;
	margin: auto;
	font-size: 1.5rem;
	cursor: pointer;
	transition:
		opacity 0.1s,
		transform 0.4s;
}
.fa-solid.fa-xmark {
	opacity: 0;
}
.fa-solid.fa-arrow-up {
	margin: 0;
}
/* end of meny knapparna X */
/* p::first-letter {
	font-weight: 500;
} */

.menu,
.submenu {
	list-style-type: none;
}
/* .logo {
	font-size: var(--p_fontZ);
	padding: 0.625rem 0.83rem 0.625rem 0;
} */
.item {
	padding: 0.83rem;
}
.item.button {
	padding: 0.75rem 0.42rem;
}
.item:not(.button) a:hover,
.item a:hover::after {
	color: var(--light_gray);
}

/* ICONER FÄRG */

.fa-solid.fa-link {
	/* länk*/
	color: #5d5e5e;
}
.fa-solid.fa-users,
.fa-solid.fa-user,
.fa-solid.fa-tree-city,
.fa-solid.fa-address-card,
.fa-solid.fa-city,
.fa-solid.fa-file-invoice {
	color: var(--blue2);
}
.fa-solid.fa-file-lines {
	color: #5e5d5d;
}
.fa-solid.fa-file-arrow-down {
	color: #ff0000;
	/* color: #5d5e5e; */
}
.fa-solid.fa-file-arrow-up {
	color: #000000;
}

.fa-solid.fa-scale-balanced {
	color: #dc143c;
}
.fa-solid.fa-mountain-sun {
	color: #50f11e;
}
.fa-solid.fa-circle-exclamation,
.fa-solid.fa-question,
.fa-solid.fa-rectangle-xmark {
	color: #ff0000;
}
.fa-solid.fa-house {
	color: #5e5d5d;
}

.fa-solid.fa-universal-access {
	color: var(--light_gray);
}
.fa-solid.fa-calendar-days {
	color: #20db20;
}
.fa-solid.fa-key {
	color: #5e5d5d;
}
.fa-solid.fa-door-open {
	color: #804000;
}
.fa-solid.fa-building-user,
.fa-solid.fa-map-location-dot,
.fa-solid.fa-house-circle-check,
.fa-solid.fa-house-laptop {
	color: #008000;
}
.fa-solid.fa-faucet,
.fa-solid.fa-faucet-drip,
.fa-solid.fa-shower {
	color: #a52a2a;
}
.fa-solid.fa-newspaper {
	color: #0080ff;
}
.fa-solid.fa-circle-info,
.fa-solid.fa-info {
	color: #35ea74;
}
.fa-solid.fa-images {
	color: #515cf5;
}
.fa-solid.fa-address-book {
	color: #0202a8;
}
.fa-solid.fa-globe {
	color: #7a08e4;
}
.fa-solid.fa-bell {
	color: rgb(248, 64, 64);
}
.fa-solid.fa-house-user {
	color: #43f3a1;
}
.fa-solid.fa-file-pdf {
	color: #b30b00;
}
/* iconer card/styrelse sidan */
.fa-solid.fa-user {
	color: var(--blue2);
}
.fa-solid.fa-mobile-screen {
	color: burlywood;
}
.fa-regular.fa-envelope {
	color: #04c233;
}
.fa-solid.fa-briefcase {
	color: #fa8072;
}
.fa-solid.fa-circle-info {
	color: #8080ff;
}
.fa-solid.fa-door-open {
	color: #804000;
}
.fa-solid.fa-phone {
	color: burlywood;
}
.fa-solid.fa-angles-down {
	color: var(--blue2);
}
.fa-solid.fa-bars,
.fa-solid.fa-arrows-left-right {
	color: var(--vita);
}
.fa-solid.fa-sun,
.fa-solid.fa-moon {
	color: var(--gold_frame);
}
.fa-solid.fa-money-bill-wave,
.fa-solid.fa-house-crack .fa-solid.fa-broom,
.fa-solid.fa-image,
.fa-solid.fa-volume-high,
.fa-solid.fa-user-shield,
.fa-solid.fa-square-parking {
	color: var(--blue);
}

/* iconer storlek */
i.fa-solid,
i.fa-regular {
	width: 4rem;
	font-size: var(--h1_fontZ);
	/* background-color: #00ffff; */
}

i.header {
	font-size: var(--header-span);
	/* background-color: #00ffff; */
}

/* end of iconer card/styrelse sidan */

/* uppknappen */

button#scrollToTopBtn {
	position: fixed;
	bottom: 75px;
	right: 15px;
	width: 30px;
	height: 30px;
	/* width: 50px;
	height: 50px; */
	background-color: var(--blue);
	color: var(--gold_frame);
	border: none;
	border-radius: 50%;
	box-shadow: 2px 3px 10px rgba(0, 0, 0, 0.8);
	cursor: pointer;
	display: none;
	justify-content: center;
	align-items: center;
	font-size: 36px;
	font-weight: bold;
	transition:
		opacity 0.3s ease,
		transform 0.3s ease;
}
button#scrollToTopBtn i.fa-solid.fa-arrow-up {
	font-size: 2rem;
}
button#scrollToTopBtn:hover {
	background-color: var(--gold_frame);
	color: var(--blue);
	transform: translateY(-5px);
}
#scrollToTopBtn.show {
	display: flex;
	/* justify-content: space-around; */
}

/* end of uppknappen */

/* end of uppknappen */

/* LINJER STORLEK MM */
/* <hr class="bR5"> */
hr.bR2 {
	margin: 2rem auto;
	border: 0.1rem solid #007bff;
	max-width: 20vw;
}
hr.bR3 {
	margin: 2rem auto;
	border: 0.1rem solid #007bff;
	max-width: 30vw;
}
hr.bR3-1rem {
	margin: 1rem auto;
	border: 0.1rem solid #007bff;
	max-width: 30vw;
}
hr.bR5 {
	margin: 2rem auto;
	border: 0.1rem solid #007bff;
	max-width: 50vw;
}

hr.bR8 {
	margin: 2rem auto;
	border: 0.1rem solid #007bff;
	max-width: 80%;
}
hr.bR10 {
	margin: 2rem auto;
	border: 0.1rem solid #007bff;
	max-width: 100%;
}
hr.bR5-05 {
	margin: 0.2rem auto;
	border: 0.1rem solid #007bff;
	max-width: 50vw;
}

/* flex till iconer och text på a-o och andra sidor */
/* flex för icon + text */
.icon_text_flex {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

/* **************** TILL DARKMOOD *********** */
/* .darkMode {
	position: relative;
	font-size: 0.8rem;
	width: 20px;
	height: 20px;
	padding: 1.5rem;
	border: 2px solid var(--white);
	color: var(--white);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	cursor: pointer;
} */
#checkboxIdText {
	cursor: pointer;
}
/* .darkMode .tooltip {
	position: absolute;
	font-size: calc(var(--p_fontZ2) - 0.5rem);
	line-height: 1.3rem;
	color: var(--black);
	background-color: var(--white-dimed);
	padding: 0rem 0.3rem;
	margin: 0;
	bottom: -3.2rem;
	border-radius: 0.7rem;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s;
} */
/* .darkMode:hover .tooltip {
	opacity: 1;
} */
@media (max-width: 1024px) {
	/* .darkMode .tooltip {
		display: none;
	} */
}

#checkboxId {
	display: none;
	height: 0;
	width: 0;
}