@font-face {
  font-family: 'SFProDisplay';
  src: url('../fonts/Somar-Light.otf');
  font-weight: 100;
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

@font-face {
  font-family: 'SFProDisplay';
  src: url('../fonts/Somar-Regular.otf');
  font-weight: normal;
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

@font-face {
  font-family: 'SFProDisplay';
  src: url('../fonts/Somar-SemiBold.otf');
  font-weight: bold;
  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

.custom-switch{
  padding-left: 0px !important;
}

.dropdown-item span{
  padding-right: 0px !important;

}

*:not(.icons, #sidebarToggle, .fc-icon, .glyphicon) {
  font-family: 'SFProDisplay', Arial, sans-serif !important;
}
.ql-snow .ql-picker:not(.ql-color-picker):not(.ql-icon-picker) svg, .textarea-emoji-control{
  right:auto !important;
  left: 2px;
}

.rtl .msg-content-right{
  margin-right: auto !important;
}

.ql-editor{
  text-align: right !important;
}
.p-sub-menu, .sidebar-menu{
  font-weight: 600 !important;
}

.bootstrap-timepicker-widget{
    direction: ltr !important;
}


   .custom-control.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
        background-color: #2196F3;
    }
    .custom-control.custom-switch .custom-control-input:checked ~ .custom-control-label::after {
        background-color: #fff;
        transform: translateX(14px);
        right: calc(-1.5rem + 4px);
       
    }
    .custom-control.custom-switch .custom-control-label::before{
         width: 2.5rem !important;
        top: .15rem !important;
        height: 1.2rem !important;
        
    }
    .custom-control.custom-switch .custom-control-input ~ .custom-control-label::before {
        transition: .4s;
        border-radius: 34px;
    }
    .custom-control.custom-switch .custom-control-input ~ .custom-control-label::after {
        transition: .4s;
        border-radius: 50%;
    }
    
    .rounded {
  border-radius: .6rem !important;
}

    .feature-box {
mix-blend-mode: normal;
border: 1px solid #54524D !important;
border-radius: 12px !important;
height: 100%;
box-shadow: 1px 3px 0px #54524D !important;
}
.feature-activation{
    border-bottom: 2px dashed #9B9A97;
    
}
.feature-box img{
    width: 50%;
}

.feature-box.disabled {
    background-color: #f7f7f7 !important;
    border: 0 !important;
    box-shadow: none !important;
}

.notification-box{
    mix-blend-mode: normal;
border: 1px solid #54524D !important;
border-radius: 12px !important;
height: 100%;
box-shadow: 1px 3px 0px #54524D !important;
position: relative;
}

.notification-box a{
   
font-style: normal;
font-weight: 700;
font-size: 16px;
color: #E03E3E !important;
text-decoration: underline;

}

    .countdown-block {
        display: inline-block;
        margin: 0 10px;
    }
    .label {
        font-size: 1.5rem;
        font-weight: normal;
        display: block;
        line-height: 1.5;
    }
    .countdown-unit {
        font-size: 3.5rem;
        font-weight: bold;
    }
    
    .notification-box .close-btn {
    position: absolute;
    top: -20px;
    right: -20px;
    cursor: pointer;
    width: 44px;
    height: 44px;
    border-radius: 50px;
    font-size: 28px;
    font-weight: 300;
    background: #FFFFFF;
    
    }
    
    
    .setup_box{
        background: #fff;
          mix-blend-mode: normal;
border: 1px solid #54524D !important;
border-radius: 12px !important;
height: 100%;
box-shadow: 1px 3px 0px #54524D !important;
position: relative;
    }
    
    
    .setup_progress{
        
    }
    
    .setup-step-btn{
        
    justify-content: center;
    align-items: center;
    padding: 8px 16px;
    font-weight: 600;
    border-radius: 50px;
    
    }
    
    .stepper{
        min-width:300px;
        -webkit-box-shadow: -2px 0 rgba(221, 130, 50, 0.15);
        box-shadow: -2px 0 rgba(221, 130, 50, 0.15);
    }
    
    .stepper ul .list-group-item{
        border: none !important;
           color: #BBB7AE;
        background: transparent !important;

    }
    
    
    .ai_generation_cats{
        background: #f7f6f3;
        border-radius: 12px;
        padding: 16px;
    }
    
     
    .stepper ul .completed{
             color: #A6A39C;
    }
    
    .stepper ul .active{
        color: #353B46;
        background: transparent !important;
        background-image : url('../img/list-active.svg') !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
    }
    
    #companyDetailsDiv textarea{
        border: solid 2px #afafaf;
        border-radius: 16px;
        padding: 16px;
    }
    #companyDetailsDiv p{
        line-height: 1.7;
    }

    #aiSetupSteps .setup-steps-ul{
    
        max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    }
    
    #aiSetupSteps .active{
    color: #E03E3E;
    border: 2px solid #E03E3E;
    
    }
    
    #aiSetupSteps .next{
    border: none;
    color: #c3c1bc;
    
    }
    #aiSetupSteps .done{
        background: #FFFFFF;
    border: 2px solid #37352F;
    }
    
    #aiSetupSteps .btn-primary, #companyDetailsDiv .btn-primary{
        border: 2px solid #000000 !important;
    }
    .btn{
        font-weight: 600 !important;
    }
    
    .dark-theme .setup_box{
               background: transparent !important;
 
    }
    
    .dark-theme .stepper ul .list-group-item{
        border: none !important;
      

    }
    
    .dark-theme .ai_generation_cats{
               background: #101225 !important
 
    }
    
    .dark-theme .stepper ul .active{
                color: #fff;

        
    }
    
    .dark-theme #aiSetupSteps .done{
        background: transparent;
    border: 2px solid #fff;
    }
    
    #complete_img{
        display: flex;
    }
    
    @media (max-width: 767.98px) {
        .stepper{
        min-width:auto;
         -webkit-box-shadow: none;
        box-shadow: none;
    }
    #complete_img{
        display: none;
    }
    
    .label {
        font-size: 1rem;
        font-weight: normal;
        display: block;
        line-height: 1;
    }
    .countdown-unit {
        font-size: 2rem;
        font-weight: bold;
    }

    
}