@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/* LOADING */
.loading {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  justify-content: center;
  align-items: center;
  display: flex;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.69);
  z-index: 995;
}
.spinner {
  -webkit-animation: rotate 2s linear infinite;
          animation: rotate 2s linear infinite;
  z-index: 2;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -25px 0 0 -25px;
  width: 50px;
  height: 50px;
}
.spinner .path {
  stroke: #2075cb;
  stroke-linecap: round;
  -webkit-animation: dash 1.5s ease-in-out infinite;
          animation: dash 1.5s ease-in-out infinite;
}

@-webkit-keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -35;
  }
  100% {
    stroke-dasharray: 90, 150;
    stroke-dashoffset: -124;
  }
}
.loader-out{
  opacity: 0;
  transition: opacity 0.4s ease-out;
  display: none;
}
/* END LOADING */

/* ALERT ALERT */
.msg-flash{
  top: -5em;
  z-index: 2000;
  opacity: 0;
  transition: all 2s;
}
.bg-gradient-success{
  border-color: #cde9ce;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(76, 175, 80, 0.4);
}
.bg-gradient-danger{
  border-color: #fccac7;
  box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(244, 67, 54, 0.4);
}
.msg-flash.flash{
  top: 2em;
  opacity: 1;
  animation: move 2s;
  z-index: 20000;
}
@keyframes move {
  from {
    top: -5em;
    opacity: 0;
  }
  to {
    top: 2em;
    opacity: 1;
  }
}
/* ALERT ALERT */

.height-bar{
  min-height: 82vh;
  height: auto;
  padding-bottom: 4em;
}
.line{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box!important;
  -webkit-box-orient: vertical;
}
.line-1{
  -webkit-line-clamp: 1;
}
.line-2{
  -webkit-line-clamp: 2;
}
.line-3{
  -webkit-line-clamp: 3;
}
.line-4{
  -webkit-line-clamp: 4;
}
.line-5{
  -webkit-line-clamp: 5;
}
.line-6{
  -webkit-line-clamp: 6;
}
.line-7{
  -webkit-line-clamp: 7;
}
.line-8{
  -webkit-line-clamp: 8;
}
.line-9{
  -webkit-line-clamp: 9;
}

.font-weight-maxBold {
  font-weight: 700 !important;
}

.navbar.navbar-main.navbar-expand-lg{
  left: 0;
  right: 0;
  z-index: 1000;
}

.nav-item.icon-nav .nav-link{
  margin: 0;
}

.navbar .nav-link{
  color: #aeb0c8!important;
  margin: 0 1em;
  padding: 0.8em 0;
}
.navbar .nav-link:hover{
  color: #fff!important;
}
.navbar .nav-link.active{
  color: #fff!important;
  border-bottom: 1px solid #fff!important;
}

.avatar-moyen {
  width: 40px !important;
  height: 40px !important;
}

.bg-personnaliser-1{
  background: #2b3f6f !important;
}

.sidenav.bg-white .navbar-nav>.nav-item>.nav-link.active{
  background: transparent!important;
  border-radius: 0 !important;
}

.navbar-vertical .navbar-nav .nav-link.active{
  border-radius: 0 0.25rem 0.25rem 0 !important;
}

.sidenav.bg-white .navbar-vertical .navbar-nav .nav-link {
  color: #000 !important;
}

.active .icon.icon-shape.icon-sm svg{
  color: #0d4683 !important;
}

.sidenav.bg-slate-900 .active .icon.icon-shape.icon-sm svg {
  color: hsl(210.69deg 100% 64.31%) !important;
}

.sidenav.bg-slate-900 .sidenav .mode-claire, .sidenav.bg-white .sidenav .mode-sombre{
  display: none;
}
.sidenav.bg-white .sidenav .mode-claire, .sidenav.bg-slate-900 .sidenav .mode-sombre,{
  display: block;
}

.sidenav.bg-slate-900 .navbar .sidenav-toggler-inner .sidenav-toggler-line{
  background: hsl(45deg 3.77% 79.22%) !important;
}
.sidenav.bg-slate-900 .navbar-vertical .navbar-nav .nav-link, .sidenav.bg-slate-900 .icon.icon-shape.icon-sm svg{
  color: #e3e3e3 !important;
}

.sidenav.bg-slate-900 .sidenav-footer h6, .sidenav.bg-slate-900 .sidenav-footer svg{
  color: #fff !important;
}
.sidenav.bg-slate-900 .sidenav-footer p{
  color: #c8c8c8 !important;
}

