From fbad8d4a29ecb409e56fceb1729ec65093a2c72b Mon Sep 17 00:00:00 2001
From: Laurent Destailleur <eldy@destailleur.fr>
Date: Tue, 27 Dec 2022 13:18:38 +0100
Subject: [PATCH] Fix force THEME_DARKMODEENABLED

---
 htdocs/theme/eldy/global.inc.php   |  37 +++-
 htdocs/theme/eldy/info-box.inc.php |   2 +-
 htdocs/theme/eldy/style.css.php    |   2 +-
 htdocs/theme/md/info-box.inc.php   |  30 ++-
 htdocs/theme/md/style.css.php      | 297 ++++++++++++++++++++---------
 5 files changed, 257 insertions(+), 111 deletions(-)

diff --git a/htdocs/theme/eldy/global.inc.php b/htdocs/theme/eldy/global.inc.php
index f737d6523a1..fcb4e3f8872 100644
--- a/htdocs/theme/eldy/global.inc.php
+++ b/htdocs/theme/eldy/global.inc.php
@@ -1,6 +1,9 @@
-<?php if (!defined('ISLOADEDBYSTEELSHEET')) {
+<?php
+if (!defined('ISLOADEDBYSTEELSHEET')) {
 	die('Must be call by steelsheet');
-} ?>
+}
+
+?>
 /* <style type="text/css" > */
 
 /* ============================================================================== */
@@ -289,7 +292,7 @@ section.setupsection {
 	border-radius: 5px;
 }
 
