:root {
	--ms-sidebar-width: 256px;
	/* Palette */
	--ms-bg: #f6f8fb;
	--ms-surface: #ffffff;
	--ms-border: #e6eaf0;
	--ms-text: #16202c;
	--ms-muted: #6b7a8d;
	--ms-primary: #2f6fed;
	--ms-primary-soft: #eaf1fe;
	--ms-sidebar-bg: #131c2b;
	--ms-sidebar-text: #a8b6c9;
	/* Forma */
	--ms-radius: 14px;
	--ms-radius-sm: 10px;
	--ms-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 6px 20px rgba(16, 24, 40, .06);
	--bs-primary: var(--ms-primary);
	--bs-body-color: var(--ms-text);
}

html, body {
	height: 100%;
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	background-color: var(--ms-bg);
	color: var(--ms-text);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 {
	letter-spacing: -.015em;
}

/* Shell applicativa autenticata */
.app-shell {
	display: flex;
	min-height: 100vh;
}

.app-content {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
}

	.app-content > main {
		max-width: 1360px;
		width: 100%;
		margin-inline: auto;
	}

/* Sidebar */
.app-sidebar {
	width: var(--ms-sidebar-width);
	flex-shrink: 0;
	background: var(--ms-sidebar-bg);
	color: var(--ms-sidebar-text);
	position: sticky;
	top: 0;
	height: 100vh;
}

.app-sidebar .sidebar-brand {
	color: #fff;
	font-size: 1.05rem;
	letter-spacing: -.02em;
	border-color: rgba(255, 255, 255, .08) !important;
}

	.app-sidebar .sidebar-brand i {
		color: var(--ms-primary);
	}

.app-sidebar .nav-section {
	font-size: .68rem;
	text-transform: uppercase;
	letter-spacing: .09em;
	color: #64748b;
	padding: .75rem .75rem .25rem;
}

.app-sidebar .nav-link {
	color: var(--ms-sidebar-text);
	border-radius: var(--ms-radius-sm);
	padding: .55rem .75rem;
	font-size: .925rem;
	font-weight: 500;
	transition: background-color .15s ease, color .15s ease;
}

	.app-sidebar .nav-link:hover {
		background-color: rgba(255, 255, 255, .06);
		color: #fff;
	}

	.app-sidebar .nav-link.active {
		background-color: var(--ms-primary);
		color: #fff;
		box-shadow: 0 6px 16px rgba(47, 111, 237, .35);
	}

.app-sidebar .border-top {
	border-color: rgba(255, 255, 255, .08) !important;
}

.app-sidebar .sidebar-footer .sidebar-logo {
	max-width: 100%;
	max-height: 64px;
	width: auto;
	height: auto;
	object-fit: contain;
	opacity: .9;
}

/* Topbar */
.app-topbar {
	position: sticky;
	top: 0;
	z-index: 20;
	background: rgba(255, 255, 255, .85) !important;
	backdrop-filter: blur(10px);
	border-color: var(--ms-border) !important;
}

.topbar-action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	color: var(--ms-muted);
	transition: background-color .15s ease, color .15s ease;
}

	.topbar-action:hover {
		background: var(--ms-primary-soft);
		color: var(--ms-primary);
	}

.user-chip {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	font-size: .875rem;
	color: var(--ms-text);
}

.user-avatar {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--ms-primary-soft);
	color: var(--ms-primary);
	font-size: .78rem;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Card */
.card {
	border: 1px solid var(--ms-border);
	border-radius: var(--ms-radius);
	box-shadow: var(--ms-shadow);
	background: var(--ms-surface);
}

.card-header {
	background: transparent !important;
	border-bottom: 1px solid var(--ms-border);
	padding: 1rem 1.25rem;
}

/* Stat card */
.stat-card {
	position: relative;
	overflow: hidden;
	transition: transform .15s ease, box-shadow .15s ease;
}

	.stat-card:hover {
		transform: translateY(-2px);
		box-shadow: 0 10px 28px rgba(16, 24, 40, .1);
	}

	.stat-card .stat-value {
		font-size: 2rem;
		font-weight: 650;
		line-height: 1;
		letter-spacing: -.03em;
	}

	.stat-card .bi {
		font-size: 1.15rem;
	}

/* Tabelle */
.table {
	--bs-table-hover-bg: #f7f9fc;
	margin-bottom: 0;
}

	.table > thead th {
		background: #fafbfd;
		color: var(--ms-muted);
		font-size: .74rem;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .06em;
		border-bottom: 1px solid var(--ms-border);
		padding: .7rem 1rem;
	}

	.table > tbody td {
		padding: .8rem 1rem;
		border-color: #f0f3f7;
		vertical-align: middle;
	}

	.table code {
		background: #f1f4f9;
		color: #33445c;
		padding: .15rem .45rem;
		border-radius: 6px;
		font-size: .8rem;
	}

.table-hover tbody tr {
	cursor: default;
}

/* Badge */
.badge {
	font-weight: 600;
	border-radius: 999px;
	padding: .35em .7em;
	font-size: .74rem;
}

	.badge.bg-success {
		background: #e7f7ef !important;
		color: #12734a !important;
	}

	.badge.bg-warning {
		background: #fff4e0 !important;
		color: #96590f !important;
	}

	.badge.bg-danger {
		background: #fdeaea !important;
		color: #a32020 !important;
	}

	.badge.bg-primary {
		background: var(--ms-primary-soft) !important;
		color: var(--ms-primary) !important;
	}

/* Form e bottoni */
.form-control, .form-select {
	border-radius: var(--ms-radius-sm);
	border-color: var(--ms-border);
	padding: .5rem .75rem;
}

	.form-control:focus, .form-select:focus {
		border-color: var(--ms-primary);
		box-shadow: 0 0 0 3px rgba(47, 111, 237, .15);
	}

.input-group-text {
	background: #fafbfd;
	border-color: var(--ms-border);
	color: var(--ms-muted);
	border-radius: var(--ms-radius-sm) 0 0 var(--ms-radius-sm);
}

.form-label {
	font-size: .82rem;
	font-weight: 600;
	color: var(--ms-muted);
}

.btn {
	border-radius: var(--ms-radius-sm);
	font-weight: 500;
	transition: transform .12s ease, box-shadow .15s ease;
}

	.btn:active {
		transform: translateY(1px);
	}

.btn-primary {
	background: var(--ms-primary);
	border-color: var(--ms-primary);
	box-shadow: 0 4px 12px rgba(47, 111, 237, .25);
}

.btn-sm {
	border-radius: 8px;
}

/* Modali */
.modal-content {
	border: 0;
	border-radius: var(--ms-radius);
	box-shadow: 0 24px 60px rgba(16, 24, 40, .22);
}

.modal-header, .modal-footer {
	border-color: var(--ms-border);
	padding: 1rem 1.25rem;
}

/* Shell pubblica (login) */
.public-shell {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background: radial-gradient(1200px 600px at 20% 0%, #26406e 0%, #101828 55%, #0a1120 100%);
	padding: 1rem;
}

.public-card {
	width: 100%;
	max-width: 420px;
	border-radius: 18px;
	box-shadow: 0 24px 70px rgba(0, 0, 0, .35);
}

@media (max-width: 768px) {
	.app-shell {
		flex-direction: column;
	}

	.app-sidebar {
		width: 100%;
		height: auto;
		position: static;
	}

		.app-sidebar .nav {
			flex-direction: row !important;
			flex-wrap: wrap;
		}

		.app-sidebar .nav-section {
			display: none;
		}
}
