/*-----------------------------------*/
/* Body Background and general style */
/*-----------------------------------*/
body 
{
   width:100%;
   height:100%;
   line-height: 10px;
   background-color: white;
   font: 9pt verdana, arial,helvetica, sans-serif;
   margin:0px;
   background-attachment:fixed; background-position:center; background-repeat:no-repeat; background-size:cover;
}

/*-----*/
/* DIV */
/*-----*/

#div_login_front          {visibility:visible; position:absolute; height:auto;                  width:auto;  left:  40px;   top:    40px; z-index:4; border:0px solid #000000; }

#div_menu_reduced         {visibility:visible; position:fixed;    height:100%;                  width:40px;              left:0px;    top:0px;    z-index:8; border:0px solid #000000;                                 padding-left:5px;    background-color:var(--color-panel); overflow:hidden; }
#div_menu_full            {visibility:visible; position:fixed;    height:100%;                  width:130px;             left:-130px; top:0px;    z-index:7; border:0px solid #000000; border-right:1px solid var(--color-button); padding-left:5px;    background-color:var(--color-panel); overflow:hidden; }
#div_menu_background      {visibility:visible; position:fixed;    height:100%;                  width:100%;              left:0px;    top:0px;    z-index:6; border:0px solid #000000; }

#div_bottom               {visibility:visible; position:fixed;    height:auto;                  width:100%;              left:0px;    bottom:0px; z-index:9; border:0px solid #000000;                                                      background-color:white;  opacity:0.6; filter:alpha(opacity=60); }

#div_main                 {visibility:visible; position:absolute; height:auto;                  width:calc(99% - 60px);  left:60px;   top:7px;    z-index:5; border:0px solid #000000;                                  padding-bottom:70px; }

#div_main_dashboard       {visibility:visible; position:absolute; height:auto;                  width:calc(99% - 60px);  left:60px;   top:7px;    z-index:5; border:0px solid #000000;                                  padding-bottom:70px; }

#div_main_menu_full       {visibility:visible; position:fixed;    height:auto; min-height:50px; width:calc(99% - 60px);  left:60px;   top:7px;    z-index:4; border:0px solid #000000; }
#div_main_text_full       {visibility:visible; position:absolute; height:auto;                  width:calc(99% - 60px);  left:60px;   top:70px;   z-index:3; border:0px solid #000000;                                 padding-bottom:70px;  }

#div_main_menu_left       {visibility:visible; position:fixed;    height:auto;                  width:200px;             left:40px;   top:7px;   z-index:5; border:1px solid var(--color-button); border-radius: 5px;             background-color: var(--color-panel);}
#div_main_menu_right      {visibility:visible; position:fixed;    height:auto; min-height:50px; width:calc(99% - 255px); left:255px;  top:7px;    z-index:4; border:0px solid #000000; }
#div_main_text_right      {visibility:visible; position:absolute; height:auto;                  width:calc(99% - 255px); left:255px;  top:75px;   z-index:3; border:0px solid #000000;                                 padding-bottom:70px; }

#div_main_menu_left_ext   {visibility:visible; position:fixed;    height:auto;                  width:200px;             left:10px;   top:10px;   z-index:5; border:1px solid var(--color-button); border-radius: 5px;             background-color: var(--color-panel);}
#div_main_menu_right_ext  {visibility:visible; position:fixed;    height:auto; min-height:50px; width:calc(99% - 225px); left:225px;  top:10px;   z-index:4; border:0px solid #000000; }
#div_main_text_right_ext  {visibility:visible; position:absolute; height:auto;                  width:calc(99% - 225px); left:225px;  top:80px;   z-index:3; border:0px solid #000000;                                 padding-bottom:70px; }

#div_outlook_summary      {visibility:visible; position:fixed;    height:auto;                  width:240px;             left:60px;   top:70px;   z-index:4; border:0px solid #000000; }
#div_outlook_text         {visibility:visible; position:absolute; height:auto;                  width:calc(99% - 310px); left:310px;  top:70px;   z-index:3; border:0px solid #000000;                                 padding-bottom:70px; }

#div_modalback            {visibility:visible; position:absolute; height:100%;                  width:100%;                           top:0px;    z-index:8; border:0px solid #000000;                                                      background-color:black; opacity: 0.8; filter: alpha(opacity=80); }
#div_modalfront           {visibility:visible; position:relative; height:60%;                   width:60%;                            top:200px;  z-index:9; border:0px solid #000000; }            

