/* =========================================
   Google Fonts
========================================= */
@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght,SOFT@9..144,100..900,50&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Urbanist:wght@500;600;700&display=swap");

/* =========================================
   Design Tokens (UNICO :root)
========================================= */
:root {
	/* Palette (pastello + brand green utilizzati nel progetto) */
	--bs-primary: #a6c0fe;
	--bs-secondary: #f6d2f6;
	--bs-success: #b9fbc0;
	--bs-info: #a1e0ff;
	--bs-warning: #ffe6a7;
	--bs-danger: #ffadad;
	--bs-light: #f5f5fa;
	--bs-white: #ffffff;

	/* Accenti brand “Avylia” */
	--brand-dark: #004236;
	--brand-dark-2: #078972;

	/* Gradients */
	--gradient-1: linear-gradient(to right, var(--bs-primary), var(--bs-secondary));
	--gradient-2: linear-gradient(to right, var(--bs-success), var(--bs-info));
	--gradient-3: linear-gradient(to right, var(--bs-warning), var(--bs-danger));
	--bg-avylia-gradient: linear-gradient(to right bottom, #c5f0f1, #cff2ea, #daf2e5, #e6f3e3, #f0f3e4, #f4efde, #f8ebda, #fde7d8, #ffdbd1, #ffd0d2, #ffc6db, #f1bfe9);

	/* Typography */
	--font-body: "Inter", sans-serif;
	--font-heading: "Urbanist", sans-serif; /* manteniamo Urbanist per headings */
	--font-heading-alt: "Fraunces", serif; /* disponibile se vuoi varianti editoriali */

	/* Text colors */
	--font-color-dark: #3a3f5a;
	--font-color-secondary: #5b556d;
	--font-color-muted: #7f8c8d;
	--font-color-light: #e0e0e0;

	/* Spacing */
	--spacing-xs: 4px;
	--spacing-sm: 8px;
	--spacing-md: 16px;
	--spacing-lg: 24px;

	/* Radius & Shadows */
	--radius-sm: 6px;
	--radius-md: 12px;
	--radius-lg: 20px;
	--shadow-sm: 0 2px 5px rgba(0, 0, 0, 0.06);
	--shadow-md: 0 6px 16px rgba(0, 0, 0, 0.1);
	--shadow-lg: 0 10px 24px rgba(0, 0, 0, 0.12);

	/* Misc */
	--focus-ring: 0 0 0 3px rgba(166, 192, 254, 0.45);
}

/* =========================================
   Base
========================================= */
* {
	box-sizing: border-box;
}

html,
body {
	height: 100%;
}

body {
	font-family: var(--font-body);
	background: var(--bg-avylia-gradient);
	background-attachment: fixed;
	color: var(--font-color-dark);
	line-height: 1.6;
	margin: 0;
}

/* Print helpers */
@media print {
	.page,
	.page-break {
		break-after: page;
	}
}

/* Utilities */
.fs-small {
	font-size: 14px;
}
.red {
	color: #c8382d;
}
.green {
	color: #125341;
}
.bolder {
	font-weight: 600 !important;
}
a {
	text-decoration: none;
	color: var(--bs-primary);
	transition: color 0.2s ease;
}
a:hover {
	color: #7ea1ff;
	text-decoration: underline;
}

/* =========================================
   Typography
========================================= */
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: var(--font-heading);
	color: var(--font-color-dark);
	line-height: 1.2;
}

h1 {
	font-size: clamp(1.75rem, 1.2rem + 1.2vw, 2.5rem);
	font-weight: 700;
}
h2 {
	font-size: clamp(1.5rem, 1.2rem + 0.5vw, 2rem);
	font-weight: 600;
}
h3 {
	font-size: clamp(1.25rem, 1.1rem + 0.3vw, 1.6rem);
	font-weight: 600;
}
h4 {
	font-size: clamp(1.1rem, 1rem + 0.2vw, 1.35rem);
	font-weight: 500;
}
h5 {
	font-size: 1.05rem;
	font-weight: 500;
}
h6 {
	font-size: 1rem;
	font-weight: 500;
}

p {
	margin: 0 0 1rem;
}
.lead {
	font-family: var(--font-heading);
	font-weight: 500;
	font-size: 1.25rem;
}

