:root {
    --blue: #007bff;
    --indigo: #6610f2;
    --purple: #9b479f;
    --pink: #e83e8c;
    --red: #eb0029;
    --orange: #d9831f;
    --yellow: #ffc107;
    --green: #469408;
    --teal: #20c997;
    --cyan: #029acf;
    --white: #fff;
    --gray: #777;
    --gray-dark: #373a3c;
    --primary: #eb0029;
    --secondary: #fff;
    --success: #00AA3F;
    --info: #029acf;
    --warning: #d9831f;
    --danger: #9b479f;
    --light: #fff;
    --dark: #373a3c;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: "Ubuntu";
    --font-family-monospace: "Ubuntu";
}

/* ------------ */
/* --  BASE  -- */
/* ------------ */

body {
    margin: 0;
    font-family: "Ubuntu", Arial, Helvetica, sans-serif;
    font-style: normal;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    text-align: left;
    background-color: #fcfcfc;
}

@font-face {
    font-family: "Ubuntu";
    font-style: normal;
    font-size: 1rem;
    font-weight: 400;
    src: url("/fonts/Ubuntu-Light.ttf") format("truetype");
}

.imgLogo {
    height: 100px;
}

.imgBottomRight {
    position: absolute;
    right: 0px;
    bottom: 0px;
}

body,
html {
    height: 100%;
    width: 100%;
}

.fill {
    min-height: 100%;
    height: 100%;
}

.mb-container {
    padding-right: 5px;
    padding-left: 5px;
}

.mb-form-date {
    display: inline-block !important;
    width: 30% !important;
}

.mb-label-search {
    font-size: 13px;
}

.mb-modal-scroll {
    max-height: calc(100vh - 20vh);
    overflow-y: auto;
}

/* ------------ */
/* -- Table -- */
/* ------------ */

th,
td {
    border-bottom: 1px solid rgba(0, 0, 0, .12);
}

tr:hover {
    background-color: rgba(0, 0, 0, .04);
}

th {
    color: white;
    text-align: center;
    background-color: #00AA3F;
}

td {
    width: 120px;
    height: 36px;
    border-bottom: 1px solid rgba(0, 0, 0, .12);
    text-align: center;
}

.mb-table-xl {
    width: 200px;
}

.mb-table-xxl {
    width: 500px;
}

.mb-table-left {
    text-align: left;
}

.mb-table-center {
    text-align: center;
}

.mb-table-right {
    text-align: right;
}

.underlinePagination {
    text-decoration: underline;
}

#nav a {
    color: #eb0029;
}

/* ------------ */
/* -- Modal dialog -- */
/* ------------ */

.modal-content {
    border: none;
}

.modal-header {
    background-color: #eb0029;
    color: #fff;
}

.modal-title {
    text-align: center;
    font-weight: bold;
}

.modal-header .close {
    color: #fff;
    text-shadow: none;
    opacity: 0.8;
    font-size: 1.5rem;
}

.mb-label-claim {
    font-size: 15px;
}

.mb-space-line {
    margin-top: 5px;
}

#claim-display .modal-dialog {
    width: 95%;
    max-width: 95%;
    height: 90%;
    max-height: 90%;
}

/* ------------ */
/* -- Button -- */
/* ------------ */

.mb-btn-space {
    margin-right: 1%;
    width: 24%;
    font-size: 1em;
}

.mb-btn-space-xs {
    margin-right: 1%;
    width: 19%;
    font-size: 1em;
}

.mb-btn-space-xl {
    margin-right: 1%;
    width: 49%;
    font-size: 1em;
}

.btn-primary {
    background-color: #eb0029;
    border-color: #eb0029;
    background-image: none;
}

.btn-secondary {
    background-color: #00AA3F;
    border-color: #00AA3F;
    background-image: none;
    color: #fff;
}

.mb-btn-red {
    color: #fff;
    background-color: #eb0029;
    border-color: #eb0029;
}

.mb-btn-red:hover {
    color: #fff;
    background-color: #bb001f;
    border-color: #eb0029;
}

.mb-btn-red:focus,
.mb-btn-red.focus {
    color: #000;
    background-color: #eb0029;
    border-color: #bb001f;
    box-shadow: 0 0 0 0.2rem rgba(196, 3, 3, 0.5);
}

.mb-btn-green {
    color: #fff;
    background-color: #82D700;
    border-color: #82D700;
}

