:root {
	--font-sans: 'Urbanist', 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
	--font-report: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body {
	padding: 0;
	font-family: var(--font-sans) !important;
}

div .el-tablo {
	text-decoration: none;
	display: block;
	color: #4a4534;
	-webkit-transition: all 0.25s ease;
	transition: all 0.25s ease;
}

div.el-tablo .value {
	-webkit-transition: all 0.25s ease;
	transition: all 0.25s ease;
}

div.el-tablo .label {
	-webkit-transition: all 0.25s ease;
	transition: all 0.25s ease;
}

div.el-tablo:hover {
	-webkit-transform: translateY(-5px) scale(1.02);
	transform: translateY(-5px) scale(1.02);
	box-shadow: 0px 5px 12px rgba(74, 69, 52, 0.18);
}

div.el-tablo:hover .value {
	-webkit-transform: translateY(-3px);
	transform: translateY(-3px);
	color: #6c6444;
}

div.el-tablo:hover .label {
	color: #7A7460;
}

div.el-tablo:hover.centered .value {
	-webkit-transform: scale(1.1) translateY(-3px);
	transform: scale(1.1) translateY(-3px);
}

div.el-tablo:hover .label {
	-webkit-transform: translateY(-2px);
	transform: translateY(-2px);
}

.modal-dialog:not(.modal-dialog-scrollable) .modal-content {
	max-height: calc(100vh - 3.5rem);
	overflow: hidden;
}

.modal-dialog:not(.modal-dialog-scrollable) .modal-body {
	overflow-y: auto;
	overflow-x: hidden;
}

/* Radios, cases a cocher et interrupteurs aux couleurs du theme au lieu du bleu Bootstrap.
   Le khaki est deja l'accent de l'app (.btn-primary, .ssamta_icon_primary, --sdr-accent) : le bleu
   des controles n'etait que le defaut Bootstrap jamais surcharge. Ancre sur .custom-control pour
   gagner par specificite et non par ordre de chargement (theme/main.css declare le meme selecteur).
   Les etats de validation (.was-validated ... :invalid) restent prioritaires : ils sont plus specifiques. */
.custom-control .custom-control-input:checked ~ .custom-control-label::before {
	color: #fff;
	background-color: var(--ssamta-control-accent);
	border-color: var(--ssamta-control-accent);
}

.custom-control.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
	background-color: var(--ssamta-control-accent);
	border-color: var(--ssamta-control-accent);
}

.custom-control .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
	border-color: var(--ssamta-control-accent);
}

/* Anneau de focus opaque : conserve le liseret blanc de Bootstrap comme separateur, sinon le halo
   translucide tombe sous le ratio 3:1 exige par WCAG 2.2 sur les fonds creme de l'app. */
.custom-control .custom-control-input:focus ~ .custom-control-label::before {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--ssamta-control-accent);
}

.custom-control .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
	color: #fff;
	background-color: var(--ssamta-control-accent-soft);
	border-color: var(--ssamta-control-accent-soft);
}

.custom-control.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before,
.custom-control.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before,
.custom-control.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before,
.custom-control.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
	background-color: var(--ssamta-control-accent-muted);
	border-color: var(--ssamta-control-accent-muted);
}

/* Cases a cocher natives (hors Blazorise), ex. les filtres du rapport de projet moderne :
   l'input est visible, donc accent-color et outline s'appliquent reellement. */
input[type="checkbox"],
input[type="radio"],
.form-check-input {
	accent-color: var(--ssamta-control-accent);
}

input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
	outline: 2px solid var(--ssamta-control-accent);
	outline-offset: 2px;
}

/* Grilles sur petit ecran (moins de 1600px). */
@media (max-width: 1599.98px) {
	/* Badge provisoire : la colonne date des grilles de paiement est passee de 95px a 190px (date +
	   badge en ligne) et des colonnes fixes se sont ajoutees. En mise en page fixe, quand le panneau
	   de criteres est ouvert, ces largeurs mangent l'espace et les colonnes flexibles (Paye a,
	   Resume des commentaires) s'ecrasent en texte vertical. On resserre les colonnes fixes pour que
	   le contenu se repartisse dans l'espace disponible comme avant : le badge passe sous la date au
	   besoin. Panneau ferme ou grand ecran, rien ne change. */
	body:has(#sidepanel.is-open) .ssamta-topay-grid th.ssamta-tablecol-190px {
		width: 120px;
	}

	body:has(#sidepanel.is-open) .ssamta-topay-grid th.ssamta-tablecol-125px {
		width: 100px;
	}

	/* En-tete des grilles : l'en-tete (datagrid-topMenu, CdrhpnqLibs) est un flex sans retour a la
	   ligne. Quand la place manque, le champ de recherche est ecrase en filet et le bloc d'actions
	   de droite deborde de la carte (ex. Paiements etape 1 en 1366x768). On autorise le passage a la
	   ligne et on fixe la largeur du champ de recherche au lieu de le laisser retrecir. */
	.datagrid-topMenu > .d-flex {
		flex-wrap: wrap;
		row-gap: 8px;
	}

	.datagrid-topMenu .table-search-zone {
		flex-wrap: wrap;
		row-gap: 8px;
	}

	.datagrid-topMenu .table-search-zone > .form-control {
		width: 180px;
		flex: 0 0 180px;
	}

	.datagrid-topMenu > .d-flex > div:last-child {
		margin-left: auto;
	}
}