.sidenav.bg-slate-900 .navbar.navbar-main .border.border-2 {
  border: 2px solid hsl(45deg 3.77% 79.22%) !important;
}
.sidenav.bg-slate-900 .navbar.navbar-main .border.border-2 small {
  color: hsl(45deg 3.77% 79.22%)!important;
}

.sidenav.bg-slate-900 .navbar.navbar-main .nav-item .btn.btn-sm.btn-dark{
  background-color: #fff;
  color: #000;
}
.sidenav.bg-slate-900 .navbar.navbar-main .nav-item .nav-link svg{
  color: hsl(45deg 3.77% 79.22%);
}

.sidenav.bg-slate-900 .fixed-plugin .card{
  background-color: hsl(0deg 0% 7.84%) !important;
}

.sidenav.bg-slate-900 button.btn.btn-outline-dark{
  background-color: #fff;
  color: #000;
}

.sidenav.bg-slate-900 .fixed-plugin .float-start,
.sidenav.bg-slate-900 .fixed-plugin .float-end button.fixed-plugin-close-button svg,
.sidenav.bg-slate-900 .fixed-plugin .float-start h5,
.sidenav.bg-slate-900 .fixed-plugin h6, .sidenav.bg-slate-900 .fixed-plugin.show p{
  color: #fff;
}

.sidenav.bg-slate-900 .dropdown-menu.dropdown-menu-end{
  background-color: hsl(0deg 0% 7.84%) !important;
}
.sidenav.bg-slate-900 .dropdown-menu.dropdown-menu-end h6,
.sidenav.bg-slate-900 .dropdown-menu.dropdown-menu-end p{
  color: #fff;
}

.icon.icon-shape.icon-sm svg{
  color: #1e293b !important;
}

.sidenav.bg-slate-900 .navbar-vertical.bg-white .navbar-nav>.nav-item.border-start {
  border-color: rgba(191, 191, 191, 0.5) !important;
}

.fixed-plugin-button-nav{
  width: 16px;
  height: 16px!important;
  display: block;
  text-align: center;
}

.navbar-vertical .navbar-nav .nav-link.active {
  box-shadow: none!important;
}

.input-group .search.form-control:focus {
  border-color: none !important;
  border-left: none !important;
  border-right: none !important;
  border-color: none !important;
  outline: 0;
}

.sidenav.bg-slate-900 .input-group .form-control:focus{
  border-color: hsl(45deg 3.77% 79.22%) !important;
}

.sidenav.bg-white .form-control{
  background-color: #fff!important;
  color: #495057!important;
}
.sidenav.bg-slate-900 .form-control{
  background-color: transparent!important;
  color: #fff!important;
}
.sidenav.bg-slate-900 .form-control:focus{
  color: #fff!important;
  background-color: transparent!important;
}

.sidenav.bg-slate-900 .input-group-text{
  border: 1px solid hsl(0deg 0% 29.8%)!important;
  background-color: rgb(32, 32, 32)!important;
}

.sidenav.bg-slate-900 .form-control{
  border: 1px solid hsl(0deg 0% 29.8%)!important;
  background-color: transparent!important;
}

@media (min-width: 1200px){
  body.sidenav:hover {
    max-width: initial!important;
  }
}

.folder{
  width: 250px;
  float: left;
}

.folder-file{
  width: 100%;
}

.person-picture{
  margin-left: -10px;
}

.person img{
  border: 2px solid #fff;
}

.person img.black{
  border: 2px solid #1e293b;
}

.home.table tr{
  border-style: none!important;
  border-color: transparent!important;
}
tbody tr:hover{
  background: #eff3fd;
}

.add-dossier{
  padding: 0.8em 0.9em 0.7em 0.9em;
  border-radius: 50%;
}

.add-folder{

}
.add-folder label{
  color: #2b3f6f;
}
.add-folder input{
  border: none;
  margin-left: 1em;
  outline: 0;
  width: 50%;
  font-size: 0.8125rem;
  font-weight: 600;
  margin-bottom: 0.375rem;
}

.doc-input{
  position: relative;
  border-style: dotted !important;
  border: 2px solid #a1a1a1;
  background: rgba(144, 144, 144, 0.1);
}

@media (max-width: 1199px) {
  .navbar.navbar-main.navbar-expand-lg {
    left: 0;
  }
}

.pass-view{
  top: 0.7em;
  right: 0.7em;
}

.addPlus.dropdown-menu {
  box-shadow: initial;
}

