/************************************************************ GENERAL **********************************************************************/
@import url('https://fonts.googleapis.com/css?family=Palanquin:200&display=swap');

html {
    overflow-y: scroll !important;
    scrollbar-width: thin !important;
}

body {
    font-family: 'Palanquin', sans-serif;
}

.form-control, input {
    color: #1d1d1d;
}

/*table td {font-family: 'Open Sans', sans-serif; font-size: 0.74em!important; line-height: 1.4em;  }*/
/*table th { font-size: 1em!important; line-height: 1.8em }*/

.vh-100 {
    min-height: 100vh;
}

/* Hauteur 100% */

/*//////////////////////////////////////////////////////////////////
[ DEV ]*/
.dev {
    border: 6px solid red;
}

/***** CUSTOM CSS COLORS *****/
.border-grey {
    border: 1px solid #f2f2f2;
}

.border-greyDark {
    border: 1px solid #dadada;
}

/* Custom background */
.bgTitle {
    background-color: #d4d4d4;
}

.bg-grey {
    background-color: #e9ecef;
}

.bg-greyLight {
    background-color: #f2f2f2;
}

.bg-greyLight {
    background-color: #f2f2f2;
}

.bgRed {
    background-color: #E51B2F;
}

.bgRedLight {
    background-color: rgba(229, 27, 47, 0.90);
}

.bgClair {
    background-color: rgba(229, 27, 47, 0.2);
}

/* Custom Font-color */
.text-dark {
    color: #1d1d1d !important;
}

.text-grey {
    color: #77776e !important;
}

.text-greyLight {
    color: #b6b6b6 !important;
}

.text-colored {
    color: rgba(229, 27, 47, 0.9) !important;
}

.text-coloredLight {
    color: rgba(229, 27, 47, 0.45) !important;
}

.text-degraded {
    background: linear-gradient(80deg, #e51b2f, #9d1220) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

.text-red {
    color: #a11627 !important;
}

.modal .btn:hover {
    background-color: rgba(229, 27, 47, 0.90) !important;
    color: #fff !important;
}

.modal .btn:hover i {
    color: #fff !important;
}

.modal .modalListDestinatairesPres {
    max-height: 40em;
    overflow-y: auto;
    font-size: 0.8em;
}

a {
    color: #e51b2f;
}

td a {
    cursor: pointer;
}

a:hover, a:focus, #homeBoard .operation-box i:hover {
    text-decoration: none;
    color: rgba(229, 27, 47, 0.62) !important;
}

h2 a:hover {
    text-decoration: none;
    color: #cccccc !important;
}

h1, h2, h3, h4, h5, h6, .titreOperationTable, .sousTitreTable, caption {
    color: #e51b2f;
    text-transform: uppercase;
}

h1 {
    font-size: 1.4em;
}

h2 {
    font-size: 1.2em;
}

h3 {
    font-size: 1.0em;
}

h4 {
    font-size: 0.8em;
}

h5 {
    font-size: 0.7em;
}

/*p, textarea { font-family: 'Open Sans', sans-serif; font-size: 0.85em!important; }*/
/*.active { background-color: #e51b2f;}*/
.uppercase {
    text-transform: uppercase
}

input::placeholder, .form-control::placeholder, input, select option, select, textarea::placeholder, #newOP .input-group span {
    font-size: 0.90em !important;
    border: 1px solid #f2f2f2 !important;
}

button:focus {
    box-shadow: none !important;
}

button:hover, button.active {
    color: rgba(229, 27, 47, 0.90) !important;
    background-color: transparent !important;
}

mark {
    background-color: rgba(229, 27, 47, 0.05);
}

label span.error {
    color: #e51b2f;
    font-size: 0.8em;
}

.fieldError {
    border-color: #e51b2f !important;
}

.pointer {
    cursor: pointer;
}

