/*
 * Back-office menu styling.
 * Loaded after global.css; selectors are prefixed with body.gaia / #celMenuItems so they
 * also win over the dojo "gaia" theme, which is loaded later in the page body.
 */
:root {
	--gm-primary: #00524F;
	--gm-primary-soft: rgba(0, 82, 79, 0.08);
	--gm-primary-soft-strong: rgba(0, 82, 79, 0.14);
	--gm-table-border: 1.5px solid var(--gm-primary); /* every table cell, header and title bar: same width or the edges are offset */
	--gm-border: #b5bcc7; /* same grey as the questionnaire inputs (reponse.css) */
	--gm-surface: #eaecec;
	--gm-text: #2f3a39;
	--gm-muted: #6b7776;
	--gm-danger: #a8432a;
	--gm-danger-soft: rgba(168, 67, 42, 0.08);
}

/* ---------------------------------------------------------------- Context menu (company pages) */
body.gaia .wrapmenucontext {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px;
	width: auto;
}
body.gaia a.menucontext,
body.gaia a.menucontext:hover {
	float: none;
	left: 0;
	height: auto;
	padding: 2px 8px;
	border: 1px solid var(--gm-border);
	border-radius: 999px;
	font-size: 11px;
	letter-spacing: 0.04em;
	text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
body.gaia a.menucontext {
	background-color: #ffffff;
	color: var(--gm-text);
}
body.gaia a.menucontext:hover {
	background-color: var(--gm-primary);
	border-color: var(--gm-primary);
	color: #ffffff;
}

/* ---------------------------------------------------------------- Dojo menu bar (administration) */
body.gaia .dijitMenuBar {
	padding: 2px;
	border: 1px solid var(--gm-border);
	border-radius: 8px;
	background-color: #ffffff;
	background-image: none;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
}
body.gaia .dijitMenuBar .dijitMenuItem,
body.gaia .dijitMenuBar .dijitMenuItemHover,
body.gaia .dijitMenuBar .dijitMenuItemSelected {
	margin: 0 2px 0 0;
	padding: 5px 10px;
	border: 1px solid transparent;
	border-radius: 6px;
	background-image: none;
	color: var(--gm-text);
	transition: background-color 0.15s ease, color 0.15s ease;
}
body.gaia .dijitMenuBar .dijitMenuItemHover,
body.gaia .dijitMenuBar .dijitMenuItemSelected {
	background-color: var(--gm-primary-soft-strong);
	color: var(--gm-primary);
}
/* clicked item: same as hover, no solid green */
body.gaia .dijitMenuBar .dijitMenuItemActive {
	background-color: var(--gm-primary-soft-strong);
	background-image: none;
	color: var(--gm-primary);
}

/* dojo popup menus (opened from the menu bar) */
/* the theme puts a square shadow on the popup wrapper: it shows in the rounded corners of the menu */
body.gaia .dijitPopup.dijitMenuPopup {
	border-radius: 8px;
	box-shadow: none;
}
body.gaia .dijitMenuPopup .dijitMenu {
	padding: 2px;
	border: 1px solid var(--gm-border);
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
}
body.gaia .dijitMenuPopup .dijitMenuItem td {
	padding: 3px 6px;
	border-color: transparent;
	color: var(--gm-text);
}
body.gaia .dijitMenuPopup .dijitMenuItemHover,
body.gaia .dijitMenuPopup .dijitMenuItemSelected {
	background-color: transparent;
	background-image: none;
	border-color: transparent;
}
body.gaia .dijitMenuPopup .dijitMenuItemHover td,
body.gaia .dijitMenuPopup .dijitMenuItemSelected td {
	background-color: var(--gm-primary-soft-strong);
	background-image: none;
	border-color: transparent;
	color: var(--gm-primary);
}
body.gaia .dijitMenuPopup .dijitMenuItemHover td:first-child,
body.gaia .dijitMenuPopup .dijitMenuItemSelected td:first-child {
	border-radius: 6px 0 0 6px;
}
body.gaia .dijitMenuPopup .dijitMenuItemHover td:last-child,
body.gaia .dijitMenuPopup .dijitMenuItemSelected td:last-child {
	border-radius: 0 6px 6px 0;
}

/* ---------------------------------------------------------------- Dropdown menus (.dropdown / .dd-menu) */
body.gaia .dd-button {
	border-color: #c9d3d2;
	border-radius: 6px;
	padding: 3px 16px 3px 6px;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}
body.gaia .dd-button:hover {
	background-color: var(--gm-primary-soft);
	border-color: var(--gm-primary);
}
body.gaia .dd-menu {
	padding: 2px;
	border: 1px solid var(--gm-border);
	border-radius: 8px;
	box-shadow: 0 8px 24px rgba(16, 24, 40, 0.12);
}
body.gaia .dd-menu div {
	border: none;
	border-radius: 6px;
	padding: 5px 9px;
}
body.gaia .dd-menu div:hover {
	border: none;
	background-color: var(--gm-primary-soft-strong);
	background-image: none;
}
body.gaia .dd-menu div.divider {
	margin: 4px 0;
	padding: 0;
	border-radius: 0;
	border-bottom: 1px solid var(--gm-border);
}
body.gaia .dd-menu div.divider:hover,
body.gaia .dd-menu div.disabled:hover {
	background-color: transparent;
}

/* ---------------------------------------------------------------- Buttons */
/* native <button> without a dedicated class (most of the back-office buttons) */
body.gaia button:not(.btn):not([class*="qbutton"]):not(#openNavBtn) {
	padding: 4px 8px;
	border: 1px solid #c9d3d2;
	border-radius: 6px;
	background-color: #ffffff;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
	color: var(--gm-text);
	font-family: inherit;
	font-size: 12px;
	line-height: 1.3;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
body.gaia button:not(.btn):not([class*="qbutton"]):not(#openNavBtn):hover {
	border-color: var(--gm-primary);
	background-color: var(--gm-primary-soft);
	color: var(--gm-primary);
}
body.gaia button:not(.btn):not([class*="qbutton"]):not(#openNavBtn):active {
	background-color: var(--gm-primary-soft-strong);
	box-shadow: none;
}
body.gaia button:focus-visible,
body.gaia .btn:focus-visible {
	outline: 2px solid rgba(0, 82, 79, 0.35);
	outline-offset: 1px;
}
body.gaia button:disabled,
body.gaia button:disabled:hover {
	border-color: #dde3e2;
	background-color: #f3f5f5;
	color: #9aa4a3;
	box-shadow: none;
	cursor: not-allowed;
}
/* .btn: same shape as native buttons, colour variants from global.css are kept */
body.gaia .btn {
	border-radius: 6px;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
	font-family: inherit;
}
body.gaia .btn:not([class*="btn-"]) {
	border-color: #c9d3d2;
	background-color: #ffffff;
	color: var(--gm-text);
}
body.gaia .btn:not([class*="btn-"]):hover {
	border-color: var(--gm-primary);
	background-color: var(--gm-primary-soft);
	color: var(--gm-primary);
}

/* dojo buttons (dijit/form/Button, DropDownButton, ToggleButton) */
body.gaia .dijitButton .dijitButtonNode,
body.gaia .dijitDropDownButton .dijitButtonNode,
body.gaia .dijitToggleButton .dijitButtonNode {
	padding: 2px 6px;
	border: 1px solid #c9d3d2;
	border-radius: 6px;
	background-color: #ffffff;
	background-image: none;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
	color: var(--gm-text);
}
body.gaia .dijitButtonHover .dijitButtonNode,
body.gaia .dijitDropDownButtonHover .dijitButtonNode,
body.gaia .dijitToggleButtonHover .dijitButtonNode {
	border-color: var(--gm-primary);
	background-color: var(--gm-primary-soft);
	background-image: none;
	color: var(--gm-primary);
}
body.gaia .dijitButtonActive .dijitButtonNode,
body.gaia .dijitDropDownButtonActive .dijitButtonNode,
body.gaia .dijitToggleButtonActive .dijitButtonNode,
body.gaia .dijitToggleButtonChecked .dijitButtonNode {
	background-color: var(--gm-primary-soft-strong);
	background-image: none;
	box-shadow: none;
}
body.gaia .dijitButtonDisabled .dijitButtonNode,
body.gaia .dijitDropDownButtonDisabled .dijitButtonNode,
body.gaia .dijitToggleButtonDisabled .dijitButtonNode {
	border-color: #dde3e2;
	background-color: #f3f5f5;
	background-image: none;
	box-shadow: none;
	color: #9aa4a3;
}

/* ---------------------------------------------------------------- Ghost button (.btn-ghost) */
/* transparent .btn for coloured backgrounds (header / footer "Contact us") */
body.gaia .btn.btn-ghost {
	border-color: rgba(255, 255, 255, 0.7);
	background-color: transparent;
	box-shadow: none;
	color: #ffffff;
}
body.gaia .btn.btn-ghost:hover {
	border-color: #ffffff;
	background-color: rgba(255, 255, 255, 0.15);
	color: #ffffff;
}

/* ---------------------------------------------------------------- Header */
/* "Contact us" button aligned on the right edge, under the login line */
body.gaia #user_info p {
	text-align: right;
}

/* ---------------------------------------------------------------- Tables (.tabCelBleueClaire) */
/* only tables whose own rows/cells use the class: replaces the cellspacing gaps with collapsed cell borders */
body.gaia table:has(> tbody > tr.tabCelBleueClaire, > tbody > tr > .tabCelBleueClaire, > thead > tr > .tabCelBleueClaire, > tr.tabCelBleueClaire, > tr > .tabCelBleueClaire) {
	border-collapse: collapse;
}
body.gaia td.tabCelBleueClaire,
body.gaia th.tabCelBleueClaire,
body.gaia tr.tabCelBleueClaire > td,
body.gaia tr.tabCelBleueClaire > th {
	padding: 3px 5px;
	border: var(--gm-table-border);
}
body.gaia .tabCelBleueClaire {
	background-color: var(--gm-surface);
}
body.gaia td.tabCelBleueClaire,
body.gaia tr.tabCelBleueClaire > td {
	border-color: #ffffff;
}
/* header cells: same look as the section titles (.accueil_dernieres_info_titre) */
body.gaia th.tabCelBleueClaire,
body.gaia tr.tabCelBleueClaire > th,
body.gaia .tabCelGrise,
body.gaia tr.tabCelGrise > td,
body.gaia tr.tabCelGrise > th {
	background-color: var(--gm-primary);
	border-color: var(--gm-primary);
	color: #ffffff;
	font-weight: 600;
	letter-spacing: 0.03em;
}
/* same padding as the admin_societes headers (cellpadding 2 + inline 5px sides);
   same border as the body cells, else header and rows are offset in collapsed tables */
body.gaia td.tabCelGrise,
body.gaia th.tabCelGrise,
body.gaia tr.tabCelGrise > td,
body.gaia tr.tabCelGrise > th,
body.gaia th.tabCelBleueClaire,
body.gaia tr.tabCelBleueClaire > th {
	padding: 2px 5px;
	border: var(--gm-table-border);
}
/* row hover on the same tables (title/header rows excluded); a tint layered over the cell
   background, so cells with their own colour (e.g. .tabCelOrange default campaign) keep it */
body.gaia table:has(> tbody > tr.tabCelBleueClaire, > tbody > tr > .tabCelBleueClaire, > thead > tr > .tabCelBleueClaire, > tr.tabCelBleueClaire, > tr > .tabCelBleueClaire) > tbody > tr:not(.tabCelGrise):not(.accueil_dernieres_info_titre):hover > td:not(.tabCelGrise):not(.accueil_dernieres_info_titre) {
	background-image: linear-gradient(var(--gm-primary-soft-strong), var(--gm-primary-soft-strong));
}

/* ---------------------------------------------------------------- Section titles (.accueil_dernieres_info_titre) */
body.gaia .accueil_dernieres_info_titre,
body.gaia tr.accueil_dernieres_info_titre > td,
body.gaia tr.accueil_dernieres_info_titre > th {
	padding: 4px 6px;
	background-color: var(--gm-primary);
	color: #ffffff;
	font-weight: 600;
	letter-spacing: 0.03em;
}
/* same border as the table cells below, so the edges line up */
body.gaia td.accueil_dernieres_info_titre,
body.gaia th.accueil_dernieres_info_titre,
body.gaia tr.accueil_dernieres_info_titre > td,
body.gaia tr.accueil_dernieres_info_titre > th {
	border: var(--gm-table-border);
}
/* links inside the title bar (e.g. "add") must stay readable on the dark background */
body.gaia .accueil_dernieres_info_titre a:not(.btn) {
	color: #ffffff;
	text-decoration: none;
}
body.gaia .accueil_dernieres_info_titre a:not(.btn):hover {
	text-decoration: underline;
}

/* ---------------------------------------------------------------- Admin tool container (#outil_secteur_div) */
/* drops the dark green frame of global.css; links were white on it, so they get the primary colour back */
body.gaia #outil_secteur_div {
	background-color: transparent;
}
body.gaia #outil_secteur_div a:not(.btn) {
	color: var(--gm-primary);
}
/* links inside the title bar stay white */
body.gaia #outil_secteur_div .accueil_dernieres_info_titre a:not(.btn) {
	color: #ffffff;
}
/* dojo trees (admin_sectors...): the theme (gaia.css) makes their labels white for the old green frame */
body.gaia .dijitTreeContent {
	color: var(--gm-text);
}
/* light panel behind the tree, same background as the tables */
body.gaia .dijitTree {
	padding: 6px;
	border: 1px solid var(--gm-border);
	background-color: var(--gm-surface);
}