.mb-btn-green:hover {
    color: #fff;
    background-color: #357006;
    border-color: #82D700;
}

.mb-btn-green:focus,
.mb-btn-green.focus {
    color: #fff;
    background-color: #82D700;
    border-color: #fff;
    box-shadow: 0 0 0 0.2rem rgba(98, 164, 45, 0.5);
}

.mb-btn-orange {
    color: #000;
    background-color: #FA9619;
    border-color: #FA9619;
}

.mb-btn-orange:hover {
    color: #fff;
    background-color: #ac6819;
    border-color: #FA9619;
}

.mb-btn-orange:focus,
.mb-btn-orange.focus {
    color: #000;
    background-color: #FA9619;
    border-color: #ac6819;
    box-shadow: 0 0 0 0.2rem rgba(223, 150, 65, 0.5);
}

.mb-btn-yellow {
    color: #000;
    background-color: #C8DC0A;
    border-color: #C8DC0A;
}

.mb-btn-yellow:hover {
    color: #fff;
    background-color: #BDB76B;
    border-color: #C8DC0A;
}

.mb-btn-yellow:focus,
.mb-btn-yellow.focus {
    color: #000;
    background-color: #C8DC0A;
    border-color: #BDB76B;
    box-shadow: 0 0 0 0.2rem rgba(200, 220, 10, 0.5);
}

.mb-btn-bisk {
    color: #000;
    background-color: #FFE4C4;
    border-color: #FFE4C4;
}

.mb-btn-bisk:hover {
    color: #000;
    background-color: #E2CBBA;
    border-color: #FFE4C4;
}

.mb-btn-bisk:focus,
.mb-btn-bisk.focus {
    color: #000;
    background-color: #FFE4C4;
    border-color: #E2CBBA;
    box-shadow: 0 0 0 0.2rem rgba(255, 228, 196, 0.5);
}

.mb-btn-blue {
    color: #fff;
    background-color: #7396FA;
    border-color: #7396FA;
}

.mb-btn-blue:hover {
    color: #fff;
    background-color: #027ea9;
    border-color: #7396FA;
}

.mb-btn-blue:focus,
.mb-btn-blue.focus {
    color: #000;
    background-color: #7396FA;
    border-color: #02749c;
    box-shadow: 0 0 0 0.2rem rgba(40, 169, 214, 0.5);
}

.mb-btn-grey {
    color: #fff;
    background-color: grey;
    border-color: grey;
}

.mb-btn-grey:hover {
    color: #fff;
    background-color: #696767;
    border-color: grey;
}

.mb-btn-grey:focus,
.mb-btn-grey.focus {
    color: #fff;
    background-color: grey;
    border-color: #696767;
    box-shadow: 0 0 0 0.2rem rgba(105, 103, 103, 0.5);
}

.mb-black-color {
    color: #000000 !important;
}

.btnExport {
    width: 200px;
    float: right;
    margin-top: 30px;
}

/* ------------ */
/* -- Tooltips -- */
/* ------------ */
.tooltip-inner {
    background-color: #00AA3F;
}

.bs-tooltip-auto[x-placement^=bottom] .arrow::before,
.bs-tooltip-bottom .arrow::before {
    border-bottom-color: #00AA3F;
}

.bs-tooltip-auto[x-placement^=top] .arrow::before,
.bs-tooltip-top .arrow::before {
    border-top-color: #00AA3F;
}

.bs-tooltip-auto[x-placement^=left] .arrow::before,
.bs-tooltip-left .arrow::before {
    border-left-color: #00AA3F;
}

.bs-tooltip-auto[x-placement^=right] .arrow::before,
.bs-tooltip-right .arrow::before {
    border-right-color: #00AA3F;
}

/* ------------ */
/* -- JSGRID -- */
/* ------------ */

.jsgrid-grid-header,
.jsgrid-grid-body {
    overflow: auto !important;
    border: none !important;
}

/** tab header border **/
th.jsgrid-header-cell {
    border: none !important;
}

/** selected row color **/
tr.jsgrid-row.jsgrid-selected-row>.jsgrid-cell,
tr.jsgrid-alt-row.jsgrid-selected-row>.jsgrid-cell {
    background-color: rgb(250, 150, 25);
    border-color: rgb(250, 150, 25);
}

/** background input **/
.jsgrid-edit-row input {
    border: none;
}

