@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600&display=swap");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");

:root {
	--app-org-bg: #d4b2a7;
	--app-org-fg: black;
	--app-per-bg: #8a2525;
	--app-per-fg: white;
	--app-footer-bg: #ca8a75;
	--app-footer-fg: black;
	--app-header-bg: #f3e7dd;
	--app-header-fg: #555555;
   --app-landing-bg: #f3e7dd;
   --app-button-bg: #a38f85;
   --app-button-fg: white;
}
body {
	font-family: "Inter", sans-serif !important;
	line-height: 1.2 !important;
	margin: 0 auto !important;
	max-width: 500px;
   border: solid 1px gray;
}
a {
	text-decoration: none !important;
}
label {
	font-size: medium;
	margin-top: 20px;
}
form {
	min-width: 80%;
}
.app-content {
	min-height: 74vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-left: 1rem;
	padding-right: 1rem;
}
.app-landing {
	min-height: 74vh;
   background-color: var(--app-landing-bg);
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-left: 1rem;
	padding-right: 1rem;
}
.menu-item {
	font-size: 1rem;
	padding-left: 28px;
}
.app-menu {
	padding: 0.5rem;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
.person {
	background-color: var(--app-per-bg);
	color: var(--app-per-fg);
}
.organiz {
	background-color: var(--app-org-bg);
	color: var(--app-org-fg);
}
.app-header {
	background-color: var(--app-header-bg);
	color: var(--app-header-fg);
	padding: 1rem;
	font-size: 18px;
}
.app-button {
	border: 0;
	border-radius: 10px;
   background-color: var(--app-button-bg);
   color: var(--app-button-fg);
	font-weight: bold;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	/* min-width: 60%; */
}
.app-card {
   background-color: var(--app-landing-bg);
}
.footer {
	background-color: var(--app-footer-bg);
	color: var(--app-footer-fg);
	text-align: center;
	font-weight: thin;
	font-size: small;
}
.popup {
	position: fixed !important;
	display: none;
	padding: 0;
	top: 30%;
	left: 8%;
	height: auto;
	background-color: white;
	color: black;
	cursor: pointer;
}