/*********** TABLEAUX DE TOUS LES BOARDS ***********/
.table-wrapper-scroll-y {
    display: block;
    position: relative;
    height: 370px;
    overflow: auto;
}
#formRecupOffre .table-wrapper-scroll-y { height: 335px; }
/*!* Permet d'avoir les icones "up" et "down" des th en gris et à coté de l'intitulé *!*/
/*.table-sm th:first-child { position: relative;}*/
/*.table-sm th i{ position: absolute; color: #bbbbbb!* !important;*!}*/
/*.table-sm thead tr { background-color: #f6f6f6; font-size: 0.9em;  }*/
/*.table-sm table td {  line-height: 1.4em;  }*/
/*.table-sm thead th { font-weight: normal; }*/
/*!* Rends les tableaux avec thead fixed *!*/
/*.table-sticky>thead>tr>th { font-size: 1em!important; }*/
/*.table-sticky>thead>tr>th,*/
/*.table-sticky>thead>tr>td { background: #f6f6f6 !important; color: #212529; top: 0; position: sticky!important; z-index: 100; padding-top: 0!important; padding-bottom: 0!important;}*/
/*.table-height { height: 320px; display: block; overflow: scroll; width: 100%; }*/
/*table { border-collapse: collapse; border-spacing: 0; }*/

/******** TOUS LES DATA TABLES *********/
/* Pour enlever bordure en dessous thead et fin de tableaux */
/*table.dataTable thead th, table.dataTable thead td { border-bottom:1px solid transparent !important; font-size: 0.92em!important; line-height: 1.8em}*/
/*table.dataTable.no-footer { border-bottom: none!important; }*/
/*!* Apparance générale des flèches pour le tri *!*/
/*table.dataTable thead .sorting:after, table.dataTable  thead .sorting:before, table.dataTable  thead .sorting_asc:after, table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_desc_disabled:after, table.dataTable thead .sorting_desc_disabled:before {*/
/*    position: absolute; bottom: .0em; display: block; opacity: .3; font-family: 'Font Awesome\ 5 Free';  }*/
/*!* Apparance flèche du haut *!*/
/*table.dataTable .sorting:before, table.dataTable .sorting_asc:before,  table.dataTable.sorting_asc_disabled:before,  table.dataTable .sorting_desc:before,  table.dataTable .sorting_desc_disabled:before {*/
/*    content: "\f0de"; font-weight: 900; font-size: 1rem; right: 25px; }*/
/*!* Apparance flèche du bas *!*/
/*table.dataTable .sorting:after, table.dataTable .sorting_asc:after,  table.dataTable .sorting_asc_disabled:after,  table.dataTable .sorting_desc:after,  table.dataTable .sorting_desc_disabled:after {*/
/*    content: "\f0dd"; font-weight: 900; font-size: 1rem; right: 25px; }*/
/*table.dataTable thead .sorting_asc:before,*/
/*table.dataTable thead .sorting_desc:after { opacity: 1 }*/
/*table.dataTable thead .sorting_asc_disabled:before,*/
/*table.dataTable thead .sorting_desc_disabled:after { opacity: 0 }*/
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc { background-image: none; }


/******************************************** LOGIN ********************************************/
#login a:hover {
    background-color: rgb(255, 30, 53);
    color: #303030 !important; /*font-weight: bold*/
}

#login h2 {
    color: #e0dfdc;
    letter-spacing: .08em;
    text-shadow: 0 -1px 0 rgb(255, 30, 53), 0 4px 20px rgba(0, 0, 0, 0.9);
}

#login p.errorMsg {
    color: rgb(229, 27, 47);
}

/*************************************************************** NAVBAR *****************************************************************/
/************** 1ST ROW NAVBAR **************/
/******** navbar recherche ********/
#header button i {
    color: #e51b2f
}

#search-btn:hover {
    cursor: pointer;
    background-color: #e6e6e6;
}

.navbar-search .input-group-addon {
    margin-left: -35px;
    margin-top: 0.1em;
    z-index: 3;
    background-color: transparent;
    border: none;
}