.div_col_45
{
   float: left;
   width: 45%;
}

.div_col_30
{
   float: left;
   width: 30%;
}

.div_col_25
{
   float: left;
   width: 25%;
}

.div_col_30
{
   float: left;
   width: 30%;
   flex: 1;
}

.div_col_15
{
   float: right;
   width: 15%;
}

.div_col_3
{
   float: left;
   width: 3%;
}

/*-----------------*/
/* input, buttons  */
/*-----------------*/
.input
{ 
   border-top: 1px solid transparent;
   border-right: 1px solid transparent;
   border-left: 1px solid transparent;
   border-bottom: 1px solid var(--color-button);
   border-radius: 5px;
   background-color: var(--color-input);
   font-size: 14px;
   font-weight: normal;
   color: var(--color-input-text);
   padding:5px;
}

.input::placeholder
{
   color: var(--color-text-input);
}

.input:focus
{
   outline: none;
   border: 1px solid var(--color-button);
   background-color: var(--color-input-hover);
}

.input_radio
{ 
   border-top: 1px solid transparent;
   border-right: 1px solid transparent;
   border-left: 1px solid transparent;
   border-bottom: 1px solid var(--color-button);
   border-radius: 5px;
   background-color: var(--color-input);
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
   padding:5px;
   margin-right: 10px;
   cursor: pointer;
}

.input_checkbox
{ 
   border-top: 1px solid transparent;
   border-right: 1px solid transparent;
   border-left: 1px solid transparent;
   border-bottom: 1px solid var(--color-button);
   border-radius: 5px;
   background-color: var(--color-button);
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
   padding:5px;
   margin-right: 10px;
   cursor: pointer;
}

.label
{
   font-size: 14px;
   font-weight:lighter;
   color: var(--color-text);
   margin-top: 3px;
   margin-bottom: 3px;
   margin-left: 3px;
}

.label-block
{
  display: block;
  padding: 5px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  font-size: 14px !important;
  font-weight: normal;
}
.img_rounded
{
   border-radius:5px;
}

.img_pointer:hover
{
   cursor:pointer;
}

select {
  cursor: pointer;
}

#zoom
{
  width: 100%;
  height: 100%;
  transform-origin: 0px 0px;
  transform: scale(1) translate(0px, 0px);
  cursor: grab;
}

div#zoom > img
{
  width: 100%;
  height: auto;
}

.button
{ 
   border: 2px solid var(--color-button);
   border-radius: 5px;
   background-color: var(--color-button);
   font-size: 14px;
   font-weight: normal;
   color: var(--color-button-text);
   padding-top: 2px;
   padding-bottom: 2px;
   padding-left: 20px;
   padding-right: 20px;
   cursor: pointer;
}

.button:hover
{ 
   border: 2px solid var(--color-button-hover);
   background-color: var(--color-button-hover);
}

.pointer
{
   cursor: pointer;
}

.attached_file
{
   cursor: pointer;
}

.attached_file:hover
{
   color: var(--color-button);
}

.input_color
{
   float: left;
   padding: 5px;
   padding-right: 30px;
}

/*-------*/
/* href  */
/*-------*/
a {
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
   text-decoration: none;
}

a:hover {
   color: var(--color-button);
}

a.button_return
{ 
   border: 0px solid #000000;
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
   text-decoration:none;
}

a.button_return:hover
{ 
   color: var(--color-button);
}

a.sub_menu {
   display: block;
   padding: 10px;
   padding-left: 20px;
   width: 150px;
   height: auto;
   text-align: left;
   vertical-align: center;
   font-size: 14px;
   font-weight: normal;
   color: var(--color-button);
   text-decoration:none;
   }

a.sub_menu:hover
{
   color:var(--color-text);
}

a.sub_menu_customer {
   display: block;
   padding: 10px;
   padding-left: 5px;
   width: 150px;
   height: auto;
   text-align: left;
   vertical-align: center;
   font-size: 14px;
   font-weight: normal;
   color: var(--color-button);
   text-decoration:none;
   }

a.sub_menu_customer_warning {
   display: block;
   background-color: white;
   border: 1px solid white;
   border-radius: 5px;
   padding-right: 5px;
   padding-top: 5px;
   padding-bottom: 5px;
   width: 140px;
   height: auto;
   text-align: center;
   vertical-align: middle;
   font-size: 14px;
   font-weight: normal;
   color: orange;
   text-decoration:none;
   position: relative;
   }