-.field-error-icon { color: #ea1212; !important; }
+.field-error-icon { color: #ea1212 !important; }
 
 /* Focus definitions must be after standard definition */
 div.tabBar textarea:focus {
@@ -3982,9 +3985,7 @@ div.pagination li.pagination span {
   line-height: 1.42857143;
   text-decoration: none;
   background-repeat: repeat-x;
-  <?php if (empty($conf->global->THEME_DARKMODEENABLED)) { ?>
-  color: #000;
-  <?php } ?>
+  color: var(--color-black);
 }
 div.pagination li.pagination span.inactive {
   cursor: default;
@@ -4123,7 +4124,7 @@ table.hidepaginationnext .paginationnext {
 {
 	font-family: <?php print $fontlist ?>;
 	margin-bottom: 1px;
-	color: var(--oddeven);
+	color: var(--oddevencolor);
 }
 .impair, .nohover .impair:hover, tr.impair td.nohover
 {
@@ -5037,12 +5038,30 @@ div.ui-tooltip.mytooltip {
 	-webkit-box-shadow:0.5px 0.5px 4px 0px rgba(0, 0, 0, 0.5);
 	-o-box-shadow:     0.5px 0.5px 4px 0px rgba(0, 0, 0, 0.5);
 	box-shadow:        0.5px 0.5px 4px 0px rgba(0, 0, 0, 0.5);
-	filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=5);
+	filter: progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=5);
 	background: var(--tooltipbgcolor) !important;
-	color : var(--tooltipfontcolor);
+	color: var(--tooltipfontcolor);
 	line-height: 1.6em;
 	min-width: 550px;
 }
+
+<?php
+if (!empty($conf->global->THEME_DARKMODEENABLED)) {
+	print "/* For dark mode */\n";
+	if ($conf->global->THEME_DARKMODEENABLED != 2) {
+		print "@media (prefers-color-scheme: dark) {";	// To test, click on the 3 dots menu, then Other options then Display then emulate prefer-color-schemes
+	} else {
+		print "@media not print {";
+	}
+	?>
+	div.ui-tooltip.mytooltip {
+		border: 1px solid #bbb !important;
+	}
+	<?php
+	print '}';
+}
+?>
+
 @media only screen and (max-width: 768px)
 {
 	div.ui-tooltip.mytooltip {
diff --git a/htdocs/theme/eldy/info-box.inc.php b/htdocs/theme/eldy/info-box.inc.php
index 29db8cf0769..8726eeb005c 100644
--- a/htdocs/theme/eldy/info-box.inc.php
+++ b/htdocs/theme/eldy/info-box.inc.php
@@ -418,7 +418,7 @@ if (GETPOSTISSET('THEME_SATURATE_RATIO')) {
 
 /* USING FONTAWESOME FOR WEATHER */
 .info-box-weather .info-box-icon{
-	background: rgba(0, 0, 0, 0.08) !important;
+	background: var(--colorbacktitle1) !important;
 }
 .fa-weather-level0:before{
 	content: "\f185";
diff --git a/htdocs/theme/eldy/style.css.php b/htdocs/theme/eldy/style.css.php
index 40a03a0db5b..fcf9f7ffd1f 100644
--- a/htdocs/theme/eldy/style.css.php
+++ b/htdocs/theme/eldy/style.css.php
@@ -91,7 +91,7 @@ if (GETPOST('theme', 'aZ09')) {
 if (GETPOST('lang', 'aZ09')) {
 	$langs->setDefaultLang(GETPOST('lang', 'aZ09')); // If language was forced on URL
 }
-if (GETPOST('THEME_DARKMODEENABLED', 'int')) {
+if (GETPOSTISSET('THEME_DARKMODEENABLED', 'int')) {
 	$conf->global->THEME_DARKMODEENABLED = GETPOST('THEME_DARKMODEENABLED', 'int'); // If darkmode was forced on URL
 }
 
diff --git a/htdocs/theme/md/info-box.inc.php b/htdocs/theme/md/info-box.inc.php
index ba96575239f..e2179b96162 100644
--- a/htdocs/theme/md/info-box.inc.php
+++ b/htdocs/theme/md/info-box.inc.php
@@ -201,7 +201,7 @@ a.info-box-text-a i.fa.fa-exclamation-triangle {
 	text-align: center;
 	font-size: 45px;
 	line-height: 90px;
-	background: #eee;
+	background: var(--colorbacktitle1) !important;
 	<?php if (isset($conf->global->THEME_SATURATE_RATIO)) { ?>
 		filter: saturate(<?php echo $conf->global->THEME_SATURATE_RATIO; ?>);
 	<?php } ?>
@@ -295,6 +295,17 @@ a.info-box-text-a i.fa.fa-exclamation-triangle {
 	padding: 5px 10px;
 	margin-left: 84px;
 }
+.info-box-sm .info-box-content {
+	margin-left: 80px;
+	height: 86px;   /* 96 - margins of .info-box-sm .info-box-content */
+}
+.info-box-sm .info-box-module-enabled {
+	/* background: linear-gradient(0.35turn, #fff, #fff, #f6faf8, #e4efe8) */
+	background: var(--infoboxmoduleenabledbgcolor);
+}
+.info-box-content-warning span.font-status4 {
+	color: #bc9526 !important;
+}
 
 .info-box-number {
 	display: block;
@@ -335,11 +346,14 @@ a.info-box-text{ text-decoration: none;}
 
 
 /* ICONS INFO BOX */
-.info-box-icon {
-	color: #000 !important;
-}
 <?php
 include_once DOL_DOCUMENT_ROOT.'/core/lib/functions2.lib.php';
+
+$prefix = '';
+if (!empty($conf->global->THEME_INFOBOX_COLOR_ON_BACKGROUND)) {
+	$prefix = 'background-';
+}
+
 if (!isset($conf->global->THEME_SATURATE_RATIO)) {
 	$conf->global->THEME_SATURATE_RATIO = 0.7;
 }
@@ -420,7 +434,7 @@ if (GETPOSTISSET('THEME_SATURATE_RATIO')) {
 
 /* USING FONTAWESOME FOR WEATHER */
 .info-box-weather .info-box-icon{
-	background: #eee !important;
+	background: var(--colorbacktitle1) !important;
 }
 .fa-weather-level0:before{
 	content: "\f185";
@@ -502,11 +516,13 @@ if (GETPOSTISSET('THEME_SATURATE_RATIO')) {
 	height: 0;
 }
 
+.info-box-title {
+	width: calc(100% - 20px);
+}
 .info-box-module {
 	min-width: 350px;
 	max-width: 350px;
 }
-
 .info-box-module .info-box-content {
 	height: 6.3em;
 }
@@ -530,3 +546,5 @@ if (GETPOSTISSET('THEME_SATURATE_RATIO')) {
 	}
 }
 
+
+
diff --git a/htdocs/theme/md/style.css.php b/htdocs/theme/md/style.css.php
index b90137858d5..d3a56e5ae28 100644
--- a/htdocs/theme/md/style.css.php
+++ b/htdocs/theme/md/style.css.php
@@ -93,6 +93,10 @@ if (GETPOST('lang', 'aZ09')) {
 	$langs->setDefaultLang(GETPOST('lang', 'aZ09')); // If language was forced on URL
 }
 
+if (GETPOSTISSET('THEME_DARKMODEENABLED', 'int')) {
+	$conf->global->THEME_DARKMODEENABLED = GETPOST('THEME_DARKMODEENABLED', 'int'); // If darkmode was forced on URL
+}
+
 $langs->load("main", 0, 1);
 $right = ($langs->trans("DIRECTION") == 'rtl' ? 'left' : 'right');
 $left = ($langs->trans("DIRECTION") == 'rtl' ? 'right' : 'left');
@@ -354,6 +358,8 @@ print '*/'."\n";
 	--tablevalidbgcolor: rgb(252, 248, 227);
 	--butactionbg : #<?php print $butactionbg; ?>;
 	--textbutaction : #<?php print $textbutaction; ?>;
+	--colorblack: #000;
+	--colorwhite: #fff;
 }
 
 <?php
@@ -407,6 +413,8 @@ if (!empty($conf->global->THEME_DARKMODEENABLED)) {
 	            --amountremaintopaybackcolor:rbg(245,130,46);
 				--infoboxmoduleenabledbgcolor : linear-gradient(0.4turn, #000, #000, #000, #274231);
 				--tablevalidbgcolor: rgb(80, 64, 33);
+				--colorblack: #fff;
+				--colorwhite: #000;
 	      }
 
 		body, button {
@@ -419,10 +427,7 @@ if (!empty($conf->global->THEME_DARKMODEENABLED)) {
 body {
 <?php if (GETPOST('optioncss', 'aZ09') == 'print') {  ?>
 	background-color: #FFFFFF;
-<?php } else { ?>
-	background: var(--colorbackbody);
 <?php } ?>
-	color: rgb(<?php echo $colortext; ?>);
 	font-size: <?php print is_numeric($fontsize) ? $fontsize.'px' : $fontsize; ?>;
 	line-height: 1.4;
 	font-family: <?php print $fontlist ?>;
@@ -430,9 +435,12 @@ body {
 	margin-bottom: 0;
 	margin-right: 0;
 	margin-left: 0;
+	font-weight: 400;
+	background-color: var(--colorbackbody);
 	<?php print 'direction: '.$langs->trans("DIRECTION").";\n"; ?>
 }
 
+/* Style used to protect html content in output to avoid attack by replacing full page with js content */
 .sensiblehtmlcontent * {
 	position: static !important;
 }
@@ -441,16 +449,18 @@ body {
 th a { font-weight: <?php echo ($useboldtitle ? 'bold' : 'normal'); ?> !important; }
 a.tab { font-weight: 500 !important; }
 
-a:link, a:visited, a:hover, a:active { font-family: <?php print $fontlist ?>; font-weight: normal; color: rgb(<?php print $colortextlink; ?>); text-decoration: none;  }
-a:hover { text-decoration: underline; color: rgb(<?php print $colortextlink; ?>); }
-a.commonlink { color: rgb(<?php print $colortextlink; ?>) !important; text-decoration: none; }
+a:link, a:visited, a:hover, a:active, .classlink { font-family: <?php print $fontlist ?>; font-weight: normal; color: var(--colortextlink); text-decoration: none;  }
+a:hover { text-decoration: underline; color: var(--colortextlink); }
+a.commonlink { color: var(--colortextlink) !important; text-decoration: none; }
 
 input {
 	font-size: unset;
 }
+/*
 input, input.flat, textarea, textarea.flat, form.flat select, select, select.flat, .dataTables_length label select {
 	background-color: #FDFDFD;
 }
+*/
 select.vmenusearchselectcombo {
 	background-color: unset;
 }
@@ -492,11 +502,16 @@ select#date_startday, select#date_startmonth, select#date_endday, select#date_en
 	margin-right: 4px;
 }
 input, input.flat, textarea, textarea.flat, form.flat select, select, select.flat, .dataTables_length label select {
-	font-family: <?php print $fontlist ?>;
+	color: var(--colortext);
 	border: none;
 	border<?php echo empty($conf->global->THEME_SHOW_BORDER_ON_INPUT) ? '-bottom' : ''; ?>: solid 1px var(--inputbordercolor);
+	font-family: <?php print $fontlist ?>;
 	outline: none;
 	margin: 0px 0px 0px 0px;
+	background-color: var(--inputbackgroundcolor);
+	<?php if (empty($conf->global->THEME_ADD_BACKGROUND_ON_INPUT)) { ?>
+		border<?php echo empty($conf->global->THEME_SHOW_BORDER_ON_INPUT) ? '-bottom' : ''; ?>: solid 1px var(--inputbordercolor);
+	<?php } ?>
 }
 
 input {
@@ -629,11 +644,6 @@ input.buttonpaymentcb {
 	background-repeat: no-repeat;
 	background-position: 5px 4px;
 }
-input.buttonpaymentcheque {
-	background-image: url(<?php echo dol_buildpath($path.'/paypal/img/object_paypal.png', 1) ?>);
-	background-repeat: no-repeat;
-	background-position: 5px 4px;
-}
 input.buttonpaymentpaypal {
 	background-image: url(<?php echo dol_buildpath($path.'/paypal/img/object_paypal.png', 1) ?>);
 	background-repeat: no-repeat;
@@ -681,6 +691,12 @@ td.onholidayallday {
 td.onholidayallday:not(.weekend) input {
 	background-color: #f8f7f0;
 }
+td.weekend {	/* must be after td.onholidayallday */
+	background-color: #eee;
+}
+td.weekend input {
+	background-color: #f8f8f8;
+}
 td.leftborder, td.hide0 {
 	border-left: 1px solid #ccc;
 }
@@ -690,12 +706,6 @@ td.leftborder, td.hide6 {
 td.rightborder {
 	border-right: 1px solid #ccc;
 }
-td.weekend {	/* must be after td.onholidayallday */
-	background-color: #eee;
-}
-td.weekend input {
-	background-color: #f8f8f8;
-}
 
 
 td.amount, span.amount, div.amount, b.amount {
@@ -737,10 +747,13 @@ input.pageplusone, .divadvancedsearchfieldcompinput, {
 	opacity: 0;
 }
 .colorwhite {
-	color: #fff;
+	color: var(--colorwhite);
+}
+.colorgrey {
+	color: #888 !important;
 }
 .colorblack {
-	color: #000;
+	color: var(--colorblack);
 }
 .fontsizeunset {
 	font-size: unset !important;
@@ -753,12 +766,13 @@ input.pageplusone, .divadvancedsearchfieldcompinput, {
 	transform: scale(-1, 1);
 }
 
-select:invalid {
+select:invalid, select.--error {
 	color: gray;
 }
 input:disabled, textarea:disabled, select[disabled='disabled']
 {
-	background:#eee;
+	background: var(--inputbackgroundcolordisabled);
+	color: var(--inputcolordisabled);
 }
 
 input.liste_titre {
@@ -773,7 +787,7 @@ input.removedfile {
 	vertical-align: text-bottom;
 }
 
-input[type=file ]    { background-color: transparent; border-top: none; border-left: none; border-right: none; box-shadow: none; }
+input[type=file]     { background-color: transparent; border-top: none; border-left: none; border-right: none; box-shadow: none; }
 input[type=checkbox] { background-color: transparent; border: none; box-shadow: none; vertical-align: middle; }
 input[type=radio]    { background-color: transparent; border: none; box-shadow: none; vertical-align: middle; }
 input[type=image]    { background-color: transparent; border: none; box-shadow: none; }
@@ -807,6 +821,12 @@ input#onlinepaymenturl, input#directdownloadlink {
 	opacity: 0.7;
 }
 
+.formconsumeproduce {
+	background: #f3f3f3;
+	padding: 20px 0px 0px 0px;
+	border-radius: 8px;
+}
+
 div#moretabsList, div#moretabsListaction {
 	z-index: 5;
 }
@@ -873,7 +893,7 @@ table.tableforfield .buttonDelete:not(.bordertransp):not(.buttonpayment) {
 }
 .button_search, .button_removefilter {
 	border: unset;
-	background: unset;
+	background-color: unset;
 }
 .button_search:hover, .button_removefilter:hover {
 	cursor: pointer;
@@ -882,6 +902,9 @@ form {
 	padding:0px;
 	margin:0px;
 }
+form#addproduct {
+	padding-top: 10px;
+}
 div.float, span.floatleft
 {
 	float:<?php print $left; ?>;
@@ -904,6 +927,9 @@ div.floatright
 button:focus {
 	outline: none;
 }
+.fa-info-circle {
+	padding-<?php echo $left; ?>: 3px;
+}
 .line-height-large {
 	line-height: 1.8em;
 }
@@ -934,6 +960,9 @@ th .button {
 .centpercent {
 	width: 100%;
 }
+.centpercentwithoutmenu {
+	width: calc(100% - 200px);
+}
 .quatrevingtpercent, .inputsearch {
 	width: 80%;
 }
@@ -946,18 +975,21 @@ th .button {
 .quatrevingtquinzepercent {
 	width: 95%;
 }
-textarea.centpercent {
-	width: 96%;
-}
 .quatrevingtpercentminusx {
 	width: calc(80% - 52px);
 }
+textarea.centpercent {
+	width: 96%;
+}
 .small, small {
 	font-size: 85%;
 }
 .large {
 	font-size: 125%;
 }
+.double {
+	font-size: 2em;
+}
 
 .h1 .small, .h1 small, .h2 .small, .h2 small, .h3 .small, .h3 small, h1 .small, h1 small, h2 .small, h2 small, h3 .small, h3 small {
 	font-size: 65%;
@@ -1038,6 +1070,9 @@ textarea.centpercent {
 .nobold {
 	font-weight: normal !important;
 }
+.uppercase {
+	text-transform: uppercase;
+}
 .nounderline {
 	text-decoration: none;
 }
@@ -1083,18 +1118,6 @@ textarea.centpercent {
 .paddingright2imp {
 	padding-<?php print $right; ?>: 2px !important;
 }
-.marginleft2 {
-	margin-<?php print $left; ?>: 2px;
-}
-.marginright2 {
-	margin-<?php print $right; ?>: 2px;
-}
-.nomarginleft {
-	margin-<?php print $left; ?>: unset;
-}
-.nomarginright {
-	margin-<?php print $right; ?>: unset;
-}
 .paddingtop {
 	padding-top: 4px;
 }
@@ -1107,6 +1130,18 @@ textarea.centpercent {
 .paddingbottom2 {
 	padding-bottom: 2px;
 }
+.marginleft2 {
+	margin-<?php print $left; ?>: 2px;
+}
+.marginright2 {
+	margin-<?php print $right; ?>: 2px;
+}
+.nomarginleft {
+	margin-<?php print $left; ?>: unset;
+}
+.nomarginright {
+	margin-<?php print $right; ?>: unset;
+}
 
 .cursordefault {
 	cursor: default;
@@ -1120,12 +1155,12 @@ textarea.centpercent {
 .cursormove {
 	cursor: move;
 }
-.cursorwait {
-	cursor: wait;
-}
 .cursornotallowed {
 	cursor: not-allowed;
 }
+.cursorwait {
+	cursor: wait;
+}
 .backgroundblank {
 	background-color: #fff;
 }
@@ -1136,6 +1171,12 @@ textarea.centpercent {
 	font-size: 0.85em;
 	opacity: 0.7;
 }
+.borderimp {
+	border: 1px solid #888 !important;
+}
+.text-warning{
+	color : <?php print $textWarning; ?>
+}
 .longmessagecut {
 	max-height: 250px;
 	max-width: 100%;
@@ -1155,9 +1196,6 @@ div.urllink, div.urllink a {
 	color: #339 !important;
 }
 
-.fa-info-circle {
-	padding-<?php echo $left; ?>: 3px;
-}
 i.fa-mars::before, i.fa-venus::before, i.fa-genderless::before, i.fa-transgender::before  {
 	color: #888 !important;
 	opacity: 0.4;
@@ -1194,23 +1232,18 @@ body[class*="colorblind-"] .text-success{
 	color : <?php print $textDanger; ?>
 }
 
-.editfielda span.fa-pencil-alt, .editfielda span.fa-trash {
+.editfielda span.fa-pencil-alt, .editfielda span.fa-pencil-ruler, .editfielda span.fa-trash, .editfielda span.fa-crop,
+.editfieldlang {
 	color: #ccc !important;
 }
-.editfielda span.fa-pencil-alt:hover, .editfielda span.fa-trash:hover {
+.editfielda span.fa-pencil-alt:hover, .editfielda span.fa-pencil-ruler:hover, .editfielda span.fa-trash:hover, .editfielda span.fa-crop:hover,
+.editfieldlang:hover {
 	color: var(--colortexttitle) !important;
 }
 a.editfielda.nohover *:hover:before {
 	color: #ccc !important;
 }
 
-.size15x { font-size: 1.5em !important; }
-.fa-toggle-on, .fa-toggle-off, .size2x { font-size: 2em; }
-.websiteselectionsection .fa-toggle-on, .websiteselectionsection .fa-toggle-off,
-.asetresetmodule .fa-toggle-on, .asetresetmodule .fa-toggle-off {
-	font-size: 1.5em; vertical-align: text-bottom;
-}
-
 .fawidth30 {
 	width: 20px;
 }
@@ -1218,6 +1251,27 @@ a.editfielda.nohover *:hover:before {
 	float: none !important;
 }
 
+span.fa.fa-plus-circle.paddingleft {
+	padding-right: 4px;
+	padding-top: 3px;
+	padding-bottom: 2px;
+}
+
+.size15x { font-size: 1.5em !important; }
+.fa-toggle-on, .fa-toggle-off, .size2x { font-size: 2em; }
+.websiteselectionsection .fa-toggle-on, .websiteselectionsection .fa-toggle-off,
+.asetresetmodule .fa-toggle-on, .asetresetmodule .fa-toggle-off,
+.tdwebsitesearchresult .fa-toggle-on, .tdwebsitesearchresult .fa-toggle-off {
+	font-size: 1.5em; vertical-align: text-bottom;
+}
+
+.divoverflow {
+	overflow: hidden;
+	white-space: nowrap;
+	vertical-align: middle;
+	text-overflow: ellipsis;
+}
+
 
 /* Themes for badges */
 <?php include dol_buildpath($path.'/theme/'.$theme.'/badges.inc.php', 0); ?>
@@ -1453,9 +1507,15 @@ select.flat.selectlimit {
 .margintoponly {
 	margin-top: 10px !important;
 }
+.margintoponlyshort {
+	margin-top: 3px !important;
+}
 .marginbottomonly {
 	margin-bottom: 10px !important;
 }
+.marginbottomonlyshort {
+	margin-bottom: 3px !important;
+}
 .nomargintop {
 	margin-top: 0 !important;
 }
@@ -1571,7 +1631,7 @@ select.flat.selectlimit {
 	max-width: 0;
 	overflow: auto;
 }
-.divintodwithtwolinesmax {
+.divintowithtwolinesmax {
 	width: 75px;
 	display: -webkit-box;
 	-webkit-box-orient: vertical;
@@ -1598,20 +1658,29 @@ select.flat.selectlimit {
 .amountalreadypaid {
 }
 .amountpaymentcomplete {
-	color: #008800;
+	color: var(--amountpaymentcomplete);
 	font-weight: bold;
 }
 .amountremaintopay {
-	color: #880000;
+	color: var(--amountremaintopaycolor);
 	font-weight: bold;
 }
 .amountremaintopayback {
 	font-weight: bold;
 }
 .amountpaymentneutral {
+	color: var(--amountremaintopaybackcolor);
 	font-weight: bold;
 	font-size: 1.4em;
 }
+
+.onlinepaymentbody .amountpaymentcomplete {
+	background-color: var(--amountpaymentcomplete);
+	color: #fff;
+	padding: 5px;
+	border-radius: 5px;
+}
+
 .savingdocmask {
 	margin-top: 6px;
 	margin-bottom: 12px;
@@ -1667,7 +1736,7 @@ div.fiche>form>div.div-table-responsive {
 
 .flexcontainer {
 	<?php if (in_array($conf->browser->name, array('chrome', 'firefox'))) {
-		echo 'display: inline-flex;';
+		echo 'display: inline-flex;'."\n";
 	} ?>
 	flex-flow: row wrap;
 	justify-content: flex-start;
@@ -1712,6 +1781,13 @@ table[summary="list_of_modules"] .fa-cog {
 	height: 100px;
 }
 
+.maxscreenheightless200 {
+	max-height: <?php echo isset($_SESSION['dol_screenheight']) ? max(500, $_SESSION['dol_screenheight'] - 200) : 700; ?>px;	/* we guarantee height of 500 */
+}
+.maxscreenheightless300 {
+	max-height: <?php echo isset($_SESSION['dol_screenheight']) ? max(400, $_SESSION['dol_screenheight'] - 300) : 700; ?>px;	/* we guarantee height of 500 */
+}
+
 tr.nobottom td {
 	border-bottom: 0px !important;
 }
@@ -1768,6 +1844,7 @@ tr.nobottom td {
 .maxwidth40  { max-width: 40px; }
 .maxwidth50  { max-width: 50px; }
 .maxwidth75  { max-width: 75px; }
+.maxwidthdate  { max-width: 80px; }
 .maxwidth100 { max-width: 100px; }
 .maxwidth125 { max-width: 125px; }
 .maxwidth150 { max-width: 150px; }
@@ -1776,6 +1853,8 @@ tr.nobottom td {
 .maxwidth300 { max-width: 300px; }
 .maxwidth400 { max-width: 400px; }
 .maxwidth500 { max-width: 500px; }
+.maxwidth750 { max-width: 750px; }
+.maxwidth1000 { max-width: 1000px; }
 .maxwidth50imp  { max-width: 50px !important; }
 .maxwidth75imp  { max-width: 75px !important; }
 
@@ -1858,6 +1937,10 @@ select.widthcentpercentminusxx, span.widthcentpercentminusxx:not(.select2-select
 	div.refidno {
 		font-size: <?php print is_numeric($fontsize) ? ($fontsize).'px' : $fontsize; ?> !important;
 	}
+	.divadvancedsearchfield {
+		padding-left: 5px;
+		padding-right: 5px;
+	}
 
 	div.divphotoref {
 		padding-right: 10px !important;
@@ -1936,16 +2019,12 @@ select.widthcentpercentminusxx, span.widthcentpercentminusxx:not(.select2-select
 	}
 
 	div.fiche {
-			margin-top: <?php print ($dol_hide_topmenu ? '12' : '6'); ?>px !important;
+		margin-top: <?php print ($dol_hide_topmenu ? '12' : '6'); ?>px !important;
 	}
 	.border tbody tr, .border tbody tr td, div.tabBar table.border tr, div.tabBar table.border tr td, div.tabBar div.border .table-border-row, div.tabBar div.border .table-key-border-col, div.tabBar div.border .table-val-border-col {
 		height: 40px !important;
 	}
 
-	.quatrevingtpercent, .inputsearch {
-		width: 95%;
-	}
-
 	div.tabs div.tab a.tab  {
 		max-width: 200px;
 		overflow: hidden;
@@ -1953,6 +2032,10 @@ select.widthcentpercentminusxx, span.widthcentpercentminusxx:not(.select2-select
 		white-space: nowrap;
 	}
 
+	.quatrevingtpercent, .inputsearch {
+		width: 95%;
+	}
+
 	select {
 		padding-top: 4px;
 		padding-bottom: 5px;
@@ -2035,7 +2118,7 @@ select.widthcentpercentminusxx, span.widthcentpercentminusxx:not(.select2-select
 .linkobject { cursor: pointer; }
 
 table.tableforfield tr:not(.liste_titre)>td:first-of-type, tr.trforfield:not(.liste_titre)>td:first-of-type, div.tableforfield div.tagtr:not(.liste_titre)>div.tagtd:first-of-type {
-	color: #666;
+	color: var(--tableforfieldcolor);
 }
 
 <?php if (GETPOST('optioncss', 'aZ09') == 'print') { ?>
@@ -2522,11 +2605,6 @@ img.photoref, div.photoref {
 	width: 80px;
 	object-fit: contain;
 }
-.difforspanimgright {
-	display: table-cell;
-	padding-right: 10px;
-}
-
 img.photokanban, div.photokanban {
 	padding: 0;
 	border: none;
@@ -2546,6 +2624,10 @@ div.photoref {
 	vertical-align:middle;
 	text-align:center;
 }
+.difforspanimgright {
+	display: table-cell;
+	padding-right: 10px;
+}
 img.photorefnoborder {
 	padding: 2px;
 	height: 48px;
@@ -2655,7 +2737,7 @@ a.tmenudisabled:link, a.tmenudisabled:visited, a.tmenudisabled:hover, a.tmenudis
 	font-weight: normal;
 	padding: 0px 5px 0px 5px;
 	white-space: nowrap;
-	color: #<?php echo $colortextbackhmenu; ?>;
+	color: var(--colortextbackhmenu);
 	text-decoration: none;
 	cursor: not-allowed;
 }
@@ -2676,7 +2758,7 @@ a.tmenu:link, a.tmenu:visited, a.tmenu:hover, a.tmenu:active {
 	padding: 0px 5px 0px 5px;
 	white-space: nowrap;
 	/*	text-shadow: 1px 1px 1px #000000; */
-	color: #<?php echo $colortextbackhmenu; ?>;
+	color: var(--colortextbackhmenu);
 	text-decoration: none;
 }
 a.tmenusel:link, a.tmenusel:visited, a.tmenusel:hover, a.tmenusel:active {
@@ -2684,7 +2766,7 @@ a.tmenusel:link, a.tmenusel:visited, a.tmenusel:hover, a.tmenusel:active {
 	padding: 0px 5px 0px 5px;
 	margin: 0px 0px 0px 0px;
 	white-space: nowrap;
-	color: #<?php echo $colortextbackhmenu; ?>;
+	color: var(--colortextbackhmenu);
 	text-decoration: none !important;
 }
 
@@ -2765,6 +2847,8 @@ div.menu_titre {
 {
 	padding-<?php print $left; ?>: 2px;
 	padding-<?php print $right; ?>: 2px;
+	font-family: Roboto,<?php echo $fontlist; ?>;
+	font-weight: 400;
 }
 
 div.mainmenu {
@@ -2838,13 +2922,13 @@ div.mainmenu.menu {
 		// Img file not found
 		if (!$found) {
 			if (!defined('DISABLE_FONT_AWSOME')) {
-				print "/* A mainmenu entry was found but img file ".$val.".png not found (check /".$val."/img/".$val.".png), so we use a generic one */\n";
+				print "/* A mainmenu entry was found but img file ".$val.".png not found (check /".$val."/img/".$val.".png), so we use a generic one. */\n";
+				print "/* Overwrite this definition in your own css with a different content to use your own font awesome icon. */\n";
 				print 'div.mainmenu.'.$val.'::before {
 	                    content: "\f249";
 	                }'."\n";
 			} else {
-				print "/* A mainmenu entry was found but img file ".$val.".png not found (check /".$val."/img/".$val.".png), so we use a generic one. */\n";
-				print "/* Overwrite this definition in your own css with a different content to use your own font awesome icon. */\n";
+				print "/* A mainmenu entry was found but img file ".$val.".png not found (check /".$val."/img/".$val.".png), so we use a generic one */\n";
 				$url = dol_buildpath($path.'/theme/'.$theme.'/img/menus/generic'.(min($generic, 4))."_over.png", 1);
 				print "div.mainmenu.".$val." {\n";
 				print "	background-image: url(".$url.");\n";
@@ -3032,6 +3116,14 @@ div.login_block {
 	display: none;
 	<?php } ?>
 }
+div.login_block a {
+	color: var(--colortextbackhmenu);
+	display: inline-block;
+}
+div.login_block span.aversion {
+	color: var(--colortextbackhmenu);
+	filter: contrast(0.7);
+}
 div.login_block table {
 	display: inline;
 }
@@ -3041,10 +3133,10 @@ div.login {
 	float: right;
 }
 div.login a {
-	color: #<?php echo $colortextbackvmenu; ?>;
+	color: var(--colortextbackvmenu);
 }
 div.login a:hover {
-	color: #<?php echo $colortextbackvmenu; ?>;
+	color: var(--colortextbackvmenu);
 	text-decoration:underline;
 }
 div.login_block_user, div.login_block_other { clear: both; }
@@ -3084,7 +3176,7 @@ a.aversion {
 }
 
 .atoplogin, .atoplogin:hover {
-	color: #<?php echo $colortextbackvmenu; ?> !important;
+	color: var(--colortextbackhmenu) !important;
 }
 .alogin, .alogin:hover {
 	color: #888 !important;
@@ -3127,7 +3219,7 @@ img.userphotosmall {			/* size for user photo in lists */
 	background-size: contain;
 	vertical-align: middle;
 }
-img.userphoto[alt="Gravatar avatar"] {
+img.userphoto[alt="Gravatar avatar"], img.photouserphoto.dropdown-user-image[alt="Gravatar avatar"] {
 	background: #fff;
 }
 form[name="addtime"] img.userphoto {
@@ -3194,7 +3286,7 @@ span.vsmenudisabled, font.vsmenudisabled {
 	font-family: <?php print $fontlist ?>;
 	text-align: <?php print $left; ?>;
 	font-weight: normal;
-	color: #aaa;
+	color: var(--colortextbackvmenu);
 	white-space: nowrap;
 }
 a.vsmenu:link, a.vsmenu:visited {
@@ -3306,6 +3398,7 @@ div.blockvmenusearch, div.blockvmenubookmarks
 	padding-top: 3px;
 	padding-bottom: 3px;
 	margin: 1px 0px 2px 0px;
+	background: var(--colorbackvmenu1);
 
 	padding-bottom: 10px;
 	/* border-bottom: 1px solid #f4f4f4; */
@@ -3405,6 +3498,10 @@ li.expanded > a.fmdirlia.jqft.ecmjqft {
 	font-weight: bold !important;
 }
 
+.divfmdirlia {
+	width: calc(100% - 100px);
+}
+
 a.fmdirlia {
 	white-space: break-spaces;
 	word-break: break-all;
@@ -3428,7 +3525,7 @@ div.tabsElem a {
 	font-weight: normal !important;
 }
 div.tabBar {
-	color: #<?php echo $colortextbacktab; ?>;
+	color: var(--colortextbacktab);
 	padding-top: 23px;
 	padding-left: 24px;
 	padding-right: 24px;
@@ -3443,8 +3540,10 @@ div.tabBar {
 	width: auto;
 	background: var(--colorbacktabcard1);
 }
-
 div.tabBar tr.titre td {
+	padding-top: 20px;
+}
+div.fiche table:not(.table-fiche-title) tr.titre td {
 	padding-top: 10px;
 }
 
@@ -3523,6 +3622,9 @@ div.tabs div.tabsElem:first-of-type a.tab {
 	margin-left: 0px !important;
 }
 
+a.tabunactive {
+	color: var(--colortextlink) !important;
+}
 a.tab:link, a.tab:visited, a.tab:hover, a.tab#active {
 	font-family: <?php print $fontlist ?>;
 	padding: 12px 13px 12px;
@@ -3786,8 +3888,8 @@ div.colorback
 table.liste, table.noborder:not(.paymenttable):not(.margintable):not(.tableforcontact), table.formdoc, div.noborder:not(.paymenttable):not(.margintable):not(.tableforcontact) {
 	<?php
 	if ($userborderontable) { ?>
-	border-left: 1px solid #BBB;
-	border-right: 1px solid #BBB;
+	border-left: 1px solid var(--colortopbordertitle1);
+	border-right: 1px solid var(--colortopbordertitle1);
 	<?php } ?>
 }
 table.liste, table.noborder.paymenttable, table.noborder.margintable, table.noborder.tableforcontact, table.formdoc, div.noborder.paymenttable, div.noborder.margintable, div.noborder.tableforcontact {
@@ -3843,6 +3945,9 @@ tr.liste_titre_filter td.liste_titre {
 	border-top-color: var(--colortopbordertitle1);
 	border-top-style: solid;
 }
+tr#trlinefordates td {
+	border-bottom: 0px !important;
+}
 .liste_titre_add td, .liste_titre_add th, .liste_titre_add .tagtd
 {
 	border-top-width: 2px;
@@ -3856,7 +3961,7 @@ tr.liste_titre_filter td.liste_titre {
 	border-top-style: solid;
 }
 
-table.liste th, table.noborder th, table.noborder tr.liste_titre td {
+table.liste th, table.noborder th, table.noborder tr.liste_titre td, table.noborder tr.box_titre td {
 	padding: 8px 6px 8px 6px;			/* t r b l */
 }
 
@@ -3914,6 +4019,7 @@ table.listwithfilterbefore {
 .tagtr, .table-border-row  { display: table-row; }
 .tagtd, .table-border-col, .table-key-border-col, .table-val-border-col { display: table-cell; }
 .confirmquestions .tagtr .tagtd:not(:first-child)  { padding-left: 10px; }
+.confirmquestions { margin-top: 5px; }
 
 
 /* Pagination */
@@ -3931,8 +4037,8 @@ a.refid {
 div.refidno  {
 	padding-top: 8px;
 	font-weight: normal;
-	color: #444;
-	font-size: <?php print $fontsize ?>px;
+	color: var(--refidnocolor);
+	font-size: <?php print is_numeric($fontsize) ? $fontsize.'px' : $fontsize ?>;
 	line-height: 21px;
 }
 div.refidno form {
@@ -3971,7 +4077,7 @@ div.pagination li.pagination span {
   padding: 6px 12px;
   padding-top: 8px;
   line-height: 1.42857143;
-  color: #000;
+  color: var(--color-black);
   text-decoration: none;
 }
 div.pagination li.pagination span.inactive {
@@ -4129,7 +4235,7 @@ ul.noborder li:nth-child(odd):not(.liste_titre) {
 	font-family: <?php print $fontlist ?>;
 	border: 0px;
 	margin-bottom: 1px;
-	color: #202020;
+	color: var(--oddeven);
 }
 .impair, .nohover .impair:hover, tr.impair td.nohover
 {
@@ -4142,7 +4248,7 @@ ul.noborder li:nth-child(odd):not(.liste_titre) {
 .oddeven, .evenodd, .pair, .nohover .pair:hover, tr.pair td.nohover, .tagtr.oddeven {
 	font-family: <?php print $fontlist ?>;
 	margin-bottom: 1px;
-	color: #202020;
+	color: var(--oddevencolor);
 }
 .pair, .nohover .pair:hover, tr.pair td.nohover {
 	background-color: var(--colorbacklinepair1);
@@ -4166,6 +4272,9 @@ td.evenodd, tr.nohoverpair td, #trlinefordates td {
 	border-bottom: 1pt solid black !important;
 	background-color: var(--colorbacklinebreak) !important;
 }
+.trforbreak.nobold td a, .trforbreak.nobold span.secondary {
+	font-weight: normal !important;
+}
 
 table.dataTable td {
 	padding: 5px 2px 5px 3px !important;
@@ -4559,10 +4668,8 @@ tr.box_titre {
 	color: #000 !important; */
 
 	/* TO MATCH ELDY */
-	background: rgb(<?php echo $colorbacktitle1; ?>);
-
-	background-repeat: repeat-x;
-	color: rgb(<?php echo $colortexttitle; ?>);
+	background: var(--colorbacktitle1);
+	color: var(--colortexttitle);
 	font-family: <?php print $fontlist ?>, sans-serif;
 	font-weight: <?php echo $useboldtitle ? 'bold' : 'normal'; ?>;
 	border-bottom: 1px solid #FDFFFF;
@@ -7307,6 +7414,8 @@ div.clipboardCPValue.hidewithsize {
 		border-left: none;
 	}
 
+	td.widthpictotitle { width: 30px; }
+
 	.box-flex-container {
 		margin: 0 0 0 -8px !important;
 	}