/************** 2ND ROW NAVBAR **************/
/*.navbar-nav { margin:  0; padding: 0; list-style: none; display: table; !* [1] *! table-layout: fixed; !* [2] *!width: 100%; !* [3] *!}*/
/*.navbar-nav__item { width: 100%; float: left; !*font-size: 1em*! }*/
/*.navbar-nav__link { display: block; !* [5] *! }*/
/*.primary-nav { background-color: #d1d1d1; overflow: hidden; !* [1] *!}*/
/*.primary-nav a { color: #000; }*/
/*.bordure { border-right: 7px solid #F8F9FA; }*/
/*.primary-nav a:hover { background: #dcdcdc; }*/

/************************************** MEDIA QUERIES **************************************/
/*@media screen and (min-width: 1200px) {*/
/*    #OP-couponing.container{*/
/*        max-width: 960px;*/
/*    }*/
/*}*/
@media screen and (min-width: 992px) {
    #OP-couponing.container .navbar-nav { display: block}
    #OP-couponing.container .navbar-nav li{ display: inline-block; margin:0 5px 5px 0; }
    #OP-couponing.container .navbar li a { border-radius: 25px; background-color: rgba(255, 255, 255, 0.3); }

    #OP-couponing.container #couponContainer{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    #OP-couponing.container div.coupon{
        width:33%;
        padding:0.5rem;
    }
    #couponingCouverture { display: none; }
    #couponingCouvertureWeb { display: block; }
}

@media screen and (max-width: 992px) {
    .third-section-navbar small { font-size: 0.7em; }
    ::placeholder { font-size: 0.7em; }
    .bordure { border-right: #F8F9FA !important; }
    #couponingCouvertureWeb { display: none; }
}

@media screen and (min-width: 62em) {
    .navbar-nav__item {
        display: table-cell; /* [4] */
        float: none;
        width: auto;
    }
}

/******************************************************************* SECTION BOARD *******************************************************************/

/************************************************************** HOME BOARD **************************************************************/
#homeBoard, #homeBoard .description {
    font-size: 0.9em;
}

/*.operation-box .box-title{ font-size: 1em; }*/
/**************************** A REALISER ****************************/
.rappel-box {
    border-radius: 20px;
    border-color: #e8f7fc !important;
    position: relative;
    margin: 0 1em;
}

.rappelDate {
    font-size: 0.91em !important;
}

.rappelOperation {
    font-size: 1.1em;
}

.rappelsPart .text-right i {
    color: rgba(229, 27, 47, 0.62) !important;
}

#homeBoard .operation-icon .fa, #homeBoard .operation-icon .far, #homeBoard .operation-icon .fas {
    color: #fff;
    font-size: 0.75em
}

hr {
    margin: 0.3em 0 !important;
}

.fa-thumbtack {
    margin-top: -0.2em !important;
    position: absolute;
}

.bg-custom {
    background-color: #effbff;
}

/************************ OPERATIONS EN COURS ************************/
#homeBoard .box-title, .box-title a {
    font-size: 1.05em !important;
}

#homeBoard .box-bottom {
    background: #fff;
}

#homeBoard .operation-box i {
    /*color: #e51b2f !important;*/
}

/************************************** MEDIA QUERIES **************************************/
@media screen and (max-width: 990px) {
    #homeBoard .rappelDate {
        font-size: 0.9em !important;
    }
}

@media screen and (min-width: 975px) and (max-width: 1075px) {
    #homeBoard .rappelDate {
        font-size: 0.8em !important;
    }

    #homeBoard .rappel-box .fa-edit {
        margin-left: -1em;
    }
}

/************************************************************* NEW OP BOARD *************************************************************/
.boutiqueChoice {
    position: relative;
    height: 470px !important;
    overflow: auto;
    scrollbar-width: thin;
}

.boutiqueChoice a:hover {
    color: #e51b2f !important;
}

.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: #f01c31;
    background-color: #e51b2f;
}

/* checkbox */
/* Accessibility focus */
[type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, .1), 0 0 0 6px rgba(229, 27, 47, 0.2) !important;
    border: #e51b2f !important;
}