a.sub_menu_customer_warning:before {
   content: "";
   background-image: url('../icones/msg_warning_small.png');
   background-repeat: no-repeat;
   background-position: center center;
   background-size: cover;
   position: absolute;
   top: 50%;
   left: 0px;
   transform: translateY(-50%);
   width: 24px;
   height: 24px;
}

a.sub_menu_customer:hover
{
   color:var(--color-text);
}

a.small_sub_menu
{
   display: block;
   padding: 10px;
   padding-left: 20px;
   width: 100px;
   height: auto;
   text-align: left;
   vertical-align: center;
   font-size: 14px;
   font-weight: normal;
   color: var(--color-button);
   text-decoration:none;
}

a.small_sub_menu:hover
{
   color:var(--color-text);
}

/*------*/
/* menu */
/*------*/
.menu_green
{
   font-size: 14px;
   font-weight: normal;
   color: var(--color-button);
   text-decoration: none;
}

.menu_green:hover
{
   color: var(--color-text);
}

.menu_green_hover
{
   color: var(--color-text);
}

a.menu_gray
{
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
   text-decoration: none;
}

a.menu_gray:hover
{
   color: var(--color-button);
}

a.menu_bottom
{
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
   text-decoration: none;
}

a.menu_bottom:hover
{
   color: var(--color-button);
}

.menu_icon
{
   width: 28px;
   height: 28px;
   display: inline-block;
   vertical-align: middle;
   background-color: var(--color-button);
   -webkit-mask: var(--icon) no-repeat center / contain;
   mask: var(--icon) no-repeat center / contain;
}

/* Reduced and full menus: identical row heights to keep icons and titles aligned */
#div_menu_reduced,
#div_menu_full
{
   font-size: 14px;
   line-height: 1;
}
#div_menu_reduced table,
#div_menu_full table
{
   border-collapse: separate;
   border-spacing: 0;
}
#div_menu_reduced td,
#div_menu_full td
{
   padding: 0;
   vertical-align: middle;
   box-sizing: border-box;
}
/* Content cells (those with height=30 attribute): exactly 30px */
#div_menu_reduced td[height="30"],
#div_menu_full    td[height="30"]
{
   height: 30px;
}
/* Spacer cells (colspan=2 with <br>, no height attribute): exactly 14px */
#div_menu_reduced td[colspan="2"]:not([height]),
#div_menu_full    td[colspan="2"]:not([height])
{
   height: 14px;
   font-size: 0;
   line-height: 0;
}
#div_menu_reduced td[colspan="2"]:not([height]) br,
#div_menu_full    td[colspan="2"]:not([height]) br
{
   display: none;
}
#div_menu_full a.menu_green,
#div_menu_reduced a.menu_green
{
   display: inline-block;
   height: 28px;
   line-height: 28px;
   vertical-align: middle;
}

.menu_icon_reduced
{
   width: 24px;
   height: 24px;
}

/* Icons inlined as data-URIs (instead of external url()) so the CSS mask is
   always available immediately. With an external SVG the mask loads
   asynchronously and could "miss" on a cached navigation, leaving the span as
   a plain green square. */