/** background color edition mode **/
.jsgrid-edit-row>.jsgrid-cell,
.jsgrid-insert-row>.jsgrid-cell {
    background-color: rgb(200, 220, 10) !important;
}

/** Border Cell properties **/
.jsgrid-cell {
    border-color: rgba(0, 0, 0, .12) !important;
    border-right: none !important;
    border-left: none !important;
}

/* ------------ */
/* -- ICONS --- */
/* ------------ */
i.action {
    cursor: pointer;
}

td .fa {
    color: #555;
}

/* Download icon */
.custom-file-input:lang(fr)~.custom-file-label::after {
    content: "Parcourir";
}


/* ------------ */
/* -- COLORS -- */
/* ------------ */

.mb-bg-primary {
    background-color: #eb0029 !important;
}

a.mb-bg-primary:hover,
a.mb-bg-primary:focus,
button.mb-bg-primary:hover,
button.mb-bg-primary:focus {
    background-color: #eb0029 !important;
}

.mb-bg-secondary {
    background-color: #00AA3F !important;
}

a.mb-bg-secondary:hover,
a.mb-bg-secondary:focus,
button.mb-bg-secondary:hover,
button.mb-bg-secondary:focus {
    background-color: #00AA3F !important;
}

.mb-bg-tertiary {
    background-color: #696767 !important;
}

a.mb-bg-tertiary:hover,
a.mb-bg-tertiary:focus,
button.mb-bg-tertiary:hover,
button.mb-bg-tertiary:focus {
    background-color: #696767 !important;
}

/* ------------ */
/* -- Card   -- */
/* ------------ */

div.display-card,
div.custom-card {
    margin: 8px 0 8px 0;
}

div.custom-header-card {
    background-color: #eb0029;
    color: #fff;
    margin: 0;
    font-weight: bold;
    padding-left: 8px;
}

/* ---------------- */
/* -- App Header -- */
/* ---------------- */

#app-bar {
    font-weight: bold;
    border: none;
}

/** Dropdown menu item **/
.dropdown-menu.show {
    text-align: center;
}

.dropdown-menu.show:hover,
.dropdown-menu.show:hover a {
    background-color: #00AA3F;
    color: #fff;
}

/* -------------------- */
/* -- Connexion page -- */
/* -------------------- */

.bg-connexion {
    /* The image used */
    background-image: url('../../img/accueil.jpg');

    /* Full height */
    min-height: 100%;
    height: 100%;
    min-width: 100%;
    width: 100%;

    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

    padding-top: 80px;
    padding-bottom: 40px;
}

.box-connexion {
    background-image: none;
    background-color: #fff;
}

/* -------------------- */
/* -- Claim display -- */
/* ------------------- */
.action-buttons {
    padding-top: 1rem;
}

.claim-display-body {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.buttons {
    height: 34px;
}

.colorLineDeleted {
    background-color: lightgrey;
}

/* -------------------- */
/* -- Parameter page -- */
/* -------------------- */
.jsgrid-tabs {
    width: 100% !important;
}

.card-body.ui-tabs {
    padding: 0;
}

div#tabs .ui-widget,
td.jsgrid-cell,
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
    font-family: Ubuntu, serif !important;
}

div#tabs #tabs-4 {
    padding-bottom: 10%;
}

div#tabs #tabs-5 {
    padding-bottom: 10%;
}

.nav-tabs.ui-tabs-nav.ui-widget-header {
    padding: 4px 0 0 4px;
    border: none;
}

.headerColor {
    background-color: #00AA3F !important;
}

.headerColorGreen {
    background-color: #2f6405 !important;
}

/** Onglets **/
li.nav-item.ui-tabs-tab {
    border: none;
}

/* active tab */
li.ui-tabs-active.ui-state-active {
    background-color: #eb0029;
    border-color: #eb0029;
    margin-bottom: 0 !important;
}

/* sorting icone */
th.jsgrid-header-sort-asc::before {
    border-color: transparent transparent #eb0029;
}

th.jsgrid-header-sort-desc::before {
    border-color: #eb0029 transparent transparent
}

/** Modal customers table **/
div.modal-dialog.customer {
    max-height: 95%;
    max-width: 95%;
}

#customer-user-tab {
    max-width: 100%;
}

#customer-user-shops-tab {
    max-width: 100%;
}

/* ------------ */
/* -- mb-modal  -- */
/* ------------ */

.mb-modal-open {
    overflow: hidden;
}