/*textarea:focus {background: none repeat scroll 0 0 #fff!important; outline-width: 0; border: 1px solid #e6e6e6 !important;}*/
/*.objetMail textarea { border:#f2f2f2 1px solid; border-radius:5px; padding: 0 0 3.2em 0;  }*/
/*.objetMail textarea::hover { border: 1px solid #f2f2f2 }*/
/*.objetMail textarea:focus, .objetMail textarea:hover { border-color:#e6e6e6; box-shadow:0 1px 2px #c3c3c3; -webkit-box-shadow:0 1px 2px #c3c3c3; -moz-box-shadow:0 1px 2px #c3c3c3; }*/

/******************************************** NEWOP-STEP1 ********************************************/
#newOP-step1 .boutiqueChoice {
    position: relative;
    height: 360px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#newOP-step1 .boutiqueChoiceMore {
    position: relative;
    height: auto !important;
    overflow-y: scroll !important;
    scrollbar-width: thin !important;
}

#newOP-step1 .mentionsPart {
    position: relative;
    height: 370px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#newOP-step1 .mentionsPart .jqte {
    height: 100% !important;
}

#OP-step1 .mentionsPart {
    position: relative;
    height: 370px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#OP-step1 .mentionsPart .jqte {
    height: 100% !important;
}

/******************************************** NEWOP-STEP2 ********************************************/
/* boutons choix envoi */
#newOP-step2 label.btn {
    cursor: pointer;
}

#newOP-step2 label.btn.active {
    font-weight: bold;
}

/******************************************** OP-EDIT ********************************************/
#OP-edit #CHECKBOX_goc_ope_page_couponing_enabled {
    z-index: 10000;
}

#OP-edit #tableMailPresentation {
    height: 452px;
}

#OP-edit #tabContent .table-wrapper-scroll-y {
    height: 460px;
}

/******************************************** OP-Boutique ********************************************/
#OP-boutique .table-wrapper-scroll-y {
    min-height: 394px !important;
}

/******************************************** PAGE OP-COUPONING ********************************************/
#OP-couponing .navbar-dark .navbar-toggler {
    border: 2px solid white;
}

#OP-couponing .navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

#OP-couponing h2, #OP-couponing h3 {
    color: black;
}

#OP-couponing nav {
    background-color: #f9b44f;
}

#OP-couponing .navbar-dark .navbar-nav .nav-link {
    color: white;
}

#OP-couponing h1 {
    color: black;
}

#OP-couponing img {
    width: 100%;
}

#modalBox .OP-couponing .modal-header {
    padding: 0.5rem;
}

#modalBox .OP-couponing .modal-header h5 {
    font-size: 1em;
}

#modalBox .OP-couponing .modal-body {
    padding: 0.5rem;
}

#modalBox .OP-couponing .modal-body p {
    font-size: 0.8rem;
}

#modalBox .OP-couponing .modal-footer {
    padding: 0.5rem;
}

#modalBox .OP-couponing #modalButClose {
    font-size: 0.8rem;
}

/******************************************** PAGE SUIVI OP ********************************************/
#suivi-OP label {
    font-size: 0.94em !important;
}

#suivi-OP input, #suivi-OP select, #suivi-OP option {
    font-size: 0.85em !important;
    font-weight: bold
}

#suivi-OP input {
    border: none !important;
}

#suivi-OP .boutiqueChoice {
    position: relative;
    height: 348px !important;
    overflow: auto;
    scrollbar-width: thin;
}

/* Apparance flèche du haut */
#boutiquesParticipantes-suiviOP .sorting:before, #boutiquesParticipantes-suiviOP .sorting_asc:before, #boutiquesParticipantes-suiviOP .sorting_asc_disabled:before, #boutiquesParticipantes-suiviOP .sorting_desc:before, #boutiquesParticipantes-suiviOP .sorting_desc_disabled:before {
    content: "\f0de";
    font-weight: 900;
    font-size: 1rem;
    right: 8px;
}

/* Apparance flèche du bas */
#boutiquesParticipantes-suiviOP .sorting:after, #boutiquesParticipantes-suiviOP .sorting_asc:after, #boutiquesParticipantes-suiviOP .sorting_asc_disabled:after, #boutiquesParticipantes-suiviOP .sorting_desc:after, #boutiquesParticipantes-suiviOP .sorting_desc_disabled:after {
    content: "\f0dd";
    font-weight: 900;
    font-size: 1rem;
    right: 8px !important;
}