.menu_icon_dashboard { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='m640-480 80 80v80H520v240l-40 40-40-40v-240H240v-80l80-80v-280h-40v-80h400v80h-40v280Zm-286 80h252l-46-46v-314H400v314l-46 46Zm126 0Z'/%3E%3C/svg%3E"); }
.menu_icon_customers { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M40-160v-112q0-34 17.5-62.5T104-378q62-31 126-46.5T360-440q66 0 130 15.5T616-378q29 15 46.5 43.5T680-272v112H40Zm720 0v-120q0-44-24.5-84.5T666-434q51 6 96 20.5t84 35.5q36 20 55 44.5t19 53.5v120H760ZM247-527q-47-47-47-113t47-113q47-47 113-47t113 47q47 47 47 113t-47 113q-47 47-113 47t-113-47Zm466 0q-47 47-113 47-11 0-28-2.5t-28-5.5q27-32 41.5-71t14.5-81q0-42-14.5-81T544-792q14-5 28-6.5t28-1.5q66 0 113 47t47 113q0 66-47 113ZM120-240h480v-32q0-11-5.5-20T580-306q-54-27-109-40.5T360-360q-56 0-111 13.5T140-306q-9 5-14.5 14t-5.5 20v32Zm296.5-343.5Q440-607 440-640t-23.5-56.5Q393-720 360-720t-56.5 23.5Q280-673 280-640t23.5 56.5Q327-560 360-560t56.5-23.5ZM360-240Zm0-400Z'/%3E%3C/svg%3E"); }
.menu_icon_outlook { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Zm280 240q-17 0-28.5-11.5T440-440q0-17 11.5-28.5T480-480q17 0 28.5 11.5T520-440q0 17-11.5 28.5T480-400Zm-188.5-11.5Q280-423 280-440t11.5-28.5Q303-480 320-480t28.5 11.5Q360-457 360-440t-11.5 28.5Q337-400 320-400t-28.5-11.5ZM640-400q-17 0-28.5-11.5T600-440q0-17 11.5-28.5T640-480q17 0 28.5 11.5T680-440q0 17-11.5 28.5T640-400ZM480-240q-17 0-28.5-11.5T440-280q0-17 11.5-28.5T480-320q17 0 28.5 11.5T520-280q0 17-11.5 28.5T480-240Zm-188.5-11.5Q280-263 280-280t11.5-28.5Q303-320 320-320t28.5 11.5Q360-297 360-280t-11.5 28.5Q337-240 320-240t-28.5-11.5ZM640-240q-17 0-28.5-11.5T600-280q0-17 11.5-28.5T640-320q17 0 28.5 11.5T680-280q0 17-11.5 28.5T640-240Z'/%3E%3C/svg%3E"); }
.menu_icon_thesaurus { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M240-80q-33 0-56.5-23.5T160-160v-640q0-33 23.5-56.5T240-880h480q33 0 56.5 23.5T800-800v640q0 33-23.5 56.5T720-80H240Zm0-80h480v-640h-80v280l-100-60-100 60v-280H240v640Zm0 0v-640 640Zm200-360 100-60 100 60-100-60-100 60Z'/%3E%3C/svg%3E"); }
.menu_icon_shop { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M223.5-103.5Q200-127 200-160t23.5-56.5Q247-240 280-240t56.5 23.5Q360-193 360-160t-23.5 56.5Q313-80 280-80t-56.5-23.5Zm400 0Q600-127 600-160t23.5-56.5Q647-240 680-240t56.5 23.5Q760-193 760-160t-23.5 56.5Q713-80 680-80t-56.5-23.5ZM246-720l96 200h280l110-200H246Zm-38-80h590q23 0 35 20.5t1 41.5L692-482q-11 20-29.5 31T622-440H324l-44 80h480v80H280q-45 0-68-39.5t-2-78.5l54-98-144-304H40v-80h130l38 80Zm134 280h280-280Z'/%3E%3C/svg%3E"); }
.menu_icon_statistics { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M640-160v-280h160v280H640Zm-240 0v-560h160v560H400Zm-240 0v-360h160v360H160Z'/%3E%3C/svg%3E"); }
.menu_icon_parameters { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='m370-80-16-128q-13-5-24.5-12T307-235l-119 50L78-375l103-78q-1-7-1-13.5v-27q0-6.5 1-13.5L78-585l110-190 119 50q11-8 23-15t24-12l16-128h220l16 128q13 5 24.5 12t22.5 15l119-50 110 190-103 78q1 7 1 13.5v27q0 6.5-2 13.5l103 78-110 190-118-50q-11 8-23 15t-24 12L590-80H370Zm70-80h79l14-106q31-8 57.5-23.5T639-327l99 41 39-68-86-65q5-14 7-29.5t2-31.5q0-16-2-31.5t-7-29.5l86-65-39-68-99 42q-22-23-48.5-38.5T533-694l-13-106h-79l-14 106q-31 8-57.5 23.5T321-633l-99-41-39 68 86 64q-5 15-7 30t-2 32q0 16 2 31t7 30l-86 65 39 68 99-42q22 23 48.5 38.5T427-266l13 106Zm42-180q58 0 99-41t41-99q0-58-41-99t-99-41q-59 0-99.5 41T342-480q0 58 40.5 99t99.5 41Zm-2-140Z'/%3E%3C/svg%3E"); }
.menu_icon_user { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M234-276q51-39 114-61.5T480-360q69 0 132 22.5T726-276q35-41 54.5-93T800-480q0-133-93.5-226.5T480-800q-133 0-226.5 93.5T160-480q0 59 19.5 111t54.5 93Zm146.5-204.5Q340-521 340-580t40.5-99.5Q421-720 480-720t99.5 40.5Q620-639 620-580t-40.5 99.5Q539-440 480-440t-99.5-40.5ZM480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm100-95.5q47-15.5 86-44.5-39-29-86-44.5T480-280q-53 0-100 15.5T294-220q39 29 86 44.5T480-160q53 0 100-15.5ZM523-537q17-17 17-43t-17-43q-17-17-43-17t-43 17q-17 17-17 43t17 43q17 17 43 17t43-17Zm-43-43Zm0 360Z'/%3E%3C/svg%3E"); }
.menu_icon_out { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-160h80v160h560v-560H200v160h-80v-160q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm220-160-56-58 102-102H120v-80h346L364-622l56-58 200 200-200 200Z'/%3E%3C/svg%3E"); }
.menu_icon_help { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M513.5-254.5Q528-269 528-290t-14.5-35.5Q499-340 478-340t-35.5 14.5Q428-311 428-290t14.5 35.5Q457-240 478-240t35.5-14.5ZM442-394h74q0-33 7.5-52t42.5-52q26-26 41-49.5t15-56.5q0-56-41-86t-97-30q-57 0-92.5 30T342-618l66 26q5-18 22.5-39t53.5-21q32 0 48 17.5t16 38.5q0 20-12 37.5T506-526q-44 39-54 59t-10 73Zm38 314q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z'/%3E%3C/svg%3E"); }
.menu_icon_rules { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M480-80q-139-35-229.5-159.5T160-516v-244l320-120 320 120v244q0 85-29 163.5T688-214L560-342q-18 11-38.5 16.5T480-320q-66 0-113-47t-47-113q0-66 47-113t113-47q66 0 113 47t47 113q0 22-5.5 42.5T618-398l60 60q20-41 31-86t11-92v-189l-240-90-240 90v189q0 121 68 220t172 132q26-8 49.5-20.5T576-214l56 56q-33 27-71.5 47T480-80Zm56.5-343.5Q560-447 560-480t-23.5-56.5Q513-560 480-560t-56.5 23.5Q400-513 400-480t23.5 56.5Q447-400 480-400t56.5-23.5ZM488-477Z'/%3E%3C/svg%3E"); }
.menu_icon_partners { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M480-600 340-740l140-140 140 140-140 140ZM40-160v-160q0-34 23.5-57t56.5-23h131q20 0 38 10t29 27q29 39 71.5 61t90.5 22q49 0 91.5-22t70.5-61q13-17 30.5-27t36.5-10h131q34 0 57 23t23 57v160H640v-91q-35 25-75.5 38T480-200q-43 0-84-13.5T320-252v92H40Zm120-280q-50 0-85-35t-35-85q0-51 35-85.5t85-34.5q51 0 85.5 34.5T280-560q0 50-34.5 85T160-440Zm640 0q-50 0-85-35t-35-85q0-51 35-85.5t85-34.5q51 0 85.5 34.5T920-560q0 50-34.5 85T800-440Z'/%3E%3C/svg%3E"); }
.menu_icon_credits { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M592-379q49-39 63-101h-83q-12 27-37 43.5T480-420q-30 0-55-16.5T388-480h-83q14 62 63 101t112 39q63 0 112-39ZM405.5-554.5Q420-569 420-590t-14.5-35.5Q391-640 370-640t-35.5 14.5Q320-611 320-590t14.5 35.5Q349-540 370-540t35.5-14.5Zm220 0Q640-569 640-590t-14.5-35.5Q611-640 590-640t-35.5 14.5Q540-611 540-590t14.5 35.5Q569-540 590-540t35.5-14.5ZM480-120l-58-50q-101-88-167-152T150-437q-39-51-54.5-94T80-620q0-94 63-157t157-63q52 0 99 22t81 62q34-40 81-62t99-22q94 0 157 63t63 157q0 46-15.5 89T810-437q-39 51-105 115T538-170l-58 50Zm0-108q96-83 158-141t98-102.5q36-44.5 50-79t14-69.5q0-60-40-100t-100-40q-47 0-87 26.5T518-666h-76q-15-41-55-67.5T300-760q-60 0-100 40t-40 100q0 35 14 69.5t50 79Q260-427 322-369t158 141Zm0-266Z'/%3E%3C/svg%3E"); }
.menu_icon_mail { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm320-280L160-640v400h640v-400L480-440Zm0-80 320-200H160l320 200ZM160-640v-80 480-400Z'/%3E%3C/svg%3E"); }
.menu_icon_site { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='M480-80q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q134 0 227-93t93-227q0-7-.5-14.5T799-507q-5 29-27 48t-52 19h-80q-33 0-56.5-23.5T560-520v-40H400v-80q0-33 23.5-56.5T480-720h40q0-23 12.5-40.5T563-789q-20-5-40.5-8t-42.5-3q-134 0-227 93t-93 227h200q66 0 113 47t47 113v40H400v110q20 5 39.5 7.5T480-160Z'/%3E%3C/svg%3E"); }
.menu_icon_youtube { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%231f1f1f'%3E%3Cpath d='m380-340 280-180-280-180v360Zm-60 220v-80H160q-33 0-56.5-23.5T80-280v-480q0-33 23.5-56.5T160-840h640q33 0 56.5 23.5T880-760v480q0 33-23.5 56.5T800-200H640v80H320ZM160-280h640v-480H160v480Zm0 0v-480 480Z'/%3E%3C/svg%3E"); }
.menu_icon_facebook { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='currentColor' d='M22.675 0h-21.35C.595 0 0 .593 0 1.326v21.348C0 23.407.595 24 1.325 24h11.495v-9.294H9.692V11.41h3.128V8.797 c0-3.1 1.894-4.788 4.659-4.788 1.325 0 2.464.099 2.795.143v3.24l-1.918.001c-1.504 0-1.796.715-1.796 1.763v2.313h3.587l-.467 3.296h-3.12V24h6.116C23.405 24 24 23.407 24 22.674V1.326C24 .593 23.405 0 22.675 0z'/%3E%3C/svg%3E"); }
.menu_icon_instagram { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='currentColor' d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.848 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.069-4.85.069-3.204 0-3.583-.012-4.849-.069-3.259-.149-4.771-1.696-4.919-4.919C2.175 15.584 2.163 15.205 2.163 12c0-3.204.012-3.583.069-4.849.149-3.227 1.664-4.771 4.919-4.919C8.417 2.175 8.796 2.163 12 2.163zm0 5.838A3.999 3.999 0 1 0 12 16a3.999 3.999 0 0 0 0-7.999zm6.406-1.845a.96.96 0 1 0 .001 1.92.96.96 0 0 0-.001-1.92z'/%3E%3C/svg%3E"); }
.menu_icon_linkedin { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='currentColor' d='M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.85-3.037-1.851 0-2.134 1.445-2.134 2.939v5.667H9.356V9h3.414v1.561h.049c.476-.9 1.637-1.85 3.369-1.85 3.602 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433a2.063 2.063 0 1 1 0-4.126 2.063 2.063 0 0 1 0 4.126zM6.985 20.452H3.688V9h3.297v11.452z'/%3E%3C/svg%3E"); }

.menu_icon:hover
{
   background-color: var(--color-text);
}

/*-------*/
/* Table */
/*-------*/
table, th, td
{
   background-color: transparent;
   border: 0px solid #000000;
}

tr.menu_left
{
   height: 30px;
   valign:top;
}

.color_app_list
{
   transition: background 0.15s;
}
.color_app_list:hover
{
   background-color: var(--color-button);
   cursor: pointer;
}

.color_app_background
{
   background-color: var(--color-button);
}

.panel
{
   background-color: var(--color-panel);
   padding: 10px;
   width: 100%;
   height: 1%;
   border: 1px solid var(--color-panel);
   border-radius: 5px;
}

.panel_50
{
   background-color: white;
   padding: 10px;
   width: 50%;
   height: 1%;
   border: 1px solid white;
   border-radius: 5px;
}

.panel_customer
{
   background-color: var(--color-panel);
   padding: 10px;
   height: 100%;
   border: 1px solid var(--color-panel);
   border-radius: 5px;
}

.panel_field
{
   background-color:#F7F7F7;
   border-bottom:1px solid var(--color-button);
   border-radius: 5px;
   display: block;
   vertical-align: top;
}

.panel_field_min50px
{
   background-color:#F7F7F7;
   border-bottom:1px solid var(--color-button);
   border-radius: 5px;
   display: block;
   vertical-align: top;
   min-height: 50px;
   height: auto;
   _height: 50px;
   width: 100%;
}

/*--------------*/
/* PROGRESS BAR */
/*--------------*/
.progress-container
{
  width: 100%;
  max-width: 300px;
  height: 25px;
  background-color: #eee;
  border-radius: 12.5px;
  overflow: hidden;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.2);
  position: relative;
  font-family: sans-serif;
}
.progress-bar
{
  height: 100%;
  background: linear-gradient(to right, #4caf50, var(--color-button));
  transition: width 0.3s ease;
}
.progress-label
{
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: gray;
  font-weight: bold;
  font-size: 14px;
  pointer-events: none;
}
.progress-text
{
  margin-top: 6px;
  font-size: 14px;
  text-align: center;
  color: #333;
}

/*------*/
/* Text */
/*------*/
h1
{
   font-size: 14px;
   font-weight: bold;
   color: var(--color-button);
   margin-top: 3px;
   margin-bottom: 3px;
}

h2 
{
   font-size: 14px;
   font-weight: bold;
   color: var(--color-text);
   margin-top: 3px;
   margin-bottom: 3px;
   text-align:left;
}

h3 
{
   font-size: 14px;
   font-weight: normal;
   color: var(--color-button);
   margin-top: 3px;
   margin-bottom: 3px;
   margin-left: 3px;
}

h4
{
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
   margin-top: 3px;
   margin-bottom: 3px;
   margin-left: 3px;
}

h5
{
   font-size: 14px;
   font-weight:lighter;
   color: var(--color-text);
   margin-top: 3px;
   margin-bottom: 3px;
   margin-left: 3px;
}

h6
{
   font-size: 9px;
   color: var(--color-text);
   margin-top: 1px;
   margin-bottom: 1px;
}

p
{
   font-size: 14px;
   font-weight: normal;
   color: var(--color-text);
}

.h_bottom
{
   font-size: 14px;
   font-weight:lighter;
   color: var(--color-panel);
   margin-top: 3px;
   margin-bottom: 3px;
   margin-left: 3px;
}

/*------*/
/* Date */
/*------*/
.calendar_date {
   position: relative;
   border: 1px solid var(--color-button);
   border-radius: 5px;
   background-color: #F1F2F2;
   height: auto;
   width: 98%;
}

/*------------*/
/* SMARTPHONE */
/*------------*/
.show-if-smartphone { display: none !important;  }
.hide-if-smartphone { display: inline-block !important; }

@media only screen and (max-width: 980px)
{
   .show-if-smartphone { display: inline-block !important; }
   .hide-if-smartphone { display: none !important;  }

   #div_login_front          {visibility:visible; position:absolute; height:auto;                  width:calc(100% - 20px);  left:10px;  top:40px;   z-index:4; border:0px solid #000000; padding-bottom: 50px;}

   #div_main_dashboard       {visibility:visible; position:absolute; height:auto;                  width:calc(100% - 55px);  left:50px;  top:7px;    z-index:5; border:0px solid #000000;                                  padding-bottom:70px; }

   #div_main_menu_full       {visibility:visible; position:fixed;    height:auto; min-height:50px; width:calc(100% - 55px);  left:50px;  top:7px;    z-index:4; border:0px solid #000000; }
   #div_main_text_full       {visibility:visible; position:relative; height:auto;                  width:calc(100% - 55px);  left:50px;  top:70px;   z-index:3; border:0px solid #000000;                                 padding-bottom:70px;  }
                          
   #div_main_menu_left       {visibility:visible; position:fixed;    height:auto;                  width:calc(100% - 46px);  left:40px;  top:70px;   z-index:5; border:1px solid var(--color-button); border-radius: 5px; background-color: var(--color-panel);}
   #div_main_menu_right      {visibility:visible; position:fixed;    height:auto; min-height:50px; width:calc(100% - 55px);  left:50px;  top:7px;    z-index:4; border:0px solid #000000; }
   #div_main_text_right      {visibility:visible; position:relative; height:auto;                  width:calc(100% - 55px);  left:50px;  top:7px;    z-index:3; border:0px solid #000000; padding-bottom:70px; }

   #div_outlook_summary      {visibility:visible; position:absolute; height:auto;                  width:calc(100% - 55px);  left:50px;  top:70px;   z-index:4; border:0px solid #000000; }
   #div_outlook_text         {visibility:visible; position:absolute; height:auto;                  width:calc(100% - 55px);  left:50px;  top:320px;  z-index:3; border:0px solid #000000;                                 padding-bottom:70px; }

   .div_col_25
   {
      float: none;
      width: 100%;
   }

   .div_col_30
   {
      float: none;
      width: 100%;
   }

   .div_col_15
   {
      float: none;
      width: 100%;
   }

   .div_col_3
   {
      float: none;
      width: 100%;
   }

   h2 
   {
      font-size: 14px;
      font-weight: bold;
      color: color: var(--color-text);
      margin-top: 3px;
      margin-bottom: 3px;
      text-align:center;
   }

   .input
   { 
      border-top: 0px solid #000000;
      border-right: 0px solid #000000;
      border-left: 0px solid #000000;
      border-bottom: 1px solid var(--color-button);
      border-radius: 5px;
      background-color: var(--color-input);
      font-size: 14px;
      font-weight: normal;
      color: var(--color-input-text);
      display: inline-block;
      width: 100%;
      padding:5px;
   }

   .input_radio
   { 
      border-top: 0px solid #000000;
      border-right: 0px solid #000000;
      border-left: 0px solid #000000;
      border-bottom: 1px solid var(--color-button);
      border-radius: 5px;
      background-color: var(--color-input);
      font-size: 14px;
      font-weight: normal;
      color: var(--color-text);
      display: inline-block;
      width: auto;
      padding:5px;
      margin-right: 10px;
      transform: scale(1.5);
   }

   .input_checkbox
   { 
      border-top: 0px solid #000000;
      border-right: 0px solid #000000;
      border-left: 0px solid #000000;
      border-bottom: 1px solid var(--color-button);
      border-radius: 5px;
      background-color: var(--color-button);
      font-size: 14px;
      font-weight: normal;
      color: var(--color-text);
      display: inline-block;
      width: auto;
      padding:5px;
      margin-right: 10px;
      transform: scale(1.5);
   }

   .img
   {
      width: 10px;
   }

   .button
   { 
      border: 2px solid var(--color-button);
      border-radius: 5px;
      background-color: var(--color-button);
      font-size: 14px;
      font-weight: normal;
      color: var(--color-button-text);
      padding-top: 2px;
      padding-bottom: 2px;
      padding-left: 20px;
      padding-right: 20px;
      cursor: pointer;
      width: 100%;
      max-width: 100%;
   }

   a {
      font-size: 12px;
      font-weight: normal;
      color: var(--color-text);
      text-decoration: none;
   }

   a.sub_menu {
      display: block;
      background-color: var(--color-panel);
      border: 1px solid var(--color-panel);
      border-radius: 5px;
      padding: 5px;
      width: calc(100% - 125px);
      height: auto;
      text-align: center;
      vertical-align: middle;
      font-size: 14px;
      font-weight: normal;
      color: var(--color-button);
      text-decoration:none;
      }

   a.button_return
   { 
      border: 0px solid #000000;
      font-size: 12px;
      font-weight: normal;
      color: var(--color-text);
      text-decoration: none;
      width: 100%;
      max-width: 100%;
      line-height: 50px;
   }

   .panel
   {
      background-color: var(--color-panel);
      padding: 10px;
      width: 100%;
      height: 1%;
      border: 1px solid var(--color-panel);
      border-radius: 5px;
      table-layout: fixed;
   }

   .panel_mobile
   {
      width: calc(100% - 20px);
      height: 1%;
   }

   .tr_mobile
   {
      display: flex;
      flex-direction: column;
      text-wrap: wrap;
      background-color: white;
      padding: 10px;
      width: 100%;
      height: 1%;
      border: 1px solid white;
      border-radius: 5px;
      table-layout: fixed;
   }

   .tr_mobile + .tr_mobile
   {
      margin-top: 10px; /* Espace de 10px entre les lignes */
   }

   .td_mobile
   {
      word-wrap: break-word;
      overflow-wrap: break-word;
      word-break: break-all;
   }

   td.td_block
   {
      width: 100%;
      display: block;
      padding-bottom: 10px;
   }

   td.td_block_align
   {
      align: center;
   }

   td.td_button_align
   {
      text-align:center;
   }
}