.fournee-graph {
	position: relative;
}

.fournee-graph svg {
	max-width: 100%;
	height: auto;
	display: block;
}

.fournee-graph__svg {
	overflow: visible;
}

.axis {
	stroke: #6e4e33;
	stroke-width: 2.2;
}

.tick {
	stroke: #6e4e33;
	stroke-width: 1.8;
}

.curve {
	fill: none;
	stroke: #6a4a30;
	stroke-width: 4;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.small {
	fill: #6b5a4a;
	font-size: 14px;
	font-family: Georgia, "Times New Roman", serif;
}

.zone-stroke {
	stroke: rgba(255, 255, 255, 0.55);
	stroke-width: 1.2;
}

.badge {
	fill: white;
	stroke: #6a4a30;
	stroke-width: 1.8;
}

.badge-text {
	fill: #3f3126;
	font-size: 16px;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 700;
	text-anchor: middle;
	dominant-baseline: middle;
}

.separator-band {
	fill: #6a4a30;
	opacity: 0.05;
}

.separator-line {
	stroke: #6a4a30;
	stroke-width: 1.8;
	stroke-dasharray: 7 8;
	opacity: 0.45;
}

.z1 { fill: #b85a1b; }
.z2 { fill: #cf7a1c; }
.z3 { fill: #d8a128; }
.z4 { fill: #a47f4f; }
.z5 { fill: #7f7b46; }
.z6 { fill: #627b74; }
.z7 { fill: #7a7a7a; }

.zone-opacity {
	opacity: 0.16;
	transition: opacity 0.25s ease;
}

.zone-group {
	cursor: pointer;
}

.zone-group:hover .zone-opacity,
.zone-group.is-active .zone-opacity {
	opacity: 0.32;
}

.fournee-graph__tooltips {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-top: 20px;
}

.fournee-graph__tooltip {
	display: none;
	background: #fff;
	border: 1px solid #6a4a30;
	border-radius: 12px;
	padding: 14px 16px;
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
	color: #3f3126;
}

.fournee-graph__tooltip.is-active {
	display: block;
}

.fournee-graph__tooltip-title {
	margin: 0 0 8px;
	font-size: 18px;
	line-height: 1.2;
	color: #3f3126;
}

.fournee-graph__tooltip-list {
	margin: 0;
	padding-left: 18px;
}

.fournee-graph__tooltip-link {
	display: inline-block;
	margin-top: 10px;
	text-decoration: none;
	font-weight: 600;
}

@media (max-width: 767px) {
	.fournee-graph__tooltips {
		grid-template-columns: 1fr;
	}
}