/* Text helpers */
.text-muted {
	color: var(--font-color-muted) !important;
}
.text-primary-p {
	color: var(--bs-primary) !important;
}
.text-secondary-p {
	color: #d5a7e0 !important;
}
.text-success-p {
	color: var(--bs-success) !important;
}
.text-info-p {
	color: var(--bs-info) !important;
}
.text-warning-p {
	color: var(--bs-warning) !important;
}
.text-danger-p {
	color: var(--bs-danger) !important;
}

/* =========================================
   Forms & Inputs
========================================= */
.form-control,
.form-select,
input,
textarea,
select {
	border-radius: var(--radius-sm);
	border: 1px solid #e2e2e2;
	padding: 12px;
	color: var(--font-color-dark);
	background: #fff;
}

.form-control:focus,
.form-select:focus,
input:focus,
textarea:focus,
select:focus {
	border-color: var(--bs-primary);
	outline: none;
	box-shadow: var(--focus-ring);
}

textarea::placeholder,
input::placeholder {
	font-size: 13px;
	font-weight: 400;
}

/* Range thumbs */
.form-range::-webkit-slider-thumb,
.form-range::-moz-range-thumb,
.form-range::-ms-thumb {
	background: #3a3f5b;
}

/* Check & Radios */
.form-check {
	margin-bottom: 10px;
	display: flex;
}

.form-check-label {
	margin-left: 10px;
}

.form-check-input:checked {
	background-color: #94a6da;
	border-color: #a8c0fe;
}

/* =========================================
   Buttons
========================================= */
.btn {
	border: none;
	border-radius: var(--radius-lg);
	padding: var(--spacing-sm) var(--spacing-md);
	font-weight: 600;
	transition: all 0.2s ease-in-out;
}

.btn:focus-visible {
	box-shadow: var(--focus-ring);
}

.btn-primary {
	background: #e2c0fc;
	color: #3a3f5b;
	font-weight: 500;
	font-size: 15px;
	border-radius: 8px;
}

.btn-primary:hover {
	filter: brightness(0.95);
	background-color: #c16dc8;
	font-weight: 500;
	font-size: 15px;
	text-decoration: none;
}

.btn-secondary {
	background: #e0e0e0;
	color: #212121;
}

.btn-outline-primary {
	--btn-color: #d093ff;
	color: var(--btn-color);
	border: 1px solid var(--btn-color);
	background: transparent;
	border-radius: 5px;
	font-size: 13px;
}

.btn-outline-primary:hover {
	color: #fff;
	background: #c482f6;
	border-color: #c482f6;
}

.btn-outline-secondary {
	--btn-color: #3a3f5b;
	color: var(--btn-color);
	border: 1px solid var(--btn-color);
	background: transparent;
	border-radius: 5px;
	font-size: 13px;
}

.btn-light {
	color: #212121;
	background: #ebebeb;
	border: 1px solid #d7d7d7;
}
.btn-light:hover {
	background: #d7d7d7;
}

/* Gradient variants */
.btn-primary-gradient {
	background: var(--gradient-1);
	color: #fff;
}
.btn-primary-gradient:hover {
	opacity: 0.9;
	transform: translateY(-2px);
	color: #fff;
}

.btn-outline-primary-gradient {
	background: transparent;
	border: 2px solid transparent;
	border-image-slice: 1;
	border-image-source: var(--gradient-1);
	color: var(--font-color-dark);
}
.btn-outline-primary-gradient:hover {
	background: var(--gradient-1);
	color: #fff;
}

/* Small actions */
.actions .btn {
	margin-right: 10px;
}
.btn-icon {
	background: transparent;
	border: none;
	padding: 0.3rem 0.5rem;
	border-radius: var(--radius-sm);
	transition: background-color 0.2s ease;
}
.btn-icon:hover {
	background: rgba(0, 0, 0, 0.05);
}

/* =========================================
   Layout: Sidebar + Content + Navbar
========================================= */
.sidebar {
	width: 300px;
	min-width: 280px;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	background: #fff;
	padding: var(--spacing-md) var(--spacing-sm);
	box-shadow: var(--shadow-md);
	z-index: 1050;
	overflow-y: auto;
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
	transition: width 0.3s ease, left 0.3s ease;
}