#suivi-OP .mentionsPart {
    position: relative;
    height: 348px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#suivi-OP .mentionsPart p {
    font-size: 0.95em
}

#suivi-OP .jqte_editor {
    height: 300px;
    font-size: .95em;
}


/******************************************** PAGE CONSULTATION-OP ********************************************/

#consultation-OP .mentionsPart {
    position: relative;
    height: 418px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#consultation-OP .mentionsPart p {
    font-size: 0.95em
}

#consultation-OP .boutiqueChoice {
    position: relative;
    height: 418px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#consultation-OP label {
    font-size: 0.85em !important;
}

#consultation-OP input, #consultation-OP select, #consultation-OP option {
    font-size: 0.85em !important;
    font-weight: bold
}

/*#suivi-OP  td[width="45%"] { font-size: 0.7em!important; }*/


/******************************************** PAGE PARTICIPATION BOUTIQUE ********************************************/
/****** Row renseignements boutique ******/
#newOP-step4 .boutiqueInformations .row2 {
    margin-top: -0.6em
}

/* Contact Table*/
#newOP-step4 #boutiqueContact-scrollbar th, #newOP-step4 #boutiqueContact-scrollbar td {
    padding: 0.1em 0.9em
}

/** Même pour tous ??? **/
#newOP-step4 .table-boutiqueContact {
    position: relative;
    height: 72px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#newOP-step4 .table-boutiqueContactMore {
    position: relative;
    height: auto !important;
    overflow-y: scroll !important;
    scrollbar-width: thin;
}

/* Row participation boutique - texte Offre */
#newOP-step4 .offreDecriptif {
    position: relative;
    height: 153px !important;
    overflow: auto;
    scrollbar-width: thin;
}

/******** Bouton select Etat de participation A RECOPIER ! ********/
#newOP-step4 .select-container {
    position: relative;
    overflow: hidden; /* Le select natif pourra dépasser sans être vu */
}

/* Le pointeur du select */
#newOP-step4 .select-container::after {
    content: '';
    position: absolute;
    top: 50%;
    margin-top: -3px;
    right: .75em;
    display: block;
    width: 0;
    height: 0;
    border-color: transparent;
    border-top-color: #848484;
    border-width: 6px;
    border-style: solid;
    pointer-events: none;
}

#newOP-step4 .select-container select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100%; /*Enlève la flèche native */
    height: 2.15em;
    border: 0;
    margin: 0;
    border-radius: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* On empêche le texte d'aller jusqu'au bout s'il est trop long */
#newOP-step4 .select-container select::-ms-expand {
    display: none; /* cacher la flèche pour IE */
}

/* Row historiques boutique */
.participationBoutique h6, .historiqueBoutique h6 {
    font-size: 0.83em
}

#newOP-step4 .table-boutiqueHistorique {
    position: relative;
    height: 164px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#newOP-step4 .table-boutiqueHistoriqueMore {
    position: relative;
    height: auto !important;
    overflow-y: scroll !important;
    scrollbar-width: thin !important;
}

.btn-modal:focus, .form-control:focus {
    box-shadow: none !important; /*border: 1px solid #f2f2f2;!important;*/
}

#newOP-step4 .boutiqueChoice a:hover {
    color: #e51b2f !important;
}

#newOP-step4 .actionsTable {
    position: relative;
    height: 164px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#newOP-step4 .actionsTableMore {
    position: relative;
    height: auto !important;
    overflow-y: scroll !important;
    scrollbar-width: thin !important;
}

/*.modal-body textarea:hover, .modal-body textarea:focus { border: none!important; }*/
#newOP-step4 .fa-eye:hover {
    color: #848484 !important;
}

/*#newOP-step4 .mentionsPart { position: relative; height: 180px!important; overflow: auto; scrollbar-width: thin; }*/

#newOP-step4 button:focus, #newOP-step1 button:focus {
    box-shadow: none !important; /*border: 1px solid #f2f2f2;!important;*/
}

#newOP-step4 button:hover, #newOP-step1 button:hover {
    color: #a8a8a8 !important;
    background-color: transparent !important;
}

