
div.mainmenu.budget::before {
	content: "\f249";
}
div.mainmenu.budget {
	background-image: none;
}

.myclasscss {
	/* ... */
}

/* ===================================================================
 * Styles pour la page de comparaison budget
 * ===================================================================*/

/* Wrapper et structure du tableau */
.budget-compare-wrapper {
	max-height: calc(100vh - 300px);
	overflow: auto;
	border: 1px solid #ddd;
	margin: 10px 0;
}

.budget-compare-table {
	width: max-content;
	min-width: 100%;
	border-collapse: collapse;
}

/* En-têtes collants */
.budget-compare-table thead th {
	position: sticky;
	top: 0;
	background: #f5f5f5;
	z-index: 10;
	border-bottom: 2px solid #888;
}

/* Colonnes fixes (Type et Label) */
.budget-compare-table .col-type,
.budget-compare-table .col-label {
	position: sticky;
	background: white;
	z-index: 5;
}

.budget-compare-table thead .col-type,
.budget-compare-table thead .col-label {
	background: #f5f5f5;
	z-index: 11;
}

.budget-compare-table .col-type {
	left: 0;
	min-width: 100px;
}

.budget-compare-table .col-label {
	left: 100px;
	min-width: 180px;
}

/* Colonne Total fixe à droite */
.budget-compare-table .col-total {
	position: sticky;
	right: 0;
	background: white;
	z-index: 5;
	min-width: 140px;
}

.budget-compare-table thead .col-total {
	background: #f5f5f5;
	z-index: 11;
}

/* Ligne de total en bas */
.budget-compare-table .liste_total td {
	position: sticky;
	bottom: 0;
	background: #e8e8e8;
	z-index: 10;
	border-top: 2px solid #888;
}

.budget-compare-table .liste_total .col-type,
.budget-compare-table .liste_total .col-label {
	z-index: 11;
}

.budget-compare-table .liste_total .col-total {
	z-index: 11;
}

/* Cellules du tableau */
.budget-compare-table td,
.budget-compare-table th {
	padding: 4px 8px;
	border: 1px solid #ddd;
}

.budget-compare-table .oddeven:hover {
	background: #f0f0f0 !important;
}

/* ===================================================================
 * STYLES PERSONNALISABLES POUR LES SECTIONS BUDGÉTÉES
 * Modifiez ces styles selon vos préférences
 * ===================================================================*/

/* Titre des sections budgétées (Revenus Budgétés, Dépenses Budgétées) */
.budget-section-header {
	font-style: italic;
	color: red;
	font-weight: bold;
}

/* Lignes de détail budgétées */
.budget-row-detail {
	font-style: italic;
}

/* Lignes de sous-total budgétées */
.budget-row-subtotal {
	font-style: italic;
}

/* Cellules de valeurs dans les en-têtes budgétés (totaux mensuels) */
.budget-header-value {
	font-weight: normal;
	/* Décommentez la ligne suivante pour mettre en gras : */
	/* font-weight: bold; */
}

/* Couleurs de fond des sections - Correspondance avec la légende */
.budget-bg-budgeted {
	background: #e0e0e0;  /* Gris clair pour les sections budgétées */
}

.budget-bg-paid {
	background: #c8e6c9;  /* Vert pour les revenus payés */
}

.budget-bg-unpaid {
	background: #fff9c4;  /* Jaune pour les revenus en attente */
}

.budget-bg-signed {
	background: #b3e5fc;  /* Bleu pour les revenus signés */
}

.budget-bg-opportunities {
	background: #e1bee7;  /* Violet pour les opportunités */
}

.budget-bg-expense-actual {
	background: #ffe0b2;  /* Orange pour les dépenses réalisées */
}

/* ===================================================================
 * RESPONSIVE TABLES - Issues #9 et #10
 * Tables with horizontal scroll for month columns, sticky first column
 * ===================================================================*/

