/*
	Voici comment savoir où mettre ton CSS :
	C'est des classes qu'on a créé?				-> Ici (radzen-custom.css).
	Ça affecte seulement 1 component?			-> Dans un fichier scoped (ex: TonFicher.razor.css).
	Ça touche les classes de base de Radzen?	-> Dans les overrides (radzen-humanistic-overrides.css).
*/

/* ----- Inputs ----- */

/* Boutons */
.rz-button-icon-only-full-size-md {
	padding: 0.875rem !important;
}

.checkbox-with-label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}


/* ----- UI ----- */

/* Grids */
.rz-data-row.rz-data-row-desactive td:first-child {
	border-left: 0.5rem solid var(--rz-danger);
}

.rz-data-row.rz-data-row-desactive td {
	background-color: var(--gris-clair) !important;
}

/* Dialogs */
.rz-dialog-side.dialog-35 {
	width: 35%;
}

.rz-dialog-side.dialog-50 {
	width: 50%;
}

.rz-dialog-side.dialog-60 {
	width: 60%;
}

.rz-dialog-side.dialog-75 {
	width: 75%;
}

.rz-dialog-side.dialog-95 {
	width: 95%;
}

.rz-dialog.dialog-40 {
	width: 40% !important;
}

.rz-dialog-side-content .rz-dialog-side-footer {
	bottom: 0.75rem;
	left: 0.75rem;
	right: 0.75rem;
	position: absolute;
}

/* Ajoute la petite barre de couleur sous le titre */
h1:after {
	content: "";
	display: block;
	margin: 0;
	width: 3rem;
	padding-top: 0.25rem;
	border-bottom: 4px solid var(--accent);
}


/* Chips besoins informatiques */
.chip-pilote.rz-chip {
	background-color: var(--rz-primary) !important;
	color: var(--rz-on-primary) !important;
}

.chip-pilote.rz-chip .rz-chip-remove {
	color: var(--rz-on-primary) !important;
}

.chip-libre.rz-chip {
	background-color: var(--rz-secondary) !important;
	color: var(--rz-on-secondary) !important;
}

.chip-libre.rz-chip .rz-chip-remove {
	color: var(--rz-on-secondary) !important;
}