@font-face {
  font-family: "PlutoSans";
  src: url("../font/PlutoSansDPDRegular.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "PlutoSans";
  src: url("'../font/PlutoSansDPDThin.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: "PlutoSans";
  src: url("'../font/PlutoSansDPDLight.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "PlutoSans";
  src: url("'../font/PlutoSansDPDExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-style: normal;
}

body{
  font-family: "PlutoSans", sans-serif; 
  font-weight: 400;
}
/* REBOOT */

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 0;
    border-radius: 0;
}

.btn-primary {
    color: #fff;
    background-color: #0060A2;
    border-color: #0060A2;
    border-radius: 0;
    font-size: 13px;
    font-weight: 300;
}

.btn-primary:hover {
    color: #fff;
    background-color: #209adf;
    border-color: #209adf;
}

.btn-outline-danger { 
  border-color: #dc3545;
  border-radius: 0;
  font-size: 13px;
  font-weight: 300;
}

.btn-outline-secondary{ 
  border-color: #6c757d;
  border-radius: 0;
  font-size: 13px;
  font-weight: 300;
}

.btn-secondary{
  color: #fff;
  border-color: #6c757d;
  background-color: #6c757d;
  border-radius: 0;
  font-size: 13px;
  font-weight: 300;
}

/* END REBOOT */

.input-login{ 
  /* border-radius: 11px; */
  height: 40px;
}

.form-label{
  font-weight: 400 !important;
  color: #414042 !important; 
   font-size: 16px;
  line-height: 18.75px;
}

.form-control {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-weight: 300;
    font-size: 12px;
    line-height: 1.5;
    color: #212529;
    background-color: #fbfcfd;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.box-change-account{
  font-size: 13px;
}

.box-forgod-password{
  color: #0060A2;
  text-decoration: underline;
  font-size: 13px;
}

.moz-btn-primary{
  width: auto;
  padding-left: 30px;
  padding-right: 30px;
  background-color: #019AE0;
  border-color: #019AE0;
  /* border-radius: 10px; */
  color: white;
}

.moz-slect-type-signup{
  width: auto;
  padding: 7px;
  background-color: white;
  border-color: black;
  /* border-radius: 10px; */
  color: black;
  font-size: 13px;
  text-align: center;
  border: 1px solid;
  cursor: pointer;
  min-width: 160px;
}

.moz-slect-type-signup.active{
  background-color: #0060A2;
  border-color: #0060A2;
  color: white;
}
.box-logo{
  width:300px;
  height:100px;
  background: white;
  border-bottom-right-radius: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.box-login-card{
  box-shadow: 8px 14px 57px rgba(2, 25, 37, .25); 
  border-radius: 0px;
  background:#FFFFFF;
}


.moz-btn-primary:hover {
  color: #fff;
  background-color:#019AE0;
  border-color: #019AE0;
}

.moz-btn-primary:not(:disabled):not(.disabled).active, .moz-btn-primary:not(:disabled):not(.disabled):active {
  color: #fff;
  background-color: #019AE0;
  border-color: #019AE0;
}

.login-box-msg, .register-box-msg {
  margin: 0;
  padding: 0 20px 20px;
  text-align: center;
}

.error{
  color: red;
  font-size: 13px;
  font-weight: 400 !important;
}

.icon-star-required{
  color: red;
  font-size: 16px;
  font-weight: 700;
}

input.error {
  border: 1px solid red;
}
select.error {
  border: 1px solid red;
}

.box-desc-forgot-pass{
  max-width: 450px;
  text-align: center;
}

/* SIGNIN + SIGNUP CSS */
img.form_signin_logo {
    width: 260px;
    text-align: center;
    margin: 0 auto;
    display: block;
    margin-bottom: 15px;
}

.moz-btn-primary {
    width: auto;
    padding-left: 30px;
    padding-right: 30px;
    background-color: #0060A2;
    border-color: #0060A2;
    border-radius: 0px;
    color: white;
    font-size: 14px;
}

.box-login-card .form-control {
    background: #fbfcfd;
    border-radius: 0;
    border-color: #ced4da;
    font-size: 12px;
}

/* DASHBOARD */
.moz-fa {
    font-size: 3.5em;
}

.h3, h3 {
    font-size: calc(1.1rem + .6vw);
}

@media (min-width: 1200px) {
/*    .h3, h3 {
        font-size: 0.8rem;
    }*/
}

@media (min-width: 998px){
  body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) 
  .content-wrapper, body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) 
  .main-footer, body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header {
      transition: margin-left .3s ease-in-out;
      margin-left: 190px;
  }
}


@media (min-width: 768px) {
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .content-wrapper,
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-footer,
    body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header {
        transition: margin-left .3s ease-in-out;
        margin-left: 190px;
    }
}

.user-panel svg {
    width: 30px;
}

.custom-bg-input{
  background-color: #fbfcfd
}

.main-sidebar, .main-sidebar::before {
  transition: margin-left .3s ease-in-out, width .3s ease-in-out;
  width: 190px;
}

[class*=sidebar-light] .brand-link {
    border-bottom: none;
}

.layout-fixed .brand-link {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}

.brand-link .brand-image { 
  /* max-height: 70px; */
  border-radius: 20px;
  width: 100%;
  margin-top: 0px;
}

.elevation-4 { 
  box-shadow: unset !important; 
  background-color: #019AE0;
}

.menu-bar-option{
  font-size: 13px;
  font-weight: 500;
  color: white;
  white-space: normal;
}
.deactivate-underline{
  text-decoration: unset;
}

.checkbox-row {
  display: flex; /* Flexbox to align items in a row */
  align-items: center; /* Center items vertically */
  gap: 16px; /* Space between elements */
} 

.custom-checkbox {
  appearance: none; /* Remove default checkbox appearance */
  width: 20px;
  height: 20px;
  border: 1px solid #000; /* Add a custom border */
  border-radius: 5px;
  background: #fff; /* White background when unselected */
  cursor: pointer;
  display: inline-block;
  vertical-align: middle; /* Center with text */
  position: relative;
}

.custom-checkbox:checked {
    background: #209ae0;
}

.checkbox-label {
  display: inline-block;
  margin-left: 8px;
  cursor: pointer;
  font-weight: 400 !important;
}

.size-14{
  font-size: 14px;
}

.ref-input{
  width: 120px;
}

.block-step{
  background-color: #fbfcfd;
  border-radius: 8px; 
  padding-top: 40px;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 40px;
  background-color: #fff;
  background-clip: border-box;
  border-radius: .25rem;
  box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);
}

.chrono-text-primary{
  color: #019ae0;
}

.chrono-text-secondary{
  color: #565e64;
}

.card-colis-header{
  background-color: white;
}

.card-colis-link{
  text-decoration: none;
  color: black;
}


.btn-colis-header{
  border: 1px solid #565e64;
  background-color: white;
  border-radius: 25px;
  padding: 0px;
  width: 30px;
  height: 30px;
}


td{
    border:none;
}

.box-td-table{
    padding: 5px !important;
    border: 1px solid #93a8b7 !important;
}

.td-label{
    background: #fbfcfd ! important;
    font-weight: 600;
}

.tr-active{
    background: #fbfcfd ! important;
}

.table-collapse {
    border-collapse: separate; /* Allows spacing between cells */
    border-spacing: 5px; /* Adds space between cells */
}

.header-colis{ 
    background: #fbfcfd ! important;
    height: 60px;
}
.th-center{
    vertical-align: middle !important;
    font-weight: 600;
}

.tbale-colis{
    border: 1px solid #93a8b7;
    border-collapse: separate;
    border-spacing: 0;
    padding: 0px;
}

  
.td-75 {
    width: 75%; /* Sets the width to 70% */
}

.td-50 {
    width: 49%; /* Sets the width to 30% */
}

.content-wrapper {
  background-color: #f9f9ff;
  padding-top: 30px;
}

.user-panel {
  border-bottom: unset !important;
}

.card-body.card-tracking {
  background: #009ADF;
}

label.title_tracking {
    color: #FFF;
    background: url(../img/icon-tracking.png) 0 center no-repeat transparent;
    padding-left: 60px;
    background-size: 50px;
    padding-bottom: 5px;
    padding-top: 5px;
}

img.icon_start_tracking {
    width: 100px;
}

.btn-outline-primary {
    color: #0060A2;
    border-color: #0060A2;
    border-radius: 0px;
    font-size: 13px;
    padding: 8px 20px;
}

.btn-outline-primary:hover {
    color: #fff;
    background-color: #0060A2;
    border-color: #0060A2;
}

.card.card-tableau {
    border: 0;
    box-shadow: none;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 0 !important;
    font-size: 13px;
    background: #fbfcfd;
}

.table-bordered td{
    font-size: 12px;
    vertical-align: middle;
}

.table-bordered td p{
    margin:0;
}

.table-bordered td p.text-secondaire{
    font-size:10px;
}

.badge-info {
    color: #4F5AED !important;
    background-color: #F0F1FA;
    padding: 5px 12px !important;
    border-radius: 50px !important;
    font-size: 10px !important;
}

.badge-danger {
    color: #D12953 !important;
    background-color: #FAF0F3;
    padding: 5px 12px !important;
    border-radius: 50px !important;
    font-size: 10px !important;
}

.badge-success {
    color: #14804A !important;
    background-color: #E1FCEF;
    padding: 5px 12px !important;
    border-radius: 50px !important;
    font-size: 10px !important;
}

.btn-actions {
    display: flex;
    justify-content: space-around;
}

.btn-actions i {
    color: #0000008c;
    font-size: 14px;
}


/* MENU DECORATION ACTIVE */

.user-panel.pt-1.is-active {
    background: #FFF;
    position: relative;
    overflow: visible;
}

.user-panel.pt-1.is-active svg path {
    fill: none;
    stroke: #019AE0 !important;
}

.user-panel.pt-1.is-active .menu-bar-option{
  color: #019AE0 !important;
}

.user-panel.pt-1.last.is-active {
    padding-bottom: 10px;
}

.user-panel.pt-1.is-active::before {
    content: '';
    display: block;
    height: 69px;
    width: 30px;
    position: absolute;
    top: 0px;
    background: #FFF;
    left: -11px;
}

.user-panel.pt-1.is-active::after {
    content: '';
    display: block;
    height: 69px;
    width: 30px;
    position: absolute;
    top: 0px;
    background: #FFF;
    right: -11px;
}

.user-panel.pt-1.is-active .menu-bar-option{
  color: #019AE0 !important;
}

.user-panel.pt-1.is-active:last-child {
    padding-bottom: 10px;
}

/* MENU DECORATION ACTIVE HOVER */

.user-panel.pt-1:hover {
    background: #FFF;
    position: relative;
    overflow: visible;
}

.user-panel.pt-1:hover svg path {
    fill: none;
    stroke: #019AE0 !important;
}

.user-panel.pt-1:hover .menu-bar-option{
  color: #019AE0 !important;
}

.user-panel.pt-1.last:hover {
    padding-bottom: 10px;
}

.user-panel.pt-1:hover::before {
    content: '';
    display: block;
    height: 69px;
    width: 30px;
    position: absolute;
    top: 0px;
    background: #FFF;
    left: -11px;
}

.user-panel.pt-1:hover::after {
    content: '';
    display: block;
    height: 69px;
    width: 30px;
    position: absolute;
    top: 0px;
    background: #FFF;
    right: -11px;
}

.user-panel.pt-1:hover .menu-bar-option{
  color: #019AE0 !important;
}

.user-panel.pt-1:hover:last-child {
    padding-bottom: 10px;
}

.moz-badge
{
  padding: 5px 12px !important;
  border-radius: 50px !important;
  font-size: 10px !important;
}

/* Add this to your existing stylesheet */
meter {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  width: 100%;
  height: 10px; /* Adjust height as needed */
  background-color: rgba(0,0,0,0.1);
}

meter::-webkit-meter-bar {
  background: none;
  background-color: rgba(0,0,0,0.1);
}

meter[value="1"]::-webkit-meter-optimum-value { background: red; }
meter[value="2"]::-webkit-meter-optimum-value { background: yellow; }
meter[value="3"]::-webkit-meter-optimum-value { background: orange; }
meter[value="4"]::-webkit-meter-optimum-value { background: green; }

meter[value="1"]::-moz-meter-bar { background: red; }
meter[value="2"]::-moz-meter-bar { background: yellow; }
meter[value="3"]::-moz-meter-bar { background: orange; }
meter[value="4"]::-moz-meter-bar { background: green; }

.feedback {
  color: #9ab;
  font-size: 0.8em;
  padding: 0 .25em;
  margin-top: 1em;
}

#password-strength-text {
  margin-top: 5px;
  color: red; /* Default color, will be overridden by JavaScript */
  font-size: 0.9em;
}