.line{
  text-overflow: ellipsis;
  overflow: hidden;
  display: -webkit-box!important;
  -webkit-box-orient: vertical;
}
.line-1{
  -webkit-line-clamp: 1;
}
.line-2{
  -webkit-line-clamp: 2;
}
.line-3{
  -webkit-line-clamp: 3;
}
.line-4{
  -webkit-line-clamp: 4;
}
.line-5{
  -webkit-line-clamp: 5;
}
.line-6{
  -webkit-line-clamp: 6;
}
.line-7{
  -webkit-line-clamp: 7;
}
.line-8{
  -webkit-line-clamp: 8;
}
.line-9{
  -webkit-line-clamp: 9;
}

.form-control {
  -webkit-appearance: none;
}

.nav-item .nav-link.text-body.active{
  color: #ea4e3d!important;
}

.theme button.active{
  background: #0d4683!important;
  color: #fff!important
}

.form-control{
  padding-left: 0.5em!important;
}
.form-control:focus {
  border-color: #0756c2!important;
}

.sidenav.bg-slate-900 .card{
  background: hsl(0deg 0% 9.8%) !important;
  border: none!important;
}
.sidenav.bg-slate-900 .card.border-dashed{
  border: 1px dashed #fff !important;
}

.sidenav.bg-slate-900 .card .card-header, .sidenav.bg-slate-900 .card h5,
.sidenav.bg-slate-900 .card h4, .sidenav.bg-slate-900 .card p, .sidenav.bg-slate-900 .card small{
  color: #fff!important;
}
.sidenav.bg-slate-900 .card-customer .icon.icon-shape{
  background: #fff !important;
}
.sidenav.bg-slate-900 .card-customer .icon.icon-shape svg{
  color: #000 !important;
}

.sidenav.bg-slate-900 .dropdown-item:hover, .dropdown-item:focus {
  background-color: #333!important;
}

.wizard-navigation ul li.active{
  background: #0756c2;
}
.wizard-navigation ul li.active a{
  color: #fff;
  font-weight: bold;
}

label.error{
  color: #ed0c44;
  font-weight: normal;
}

.nav-link.grid.active{
  width: 25px!important;
  background: #fff!important;
}
.nav-link.list.active{
  width: 25px!important;
  background: #fff!important;
}
.doc .moving-tab .nav-link{
  background: transparent!important;
  box-shadow: none;
}


span.notify{
  padding: 1px 6px 1px 5px;
  border-radius: 50px;
  position: absolute;
  top: 0;
  left: 6px;
}
span.notifys{
  padding: 3px 4px 3px 4px;
  border-radius: 50px;
  position: absolute;
  top: -5px;
  left: 5px;
}

.sidenav.bg-slate-900 .retour a{
  color: #fff;
}

.navbar-vertical.navbar-expand-xs{
  z-index: 20000;
}

.content-customer{
  display: block;
  overflow: scroll;
  height: auto;
  max-height: 64vh;
  padding-top: 1em;
}

.sidenav.bg-slate-900 .filter .card-header button.btn,
.sidenav.bg-slate-900 .content-customer .flex-column h6,
.sidenav.bg-slate-900 .content-customer .flex-column p,
.sidenav.bg-slate-900 .content-customer .flex-column p svg{
  color: #fff!important;
}

.sidenav.bg-slate-900 .content-customer .graduition{
  background: #b3b3b3;
  color: #000;
}
.content-customer .graduition{
  background: #454545;
  color: #fff;
  border-radius: 5px;
  padding: 2px 10px !important;
}

.table-customer{
  background: hsl(214.29deg 100% 98.63%);
  padding: 0 1em 1em;
  margin: 0 0.7em;
}

.sidenav.bg-slate-900 .table-customer{
  background: #262626 !important;
}

.table-customer .icon-transac{
  background-color: #000 !important;
}
.table-customer .icon-transac svg{
  color: #fff;
}

.sidenav.bg-slate-900 .table-customer .icon-transac {
  background-color: #fff !important;
}
.sidenav.bg-slate-900 .table-customer .icon-transac svg{
  color: #000 !important;
}

.sidenav.bg-slate-900 .table-customer span.title, .sidenav.bg-slate-900 .table-customer span.desc {
  color: #fff !important;
}

.sidenav.bg-slate-900 .profile h4, .sidenav.bg-slate-900 .profile p,
.sidenav.bg-slate-900 label, .sidenav.bg-slate-900 .pass-view svg{
  color: #fff!important;
}

.pageA4{
  width: 21cm;
  min-height: 29.7cm;
  padding: 0cm;
  margin: 0.5cm auto;
  border: 1cm #D3D3D3 solid;
  border-radius: 5px;
  background: #fff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.dnone{
  display: none;
}