.sidebar.collapsed {
	width: 90px;
	min-width: 80px;
	padding-left: 0;
	padding-right: 0;
	overflow-x: hidden;
}

/* Sidebar header/logo */
.sidebar-header {
	padding: var(--spacing-sm) var(--spacing-md);
	border-bottom: 1px solid #eee;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--spacing-sm);
	white-space: nowrap;
}
.sidebar-logo-expanded {
	display: flex;
	align-items: center;
	color: var(--font-color-dark);
	gap: var(--spacing-sm);
}
.sidebar-logo-expanded img {
	border-radius: var(--radius-sm);
}
.sidebar-logo-expanded span {
	opacity: 1;
	transition: opacity 0.3s ease;
}
.sidebar.collapsed .sidebar-logo-expanded span {
	opacity: 0;
	width: 0;
	overflow: hidden;
	padding: 0;
}
.sidebar-logo-collapsed {
	display: none;
}
.sidebar.collapsed .sidebar-logo-collapsed {
	display: block !important;
	text-align: center;
}

.sidebar ul.components > li:not(.submenu) {
	margin-bottom: 15px;
	background: var(--bs-light);
	border-radius: var(--radius-md);
	padding: 2px 0;
}
.sidebar ul li a {
	display: flex;
	align-items: center;
	padding: 6px 14px;
	font-size: 1.02em;
	color: var(--font-color-dark);
	border-radius: var(--radius-sm);
	transition: all 0.2s ease;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sidebar ul li a:hover,
.sidebar ul li a.active {
	background: var(--gradient-1);
	color: #fff;
	box-shadow: var(--shadow-sm);
}
.sidebar ul li a .icon-main {
	font-size: 1.2em;
	min-width: 40px;
	text-align: center;
	margin-right: var(--spacing-sm);
}
.nav-text {
	font-size: 16px;
}
.sidebar.collapsed .nav-text {
	opacity: 0;
	width: 0;
	overflow: hidden;
}

/* Dropdown / submenu */
.sidebar ul li a.dropdown-toggle {
	position: relative;
	padding-right: 35px;
}
.sidebar ul li a.dropdown-toggle::after {
	content: "▾";
	font-size: 0.8em;
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	transition: transform 0.3s ease;
}
.sidebar ul li a.dropdown-toggle[aria-expanded="true"]::after {
	transform: translateY(-50%) rotate(180deg);
}

.sidebar ul ul {
	padding-left: 0;
	margin: 6px var(--spacing-sm);
	background: rgba(255, 255, 255, 0.95);
	border-radius: var(--radius-sm);
	overflow: hidden;
	transition: all 0.3s ease;
}
.sidebar ul ul.collapse:not(.show) {
	display: none;
}
.sidebar ul ul li a {
	padding: var(--spacing-sm) var(--spacing-md);
	font-size: 0.95em;
	border-radius: var(--radius-sm);
}
.sidebar ul ul li a:hover {
	background: var(--gradient-2);
	color: #3a405a;
}
.sidebar ul ul li a i {
	font-size: 1em;
	margin-right: var(--spacing-sm);
}

/* Collapsed: open submenu as overlay on hover */
.sidebar.collapsed ul li:hover > ul.collapse:not(.show) {
	display: block !important;
	position: absolute;
	left: 88px;
	width: 250px;
	background: #fff;
	box-shadow: var(--shadow-md);
	border-radius: var(--radius-md);
	z-index: 1060;
	padding: var(--spacing-sm) 0;
	transform: translateX(-10px);
	opacity: 0;
	pointer-events: none;
}
.sidebar.collapsed ul li:hover > ul.collapse {
	opacity: 1;
	pointer-events: auto;
	transform: translateX(0);
}

.sidebar .top-section {
	padding-top: 10px;
}

.sidebar .bottom-section {
	padding-top: 10px;
	border-top: 1px solid #eee;
	margin-top: var(--spacing-md);
	display: flex;
	flex-direction: column;
}

/* Navbar */
.navbar {
	border-bottom: 1px solid #eee;
	padding: var(--spacing-sm) var(--spacing-md);
	z-index: 1020;
}
.navbar-toggler {
	border: none;
	font-size: 1.5rem;
	color: var(--font-color-dark);
}
.navbar-toggler:focus {
	box-shadow: none;
}
.navbar-brand {
	font-family: var(--font-heading);
	font-weight: 600;
	color: var(--font-color-dark);
	font-size: 15px;
}

/* Content area */
#content {
	transition: margin-left 0.3s ease, width 0.3s ease;
	margin-left: 280px;
	width: calc(100% - 280px);
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}
#content > .navbar {
	padding-left: var(--spacing-md);
	padding-right: var(--spacing-md);
}
#content > div:last-child {
	flex-grow: 1;
}
.content-page {
	margin-left: 30px;
}

