/* Zajednicki okvir aplikacije: pozadina stranice, navigacija, krug s inicijalom */

body {
	padding: 0 0 40px;
	background-color: #eee;
}

/* Navbar: one thin line, no shadows */
.app-nav {
	border-bottom: 1px solid var(--bs-border-color);
	background: var(--bs-body-bg);
}
.app-nav .navbar-brand {
	font-weight: 600;
}
.app-nav .nav-link {
	color: var(--bs-secondary-color);
	padding-inline: .75rem;
}
.app-nav .nav-link:hover,
.app-nav .nav-link:focus-visible {
	color: var(--bs-body-color);
}
.app-nav .nav-link.active {
	color: var(--bs-body-color);
	font-weight: 600;
	box-shadow: inset 0 -2px 0 var(--bs-primary);
}
.app-nav .dropdown-header {
	max-width: 14rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Krug s prvim slovom imena */
.avatar {
	display: inline-grid;
	place-items: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--bs-primary);
	color: #fff;
	font-weight: 600;
	font-size: .95rem;
	line-height: 1;
}
button.avatar {
	border: 0;
	padding: 0;
}
button.avatar:hover {
	filter: brightness(.92);
}
.avatar.is-current {
	box-shadow: 0 0 0 2px var(--bs-body-bg), 0 0 0 4px var(--bs-primary);
}
.avatar-lg {
	width: 56px;
	height: 56px;
	font-size: 1.5rem;
}