.mb-modal-open .mb-modal {
    overflow-x: hidden;
    overflow-y: auto;
}

.mb-modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    outline: 0;
}

.mb-modal-dialog {
    position: relative;
    width: auto;
    margin: 0.5rem;
    pointer-events: none;
}

.mb-modal.fade .mb-modal-dialog {
    transition: -webkit-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
    transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
    -webkit-transform: translate(0, -50px);
    transform: translate(0, -50px);
}

@media (prefers-reduced-motion: reduce) {
    .mb-modal.fade .mb-modal-dialog {
        transition: none;
    }
}

.mb-modal.show .mb-modal-dialog {
    -webkit-transform: none;
    transform: none;
}

.mb-modal.mb-modal-static .mb-modal-dialog {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
}

.mb-modal-dialog-scrollable {
    display: -ms-flexbox;
    display: flex;
    max-height: calc(100% - 1rem);
}

.mb-modal-dialog-scrollable .mb-modal-content {
    max-height: calc(100vh - 1rem);
    overflow: hidden;
}

.mb-modal-dialog-scrollable .mb-modal-header,
.mb-modal-dialog-scrollable .mb-modal-footer {
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

.mb-modal-dialog-scrollable .mb-modal-body {
    overflow-y: auto;
}

.mb-modal-dialog-centered {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    min-height: calc(100% - 1rem);
}

.mb-modal-dialog-centered::before {
    display: block;
    height: calc(100vh - 1rem);
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    content: "";
}

.mb-modal-dialog-centered.mb-modal-dialog-scrollable {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    height: 100%;
}

.mb-modal-dialog-centered.mb-modal-dialog-scrollable .mb-modal-content {
    max-height: none;
}

.mb-modal-dialog-centered.mb-modal-dialog-scrollable::before {
    content: none;
}

.mb-modal-content {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: none;
    border-radius: 0.3rem;
    outline: 0;
}

.mb-modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #000;
}

.mb-modal-backdrop.fade {
    opacity: 0;
}

.mb-modal-backdrop.show {
    opacity: 0.5;
}

.mb-modal-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #eeeeee;
    border-top-left-radius: calc(0.3rem - 1px);
    border-top-right-radius: calc(0.3rem - 1px);
    background-color: #eb0029;
    color: #fff;
}

.mb-modal-header .close {
    padding: 1rem 1rem;
    margin: -1rem -1rem -1rem auto;
    color: #fff;
    text-shadow: none;
    opacity: 0.8;
    font-size: 1.5rem;
}

.mb-modal-title {
    margin-bottom: 0;
    line-height: 1.5;
    font-weight: bold;
}

.mb-modal-body {
    position: relative;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1rem;
}

.mb-modal-footer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding: 0.75rem;
    border-top: 1px solid #eeeeee;
    border-bottom-right-radius: calc(0.3rem - 1px);
    border-bottom-left-radius: calc(0.3rem - 1px);
}

.mb-modal-footer>* {
    margin: 0.25rem;
}

.mb-modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll;
}

@media (min-width: 576px) {
    .mb-modal-dialog {
        max-width: 500px;
        margin: 1.75rem auto;
    }

    .mb-modal-dialog-scrollable {
        max-height: calc(100% - 3.5rem);
    }

    .mb-modal-dialog-scrollable .mb-modal-content {
        max-height: calc(100vh - 3.5rem);
    }

    .mb-modal-dialog-centered {
        min-height: calc(100% - 3.5rem);
    }

    .mb-modal-dialog-centered::before {
        height: calc(100vh - 3.5rem);
        height: -webkit-min-content;
        height: -moz-min-content;
        height: min-content;
    }

    .mb-modal-sm {
        max-width: 300px;
    }
}

@media (min-width: 992px) {

    .mb-modal-lg,
    .mb-modal-xl {
        max-width: 800px;
    }
}

@media (min-width: 1200px) {
    .mb-modal-md {
        max-width: 800px;
    }

    .mb-modal-lg {
        max-width: 70%;
    }

    .mb-modal-xl {
        max-width: 85%;
    }
}

.mb-fade {
    transition: opacity 0.15s linear;
}

@media (prefers-reduced-motion: reduce) {
    .mb-fade {
        transition: none;
    }
}

.mb-fade:not(.show) {
    opacity: 100;
}

.SumoSelect {
    width: 100% !important;
    height: calc(1.47em + 1rem + 2px) !important;
    border: none !important;
}