/* =========================================
   Cards & Components
========================================= */
.card {
	background: #fff;
	border-radius: 15px;
	box-shadow: var(--shadow-md);
	margin-bottom: 20px;
	transition: transform 0.1s ease-in-out;
}
.card:hover {
	transform: translateY(-2px);
}
.card-image {
	width: 100%;
	max-height: 350px;
	object-fit: cover;
	border-radius: 15px;
}
.card-text {
	padding: 15px;
}
.lift:hover {
	transform: scale(1.03);
}

.widget-card {
	display: flex;
	flex-direction: column;
	padding: var(--spacing-md);
	background: var(--bs-white);
	border-radius: var(--radius-md);
	box-shadow: var(--shadow-sm);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	height: 100%;
}
.widget-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
}
.widget-icon {
	font-size: 2.2rem;
	margin-bottom: var(--spacing-xs);
}
.widget-title {
	font-family: var(--font-heading);
	font-size: 1.05rem;
	color: var(--font-color-secondary);
	margin-bottom: var(--spacing-xs);
}
.widget-desc {
	font-size: 0.9rem;
	color: #6c757d;
	margin-bottom: var(--spacing-sm);
	flex-grow: 1;
}
.widget-btn {
	display: inline-block;
	text-transform: uppercase;
	font-size: 0.75rem;
	letter-spacing: 0.05em;
	padding: 0.5rem 1rem;
	border: none;
	border-radius: var(--radius-sm);
	transition: background 0.3s ease;
}

/* Profile card */
.profile-card {
	border-radius: 12px;
	overflow: hidden;
}
.profile-card .card-header {
	padding: 0;
	position: relative;
	overflow: hidden;
	background: #fff;
}
.profile-card .card-header img {
	display: block;
	width: 100%;
	height: 170px;
	object-fit: cover;
}
.profile-card .card-body {
	margin-top: -30px;
	background: #fff;
	border-top: none;
	border-radius: 0 0 12px 12px;
}
.profile-info h5 {
	color: #3a3f5b;
	font-size: 24px;
	font-weight: 600;
}
.profile-info small {
	color: #3a3f5cc4;
}