/* Radios, cases a cocher et interrupteurs aux couleurs du theme au lieu du bleu Bootstrap.
   Le khaki est deja l'accent de l'app (.btn-primary, .ssamta_icon_primary, --sdr-accent) : le bleu
   des controles n'etait que le defaut Bootstrap jamais surcharge. Ancre sur .custom-control pour
   gagner par specificite et non par ordre de chargement (theme/main.css declare le meme selecteur).
   Les etats de validation (.was-validated ... :invalid) restent prioritaires : ils sont plus specifiques. */
.custom-control .custom-control-input:checked ~ .custom-control-label::before {
	color: #fff;
	background-color: var(--ssamta-control-accent);
	border-color: var(--ssamta-control-accent);
}

.custom-control.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
	background-color: var(--ssamta-control-accent);
	border-color: var(--ssamta-control-accent);
}

.custom-control .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
	border-color: var(--ssamta-control-accent);
}

/* Anneau de focus opaque : conserve le liseret blanc de Bootstrap comme separateur, sinon le halo
   translucide tombe sous le ratio 3:1 exige par WCAG 2.2 sur les fonds creme de l'app. */
.custom-control .custom-control-input:focus ~ .custom-control-label::before {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--ssamta-control-accent);
}

.custom-control .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
	color: #fff;
	background-color: var(--ssamta-control-accent-soft);
	border-color: var(--ssamta-control-accent-soft);
}

.custom-control.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before,
.custom-control.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before,
.custom-control.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before,
.custom-control.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
	background-color: var(--ssamta-control-accent-muted);
	border-color: var(--ssamta-control-accent-muted);
}

/* Cases a cocher natives (hors Blazorise), ex. les filtres du rapport de projet moderne :
   l'input est visible, donc accent-color et outline s'appliquent reellement. */
input[type="checkbox"],
input[type="radio"],
.form-check-input {
	accent-color: var(--ssamta-control-accent);
}

input[type="checkbox"]:focus-visible,
input[type="radio"]:focus-visible {
	outline: 2px solid var(--ssamta-control-accent);
	outline-offset: 2px;
}

/* Liens de contenu : bleu = cliquable (convention web), khaki reserve aux actions.
   Un lien khaki (#6c6444) ne se distingue pas du texte (#4a4534) a 1,6:1 — il faut 3:1
   ou un soulignement. Un seul bleu, celui du jeton --B500 ; les composants (nav, boutons,
   pagination, onglets) gardent leurs couleurs via leurs classes plus specifiques. */
a,
.btn-link {
	color: #2952CC;
}

a:hover,
.btn-link:hover {
	color: #1F3D99;
}

/* Dans les cellules de grilles et tableaux, le soulignement n'apparait qu'au survol. La colonne
   entiere est cliquable et se repete a chaque ligne : l'affordance vient de cette regularite, pas
   d'un trait permanent qui alourdit la lecture d'une longue liste. Le soulignement au repos reste
   la regle pour les liens noyes dans du texte courant, qui ne sont pas cibles ici.
   :focus-visible conserve le repere pour la navigation au clavier, ou il n'y a pas de survol. */
td a:not(.btn),
.Cdrhpnq-DataGridAsyncComponent a:not(.btn) {
	text-decoration: none;
}

td a:not(.btn):hover,
td a:not(.btn):focus-visible,
.Cdrhpnq-DataGridAsyncComponent a:not(.btn):hover,
.Cdrhpnq-DataGridAsyncComponent a:not(.btn):focus-visible {
	text-decoration: underline;
}

/* Spinners bleus de CdrhpnqLibs (#1486C9 : LoadingSpinnerComponent, DataGridAsyncComponent,
   DropdownSelect, GridDynamicIconText) : cibler la couleur en ligne les recolore en khaki
   sans toucher la librairie partagee ni les spinners volontairement blancs. */
[style*="1486C9"] {
	--sk-color: #6c6444 !important;
}

/* Les SpinKit sans HexColor (ex. GridRowQuickActions de CdrhpnqLibs) retombent sur le
   primaire du theme Blazorise (#2196f3) : le rediriger vers le khaki. */
:root {
	--b-theme-primary: #6c6444;
}

/* Barre de progression du Copilot PMO : Color.Primary Blazorise, pas de membre khaki
   dans l'enum et le Style du call-site tombe sur le rail, pas la barre. */