.select_address {
  cursor: pointer;  
  font-size: 14px;  
  padding-top: 5px;
}

tbody tr {
    background: #FFF;
}

canvas#expeditionsChart {
    height: 209px !important;
    width: 100% !important;
}

@media screen and (min-width: 1300px) {
  .content-wrapper>.content {
      padding: 0 2rem !important;
  }
}

@media screen and (min-width: 1400px) {
  .content-wrapper>.content {
      padding: 0 4rem !important;
  }
}

.form-control:disabled, .form-control[readonly] {
    background-color: #e9ecef;
    opacity: 1;
}

.navbar {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.fa-bell:before {
    content: "\f0f3" !important;
}

.main-header .navbar-nav .nav-item {
    margin: 0;
    margin-right: 10px;
}

.dropdown-toggle::after {
    display: inline-block;
    margin-left: .255em;
    vertical-align: .255em;
    content: "";
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-bottom: 0;
    border-left: .3em solid transparent;
}

.row.tabs-profile {
    height: 80vh;
}

.col-md-2.col-tabs-nav {
    border-right: 1px solid #000;
}

ul.nav.tabs-vertical {
    height: 50vh;
    display: flex;
    flex-wrap: nowrap;
    align-content: stretch;
    justify-content: space-around;
}

.tabs-vertical li.nav-item {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
}

.tabs-vertical li.nav-item .nav-link  {
    color: #000;
}

li.nav-item:has(a.active) {
    border-bottom: 1px solid #000;
}

.btn-retour {
    display: flex;
    gap: 10px;
    align-items: center;
}

.btn-retour a{
    color: #000;
    text-decoration: none;
    font-size: 20px;
}

.icon-expedition {
    background: url('../img/icon-transite-white.png') center center transparent no-repeat;
    background-size: 30px;
    display: block;
    width: 30px;
    height: 30px;
}

.user-panel.pt-1:hover .icon-expedition, .user-panel.pt-1.is-active .icon-expedition {
    background: url('../img/icon-transite-blue.png') center center transparent no-repeat;
    background-size: 30px;
    display: block;
    width: 30px;
    height: 30px;
}

.icon-simulation {
    background: url('../img/icon-manage-white.png') center center transparent no-repeat;
    background-size: 30px;
    display: block;
    width: 30px;
    height: 30px;
}

.user-panel.pt-1:hover .icon-simulation, .user-panel.pt-1.is-active .icon-simulation {
    background: url('../img/icon-manage-blue.png') center center transparent no-repeat;
    background-size: 30px;
    display: block;
    width: 30px;
    height: 30px;
}

footer.main-footer {
    display: none !important;
}
.readonly {
  pointer-events: none; /* Désactive les interactions */
  background-color: lightgray; /* Ajoute un indicateur visuel */
}

.moz-mar-auto
{
  margin: auto !important;
}

.moz-btn-simulate-results
{
  min-height: 40px;
  min-width: 200px;
}

.password-wrapper {
  position: relative;
}
.password-toggle-icon {
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}

/* Styles pour le conteneur du sélecteur */
.select2-container {
  min-width: 100%; /* Ajustez la largeur selon vos besoins */
}

/* Styles pour la zone de sélection */
.select2-selection {
    border: 1px solid #ced4da !important;
    border-radius: 4px !important;
    height: 38px !important;
    line-height: 36px !important;
    font-size: 12px;
}

/* Style pour le texte de l'option par défaut */
.select2-selection__placeholder {
    color: #212529 !important;
}

/* Styles pour la flèche déroulante */
.select2-selection__arrow {
  height: 36px !important; /* Hauteur de la flèche */
}

/* Style pour la bordure de la flèche déroulante */
.select2-selection__arrow b {
  border-color: #6c757d transparent transparent !important; /* Couleur de la bordure */
}

/* Style pour la flèche déroulante (lorsque survolée) */
.select2-selection__arrow:hover b {
  border-color: #333 transparent transparent !important; /* Couleur de la bordure au survol */
}

.select2-container--default .select2-results__option {
    font-size: 12px;
}

.select2-search--dropdown .select2-search__field {
    padding: 4px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: 26px !important;
    line-height: 26px !important;
    font-size: 13px !important;
}

.modal 
{
  z-index : 1050;
}
 
#packages_accordion > div:first-of-type > div:first-of-type > button.remove-package {
  display: none;
}


.table-danger {
  background-color: #f8d7da;
}