/* Pasti / timeline */
.pasti-timeline {
	display: flex;
	flex-direction: column;
}
.pasto-card {
	background: linear-gradient(90deg, #c9eaff 60%, #e3f7fa 100%);
	border-radius: 12px;
	box-shadow: 0 2px 6px rgba(60, 125, 172, 0.07);
	padding: 10px;
	transition: box-shadow 0.2s;
}
.pasto-card:hover {
	box-shadow: 0 4px 12px rgba(60, 125, 172, 0.13);
}
.pasto-nome {
	font-size: 1.1rem;
	color: #2482b6;
}
.pasto-info {
	font-size: 1rem;
	color: #36454f;
	gap: 1rem;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}
.pasto-info .icon {
	font-size: 1.05em;
	margin-right: 2px;
	vertical-align: -2px;
}

.badge-bs-primary {
	background-color: var(--bs-primary);
	color: rgb(40, 40, 40);
}

.badge-bs-secondary {
	background-color: var(--bs-secondary);
	color: rgb(40, 40, 40);
}

.badge-bs-success {
	background-color: var(--bs-success);
	color: rgb(40, 40, 40);
}

.badge-bs-info {
	background-color: var(--bs-info);
	color: rgb(40, 40, 40);
}

.badge-bs-warning {
	background-color: var(--bs-warning);
	color: rgb(40, 40, 40);
}

.badge-bs-danger {
	background-color: var(--bs-danger);
	color: rgb(40, 40, 40);
}

/* Badge gusti */
.gusti-badges,
.gusti-badges-evita {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 0.5em;
}
.badge-gusto {
	background: linear-gradient(90deg, #c9eaff 60%, #e3f7fa 100%);
	color: #17669a;
	border-radius: 1.1rem;
	padding: 0.3em 1.1em;
	font-size: 1.01em;
	font-weight: 500;
	box-shadow: 0 1px 3px rgba(30, 110, 150, 0.05);
	white-space: nowrap;
}
.badge-gusto-evita {
	background: linear-gradient(90deg, #ffc9c9 0%, #ffdddd 100%);
	color: #b30000;
	border-radius: 1.1rem;
	padding: 0.3em 1.1em;
	font-size: 1.01em;
	font-weight: 500;
	white-space: nowrap;
	border: 1px solid #ffa5a5;
}
.badge-altri-gusti {
	background: linear-gradient(90deg, #c9ffcc 60%, #e3fae7 100%);
	color: #179a5b;
	border-radius: 1.1rem;
	padding: 0.3em 1.1em;
	font-size: 1.01em;
	font-weight: 500;
	box-shadow: 0 1px 3px rgba(30, 110, 150, 0.05);
}

/* Image header overlay */
.image-header {
	position: relative;
	width: 100%;
}
.image-header img {
	display: block;
	width: 100%;
	height: 250px;
	object-fit: cover;
}
.image-header .overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(0deg, #ec9f11, transparent);
}

/* Image radio */
.image-radio {
	cursor: pointer;
	filter: grayscale(100%);
	transition: filter 0.3s;
	width: 100px;
	height: 100px;
	object-fit: cover;
	border: 2px solid transparent;
	border-radius: 10px;
}
.image-radio.selected {
	filter: grayscale(0%);
	border-color: #007bff;
}
.image-radio-container {
	display: flex;
	margin: 10px;
	flex-direction: column;
	text-align: center;
	align-items: center;
}
.hidden-radio {
	display: none;
}
.image-radio-text {
	font-weight: 600;
}
.image-radio-description {
	font-size: 13px;
	display: block;
}

/* Progress */
.progress {
	height: 10px;
	border-radius: var(--radius-lg);
	background: var(--bs-light);
}
.progress-bar {
	border-radius: var(--radius-lg);
	background: #02473a;
}
.progress-bar-gradient {
	background: var(--gradient-2);
}

/* Tables */
.table,
.table-avylia {
	width: 100%;
	background: #fff;
	color: var(--font-color-dark);
	border-radius: var(--radius-md);
	overflow: hidden;
	border-collapse: collapse;
	box-shadow: var(--shadow-md);
}
.table thead,
.table-avylia thead {
	background: var(--gradient-1);
	color: #fff;
	text-transform: uppercase;
	font-weight: 600;
	font-family: var(--font-heading);
	font-size: 0.9rem;
}
.table th,
.table td,
.table-avylia th,
.table-avylia td {
	padding: 0.75rem 1rem;
	vertical-align: middle;
	border-bottom: 1px solid #f0f0f0;
}
.table-striped-pastel tbody tr:nth-of-type(odd) {
	background: rgba(166, 192, 254, 0.1);
}
.table-hover tbody tr:hover {
	background: rgba(161, 224, 255, 0.15);
}

/* Pagination */
.page-link {
	display: block;
	padding: 0.5rem 0.75rem;
	color: #04473b;
	background: #fff;
	border: 1px solid #dcdcdc;
	transition: color 0.15s, background-color 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.active > .page-link,
.page-link.active {
	color: #fff;
	background: #04473b;
	border-color: #04473b;
}

/* Alerts & Badges */
.alert {
	border-radius: var(--radius-md);
	padding: var(--spacing-md);
	color: var(--font-color-dark);
	background: #fff;
	border: 1px solid #eee;
}
.alert-pastel-primary {
	background: rgba(166, 192, 254, 0.2);
	border-color: var(--bs-primary);
}
.alert-pastel-success {
	background: rgba(185, 251, 192, 0.2);
	border-color: var(--bs-success);
}
.alert-disabled,
.alert-disabled h3 {
	color: #7f8c8d !important;
}

.badge {
	padding: 0.5em 0.8em;
	border-radius: 5px;
	font-weight: 400;
}

.badge-gradient {
	background: var(--gradient-3);
	color: #fff;
}

.badge-gradient-2 {
	background: linear-gradient(to right, #d29cd8, #54c2da);
	color: #fff;
}

/* Misc */
.canvas,
canvas {
	max-width: 100%;
	height: auto;
}
.obiettivo {
	font-size: 22px;
	font-weight: 500;
	color: #1e1e1e;
}
.suggestion {
	font-weight: 300 !important;
	font-size: 15px !important;
}
.pasto {
	background: #f3f3f3;
	padding: 10px;
	border-radius: 15px;
}
.bg-green {
	background: var(--brand-dark);
	color: #fff;
}
.content-header {
	padding: 5px 0 15px;
}
.print {
	padding: 5px !important;
}

/* =========================================
   Responsive (<=768px)
========================================= */
@media (max-width: 768px) {
	/* Sidebar mobile (off-canvas) */
	.sidebar {
		left: -300px;
	}
	.sidebar.show {
		left: 0;
	}
	.navbar-toggler {
		display: block;
	}

	/* Content non shift su mobile */
	#content {
		margin-left: 0;
		width: 100%;
		position: relative;
	}
	/* Overlay scuro quando sidebar è aperta */
	.sidebar.show + #content::before {
		content: "";
		position: fixed;
		inset: 0;
		background: rgba(0, 0, 0, 0.4);
		z-index: 1040;
		display: block;
		opacity: 1;
	}

	/* Submenu statici su mobile */
	.sidebar ul ul {
		position: static;
		width: auto;
		box-shadow: none;
		background: transparent;
		margin-left: var(--spacing-md);
	}
	.sidebar ul ul.collapse {
		display: none;
	}
	.sidebar ul ul.collapse.show {
		display: block;
	}

	.content-page {
		margin-left: 0;
	}

	/* Progress leggibile */
	.progress {
		font-size: 14px;
		padding: 5px;
	}

	/* Tabelle -> cards */
	.table-avylia {
		display: block;
		width: 100%;
	}
	.table-avylia thead {
		display: none;
	}
	.table-avylia tbody {
		display: flex;
		flex-direction: column;
		gap: 1rem;
	}
	.table-avylia tr {
		display: block;
		background: #fff;
		padding: 1rem;
		border-radius: var(--radius-md);
		box-shadow: var(--shadow-sm);
	}
	.table-avylia td {
		display: flex;
		justify-content: space-between;
		padding: 0.5rem 0;
		border: none;
	}
	.table-avylia td::before {
		content: attr(data-label);
		font-weight: 600;
		color: var(--font-color-secondary);
	}

	/* Pasti */
	.pasto-card {
		padding: 0.8rem 0.7rem;
		font-size: 0.98rem;
	}
	.pasto-info {
		flex-direction: column;
		gap: 0.3rem;
	}
}

/* Accordion "card-like" su mobile */
.misure-acc .accordion-item {
	border: none;
	border-radius: 14px;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
	margin-bottom: 12px;
	overflow: hidden;
	background: #fff;
}
.misure-acc .accordion-button {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.25rem;
}

.accordion-button::after {
	position: relative;
	top: -25px !important;
	height: auto;
}

.btn-xs {
	font-size: 13px;
	font-weight: 500;
}

/* riga alta */
.misure-acc .acc-row-top,
.misure-acc .acc-row-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	min-width: 0;
}

.misure-acc .acc-row-bottom {
	display: block;
	width: 100%;
	min-width: 0;
}

.misure-acc .accordion-button:focus {
	box-shadow: none;
}

/* chip fonte */
.misure-acc .pill {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.85rem;
	background: #f5f7fb;
	border: 1px solid #eef0f4;
	color: #394150;
	padding: 0.25rem 0.5rem;
	border-radius: 999px;
	white-space: nowrap;
}

/* data/ora */
.misure-acc .acc-date {
	font-size: 0.9rem;
	color: #5b556d;
	white-space: nowrap;
}

.misure-acc .acc-ago {
	font-size: 0.9rem;
	color: #5b556d;
	float: right;
	white-space: nowrap;
}

/* nome */
.misure-acc .acc-name {
	font-weight: 600;
	color: #2f2e41;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* caret (freccia) */
.misure-acc .caret {
	font-size: 1rem;
	color: #5b556d;
	flex: 0 0 auto;
	margin-left: 0.5rem;
}

.misure-acc .actions {
	display: flex;
	gap: 0.5rem;
}
.misure-acc .actions .btn {
	border-radius: 10px;
	border: 1px solid #e9e9ef;
	background: #fff;
	padding: 0.45rem 0.6rem;
}

/* --- BLOCCO ANTI-SCROLL ORIZZONTALE --- */
html,
body {
	max-width: 100%;
	overflow-x: hidden; /* rete di sicurezza */
}

/* Il main è un flex-child: con min-width:auto può generare overflow */
.main,
#content {
	min-width: 0; /* fondamentale in layout flex */
}

/* Evita elementi a larghezza viewport piena dentro contenitori con padding */
.container,
.container-fluid,
.content-page,
.content-body {
	max-width: 100%;
	overflow-x: hidden;
}

/* Se hai usato width calcolate custom, evita forzature desktop su mobile */
@media (max-width: 768px) {
	#content {
		margin-left: 0 !important;
		width: 100% !important;
	}
}

/* telefoni piccolissimi: consenti il wrap del nome */
@media (max-width: 360px) {
	.misure-acc .acc-name {
		white-space: normal;
	}
}

/* Accordion mobile: fai “schiacciare” correttamente le parti */
.misure-acc .accordion-button {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex-wrap: nowrap;
}
.misure-acc .accordion-button > * {
	min-width: 0;
} /* consente shrink */
.misure-acc .acc-name {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap; /* evita che spinga fuori lo schermo */
}
.misure-acc .acc-date {
	flex: 0 0 auto;
	white-space: nowrap;
}
@media (max-width: 360px) {
	/* su telefoni piccolissimi permetto il wrap del nome */
	.misure-acc .accordion-button {
		flex-wrap: wrap;
	}
	.misure-acc .acc-name {
		white-space: normal;
	}
}

/* Tabella desktop: niente min-width ereditati indesiderati */
.table-responsive,
.table {
	max-width: 100%;
}

/* Se in passato hai usato min-width per forzare lo scroll, disattivalo per l’accordion */
.table-scroll,
.chart-wrapper,
.image-header {
	width: 100%;
	max-width: 100%;
}

/* Accordion pazienti (mobile) */
.patients-acc .accordion-item {
	border: none;
	border-radius: 14px;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
	margin-bottom: 12px;
	overflow: hidden;
	background: #fff;
}
.patients-acc .accordion-button {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 0.25rem;
	background: #fff;
}
.patients-acc .row-top,
.patients-acc .row-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	min-width: 0;
}
.patients-acc .user {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	min-width: 0;
}
.patients-acc .avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	object-fit: cover;
	flex: 0 0 auto;
}
.patients-acc .name {
	font-weight: 600;
	color: #2f2e41;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.patients-acc .contact {
	font-size: 0.9rem;
	color: #5b556d;
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: 2px;
	white-space: nowrap;
}
.patients-acc .actions {
	display: flex;
	gap: 0.5rem;
	justify-content: flex-end;
	width: 100%;
}
.patients-acc .actions .btn {
	border-radius: 10px;
	border: 1px solid #e9e9ef;
	background: #fff;
	padding: 0.45rem 0.6rem;
}

.card-img-custom {
	width: 100%;
	object-fit: cover;
	display: block;
	/* Mobile: immagine sopra al contenuto */
	max-height: 150px;
	border-top-left-radius: var(--bs-border-radius-xxl);
	border-top-right-radius: var(--bs-border-radius-xxl);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

/* Wrapper che decide il comportamento */
.cards-wrapper {
	display: flex;
	gap: 1rem;
}

.cards-wrapper .card {
	height: min-content;
}

/* Le card normali in griglia */
.cards-wrapper .card-hscroll {
	flex: 1 1 calc(33.333% - 1rem); /* 3 per riga su desktop */
	min-width: 280px;
}

/* --- Mobile --- */
@media (max-width: 767.98px) {
	.cards-wrapper {
		flex-wrap: nowrap; /* niente a capo */
		overflow-x: auto; /* scroll orizzontale */
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
		padding-inline: 1rem;
	}
	.cards-wrapper .card-hscroll {
		flex: 0 0 auto; /* larghezza fissa per scorrere */
		min-width: 260px;
		max-width: 300px;
		scroll-snap-align: start;
	}
}