/* Wrapper général pour les tableaux responsive */
.budget-responsive-wrapper {
	position: relative;
	overflow-x: auto;
	overflow-y: visible;
	-webkit-overflow-scrolling: touch; /* Smooth scrolling sur iOS */
	margin: 0 0 20px 0;
	border: 1px solid #ddd;
	border-radius: 4px;
}

/* Table responsive - première colonne fixe */
.budget-responsive-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	min-width: 100%;
}

/* Première colonne sticky (catégorie/label) */
.budget-responsive-table thead th:first-child,
.budget-responsive-table tbody td:first-child {
	position: sticky;
	left: 0;
	z-index: 10;
	background: #fff;
	box-shadow: 2px 0 4px rgba(0,0,0,0.1); /* Ombre pour marquer la séparation */
	min-width: 100px;
	max-width: 120px;
	font-size: 11px;
	padding: 6px 4px;
}

/* Surcharge pour lignes avec background coloré */
.budget-responsive-table tbody tr[style*="background"] td:first-child {
	background: inherit !important; /* Garde la couleur de la ligne */
}

/* En-têtes de colonnes mois */
.budget-responsive-table thead th {
	white-space: nowrap;
	padding: 8px;
	font-size: 11px;
	min-width: 80px;
}

/* Cellules de données */
.budget-responsive-table tbody td {
	padding: 6px 8px;
	font-size: 12px;
	white-space: nowrap;
}

/* Première colonne - tronquer les textes longs */
.budget-responsive-table tbody td:first-child,
.budget-responsive-table thead th:first-child {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Colonne totaux - légèrement sticky à droite si nécessaire */
.budget-responsive-table .col-total {
	background: #f5f5f5;
	font-weight: bold;
	min-width: 100px;
}

/* ===================================================================
 * RESPONSIVE - Media queries pour petits écrans
 * ===================================================================*/

@media screen and (max-width: 1024px) {
	/* Réduire encore les tailles sur tablettes */
	.budget-responsive-table thead th {
		font-size: 10px;
		padding: 6px 4px;
		min-width: 70px;
	}
	
	.budget-responsive-table tbody td {
		font-size: 11px;
		padding: 5px 4px;
	}
	
	.budget-responsive-table thead th:first-child,
	.budget-responsive-table tbody td:first-child {
		min-width: 85px;
		max-width: 100px;
		font-size: 10px;
	}
}

@media screen and (max-width: 768px) {
	/* Mobile - formats encore plus compacts */
	.budget-responsive-table thead th {
		font-size: 9px;
		padding: 4px 2px;
		min-width: 60px;
	}
	
	.budget-responsive-table tbody td {
		font-size: 10px;
		padding: 4px 2px;
	}
	
	.budget-responsive-table thead th:first-child,
	.budget-responsive-table tbody td:first-child {
		min-width: 70px;
		max-width: 85px;
		font-size: 9px;
	}
	
	.budget-responsive-wrapper {
		border-radius: 0; /* Supprime les coins arrondis sur mobile */
		margin-left: -10px;
		margin-right: -10px;
	}
}

/* ===================================================================
 * EXEMPLES DE PERSONNALISATION
 * Décommentez et modifiez selon vos besoins
 * ===================================================================*/

/* Pour changer la couleur du texte des titres :
.budget-section-header {
	color: #333;
}
*/

/* Pour retirer l'italique des lignes de détail :
.budget-row-detail {
	font-style: normal;
}
*/

/* Pour changer les couleurs de fond :
.budget-bg-revenue {
	background: #e8f5e9;
}
.budget-bg-expense {
	background: #fff9c4;
}
*/

/* Pour ajouter une bordure aux sections :
.budget-section-header {
	border-top: 3px solid #333;
}
*/

/* ===================================================================
 * STYLES D'IMPRESSION PDF
 * ===================================================================*/
@media print {
	/* Masquer les éléments de navigation Dolibarr */
	#id-left,
	.side-nav,
	.tabsAction,
	.pagination,
	#formmailbeforetitle,
	.nextlink,
	.backlink,
	#id-top,
	header.header,
	.login_block,
	.login_block_user,
	.login_block_other,
	/* Masquer le formulaire de sélection */
	.ytd-selector,
	/* Masquer les onglets de navigation */
	div.tabs,
	ul.tabs,
	.tabBar.tabBarWithBottom,
	/* Masquer le footer */
	footer,
	#footer,
	.vmenu,
	.menu_titre,
	.blockvmenuimpair,
	.blockvmenupair {
		display: none !important;
	}
	
	/* Forcer le contenu principal à occuper toute la largeur */
	body {
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		background: white !important;
	}
	
	#id-container {
		width: 100% !important;
		margin: 0 !important;
		padding: 10px !important;
	}
	
	.fiche {
		width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		border: none !important;
	}
	
	/* S'assurer que le contenu principal est visible */
	.fichecenter,
	.fichehalfright,
	.fichehalfleft {
		display: block !important;
		width: 100% !important;
		page-break-inside: avoid;
	}
	
	/* Afficher les titres */
	h1, h2, h3, h4 {
		display: block !important;
		page-break-after: avoid;
		color: #000 !important;
	}
	
	/* Optimiser l'affichage des tableaux */
	table {
		page-break-inside: avoid;
		font-size: 10pt;
		width: 100% !important;
	}
	
	/* Optimiser les graphiques pour l'impression */
	canvas {
		page-break-inside: avoid;
		max-width: 100% !important;
		display: block !important;
	}
	
	/* Optimiser les cartes KPI */
	.kpi-card {
		page-break-inside: avoid;
		margin-bottom: 10px !important;
	}
	
	/* Garder les couleurs de fond pour la lisibilité */
	* {
		-webkit-print-color-adjust: exact !important;
		print-color-adjust: exact !important;
		color-adjust: exact !important;
	}
}

