/* Fonts */
@font-face {
  font-family: 'Mier';
  src: local('Mier A Regular'), local('Mier-A-Regular'),
  url('../fonts/miera/MierA-Regular.woff2') format('woff2'),
  url('../fonts/miera/MierA-Regular.woff') format('woff'),
  url('../fonts/miera/MierA-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: MierA-Black;
  src: url(../fonts/miera/MierA-Black.eot);
  src: local("MierA-Black"), url(../fonts/miera/MierA-Black.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Black.woff2) format("woff2"), url(../fonts/miera/MierA-Black.woff) format("woff"), url(../fonts/miera/MierA-Black.ttf) format("truetype");
  font-weight: 900;
  font-display: swap
}

@font-face {
  font-family: MierA-Bold;
  src: url(../fonts/miera/MierA-Bold.eot);
  src: local("MierA-Bold"), url(../fonts/miera/MierA-Bold.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Bold.woff2) format("woff2"), url(../fonts/miera/MierA-Bold.woff) format("woff"), url(../fonts/miera/MierA-Bold.ttf) format("truetype");
  font-weight: 700;
  font-display: swap
}

@font-face {
  font-family: MierA-Book;
  src: url(../fonts/miera/MierA-Book.eot);
  src: local("MierA-Book"), url(../fonts/miera/MierA-Book.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Book.woff2) format("woff2"), url(../fonts/miera/MierA-Book.woff) format("woff"), url(../fonts/miera/MierA-Book.ttf) format("truetype");
  font-weight: 500;
  font-display: swap
}

@font-face {
  font-family: MierA-Heavy;
  src: url(../fonts/miera/MierA-Heavy.eot);
  src: local("MierA-Heavy"), url(../fonts/miera/MierA-Heavy.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Heavy.woff2) format("woff2"), url(../fonts/miera/MierA-Heavy.woff) format("woff"), url(../fonts/miera/MierA-Heavy.ttf) format("truetype");
  font-weight: 900;
  font-display: swap
}

@font-face {
  font-family: MierA-DemiBold;
  src: url(../fonts/miera/MierA-DemiBold.eot);
  src: local("MierA-DemiBold"), url(../fonts/miera/MierA-DemiBold.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-DemiBold.woff2) format("woff2"), url(../fonts/miera/MierA-DemiBold.woff) format("woff"), url(../fonts/miera/MierA-DemiBold.ttf) format("truetype");
  font-weight: 600;
  font-display: swap
}

@font-face {
  font-family: MierA-ExtraBold;
  src: url(../fonts/miera/MierA-ExtraBold.eot);
  src: local("MierA-ExtraBold"), url(../fonts/miera/MierA-ExtraBold.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-ExtraBold.woff2) format("woff2"), url(../fonts/miera/MierA-ExtraBold.woff) format("woff"), url(../fonts/miera/MierA-ExtraBold.ttf) format("truetype");
  font-weight: 800;
  font-display: swap
}

@font-face {
  font-family: MierA-Hair;
  src: url(../fonts/miera/MierA-Hair.eot);
  src: local("MierA-Hair"), url(../fonts/miera/MierA-Hair.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Hair.woff2) format("woff2"), url(../fonts/miera/MierA-Hair.woff) format("woff"), url(../fonts/miera/MierA-Hair.ttf) format("truetype");
  font-weight: 300;
  font-display: swap
}

@font-face {
  font-family: MierA-Thin;
  src: url(../fonts/miera/MierA-Thin.eot);
  src: local("MierA-Thin"), url(../fonts/miera/MierA-Thin.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Thin.woff2) format("woff2"), url(../fonts/miera/MierA-Thin.woff) format("woff"), url(../fonts/miera/MierA-Thin.ttf) format("truetype");
  font-weight: 100;
  font-display: swap
}

@font-face {
  font-family: MierA-Regular;
  src: url(../fonts/miera/MierA-Regular.eot);
  src: local("MierA-Regular"), url(../fonts/miera/MierA-Regular.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Regular.woff2) format("woff2"), url(../fonts/miera/MierA-Regular.woff) format("woff"), url(../fonts/miera/MierA-Regular.ttf) format("truetype");
  font-weight: 400;
  font-display: swap
}

@font-face {
  font-family: MierA-Light;
  src: url(../fonts/miera/MierA-Light.eot);
  src: local("MierA-Light"), url(../fonts/miera/MierA-Light.eot?#iefix) format("embedded-opentype"), url(../fonts/miera/MierA-Light.woff2) format("woff2"), url(../fonts/miera/MierA-Light.woff) format("woff"), url(../fonts/miera/MierA-Light.ttf) format("truetype");
  font-weight: 300;
  font-display: swap
}



@font-face {
  font-family: 'Sansita Swashed';
  src: url('../fonts/sansita/SansitaSwashed-Light.eot');
  src: url('../fonts/sansita/SansitaSwashed-Light.eot?#iefix') format('embedded-opentype'),
  url('../fonts/sansita/SansitaSwashed-Light.woff2') format('woff2'),
  url('../fonts/sansita/SansitaSwashed-Light.woff') format('woff'),
  url('../fonts/sansita/SansitaSwashed-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}


@font-face {
  font-family: 'Nunito-Regular';
  src: url('../fonts/nunito/Nunito-Regular.eot');
  src: url('../fonts/nunito/Nunito-Regular.eot?#iefix') format('embedded-opentype'),
  url('../fonts/nunito/Nunito-Regular.woff2') format('woff2'),
  url('../fonts/nunito/Nunito-Regular.woff') format('woff'),
  url('../fonts/nunito/Nunito-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito-Bold';
  src: url('../fonts/nunito/Nunito-Bold.eot');
  src: url('../fonts/nunito/Nunito-Bold.eot?#iefix') format('embedded-opentype'),
  url('../fonts/nunito/Nunito-Bold.woff2') format('woff2'),
  url('../fonts/nunito/Nunito-Bold.woff') format('woff'),
  url('../fonts/nunito/Nunito-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Nunito-Light';
  src: url('../fonts/nunito/Nunito-Light.eot');
  src: url('../fonts/nunito/Nunito-Light.eot?#iefix') format('embedded-opentype'),
  url('../fonts/nunito/Nunito-Light.woff2') format('woff2'),
  url('../fonts/nunito/Nunito-Light.woff') format('woff'),
  url('../fonts/nunito/Nunito-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

.ff-Nunito-Bold {font-family: 'Nunito-Bold', serif !important;}
.ff-Nunito-Regular {font-family: 'Nunito-Regular', serif !important;}
.ff-Nunito-Light {font-family: 'Nunito-Light', serif !important;}

.ff-MierA-Regular {font-family: 'Mier', serif !important;}
.ff-MierA-Black {font-family: 'MierA-Black', serif !important;}
.ff-MierA-Bold {font-family: 'MierA-Bold', serif !important;}
.ff-MierA-Book {font-family: 'MierA-Book', serif !important;}
.ff-MierA-Heavy {font-family: 'MierA-Heavy', serif !important;}
.ff-MierA-DemiBold {font-family: 'MierA-DemiBold', serif !important;}
.ff-MierA-ExtraBold {font-family: 'MierA-ExtraBold', serif !important;}
.ff-MierA-Hair {font-family: 'MierA-Hair', serif !important;}
.ff-MierA-Thin {font-family: 'MierA-Thin', serif !important;}
.ff-MierA-Regular {font-family: 'MierA-Regular', serif !important;}
.ff-MierA-Light {font-family: 'MierA-Light', serif !important;}






  /*CURSOR*/
.cursor_p {cursor: pointer!important;}
.cursor_d {cursor: default!important;}
.cursor_not_alowed {cursor: not-allowed!important;}

/*Opacity*/
.op-0 {opacity: 0.0;}
.op-1 {opacity: 0.1;}
.op-2 {opacity: 0.2;}
.op-3 {opacity: 0.3;}
.op-4 {opacity: 0.4;}
.op-5 {opacity: 0.5;}
.op-6 {opacity: 0.6;}
.op-7 {opacity: 0.7;}
.op-8 {opacity: 0.8;}
.op-9 {opacity: 0.9;}


/*Font Size*/
.fs-8 {font-size: 8px !important;}
.fs-9 {font-size: 9px !important;}
.fs-10 {font-size: 10px !important;}
.fs-11 {font-size: 11px !important;}
.fs-12 {font-size: 12px !important;}
.fs-13 {font-size: 13px !important;}
.fs-14 {font-size: 14px !important;}
.fs-15 {font-size: 15px !important;}
.fs-16 {font-size: 16px !important;}
.fs-17 {font-size: 17px !important;}
.fs-18 {font-size: 18px !important;}
.fs-19 {font-size: 19px !important;}
.fs-20 {font-size: 20px !important;}
.fs-21 {font-size: 21px !important;}
.fs-22 {font-size: 22px !important;}
.fs-23 {font-size: 23px !important;}
.fs-24 {font-size: 24px !important;}
.fs-25 {font-size: 25px !important;}
.fs-26 {font-size: 26px !important;}
.fs-27 {font-size: 27px !important;}
.fs-28 {font-size: 28px !important;}


/*text color*/
.text-white{color: #ffffff !important;}
.text-yellow{color: #ffc107 !important;}
.text-dark-yellow{color: #EAAA30 !important;}
.text-dark-blue{color: #1E3C72 !important;}
.text-light-blue{color: #11B4ED !important;}
.text-gray {color: #959595 !important;}
.text-red{color: #BB0A30 !important;}
.text-dark-red{color: #ea5d1a !important;}
.text-dark-gray{color: #707070 !important;}
.text-dark-orange{color: #1E3C72 !important;}

/*Color change on hover*/
.hvr-color {color: #757575;}
.hvr-color.hvr-gray:hover {color: #757575 !important;}
.hvr-color.hvr-primary:hover {color: #007bff !important;}
.hvr-color.hvr-secondary:hover {color: #6c757d !important;}
.hvr-color.hvr-success:hover {color: #2dce89 !important;}
.hvr-color.hvr-danger:hover {color: #f5365c !important;}
.hvr-color.hvr-warning:hover {color: #fb6340 !important;}
.hvr-color.hvr-info:hover {color: #f8f9fa !important;}
.hvr-color.hvr-light:hover {color: #f8f9fa !important;}
.hvr-color.hvr-dark:hover {color: #343a40 !important;}

/* Border radius */
.b-rad-5{border-radius: 5px !important;}
.b-rad-10{border-radius: 10px !important;}
.b-rad-25{border-radius: 25px !important;}
.b-rad-50{border-radius: 50px !important;}

/*Text Style*/
.ws-normal {
  white-space: normal;
}


/*Animation*/
.anim_elem {
  transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  --webkit-transition: all 0.5s ease-in-out;
}

@keyframes rotate-shake {
  0% {
    transform: rotate(0deg);
  }
  2% {
    transform: rotate(30deg);
  }
  4% {
    transform: rotate(-30deg);
  }
  6% {
    transform: rotate(30deg);
  }
  8% {
    transform: rotate(-30deg);
  }
  10% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

.shake-rotation {
  animation: rotate-shake 4.0s ease-in-out infinite, pause 3s ease-in-out infinite;
}

/* Pause de 3 secondes avant de recommencer */
@keyframes pause {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}


body, p, h1, h2, h3, h4 {
  font-family: 'Mier';
}



/* Blue rounded button */
.orange_btn_round {
  min-height: 35px !important;
  /*border-radius: 25px !important;*/ /* CHANGED */
  border-radius: 5px !important;
  font-weight: bold;
}



.btn-secondary {
  color: #ffffff;
  background-color: #1E3C72;
  border-color: #1E3C72;

  /*background-color: #ffc107;*/
  /*border-color: #ffc107;*/
}


.btn-secondary:hover {
  color: #ffffff;
  background-color: #104D75;
  border-color: #104D75;

  /*background-color: #e0a800;*/
  /*border-color: #d39e00;*/
}

.btn-secondary:not(:disabled):not(.disabled).active, .btn-secondary:not(:disabled):not(.disabled):active, .show>.btn-secondary.dropdown-toggle {
  color: #ffffff;
  background-color: #104D75;
  border-color: #104D75;
  /*background-color: #d39e00;*/
  /*border-color: #c69500;*/
}

.btn-secondary.focus, .btn-secondary:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 80, 99, 0.5);
}

.btn-outline-secondary {
  color: #104D75;
  border-color: #104D75;
}

.btn-outline-secondary:not(:disabled):not(.disabled).active, .btn-outline-secondary:not(:disabled):not(.disabled):active, .show>.btn-outline-secondary.dropdown-toggle {
  color: #ffffff;
  background-color: #104D75;
  border-color: #104D75;
}

.btn-outline-secondary:hover {
  color: #ffffff;
  background-color: #104D75;
  border-color: #104D75;
}

.btn-outline-secondary.focus, .btn-outline-secondary:focus {
  color: #104D75;
  box-shadow: 0 0 0 0.2rem rgba(0, 80, 99, 0.5);
}



/* Dropdown menu with no caret */
.dropdown.no_caret .dropdown-menu::after{content :unset !important;}




/* top-menu */
#brand_select_menu_top #brand_select_menu_top_img_1 {height: 40px;width: 65px;margin-left: 10px;opacity: 1;}
#brand_select_menu_top #brand_select_menu_top_img_2 {height: 40px;width: 33px;opacity: 0.5}
#brand_select_menu_top #brand_select_menu_top_img_1, #brand_select_menu_top #brand_select_menu_top_img_2 {
  transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  --webkit-transition: all 0.3s ease-in-out;
}
#brand_select_menu_top:hover #brand_select_menu_top_img_1 {width: 33px;}
#brand_select_menu_top:hover #brand_select_menu_top_img_2 {width: 65px;opacity: 0.5}


/* Other Things */

.bg-darkblue {background-color: #1E3C72 !important;}
.bg-gWg {
  background-image: linear-gradient(135deg, rgba(244, 244, 244,0.07) 0%, rgba(244, 244, 244,0.07) 12.5%,rgba(211, 211, 211,0.07) 12.5%, rgba(211, 211, 211,0.07) 25%,rgba(178, 178, 178,0.07) 25%, rgba(178, 178, 178,0.07) 37.5%,rgba(145, 145, 145,0.07) 37.5%, rgba(145, 145, 145,0.07) 50%,rgba(113, 113, 113,0.07) 50%, rgba(113, 113, 113,0.07) 62.5%,rgba(80, 80, 80,0.07) 62.5%, rgba(80, 80, 80,0.07) 75%,rgba(47, 47, 47,0.07) 75%, rgba(47, 47, 47,0.07) 87.5%,rgba(14, 14, 14,0.07) 87.5%, rgba(14, 14, 14,0.07) 100%),linear-gradient(45deg, rgba(236, 236, 236,0.07) 0%, rgba(236, 236, 236,0.07) 12.5%,rgba(210, 210, 210,0.07) 12.5%, rgba(210, 210, 210,0.07) 25%,rgba(183, 183, 183,0.07) 25%, rgba(183, 183, 183,0.07) 37.5%,rgba(157, 157, 157,0.07) 37.5%, rgba(157, 157, 157,0.07) 50%,rgba(130, 130, 130,0.07) 50%, rgba(130, 130, 130,0.07) 62.5%,rgba(104, 104, 104,0.07) 62.5%, rgba(104, 104, 104,0.07) 75%,rgba(77, 77, 77,0.07) 75%, rgba(77, 77, 77,0.07) 87.5%,rgba(51, 51, 51,0.07) 87.5%, rgba(51, 51, 51,0.07) 100%),linear-gradient(90deg, #ffffff,#ffffff);
}
.no_select {
  -webkit-user-select: none; /* Safari */
  -moz-user-select: none; /* Firefox */
  user-select: none;
}

.wow_delayed {opacity: 0}

.btn {font-family: 'MierA-Bold', serif; padding: 4px 14px;}
.btn-icon {padding: 0;}

.ovfl-X-hid {overflow-x: hidden}

.min-h-35{min-height: 35px}

label {font-weight: bold;}

.w-100-m-0 {
  width: 100% !important;
  margin: 0 !important;
}

.select2-selection__arrow {height: 100%!important;}

.card {border: 1px solid #cacaca!important;margin-bottom: 20px;}

.dataTables_wrapper select.form-control { min-width: 60px !important;}

.bg_styled, .page-wrap {
  background-color: #f0f0f0 !important;
  opacity: 1 !important;
  min-height: 300px;
  background: linear-gradient(22.5deg, rgba(66, 66, 66, 0.02) 0%, rgba(66, 66, 66, 0.02) 11%, rgba(135, 135, 135, 0.02) 11%, rgba(135, 135, 135, 0.02) 24%, rgba(29, 29, 29, 0.02) 24%, rgba(29, 29, 29, 0.02) 38%, rgba(15, 15, 15, 0.02) 38%, rgba(15, 15, 15, 0.02) 50%, rgba(180, 180, 180, 0.02) 50%, rgba(180, 180, 180, 0.02) 77%, rgba(205, 205, 205, 0.02) 77%, rgba(205, 205, 205, 0.02) 100%), linear-gradient(67.5deg, rgba(10, 10, 10, 0.02) 0%, rgba(10, 10, 10, 0.02) 22%, rgba(52, 52, 52, 0.02) 22%, rgba(52, 52, 52, 0.02) 29%, rgba(203, 203, 203, 0.02) 29%, rgba(203, 203, 203, 0.02) 30%, rgba(69, 69, 69, 0.02) 30%, rgba(69, 69, 69, 0.02) 75%, rgba(231, 231, 231, 0.02) 75%, rgba(231, 231, 231, 0.02) 95%, rgba(138, 138, 138, 0.02) 95%, rgba(138, 138, 138, 0.02) 100%), linear-gradient(112.5deg, rgba(221, 221, 221, 0.02) 0%, rgba(221, 221, 221, 0.02) 17%, rgba(190, 190, 190, 0.02) 17%, rgba(190, 190, 190, 0.02) 39%, rgba(186, 186, 186, 0.02) 39%, rgba(186, 186, 186, 0.02) 66%, rgba(191, 191, 191, 0.02) 66%, rgba(191, 191, 191, 0.02) 68%, rgba(16, 16, 16, 0.02) 68%, rgba(16, 16, 16, 0.02) 70%, rgba(94, 94, 94, 0.02) 70%, rgba(94, 94, 94, 0.02) 100%), linear-gradient(90deg, #FFF, #FFF);
}

.btn_white_outline {
  background-color: white;
  color: #1E3C72;
}

.btn_white_outline:hover, .btn_white_outline:focus {
  background-color: #1E3C72;
  color: white;

}


#scrollToTopBtn {
  position: fixed; bottom: 12px; right: 15px; opacity: 1; display: none;
}

#scrollToTopBtn i {
  position: relative;top:-2px;
}

@media (max-width: 992px) {
  .overflow-x-md-scroll {
    overflow-x: scroll;
  }

}


/* custom progress bar */

.progress-bar-custom.progress-bar {
  width: 0;
  transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  --webkit-transition: all 0.5s ease-in-out;
  animation: load 2s 0s;
}

.progress-bar-custom.progress-bar.bg-red {
  background-color: #cb0a35 !important;
}

.progress-bar-custom.progress-bar.bg-red:after {
  border: 3px solid #BB0A30!important;
}

.progress-bar-custom.progress-bar.bg-darkred {
  background-color: #ff611a !important;
}

.progress-bar-custom.progress-bar.bg-darkred:after {
  border: 3px solid #ea5d1a;
}

.progress-bar-custom.progress-bar.bg-dark-yellow {
  background-color: #eaaa30 !important;
}

.progress-bar-custom.progress-bar.bg-dark-yellow:after {
  border: 3px solid #e4a331;
}

.progress-bar-custom.progress-bar.bg-darkblue {
  background-color: #005468 !important;
}

.progress-bar-custom.progress-bar.bg-darkblue:after {
  border: 3px solid #1E3C72;
}

.progress-bar-custom.progress-bar.bg-lightblue {
  background-color: #19B5FE !important;
}

.progress-bar-custom.progress-bar.bg-lightblue:after {
  border: 3px solid #1389bf;
}

.progress-bar-custom.progress-bar.bg-darkgray {
  background-color: #707070 !important;
}

.progress-bar-custom.progress-bar.bg-darkgray:after {
  border: 3px solid #707070;
}

.proj-progress-card .progress .progress-bar:after {
  top: -5px;
}

.progress-green-dot {
  position: relative;
  left: 79.8%;
  top: 14px;
  z-index: 2;
  color: #2ba22b !important;
  max-width: 20px;
}


/* Login page */

.btn-theme {
  background: linear-gradient(150deg, #104D75 30%, #1E3C72 48%, #104D75 94%);
  color: #fff;
  border-radius: 20px;
}

#login_page .login_inputs {
  border: none;
  border-bottom: solid 1px #ababab;
  border-radius: 0;
}



/* Timeout modal */
#session-timeout-dialog .modal-header {display: block;text-align: center}
#session-timeout-dialog .modal-header .close {display: none;}
#session-timeout-dialog .modal-body p {font-size: 20px; margin-top: 1rem;text-align: center}



/* Menu Top */
.wrapper .header-top {padding: 14px 0 16px 0;}

.wrapper .header-top .portal_header_img {
  width: 100px;
  margin-right: 10px;
  margin-left: 20px;
}

.wrapper .header-top .portal_header_title {
  font-weight: bold;
  font-size: 20px;
  cursor: pointer;
  color: #1E3C72;
  font-family: 'Nunito-Bold', cursive;
}

/* Main page layout */
.page-wrap .main-content {padding-left: 0!important;}



/*Ticker News*/

.TickerNews {
  width: 100%;
  height: 50px;
  line-height: 50px;
}

.TickerNews .ti_wrapper {
  width: 100%;
  position: relative;
  overflow: hidden;
  height: 50px;
}

.TickerNews .ti_slide {
  width: 30000px;
  position: relative;
  left: 0;
  top: 0;
}

.TickerNews .ti_content {
  width: 8000px;
  position: relative;
  float: left;
}

.TickerNews .ti_news {
  float: left;
  padding-left: 20px;
  padding-right: 20px;
  color: white !important;
}

.TickerNews .ti_news a {
  color: white !important;
}

.update_data {
  font-family: 'MierA-DemiBold', serif;
  display: flex; /* Active Flexbox */
  justify-content: center; /* Centrage horizontal */
  align-items: center; /* Centrage vertical */

  text-align: center;
  font-weight: bold;
  font-size: 15px;
  color: #ffffff;
  line-height: 20px;
  letter-spacing: 1px;
  padding: 6px;

  border-right: 2px solid #ffffff;

  height: 50px;
  width: 140px;
  background-color: #1e3c72;
  position: fixed;
  bottom: 0px;
  left: 0px;
  z-index: 20;
}

.update_data_1 {  background-color: #2D74BE;}
.update_data_2 {  background-color: #730019;}
.update_data_3 {  background-color: #BA430A;}
.update_data_4 {  background-color: #BA430A;}
.update_data_5 {  background-color: #008A40;}
.update_data_6 {  background-color: #2D74BE;}




/* Group Concession Menu*/
#group_cons_div_all {display: flex}
@media (max-width:480px)  {#group_cons_div_all {display: block}}
.group-concession-div {}

.group-concession-div .select2.select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 32px !important;
}


.group-concession-div .select2.select2-container .select2-selection {
  color: #1E3C72;
  border-color: #1E3C72;
  /*border-radius: 18px;*/ /* CHANGED */
  border-radius: 5px;
  box-shadow: 0 .125rem .25rem rgba(0,0,0,.075)!important;
}


.group-concession-div .select2.select2-container .select2-selection .select2-selection__placeholder,
.group-concession-div .select2.select2-container .select2-selection .select2-selection__rendered {
  color: #1E3C72;
  font-weight: bold;
}

.group-concession-div .select2 {min-width: 300px}

.group-concession-div .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: rgb(147 173 255) transparent transparent transparent !important;
}
.group-concession-div .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent rgb(147 173 255) !important;
}

.select2-blue_border {
  border: 1px solid #1E3C72!important;
  /*border-radius: 0 0 25px 25px;*/ /* CHANGED */
  border-radius: 0 0 5px 5px;
  overflow: hidden;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #1E3C72;
  color: white;
}

/*added*/
.select2-dropdown {border-radius: 1px 1px 5px 5px !important;}

.wrapper .page-wrap .main-content { min-height: calc(100vh - 60px); background-color: unset!important;}



/* Brand select page */

#brandpage_container .col img {transition: transform 0.3s ease, opacity 0.6s ease;user-drag: none;-webkit-user-drag: none;-moz-user-select: none;}
#brandpage_container .col img:hover , #brandpage_container .home_brand_square:hover img {transform: scale(1.1);}
#brandpage_container .fade-out {opacity: 0.2;transition: opacity 0.8s ease-out;}
#brandpage_container .grow-img, #brandpage_container .grow-img:hover, #brandpage_container .home_brand_square:hover .grow-img  {opacity: 1 !important;transform: scale(1.2) !important; /* Agrandir l'image lors du clic */transition: transform 1.2s ease-out; /* Transition pour l'agrandissement */}
#brandpage_container .wrapper .page-wrap .main-content {padding: 0;}
#brandpage_container .home_brand_square {height: 250px;width: 250px;border-radius: 10px;overflow: hidden;border: 1px solid #dee2e6;box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);transition: all ease-in-out 0.25s;}
#brandpage_container .home_brand_square:hover {box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);}
#brandpage_container .home_brand_square:hover.brand_id_1 {box-shadow: 0 .125rem .25rem rgba(45, 116, 190, 0.91);}
#brandpage_container .home_brand_square:hover.brand_id_2 {box-shadow: 0 .125rem .25rem rgba(115, 0, 25, 0.91);}
#brandpage_container .home_brand_square:hover.brand_id_3 {box-shadow: 0 .125rem .25rem rgba(186, 67, 10, 0.91);}
#brandpage_container .home_brand_square:hover.brand_id_4 {box-shadow: 0 .125rem .25rem rgba(186, 67, 10, 0.91);}
#brandpage_container .home_brand_square:hover.brand_id_5 {box-shadow: 0 .125rem .25rem rgba(0, 138, 64, 0.91);}
#brandpage_container .home_brand_square:hover.brand_id_6 {box-shadow: 0 .125rem .25rem rgba(45, 116, 190, 0.91);}
#brandpage_container .bell_icon_div {top: 0px;right: 0px;padding: 8px;border-radius: 0 0 0 10px;position: absolute;opacity: 0.7;background-color: #2aa129;border: solid 1px lightgray;border-top: unset;border-right: unset;}
#brandpage_container .bell_icon_div img {width: 16px;}





/*DATA TABLES*/

.dataTables_paginate .pagination .paginate_button.page-item:hover a {
  background-color: #e0e0e0 !important;
}

.dataTables_paginate .pagination .paginate_button.page-item.active a, .dataTables_paginate .pagination .paginate_button.page-item.active:hover a {
  background-color: #cacaca !important;
}




/*------------------------------------------------
    Home Page
-------------------------------------------------*/

#homepage_div {}

#homepage_div #homepage_container table {position: fixed; top: 40%;left: -10px;}

#homepage_div .side-button {
  position: relative;
  top: 50%; /* Position verticale */
  left: -220px; /* Partie cachée hors de l'écran */
  transform: translateY(-50%);
  width: 300px;
  height: 60px;
  background-color: #1E3C72;
  color: white;
  border: none;
  border-radius: 0 30px 30px 0; /* Arrondi à droite */
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  transition: left 0.3s ease; /* Animation de déplacement */
}

#homepage_div .side-button .icon {
  background-color: white;
  color: #1E3C72;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: 2px;
}


#homepage_div .side-button .icon img {
  width: 50px;
  height: 50px;
}

#homepage_div .side-button .text {
  margin-left: 20px;
  margin-right: 20px;
  opacity: 0;
  white-space: nowrap;
  transition: all 0.3s ease;
}

#homepage_div .side-button:hover {
  left: 0;
}

#homepage_div .side-button:hover .text {
  opacity: 1;
}




@media (max-width: 992px) {
  #homepage_div {
    min-height: 75vh;
  }

}





/* Menu Left */



.sc-left-menu .head-nav li:before {
  position: absolute;
  left: -0.925rem;
  top: 0;
  height: 100%;
  content: "";
  background: #ffffff;
  z-index: 1;
  transition: background 400ms;
}

.sc-left-menu .head-nav ul {
  margin-top: 0rem;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  padding: 0;
  list-style: none;
}

.sc-left-menu .head-nav li {
  position: relative;
  clear: both;
  width: 100%;
  padding: 5px 5px 0 5px;
  transition: background 200ms;
  border-left: unset !important;
  border-right: unset !important;
}

.sc-left-menu .head-nav li a {
  display: flex;
  padding-top: 17px;
  padding-bottom: 17px;
  padding-left: 2px;
  padding-right: 2px;
  transition: background 400ms;
  flex-direction: column;
}

.sc-left-menu .head-nav a {
  font-size: 23px;
  align-items: center;
  width: 100%;
  color: #fefefe;
  text-decoration: none;
  transition: color 400ms;
}

.sc-left-menu .head-nav a span {
  /*font-weight: bold;*/
  position: relative;
  display: block;
  z-index: 0;
  white-space: nowrap;
  transition: text-indent 400ms ease-in-out;
}

.sc-left-menu .head-nav img {
  max-width: 65px;
}


.sc-left-menu .brand_menu_li .brand_menu {
  padding-top: unset;
  padding-bottom: unset;
}

@media screen and (max-width: 768px) {
  .sc-left-menu .head-nav ul {
    margin-top: 0.23125rem;
  }

  .sc-left-menu .head-nav img {
    max-width: 65px;
  }
}

.sc-left-menu {
  position: fixed;
  top: 75px;
  left: 10px;
  width: 83px;
  height: calc(100vh - 140px);
  border-radius: 5px;
  z-index: 100;
  background: #ffffff;
  box-shadow: 0 .125rem .25rem rgba(82,82,82,.9)!important;
  transition: width 400ms;
}



.sc-left-menu .head-nav li.active a {background-color: #1E3C72;}
.sc-left-menu .head-nav li .menuLeftImg_2 {display: none;}

.sc-left-menu .head-nav li.active .menuLeftImg_1, .sc-left-menu .head-nav li:hover .menuLeftImg_1 {display: none;}
.sc-left-menu .head-nav li.active .menuLeftImg_2, .sc-left-menu .head-nav li:hover .menuLeftImg_2  {display: block;}

.sc-left-menu .head-nav li:hover a {background-color: #1E3C72;color: #ffffff;}

.sc-left-menu .head-nav li:hover:before a {background-color: #1E3C72;}
.sc-left-menu .head-nav li a {border-radius: 10px;height: 73px;width: 73px;}


.sc-left-menu .head-nav li a .menu_page_title {
  font-family: MierA-DemiBold, serif;
  position: absolute;
  left: 100%;
  top: 10px;
  transform: translate(-3rem);
  margin-left: 1rem;
  opacity: 0;
  pointer-events: none;
  color: #1E3C72;
  background: #fff;
  padding: 0.75rem;
  transition: 250ms ease all;
  border-radius: 10px;
}

.sc-left-menu .head-nav li:hover a .menu_page_title {opacity: 1;transform: translate(0);}

.sc-left-menu .head-nav li:hover a.brand_menu {background-color: #ffffff;}
.sc-left-menu .head-nav li:hover:before a.brand_menu {background-color: #ffffff;}
.sc-left-menu .head-nav li a.brand_menu {border-radius: 0;}
.sc-left-menu .head-nav li a.brand_menu span {font-weight: unset;}

#custom_top_menus_row {
  opacity: 0;
  position: fixed;
  width: calc(100% - 170px);
  border-radius: 5px 5px 0 0;
  top: 75px;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: #ffffff;
  z-index: 1;
  border: 1px solid #ffffff !important;
}

#custom_top_menus_row.scrolling {
  border: 1px solid #cacaca !important;
  box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
}


.wrap-all-the-things {
  min-height: 100%;
  height: 100%;
  padding-left: 140px;
  padding-bottom: 15px;
  margin-top: 0;
  transition: transform 400ms, opacity 400ms;
}

@media screen and (max-width: 480px) {
  .wrap-all-the-things {
    padding-left: 60px;
  }
}

.fadeInLeftManual {
  opacity: 0;
  transform: translateX(-100px);
  transition: opacity 0.5s, transform 0.5s;
}

.fadeInLeftManual.show {
  opacity: 1;
  transform: translateX(0);
}

/* Other Stuff*/

.rounded-table {
  border-collapse: separate; /* Important pour les effets de bordure */
  border-spacing: 0; /* Supprime les espaces entre les cellules */
  border: 1px solid #ccc; /* Bordure de la table */
  border-radius: 10px; /* Rayon de la bordure */
  overflow: hidden; /* Pour appliquer correctement le border-radius */
}


/* Sales Process & Lead */

.grayBox {
  background-color: #E6E6E6;
  border-radius: 5px;
  border: 1px solid #d4d4d4;
  padding: 5px;
  margin: 5px;
  color: black;
  text-align: center;
  width: 90%;
  font-weight: bold;
}

.grayBox .grayBox_top-text {
  font-size: 20px;
  width: 100%;
  background-color: white;
  margin: 0;
  padding: 5px;
}

.grayBox .grayBox_bottom-text {
  font-size: 19px;
  margin: 0;
  padding: 10px;
}


/*Ranking Shapes*/
.ranking_shape {
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  padding: 5px 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}
.ranking_shape.ranking_pr_gray{background-image: url('/assets/images/pictos/other/pr_gray.png');}
.ranking_shape.ranking_pr_red{background-image: url('/assets/images/pictos/other/pr_red.png');color: #ffffff;}
.ranking_shape.ranking_pr_orange{background-image: url('/assets/images/pictos/other/pr_orange.png');color: #ffffff;}
.ranking_shape.ranking_pr_green{background-image: url('/assets/images/pictos/other/pr_green.png');color: #ffffff;}
.ranking_shape.ranking_pl_gray{background-image: url('/assets/images/pictos/other/pl_gray.png');}
.ranking_shape.ranking_pl_red{background-image: url('/assets/images/pictos/other/pl_red.png');color: #ffffff;}
.ranking_shape.ranking_pl_orange{background-image: url('/assets/images/pictos/other/pl_orange.png');color: #ffffff;}
.ranking_shape.ranking_pl_green{background-image: url('/assets/images/pictos/other/pl_green.png');color: #ffffff;}






















/* Connect & Service Lead Reporting*/

@keyframes load {
  from {
    width: 0%
  }
}

@-webkit-keyframes load {
  from {
    width: 0%
  }
}

@-moz-keyframes load {
  from {
    width: 0%
  }
}

@-o-keyframes load {
  from {
    width: 0%
  }
}

.chart_area_ac {
  width: 145%;
  height: 238px !important;
  max-height: 238px;
}

.ac_table_YTD {
  width: 70%;
  margin: auto;
}
#all_pages_container .ac_table_YTD {
  width: 82%;
  margin: auto;
}

.ac_titleChart_YTD {
  text-align: center;
  color: #000;
  font-size: 30px;
}

.ac_bar {
  padding: 4px;
  border-radius: 20px;
  font-size: 14px;
  color: #FFF;
  font-weight: bold;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
  overflow: hidden;

  max-height: 42px;
  background-color: #f5f5f5;
  margin-bottom: 0 !important;
  border: 2px solid #156082;
}

.ac_bar::before {
  content: attr(data-skill);
  color: #000000;
  /*background-color: #FF931E;*/
  display: inline-block;
  border-radius: inherit;
  animation: load 2s 0s;
  -webkit-animation: load 2s 0s;
  -moz-animation: load 2s 0s;
  -o-animation: load 2s 0s;

  background-color: unset;
  border: 2px solid unset;
  max-height: 30px;
  padding: 3px 7px !important;
  transition: all 0.5s ease-out;
  white-space: nowrap;
}


.as_bar_avrg_mr_lv_1::before {background-color: #B90A2F;border-color: #B90A2F;color:#ffffff;}
.as_bar_avrg_mr_lv_2::before {background-color: #FF931E;border-color: #FF931E;color:#ffffff;}
.as_bar_avrg_mr_lv_3::before {background-color: #00853E;border-color: #00853E;color:#ffffff;}

.as_bar_avrg_four_lv_1::before {background-color: #C00000;border-color: #C00000;color:#ffffff;}
.as_bar_avrg_four_lv_2::before {background-color: #DBDBDB;border-color: #DBDBDB;color:#ffffff;}
.as_bar_avrg_four_lv_3::before {background-color: #BFBFBF;border-color: #BFBFBF;color:#ffffff;}
.as_bar_avrg_four_lv_4::before {background-color: #009E47;border-color: #009E47;color:#ffffff;}

.table_v_align_middle tr td, .table_v_align_middle tr th {vertical-align: middle!important;}



.td_with_target .vertlinediv .vertline3 {
  height: 38px;
  position: relative;
  width: 0;
  right: -100%;
  border-right: 5px solid #2ba22b;
  z-index: 2;
}

.td_with_target .vertlinediv {
  height: 0;
  width: 80%;
  position: relative;
}

.ac_bar.ac_bar_green::before {
  background-color: #00853E;
}

.ac_bar.ac_bar_blue1::before {
  background-color: #0062AC;
}

.ac_bar.ac_bar_blue2::before {
  background-color: #00B0F0;
}

.ac_bar.ac_bar_red::before {
  background-color: #BB0A30;
}

.ac_bar.ac_bar_gray::before {
  background-color: #999999;
}

.ac_bar.ac_bar_yellow::before {
  background-color: #FFC000;
  color: black;
}

.ac_text_canvas {
  position: absolute;
  text-align: center;
  width: 100%;
  height: 238px;
  line-height: 30px;
  padding-top: 92px;
  padding-right: 30px;
  font-size: 22px;
  font-weight: bold;
  cursor: default;
}



/* Dashboard Compeur  (exp page Bonus Aftersales */

table.dashboard tr:nth-child(1) td {
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  vertical-align: middle;
}

table.dashboard tr:nth-child(3) td {
  text-align: center;
}

.dashboard-variableMargins .dashboard {
  padding: 0 2rem 2rem 2rem; /*font-family: "Coda", cursive;*/
}

.dashboard-variableMargins .dashboard .grad {
  display: inline-block;
  padding: 2rem; /*font-family: "Coda", cursive;*/
}

.dashboard-variableMargins .meter {
  display: inline-block;
  position: relative;
  width: 16rem;
  height: 16rem;
  background-color: white;
  border-radius: 50%;
  margin: 0 0.5rem;
  border: 2px solid black; /*box-shadow: inset 0 3px 6px rgba(0, 0, 0, 0.16), inset 0 3px 6px rgba(0, 0, 0, 0.23);*/
}

.dashboard-variableMargins .dashboard-green {
  box-shadow: inset 0px 0px 18px -3px rgba(40, 167, 69, 0.7) /*box-shadow: inset 0px 0px 18px -3px rgba(0, 0, 0, 0.6)*/
}

.dashboard-variableMargins .dashboard-red {
  box-shadow: inset 0px 0px 18px -3px rgba(255, 0, 24, 0.7)
}

.dashboard-variableMargins .dashboard-orange {
  box-shadow: inset 0px 0px 18px -3px rgba(255, 74, 0, 0.7)
}

.dashboard-variableMargins .meter:before {
  content: "";
  display: block;
  position: absolute;
  width: 107%;
  left: -3.5%;
  top: -3.5%;
  bottom: -3.5%;
  border-radius: 50%;
  background: #333;
  z-index: -1;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}

.dashboard-variableMargins .meter--volume:before {
  background-color: white;
  content: unset;
}

.dashboard-variableMargins .meter:before {
  background-color: white;
  content: unset;
}

.dashboard-variableMargins .meter .circle-title {
  width: 100%;
  top: -18%;
  font-size: 2em;
  color: #555;
  display: none;
  position: absolute;
  transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  --webkit-transition: all 500ms ease-in-out;
}

.dashboard-variableMargins .meter .label {
  position: absolute;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  text-align: center;
  color: #555;
}

.dashboard-variableMargins .meter .label.label-value {
  color: #eee;
}

.dashboard-variableMargins .meter .label span {
  text-transform: uppercase;
  font-size: 1.4em;
}

.dashboard-variableMargins .meter .label-unit {
  top: 82.5%;
}

.dashboard-variableMargins .meter .label-unit div {
  font-size: 1rem;
}

.dashboard-variableMargins .meter--big-label .label-unit div {
  font-size: 0;
}

.dashboard-variableMargins .meter .label-value {
  top: 50%;
  line-height: 1.25;
}

.dashboard-variableMargins .meter .label-value div, .dashboard-variableMargins .meter .label-value span {
  font-size: 0;
}

.dashboard-variableMargins .meter--big-label .label-value div, .dashboard-variableMargins .meter--big-label .label-value span {
  font-size: 1.9rem;
}

.dashboard-variableMargins .meter .label-value div {
  font-family: "Roboto Mono", monospace;
  font-style: italic;
}

.dashboard-variableMargins .meter--big-label .label-value span {
  font-size: 1rem;
}

.dashboard-variableMargins .meter .label-value span {
  display: block;
  position: absolute;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}

.dashboard-variableMargins .dashboard-green .label.label-value div, .dashboard-variableMargins .dashboard-green .label.label-value span {
  color: #28a745 !important;
  font-weight: bold;
  user-select: none;
}

.dashboard-variableMargins .dashboard-red .label.label-value div, .dashboard-variableMargins .dashboard-red .label.label-value span {
  color: #dc3545 !important;
  font-weight: bold;
  user-select: none;
}

.dashboard-variableMargins .dashboard-orange .label.label-value div, .dashboard-variableMargins .dashboard-orange .label.label-value span {
  color: #dc5517 !important;
  font-weight: bold;
  user-select: none;
}

.dashboard-variableMargins .needle {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 5px;
  height: 120px;
  transform: translate3d(-50%, 0, 0);
  transform-origin: 50% 0;
  background-color: #e30;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: all 2000ms ease-in-out;
  -moz-transition: all 2000ms ease-in-out;
  --webkit-transition: all 2000ms ease-in-out;
}

.dashboard-variableMargins .dashboard-variableMargins .needle:before, .dashboard-variableMargins .needle:after {
  display: block;
  position: absolute;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
}

.dashboard-variableMargins .needle:before {
  left: -3px;
  border-width: 0 3px 120px 0;
  border-color: transparent #ff5122 transparent transparent;
}

.dashboard-variableMargins .needle:after {
  right: -3px;
  border-width: 120px 3px 0 0;
  border-color: #d52e00 transparent transparent transparent;
}

.dashboard-variableMargins .needle-axle {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  width: 37.5%;
  height: 37.5%;
  transform: translate3d(-50%, -50%, 0);
  border-radius: 50%;
  background-color: #000;
  color: #eee;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); /*cursor: pointer;*/
  transition: all 1s ease-in-out;
  -moz-transition: all 1s ease-in-out;
  --webkit-transition: all 1s ease-in-out;
}

.dashboard-variableMargins .meter:hover .needle-axle {
  background-color: #333;
}

.dashboard-variableMargins .meter:hover .circle-title {
  color: black;
}

.dashboard-variableMargins .meter--big-label .needle-axle {
  width: 37.5%;
  height: 37.5%;
}

.dashboard-variableMargins .grad {
  position: absolute;
  display: inline-block;
  font-size: 1.25rem;
  line-height: 1;
  color: #555;
  transform: translate3d(-50%, -50%, 0);
  font-weight: bold;
}

.dashboard-variableMargins .grad.redzone {
  color: #e30;
}

.dashboard-variableMargins .grad-tick.redzone, .grad-tick--half.redzone, .dashboard-variableMargins .grad-tick--quarter.redzone {
  background-color: #e30;
}

.dashboard-variableMargins .grad-tick {
  position: absolute;
  display: block;
  width: 4px;
  height: 1em;
  transform-origin: 50% 0;
  background-color: #555;
}

.dashboard-variableMargins .redzone-invert .grad {
  color: #e30;
}

.dashboard-variableMargins .redzone-invert .grad.redzone {
  color: #555;
}

.dashboard-variableMargins .redzone-invert .grad-tick.redzone, .dashboard-variableMargins .redzone-invert .grad-tick--half.redzone, .dashboard-variableMargins .redzone-invert .grad-tick--quarter.redzone {
  background-color: #555;
}

.dashboard-variableMargins .redzone-invert .grad-tick {
  background-color: #e30;
}

.dashboard-variableMargins .grad-tick--half {
  width: 2px;
  height: 0.75em;
}

.dashboard-variableMargins .grad-tick--quarter {
  width: 2px;
  height: 0.25em;
}



/* Compteur à 4 couleurs (Exp : CX Results) */



/*#table_cxScorePillarGroupDealerList_sm .gauge_init {*/
  /*margin-top: -80px;*/
  /*height: 0px;*/
  /*position: relative;*/
/*}*/

/*#table_cxScorePillarGroupDealerList_sm .gauge_init_td {*/
  /*height: 200px !important;*/
/*}*/

/*#table_cxScorePillarGroupDealerList_sm .gauge-mark-container {*/
  /*width: 300px !important;*/
  /*height: 200px;*/
/*}*/
/*#table_cxScorePillarGroupDealerList_sm .gauge-container  {*/
  /*width: 270px !important;*/
/*}*/
/*#table_cxScorePillarGroupDealerList_sm .gauge-needle {*/

  /*background: url('/assets/images/main/gauge/needle_admin.png') no-repeat !important;*/
/*}*/

.gauge_init {position: relative;}

.gauge-container {
  position: relative;
  width: 300px;
  height: 150px;
  background-color: rgba(0,0,0,0);
  clip-path: ellipse(50% 100% at 50% 0);
  transform: rotateX(180deg);
  background-image: url('/assets/images/main/gauge/compteur_after_sales.png');
  background-size: 100%;
  margin: auto;
  z-index: 0;
}

.gauge-needle {
  position: absolute;
  top: 2px;
  left: 50%;
  transform-origin: top center;
  transform: translateX(-50%) rotate(90deg);
  width: 6px;
  height: 100%;
  background: url('/assets/images/main/gauge/needle.png') no-repeat;
  transition: transform 1.5s ease-in-out;
  z-index: 2;
}

.gauge-needle-bs {
  background: url('/assets/images/main/gauge/needle-bs.png') no-repeat;
}
.gauge-needle-red {
  background: url('/assets/images/main/gauge/needle-bs.png') no-repeat;
}

.gauge-mark-container {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) scaleY(-1); /* Flip vertical */
  width: 320px;
  height: 170px;
  pointer-events: none; /* Pour que ce container ne bloque pas les clics */
  z-index: 3; /* Plus bas que l'icône */

}

.gauge-mark {
  position: absolute;
  top: 17px;
  left: 50%;
  transform-origin: top center;
  transform: translateX(-50%) rotate(90deg);
  width: 20px;
  height: 103%;
  background: url('/assets/images/main/gauge/mark.png') no-repeat;
  transition: transform 0s ease-in-out;
  z-index: 2; /* Assurez-vous que c'est au-dessus des autres éléments */
}

.gauge-mark i {
  top: 82%;
  right: 0;
  font-size: 20px; /* Ajustez la taille pour faciliter l'interaction */
  cursor: pointer; /* Change le curseur pour montrer que c'est cliquable */
  z-index: 20; /* Plus élevé que les autres éléments */
  position: relative; /* Permet de gérer les z-index correctement */
  color: rgba(211, 211, 211, 0);
}


.gauge-value {
  position: absolute;
  top: 2%;
  left: 50%;
  transform: translateX(-50%) rotateX(180deg);
  color: #333;
  font-weight: bold;
  font-size: 25px;
}

/* Gauge MD */

#table_cxScorePillarGroupDealerList .gauge-mark-container {
  position: relative;
  top: 150px;
  width: 320px;
  height: 170px;
}

#table_cxScorePillarGroupDealerList .gauge-mark {
  background: url('/assets/images/main/gauge/mark_md.png') no-repeat;
  height: 100%;

}

#table_cxScorePillarGroupDealerList .gauge_init {
  margin-top: -260px;
  height: 0px;
  position: relative;
}

#table_cxScorePillarGroupDealerList .gauge_init_td {
  height: 215px !important;
}

#table_cxScorePillarGroupDealerList .gauge-mark {
  top: 0px;
}


/* Gauge SM */
#table_cxScorePillarGroupDealerList_sm .gauge_init {
  -webkit-transform: scale(0.8); /* Compatibilité avec les anciennes versions de Chrome et Safari */
  -moz-transform: scale(0.8); /* Compatibilité avec les anciennes versions de Firefox */
  -ms-transform: scale(0.8); /* Compatibilité avec Internet Explorer 9 et 10 */
  -o-transform: scale(0.8); /* Compatibilité avec les anciennes versions d'Opera */
  transform: scale(0.8); /* Version standard pour les navigateurs modernes */
  transform-origin: center;
}

#table_cxScorePillarGroupDealerList_sm .gauge-container  {
  width: 270px !important;
}
#table_cxScorePillarGroupDealerList_sm .gauge-needle {
  background: url('/assets/images/main/gauge/needle_admin.png') no-repeat !important;
}

#table_cxScorePillarGroupDealerList_sm .gauge-mark-container {
  width: 300px !important;
  height: 150px;
}

#table_cxScorePillarGroupDealerList_sm .gauge-mark {
  top: 0;
  height: 100%;
  background: url('/assets/images/main/gauge/mark_admin.png') no-repeat !important;
}


/* Table Pillar : Page CX Quality*/
.table_pillar {}
/*.table_pillar thead tr td {width: 20% !important;}*/
.table_pillar tr td {margin: auto; vertical-align: top;text-align: center;padding: 5px;}
.table_pillar .pillar_main {padding: 5px;background-color: #e9e9e9;border: 1px solid #dbdbdb;border-radius: 5px;text-align: center;font-size: 20px;font-weight: bold;margin: 5px 0;width:100%;box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;}
.table_pillar .pillar_domain {padding: 5px;background-color: #156082;border-radius: 5px;color: #ffffff;font-size: 18px;font-weight: bold;margin: 0 0 10px 0;width:100%;box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;}
.table_pillar .pillar_subdomain {border-radius: 5px;border: 1px solid #919191;background-color:white;font-size: 15px;text-align:left;margin: 0 0 10px 0;padding:5px;width:100%;box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;}
.table_pillar .pillar_subdomain.border-danger {background-color: #dc3545;color: white}
.table_pillar .pillar_subdomain.border-warning {background-color: #E97132;border-color: #E97132 !important;color: white}
.table_pillar .billar_brand_specific_td {padding-left: 20px;}
.table_pillar .billar_brand_specific_td div {box-shadow: 0 .125rem .25rem rgba(26, 120, 179, 0.84) !important;}

/*ALL PAGES SETTINGS*/

@media only screen and (max-width:768px)  {
  .card .card-header h3 {width:50%!important;}
}