#newOP-step4 button:hover {
    background-color: rgba(229, 27, 47, 0.8) !important;
    color: white !important;
}


/************************************************************* ANCIENNES PAGES *************************************************************/
/********************************************************** OPERATION BOARD **********************************************************/
#boardOperation table td, #boardOperation .sousTitreTable {
    font-size: 0.95em !important;
    line-height: 1.1em;
}

#boardOperation thead tr {
    background-color: #f2f2f2;
    font-size: 0.9em;
}

/*#boardOperation thead th { font-weight: normal!important;  }*/
#boardOperation .operationTable {
    position: relative;
    height: 150px;
    overflow: auto;
    scrollbar-width: thin;
}

#boardOperation .boutiqueTable {
    position: relative;
    height: 270px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#boardOperation .actionsTable {
    position: relative;
    height: 170px;
    overflow: auto;
    scrollbar-width: thin;
}

#boardOperation .table-wrapper-scroll-y {
    display: block;
    position: relative;
}

/*************************** Bouton participation boutique ***************************/
.can-toggle {
    position: relative;
}

.can-toggle input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
}

/* cache la case à cocher */
.can-toggle label {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    position: relative;
    display: flex;
    align-items: center;
}

.can-toggle label .can-toggle__label-text {
    flex: 1;
    padding-left: 32px;
}

.can-toggle label .can-toggle__switch {
    position: relative;
}

/* Couleur du bouton de base et permet le slide quand unchecked */
.can-toggle label .can-toggle__label-text {
    flex: 1;
}

.can-toggle label .can-toggle__switch {
    transition: background-color 0.3s cubic-bezier(0, 1, 0.5, 1);
    background: #848484;
}

/* background du "oui" */
.can-toggle label .can-toggle__switch:before {
    color: rgba(255, 255, 255, 0.5);
}

/* couleur du "oui" */
.can-toggle label .can-toggle__switch:after {
    transition: -webkit-transform 0.3s cubic-bezier(0, 1, 0.5, 1);
    transition: transform 0.3s cubic-bezier(0, 1, 0.5, 1);
    transition: transform 0.3s cubic-bezier(0, 1, 0.5, 1), -webkit-transform 0.3s cubic-bezier(0, 1, 0.5, 1);
    color: #777;
}

/* Garder le texte "Non" à gauche meme apres le slide */
.can-toggle input[type="checkbox"]:checked ~ label .can-toggle__switch:before {
    content: attr(data-unchecked);
    left: 0;
}

.can-toggle input[type="checkbox"]:checked ~ label .can-toggle__switch:after {
    content: attr(data-checked);
}

/* Affiche le texte "oui" meme lorsque unchecked*/
.can-toggle label .can-toggle__switch:before {
    content: attr(data-checked);
    position: absolute;
    top: 0;
    text-transform: uppercase;
    text-align: center;
}

/* Affiche le texte "non" meme lorsque unchecked*/
.can-toggle label .can-toggle__switch:after {
    content: attr(data-unchecked);
    position: absolute;
    z-index: 5;
    text-transform: uppercase;
    text-align: center;
    background: white;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/* Hover du gris */
.can-toggle input[type="checkbox"][disabled] ~ label {
    color: rgba(119, 119, 119, 0.5);
}

.can-toggle input[type="checkbox"]:focus ~ label .can-toggle__switch, .can-toggle input[type="checkbox"]:hover ~ label .can-toggle__switch {
    background-color: #777;
}

.can-toggle input[type="checkbox"]:focus ~ label .can-toggle__switch:after, .can-toggle input[type="checkbox"]:hover ~ label .can-toggle__switch:after {
    color: #5e5e5e;
}

.can-toggle input[type="checkbox"]:hover ~ label {
    color: #6a6a6a;
}

/* Couleur rouge lors du slide Checked */
.can-toggle input[type="checkbox"]:checked ~ label:hover {
    color: #e51b2f;
}

.can-toggle input[type="checkbox"]:checked ~ label .can-toggle__switch {
    background-color: rgba(229, 27, 47, 0.83);
}

.can-toggle input[type="checkbox"]:checked ~ label .can-toggle__switch:after {
    color: rgba(229, 27, 47, 0.83);
}

.can-toggle input[type="checkbox"]:checked:focus ~ label .can-toggle__switch, .can-toggle input[type="checkbox"]:checked:hover ~ label .can-toggle__switch {
    background-color: rgba(229, 27, 47, 0.83);
}

.can-toggle input[type="checkbox"]:checked:focus ~ label .can-toggle__switch:after, .can-toggle input[type="checkbox"]:checked:hover ~ label .can-toggle__switch:after {
    color: #b50000;
}

/* Shadow sous la case blanche lors du hover*/
.can-toggle input[type="checkbox"]:focus ~ label .can-toggle__switch:after, .can-toggle input[type="checkbox"]:hover ~ label .can-toggle__switch:after {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.4);
}