/* =========================================================================
 * Inline action icon buttons in budget list (archive / unarchive / purge)
 * Rendered as POST forms for CSRF protection; the button needs to look like
 * a plain icon link.
 * ========================================================================= */
.budget-icon-button {
	background: none;
	border: 0;
	padding: 0 6px 0 0;
	cursor: pointer;
	color: inherit;
	font: inherit;
	vertical-align: middle;
}
.budget-icon-button:hover { opacity: 0.75; }
.budget-icon-button--danger { color: #c00; }

.js-inline-action-form {
	display: inline-block;
	margin: 0;
}

/* Read-only banner on budget card / forecast / edit / evolution */
.budget-banner-readonly {
	margin-bottom: 10px;
}
.budget-banner-icon {
	margin-right: 8px;
}
.budget-banner-form {
	display: inline-block;
	margin: 0 0 0 8px;
}

/* View mode toggle (full period / from current month onward) — Issue #22 */
.budget-view-mode-toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 6px 0 10px;
	font-size: 11px;
}
.budget-view-mode-toggle .budget-view-mode-label {
	color: #888;
	text-transform: uppercase;
	letter-spacing: 0.3px;
	font-size: 10px;
}
.budget-view-mode-toggle .budget-segmented {
	display: inline-flex;
	border: 1px solid #d0d0d0;
	border-radius: 14px;
	overflow: hidden;
	background: #f8f8f8;
	line-height: 1;
}
.budget-view-mode-toggle .budget-segmented__item {
	display: inline-block;
	padding: 4px 12px;
	color: #555;
	text-decoration: none;
	font-size: 11px;
	font-weight: normal;
	white-space: nowrap;
	transition: background-color 0.12s ease, color 0.12s ease;
}
.budget-view-mode-toggle .budget-segmented__item + .budget-segmented__item {
	border-left: 1px solid #d0d0d0;
}
.budget-view-mode-toggle .budget-segmented__item:hover {
	background: #ececec;
	color: #222;
}
.budget-view-mode-toggle .budget-segmented__item.is-active {
	background: #573f82;
	color: #fff;
	font-weight: 600;
}
.budget-view-mode-toggle .budget-segmented__item.is-active:hover {
	background: #453166;
}

/* Inline utility (archive/unarchive buttons in tabsAction) */
.inline-block { display: inline-block; }