.copilot-bubble .progress .progress-bar {
	background-color: #6c6444 !important;
}

/* ==========================================================================
   Rebrand du "primary" du theme (#047bf8) sur les composants reellement
   rendus par l'app. theme/main.css compile ce bleu dans ~200 regles ; cette
   feuille est la derniere chargee, donc le meme selecteur suffit a gagner.
   Les composants de demo du gabarit (todo, chat, pipeline, support, rentals,
   menu-w, select2, onboarding...) ne sont pas utilises : non surcharges.
   ========================================================================== */

/* site.css n'impose le khaki qu'aux `button.btn-primary` : les liens stylises
   en bouton (<a class="btn btn-primary">, page 404, tableau de bord admin,
   liens Sage) heritaient donc du bleu de main.css, charge apres site.css.
   Meme palette que site.css pour que lien et bouton soient indiscernables. */
.btn-primary {
	color: #fff;
	background-color: #6c6444;
	border-color: #6c6444;
}

.btn-primary:focus, .btn-primary.focus {
	color: #fff;
	background-color: #5a533a;
	border-color: #5a533a;
	box-shadow: 0 0 0 0.2rem rgba(108, 100, 68, 0.5);
}

.btn-primary.disabled, .btn-primary:disabled {
	color: #fff;
	background-color: #a89f7d;
	border-color: #a89f7d;
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
	color: #fff;
	background-color: #5a533a;
	border-color: #5a533a;
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(108, 100, 68, 0.5);
}

/* Anneau de focus des champs : le bleu Bootstrap apparaissait sur chaque
   input / textarea de l'app. main.css supprime le halo (box-shadow: none),
   on le remet en khaki pour rester visible sur les fonds creme.
   Les etats de validation (.is-invalid:focus) restent plus specifiques. */
.form-control:focus {
	border-color: #6c6444;
	box-shadow: 0 0 0 0.2rem rgba(108, 100, 68, 0.25);
}

.custom-select:focus {
	border-color: #6c6444;
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(108, 100, 68, 0.25);
}

.custom-file-input:focus ~ .custom-file-label {
	border-color: #6c6444;
	box-shadow: 0 0 0 0.2rem rgba(108, 100, 68, 0.25);
}

/* Pagination des DataGrid : .page-item.active est deja khaki dans main.css,
   seuls le libelle au repos et son survol restaient bleus. */
.page-link {
	color: #6c6444;
}

.page-link:hover {
	color: #5a533a;
}

/* Selection dans les menus deroulants (Blazorise Dropdown). */
.dropdown-item.active, .dropdown-item:active {
	color: #fff;
	background-color: #6c6444;
}

/* Onglets Blazorise : le soulignement anime et l'icone de l'onglet actif. */
.nav-tabs .nav-link:after,
.nav-tabs .nav-item .nav-link:after {
	background-color: #6c6444;
}

.nav-link.active i {
	color: #6c6444;
}

.nav-pills .nav-link.active,
.nav-pills .nav-item.show .nav-link,
.nav-pills .show > .nav-link {
	color: #fff;
	background-color: #6c6444;
}

/* Utilitaires Bootstrap effectivement employes : .text-primary (compteurs et
   spinners des pages d'administration) et .btn-outline-primary (Sage,
   SystemAdministration, WhatsNew). .bg-primary est deja khaki dans main.css ;
   .border-primary et .badge-primary ne sont utilises nulle part. */
.text-primary {
	color: #6c6444 !important;
}

a.text-primary:hover, a.text-primary:focus {
	color: #5a533a !important;
}

.btn-outline-primary {
	color: #6c6444;
	border-color: #6c6444;
}

.btn-outline-primary:hover {
	color: #fff;
	background-color: #6c6444;
	border-color: #6c6444;
}

.btn-outline-primary:focus, .btn-outline-primary.focus {
	box-shadow: 0 0 0 0.2rem rgba(108, 100, 68, 0.5);
}

.btn-outline-primary.disabled, .btn-outline-primary:disabled {
	color: #6c6444;
	background-color: transparent;
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
	color: #fff;
	background-color: #5a533a;
	border-color: #5a533a;
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
	box-shadow: 0 0 0 0.2rem rgba(108, 100, 68, 0.5);
}

/* Infobulles Blazorise : par defaut, gris 128,128,128 semi-transparent sous du texte blanc —
   illisible sur les fonds clairs de l'application. Meme encre foncee que les infobulles des
   graphiques (chartDefaults.js et .dash-spark-tip : #3A362A), pleinement opaque. */
:root {
	--b-tooltip-background-color-r: 58;
	--b-tooltip-background-color-g: 54;
	--b-tooltip-background-color-b: 42;
	--b-tooltip-background-opacity: 1;
	--b-tooltip-color: #FFFFFF;
}