.can-toggle label {
    font-size: 12px;
}

/* Garde le 'non' a sa place et oui a sa place meme apres le slide + déplacement de la case blanche de slide*/
.can-toggle.can-toggle--size-small input[type="checkbox"]:checked ~ label .can-toggle__switch:after {
    -webkit-transform: translate3d(44px, 0, 0);
    transform: translate3d(44px, 0, 0);
}

.can-toggle.can-toggle--size-small label .can-toggle__switch {
    height: 24px;
    flex: 0 0 90px;
    border-radius: 2px;
}

.can-toggle.can-toggle--size-small label .can-toggle__switch:before {
    left: 45px;
    font-size: 10px;
    line-height: 23px;
    width: 45px;
    padding: 0 5px;
}

.can-toggle.can-toggle--size-small label .can-toggle__switch:after {
    top: 1px;
    left: 1px;
    border-radius: 1px;
    width: 44px;
    line-height: 22px;
    font-size: 10px;
}


/************************************************************* CENTRES COMMERCIAUX BOARD *************************************************************/
#ccboard .contactTable {
    position: relative;
    height: 170px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#ccboard .boutiqueTable {
    position: relative;
    height: 230px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#ccboard .actionsTable {
    position: relative;
    height: 200px !important;
    overflow: auto;
    scrollbar-width: thin;
}

/*#ccboard .table-wrapper-scroll-y { display: block; position: relative;}*/


/************************************************************* BOUTIQUES BOARD *************************************************************/
#boutiqueBoard .boutiqueTable {
    position: relative;
    height: 100px !important;
}

#boutiqueBoard .contactBoutiqueTable {
    position: relative;
    height: 160px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#boutiqueBoard .historiqueOpTable {
    position: relative;
    height: 330px !important;
    overflow: auto;
    scrollbar-width: thin;
}


/************************************************************* ENSEIGNES BOARD *************************************************************/
#enseigneBoard .enseigneTable {
    position: relative;
    height: 100px !important;
}

#enseigneBoard .contactEnseigneTable {
    position: relative;
    height: 160px !important;
    overflow: auto;
    scrollbar-width: thin;
}

#enseigneBoard .historiqueBoutiqueTable {
    position: relative;
    height: 330px !important;
    overflow: auto;
    scrollbar-width: thin;
}


/************************************************************* SEARCH BOARD *************************************************************/
#searchBoard table td {
    font-size: 0.95em !important;
    line-height: 1.4em;
}

#searchBoard .boutiqueContact-scrollbar {
    position: relative;
    height: 155px;
    overflow: auto;
    scrollbar-width: thin;
}

#searchBoard .table-wrapper-scroll-y {
    display: block;
    position: relative;
}

.participe {
    color: #e51b2f
}

.participe-0 {
    color: #343a40;
}

/************************************************************* STATISTIQUES *************************************************************/
#stats .rickshaw_graph svg {
    margin: auto;
}

#stats .rickshaw_graph .x_ticks_d3 * {
    opacity: 1;
}

#stats .card .list-group {
    display: block;
    position: relative;
    height: 235px;
    overflow: auto;
}

#stats .card .list-group li:hover {
    background-color: #cecece;
    cursor: pointer;
}