@page{
  size: A4;
  margin: 0;
}

@media print{
  .pageA4{
    margin: 0;
    border: initial;
    border-radius: initial;
    width: initial;
    min-height: initial;
    box-shadow: initial;
    background: initial;
    page-break-after: always;
  }
  #hidden-content{
    display: none;
  }
  .dnone{
    display: block;
  }
}

.viewPhone{
  display: none;
}

.desktop, .suivi-desktop{
  display: block;
}
.mobile, .suivi-mobile{
  display: none;
}

.head-mobile{
  border-bottom: 1px solid rgba(100, 116, 139, 0.28);
}
.mobile .head-mobile li svg{
  color: #000;
}
.sidenav.bg-slate-900 .mobile .head-mobile li svg{
  color: #fff;
}

.mobile p{
  color: #000;
}
.sidenav.bg-slate-900 .mobile p{
  color: #fff;
}

.bar-bottom-menu{
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}
.sidenav.bg-white .bar-bottom-menu{
  background: linear-gradient(to top, #fff 18.49%, rgba(255, 255, 255, 0) 82.77%);
}
.sidenav.bg-slate-900 .bar-bottom-menu{
  background: linear-gradient(to top, #000 16.39%, rgba(0, 0, 0, 0) 84.03%);
}
.bar-mobile{
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 10px;
  background: #fff;
  border-radius: 10px;
  border: 1.5px solid #cdcdcd;
}
.bar-mobile ul{
  display: -webkit-box;
}
.bar-mobile a{
  justify-items: center;
  color: #818181;
}
.bar-mobile a.active{
  color: #000;
  position: relative;
}
.bar-mobile a.active::before{
  content: "";
  position: absolute;
  height: 2px;
  width: 10px;
  background: #000;
  bottom: -2px;
  border-radius: 5px;
}

.badgeNotify{
  position: absolute;
  top: -6px;
}

.dropdown-menu.dropdown-menu-end.show{
  transform: translate(0px, 27px)!important;
}

.sidenav.bg-slate-900 .bar-mobile{
  background: #262626;
  border: 1.5px solid #262626;
}
.sidenav.bg-slate-900 .bar-mobile a{
  color: #a2a2a2;
}
.sidenav.bg-slate-900 .bar-mobile a.active{
  color: #fff;
}
.sidenav.bg-slate-900 .bar-mobile a.active::before{
  background: #fff;
}

.sidenav.bg-slate-900 .card-body.balance-home a{
  background: #404040;
  color: #fff;
}
.card-body.balance-home a{
  background: #f3f3f3;
  color: #000;
}

.card-body.balance-home .avatar-moyen{
  background: #f3f3f3;
}
.sidenav.bg-slate-900 .card-body.balance-home .avatar-moyen{
  background: #fff;
}

.sidenav.bg-slate-900 .transac-home h6, .sidenav.bg-slate-900 .transac-home p,
.sidenav.bg-slate-900 .transac-home .avatar-moyen svg{
  color: #fff!important;
}
.transac-home h6, .transac-home p, .transac-home .avatar-moyen svg{
  color: #1e293b!important;
}

.sidenav.bg-slate-900 .profil-headbar{
  background: linear-gradient(#313873, rgba(0, 0, 0, 0) 110%);
}
.sidenav.bg-white .profil-headbar{
  background: linear-gradient(#7ab9e6 23.95%, rgba(255, 255, 255, 0));
}

.sidenav.bg-white{
  background: #e7e7e7;
}

.sidenav.bg-white .profil-page .card svg, .sidenav.bg-white .profil-page svg{
  color: #000;
}

.sidenav.bg-slate-900 .profil-page .card{
  box-shadow: 0 20px 27px 0 rgba(0, 0, 0, 0.17);
}

.sidenav.bg-slate-900 .profil-page .card svg, .sidenav.bg-slate-900 .profil-page svg{
  color: #fff;
}

.sidenav.bg-white .profil-page a.btn{
  color: #fff;
  background: #000;
}
.sidenav.bg-white .profil-page a.btn svg{
  color: #fff;
}

.sidenav.bg-slate-900 .profil-page a.btn{
  color: #000;
  background: #fff;
}
.sidenav.bg-slate-900 .profil-page a.btn svg{
  color: #000;
}

.sidenav.bg-slate-900 .bg-pin{
  background: linear-gradient(152deg, #313873, rgba(0, 0, 0, 0) 57.98%);
}
.sidenav.bg-white .bg-pin{
  background: linear-gradient(183deg, #48a7ff 3.78%, rgba(255, 255, 255, 0) 69.75%);
}

.sidenav.bg-slate-900 .nav.nav-pills{
  background: #262626!important;
}
.sidenav.bg-white .nav.nav-pills{
  background: #fff!important;
}
.sidenav.bg-slate-900 .nav.nav-pills .nav-link{
  color: #fff!important;
}
.sidenav.bg-slate-900 .nav.nav-pills .nav-link.active{
  color: #fff!important;
  background: #000!important;
  box-shadow: 0 20px 27px 0 rgba(0, 0, 0, 0.17);
}
.sidenav.bg-white .nav.nav-pills .nav-link.active{
  border: 1px solid rgba(35, 61, 131, 0.37)!important;
}

.sidenav.bg-slate-900 .bg-pin a,
.sidenav.bg-slate-900 #password .list-group-flush .list-group-item,
.sidenav.bg-slate-900 #password .list-group-flush .list-group-item svg {
  color: #fff;
}
.sidenav.bg-white .bg-pin a,
.sidenav.bg-white #password .list-group-flush .list-group-item,
.sidenav.bg-white #password .list-group-flush .list-group-item svg {
  color: #000;
}

.sidenav.bg-slate-900 .wallet .nav.nav-pills {
  background: transparent!important;
  flex-direction: initial!important;
}

.sidenav.bg-slate-900 .wallet .nav.nav-pills .nav-link {
  color: #fff!important;
  background: #363636;
  width: 45px;
  height: 45px;
  margin: 0 auto;
  justify-content: center;
  align-content: center;
  display: grid;
  border-radius: 100%;
}

.sidenav.bg-slate-900 .wallet .nav.nav-pills .nav-link.active {
  background: #0d49a4!important;
}
.wallet .nav.nav-pills .moving-tab.nav-link{
  background-color: transparent!important;
  display: none !important;
}

.sidenav.bg-slate-900 .stats .float-start p{
  color: #fff;
}
.sidenav.bg-white .stats .float-start p{
  color: #000;
}

.sidenav.bg-slate-900 .stats .float-start span{
  color: #b9b9b9;
}
.sidenav.bg-white .stats .float-start span{
  color: #4f4f4f;
}

.profil-page, .wallet-content{
  margin: 3em 15% 0;
}

.sidenav.bg-slate-900 .chart-stat{
  background: linear-gradient(to top, rgba(4, 61, 120, 0.36) 26.89%, rgba(0, 0, 0, 0) 81.51%);
}
.sidenav.bg-white .chart-stat{
  background: linear-gradient(to top, rgba(255, 255, 255, 0.97) 26.89%, rgba(255, 255, 255, 0) 81.51%);
}

.desktop-mobile{
  padding: 0 3rem !important;
}
.desktop-mobile .col-style{
  flex: 0 0 auto;
  width: 66.666667%;
}
ul.navbar-nav .menu-destop{
  display: flex;
}
li.nav-item.menu-deroulant{
  display: none;
}
@media (max-width: 918px){
  ul.navbar-nav .menu-destop{
    position: absolute;
    display: none;
    padding: 0 10px;
    margin-top: 2px;
    border-radius: 0 0 8px 8px;
    background: #114f99;
    box-shadow: 0 0 4px -1px rgba(12, 26, 36, 0.68), 0 0.0625rem 0.0625rem 0 rgba(12, 26, 36, 0.04);
  }
  li.nav-item.menu-deroulant{
    display: block;
  }
}
@media (max-width: 828px){
  .navbar-translate a.navbar-brand{
    padding: 0rem!important;
  }
}
@media (max-width: 717px){
  .desktop, .suivi-desktop{
    display: none;
  }
  .mobile, .suivi-mobile{
    display: block;
  }
  .desktop-mobile{
    margin-top: 0 !important;
    padding: 0 1.5rem 5rem !important;
  }
  .desktop-mobile .col-style{
    width: 100%;
  }
  .profil-page, .wallet-content{
    margin: 0;
  }
}
@media (max-width: 500px){
  .fixed-plugin.show .card{
    width: 100% !important;
  }
  .fixed-plugin .card{
      right: -100% !important;
  }
  .fixed-plugin.show .card {
    right: 0% !important;
  }

  .list-group li.list-group-item{
    font-size: 0.9em!important;
    font-weight: bold!important;
  }
}

.sidenav.bg-slate-900 footer .copyright, .sidenav.bg-slate-900 footer .copyright a{
  color: #fff!important;
}
