:root{
    --my-dark:#23262d;
    --my-purple:#5f43b2;
    --my-light:#fefdfd;
    --my-khaki:#b1aebb;
    --my-dark-purple:#3a3153;
    --my-purple-transparent:#5f43b2d1;
}

body{
    background-color: var(--my-light);
}
#preloader{
    background-color: var(--my-khaki);
}
#loader{
    border-top-color: var(--my-dark-purple);
}
#loader:before{
    border-top-color: var(--my-dark);
}
#loader:after{
    border-top-color: var(--my-purple);
}


.header{
    background-color: var(--my-purple);
}
.header button{
    color: var(--my-light);
}


.dropdown-menu{
    background-color: var(--my-dark-purple) !important;
    color: var(--my-light) !important;
}
.custom-dropdown .custom-notifications > li > a .text{
    color: var(--my-light);
}
.custom-dropdown .custom-notifications > li > a .text strong{
    color: var(--my-khaki);
}

.custom-dropdown .custom-notifications > li.unread a:hover{
background-color: var(--my-purple);
}

.custom-dropdown .btn.btn-custom {
    border: 1px solid var(--my-light);
  }
  .offcanvas-body{
    background-color: var(--my-purple);
  }
  
  .close-btn{
    background-color: var(--my-purple);
    border-color: var(--my-light);
  }
  .close-btn:hover{
    background-color: var(--my-light);
    border-color: var(--my-purple);
  }
  .close-btn:hover > i.bi{
    color: var(--my-purple);
  }
  .close-btn i.bi{
    color: var(--my-light);
  }
  .link-user{
    background-color: var(--my-dark-purple);
  }
  .link-user li:hover{
    background-color: var(--my-purple);
  }
  .link-user li a{
    color: var(--my-light);
  }
  .user-img{
    border-color:var(--my-dark-purple);
  }
  .offcanvas-start .offcanvas-header{
    background-color: var(--my-purple);
  }
  .offcanvas-start .offcanvas-header h5{
    color: var(--my-light);
  }
  .menu-site a{
    color: var(--my-light) !important;
  }
  .div-util{
    background-color: var(--my-purple);
  }
  .div-util h5{
    color: var(--my-light);
  }
  #slider-first .owl-dots button span{
    background-color: var(--my-khaki) !important;
  }
  #slider-first .owl-dots button.active span{
    background-color: var(--my-purple) !important;
  }
  .section-slider-two{
    background-color: var(--my-dark);
  }
  #slider-second .item a{
    color:var(--my-dark) !important;
  }

  #slider-second .item{
   
    background-color: var(--my-light);
  }
  #slider-second .slider-text{
   background-color: transparent;
  }
  #slider-second .slider-text i{
    color: var(--my-purple);
  }
  #slider-second .owl-dots button span{
    background-color: var(--my-khaki) !important;
  }
  #slider-second .owl-dots button.active span{
    background-color: var(--my-purple) !important;
  }
  .slider-title h3{
    color: var(--my-light) !important;
  }
  .slider-title h3:before{
    background: var(--my-purple);
  }
  .slider-title h3:after{
    background: var(--my-khaki);
  }
  .slider-title-light h3{
    color: var(--my-dark) !important;
  }
  .slider-title-light h3:before{
    background: var(--my-purple);
  }
  .slider-title-light h3:after{
    background: var(--my-dark-purple);
  }
  #slider-three .item {
    color:var(--my-dark) !important;
    background-color: var(--my-light);
  }
  #slider-three .slider-text i{
    color: var(--my-purple);
  }
  #slider-three .owl-nav button{
    color: var(--my-purple);
    background-color: var(--my-khaki);
  }
  #slider-three .owl-nav button:hover{
    color: var(--my-khaki);
    background-color: var(--my-purple);
  }
  .section-shuttle .row{
    background-color: var(--my-purple-transparent) !important;
    color: var(--my-light);
  }
  #slider-four .text i{
  color: var(--my-khaki) !important;
  } 
  #slider-four .text{
    background-color: var(--my-purple);
    color: var(--my-light) !important;
  }
  #slider-four .image ul.inner-ul li a i{
    color: var(--my-purple) !important;
  }
  #slider-four .owl-nav button{
    color: var(--my-purple);
    background-color: var(--my-khaki);
  }
  #slider-four .owl-nav button:hover{
    color: var(--my-khaki);
    background-color: var(--my-purple);
  }
  
/* =====doc cmms page===== */

/* ===== کارت‌های ویدیو ===== */
.video-card video {
  border: var(--my-khaki);;
}
.video-card:hover video {
  box-shadow:rgba(0,224,255,0.3);
}

/* ===== کارت مقاله ===== */
.article-card {
  background: rgba(255,255,255,0.05);
  border:rgba(255,255,255,0.1);
  transition: all 0.3s ease;
  height: 100%;
  display: flex;
flex-direction: column;
}
.article-card:hover {
  background: rgba(0,224,255,0.1);
}

/* ===== مشتریان ===== */
.client-logo {
  background: rgba(255,255,255,0.05);
  border: rgba(255,255,255,0.1);
}

.client-logo:hover {
  box-shadow: rgba(0,224,255,0.3);
}

/* ===== ماژول‌ها ===== */
.module-card {
  background: rgba(255,255,255,0.05);
  border: rgba(255,255,255,0.1);
}
.module-card:hover {
  background: rgba(0,224,255,0.1);
}

/* ===== CTA ===== */
.section-cta {
  background: var(--my-dark-purple);
  color: #fff;
}
.section-cta .btn {
  background-color: var(--my-purple);;
  color: #000;

}
.section-cta .btn:hover {
  background-color: #00b8d4;
  color: #fff;
}
 
/* ===== CTA ===== */

   /* =====end doc cmms page===== */


   /* ===== articlecmms cmms page===== */
.article-hero img {
  border: rgba(255,255,255,0.1);
}

blockquote {
  border-color: black;
}

.related-card {
  background: rgba(255,255,255,0.05);
  border: rgba(255,255,255,0.1);
}
.related-card:hover {
  background: rgba(0,224,255,0.1);
}


/* ===== end articlecmms cmms page===== */