@import url(https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap);
*,::after,::before{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Open Sans",sans-serif;min-height:100vh; min-width: 1100px;}
:root {
  --theme-cl: #2c74b3;
  --theme-dbcl:#a2d4ff;
  --white: #ffffff;
}
a{text-decoration: none}
input:focus,select:focus,textarea:focus{outline:0;border:1px solid #eee !important} 

.main-header{ background:#fff; height:50px; border-bottom: 1px solid #e2e2e2; position: fixed; width: 100%; top: 0; z-index: 9;}
.main-header .inner{width:100%}
.main-header .logo {width:8% ;padding:9px 5px 5px 10px; cursor: pointer; height: 50px;  float:left}
.main-header .logo img{height:34px; margin:auto}
.main-header .search {width:12% ;padding:5px 5px 5px 10px;  height: 50px; float:left}
.main-header .search .search-main{height:40px; border-radius:4px; width: 100%; border:1px solid #e4e4e4; padding-left:10px; font-size: 14px; color:#545a6d;}
.main-header .menu {width:65% ;padding:6px 5px 5px 10px;  height: 50px; float:left; }
.main-header .menu li .nav-link{padding:5px 15px; color:#666;  font-size:15px; font-weight: 500}
.main-header .menu li.active .nav-link{color: var(--theme-cl)}
.main-header .menu li .drop-icon{font-size:13px; margin-left:2px }
.main-header .menu .dropdown-menu{border:0px; border-radius: 0 0 .25rem .25rem; box-shadow: 0 1rem 3rem rgb(0 0 0 / 18%);}
.main-header .menu .dropdown-menu a{font-weight: 400; font-size:14px; color: #495057}
.main-header .menu .dropdown-menu a i{margin-right:8px; font-size:12px}
.main-header .right {width:27% ;padding:5px 5px 3px 10px;  height: 45px; float:left;  }
.main-header .right  .trial-area span{color: #ff1616;padding: 0px 10px 1px;border-radius: 5px;font-size: 12px;display: block;margin-top: 8px;border: 1px solid #f55;}
.main-header .profile .img-area{width:45px; float:left;  cursor: pointer;}
.main-header .profile .img-area img{width: 40px; border-radius: 50%; border: 1px solid #c8c8c8;}
.main-header .profile .name-area{width:130px; float:right; padding-left:5px ; cursor: pointer;}
.main-header .profile .name-area span{display:block; line-height: 18px;}
.main-header .profile .name-area .name {font-size:13px}
.main-header .profile .name-area .company {font-size:13px;     font-weight: 600;}
.main-header .profile_dropdown{margin-left: -120px; width: 260px; padding-top: 0px}
.main-header .profile_dropdown .content {background:#eee; border-radius: 5px 5px 0px 0px}
.main-header .profile_dropdown .content img{border-radius:50%}
.main-header .profile_dropdown .content .name{display:block;  }
.main-header .profile_dropdown .content .company{display:block;font-size:13px  }

.main-header .notification_dropdown{margin-left: -260px; width: 360px; max-height:450px; overflow-y: auto; padding-top: 0px; box-shadow: 2px 7px 10px rgba(0, 0, 0, 0.04); border-radius: 2px}
.main-header .notification_dropdown .dropdown-item{white-space:normal !important; display:inline-block; padding: 10px 10px 6px 10px;}
.main-header .notification_dropdown .icon{width:40px ; float:left;  }
.main-header .notification_dropdown .content{width:285px; float:left; padding-left:10px; line-height: 20px; }
.main-header .notification_dropdown .comment{font-size:14px}
.main-header .notification_dropdown .date{color:#888; font-size:12px}

.notification-icon{width: 40px;height: 40px;display: inline-flex;align-items: center;justify-content: center;background: #F4F4F4;border-radius: 40px; cursor:pointer; position:relative; border: 1px solid #d8d0d0;} 
.notification-icon .noti_count{position:fixed; display:block; background:red; color: #fff; width: 18px; height: 18px; margin-right: -30px; margin-top: 19px; border-radius: 50%;  text-align: center; font-size: 12px; line-height: 1.4;}
.notification-icon-inner{width: 40px;   height: 40px;   display: inline-flex; align-items: center; justify-content: center;  background: #FFEBC6;  border-radius: 40px; cursor:pointer;}
.mainbody{padding-top:50px}
.customForm label {display: inline-block;text-transform: uppercase;font-size: 13px;color: #484242; } 
.customForm input:not([type=radio]):not([type=checkbox]){font-size:13px; height:35px; padding-left:10px}
.customForm select {font-size:13px; height:35px}
.customForm textarea {font-size:13px; }
form.custom input:not([type=radio]):not([type=checkbox]){font-size:13px; height:35px; padding-left:10px}
form.custom select {font-size:13px; height:35px}

select.form-control {font-size:13px; height:35px}
.form-control:focus{box-shadow:none !important; outline:none !important; border:1px solid #666 !important}
form.custom .form-control:focus{box-shadow:none !important; outline:none !important; border:1px solid #666 !important}

.csLable{ padding:2px 8px; font-size: 12px; border-radius: 3px; text-transform: uppercase;}
.csLable.danger{border:1px solid #ff3838; color: #ff3838}
.csLable.success{border:1px solid #31b726; color: #31b726}
.csLable.warning{border:1px solid #d2d23f; color: #d2d23f}
.csLable.info{border:1px solid #3fa9d2; color: #3fa9d2}
.csBtn{padding: 5px 10px; font-size: 14px; border-radius: 4px; font-weight: 500; text-decoration: none; cursor:pointer;}
.csBtn.block{width:100%}
.csBtn.sm{padding: 2px 5px; font-size: 13px; border-radius: 4px; font-weight: 500;}
.csBtn.primary{border:1px solid  var(--theme-cl); background: var(--theme-cl);  color: #fff} 
.csBtn.primary:disabled{background:var(--theme-dbcl) !important;border-color: var(--theme-dbcl) !important}
.csBtn.success{border:1px solid  #1ba208; background: #1ba208;  color: #fff}
.csBtn.success:disabled{border:1px solid  var(--theme-dbcl); background: var(--theme-dbcl);  color: #fff}
.csBtn.success-border{border:1px solid  #1ba208; background: #fff;  color: #1ba208}
.csBtn.basic{border: 1px solid #dfdfdf;background: #f0f0f0;color: #6a6a6a;}
.csBtn.basic:hover{border: 1px solid #d0cfcf;}
.csBtn.warning{border: 1px solid #ffc107;background: #ffc107;color: #fff;}
.csBtn.info{border: 1px solid #58c8e1;background: #58c8e1;color: #fff;}
.csBtn.default{border: 1px dashed #444;background: #fff;color: #6a6a6a;}
.csBtn.danger{border: 1px solid #ff5252;background: #fff;color: #ff5252;}
.csBtn.dark{border: 1px dashed #444;background: #444;color: #fff;}
.csBtn i{font-size:12px}
.cursor{cursor:pointer}
.dropIcon{padding:5px 10px; cursor: pointer;}

.template_form ul.notes li{color:#666}
.head_text_area, .head_media_area, .head_media_default_area{display:none}
.button_action_area, .button_quick_area{display:none;}
.button_quick_area .append_area input{width:280px}
.template_form label.title{font-weight: 600; font-size: 14px !important}
.button_quick_area .append_area span.remove{position: absolute;left: 311px;margin-top: -32px; cursor: pointer; display: block; padding:2px 6px}
select { -webkit-appearance: menu; appearance: auto !important;}
.template_form .website_row.hide, .template_form .phone_row.hide{display:none}

.rdContainer{display:block;position:relative;padding-left:35px;margin-bottom:12px !important;cursor:pointer;font-size:16px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.rdContainer input{position:absolute;opacity:0;cursor:pointer}
.rdContainer .checkmark{position:absolute;top:0;left:0;height:25px;width:25px;background-color:#eee;border-radius:50%}
.rdContainer:hover input~.checkmark{background-color:#ccc}
.rdContainer input:checked~.checkmark{background-color:#2196f3}
.rdContainer .checkmark:after{content:"";position:absolute;display:none}
.rdContainer input:checked~.checkmark:after{display:block}
.rdContainer .checkmark:after{top:9px;left:9px;width:8px;height:8px;border-radius:50%;background:#fff}

.modal-header .btn-close{font-size:13px}
.modal-header .btn-close:focus{box-shadow:none !important; outline:none !important; border:0px solid #666 !important}

.scrollable{max-width:100%; overflow:auto;}
.scrollable table{border-collapse:collapse!important ;background: #fff;}
.scrollable thead th{position:-webkit-sticky!important;position:sticky!important;top:0!important} 
.scrollable thead th:first-child{left:0!important;z-index:1!important; border-left: 1px solid #dee2e6;  }
.scrollable thead th:last-child{left:0!important;z-index:1!important; border-left: 1px solid #dee2e6; border-right: 1px solid #dee2e6;}
.scrollable thead th{background:#f8f8f8 !important;color:#444 !important;white-space: nowrap;font-family: arial;letter-spacing: 1px;font-weight: 600;font-size: 12px!important; font-family:Roboto,sans-serif;/*text-transform: uppercase;*/ padding: 8px 10px; border-top: 2px solid #dee2e6;z-index: 2;}
.scrollable tbody th{position:-webkit-sticky!important;position:sticky!important;left:0!important}
.scrollable tbody th{background:#fff!important;border-right:1px solid #ccc!important; padding: 6px 10px !important;} 
.scrollable table td{padding: 6px 8px !important; padding-bottom: 6px !important; font-size: 14px; border: 1px solid #dee2e6; color: #495057;}

 .custom.nav-tabs{ }
 .custom.nav-tabs .nav-link{padding:5px 12px 8px 12px; border-bottom: 3px solid transparent; font-size: 14px;border:0px; color:#666; cursor: pointer; min-width: 100px;text-align: center;} 
  .custom.nav-tabs .nav-link i{margin-right: 5px}
 .custom.nav-tabs .nav-link.active{border-bottom: 3px solid var(--theme-cl); color: #000; background:transparent}

 .ld_tag_badge {color: #fff;padding: 2px 8px 2px 8px;font-size: 12px !important;border-radius: 2px;display: inline;} 
.ld_tag_badge.bclr0{border:1px solid #ccc !important;color: #444} 
.ld_tag_badge.bclr1{background: #f94839;color: #fff} 
.ld_tag_badge.bclr2{background: #08a742;color: #fff} 
.ld_tag_badge.bclr3{background: #317ae2;color: #fff}
.ld_tag_badge.bclr4{background: #fc0;color: #fff}
.ld_tag_badge.bclr5{background: #721ea9;color: #fff}
.ld_tag_badge.bclr6{background: #dcdddd;color: #fff}
.ld_tag_badge.bclr7{background: #38dac4;color: #fff}
.ld_tag_badge.bclr8{background: #f95a15;color: #fff}
.ld_tag_badge.bclr9{background: #ff33f0;color: #fff}
 
.ld_tag_badge.clr1{color: #f94839; } 
.ld_tag_badge.clr2{color: #08a742; } 
.ld_tag_badge.clr3{color: #317ae2; }
.ld_tag_badge.clr4{color: #fc0; }
.ld_tag_badge.clr5{color: #721ea9; }
.ld_tag_badge.clr6{color: #dcdddd; }
.ld_tag_badge.clr7{color: #38dac4; }
.ld_tag_badge.clr8{color: #f95a15; }
.ld_tag_badge.clr9{color: #ff33f0; }

.cs_card{padding:15px 15px 15px 15px; background:#fff; border-radius:5px; box-shadow: 0 1rem 3rem rgb(0 0 0 / 18%);}


.font10{font-size: 10px !important}
.font11{font-size: 11px !important}
.font12{font-size: 12px !important}
.font13{font-size: 13px !important}
.font14{font-size: 14px !important}
.font15{font-size: 15px !important}
.font16{font-size: 16px !important}
.font17{font-size: 17px !important}
.font18{font-size: 18px !important}
.font19{font-size: 19px !important}
.font20{font-size: 20px !important}
.font25{font-size: 25px !important}
.font30{font-size: 30px !important}
.font35{font-size: 35px !important}
.font40{font-size: 40px !important}
.br0{border-radius: 0px !important}
.br2{border-radius: 3px !important}
.br3{border-radius: 3px !important}
.br5{border-radius: 5px !important}
.br8{border-radius: 8px !important}
.br10{border-radius:10px !important}
.br20{border-radius:20px !important}
.fw400{font-weight:400 !important}
.fw500{font-weight:500 !important}
.fw600{font-weight:600 !important}
.fw700{font-weight:700 !important}
.txt_undl{text-decoration:underline;}
.switch.custom{position:relative;display:inline-block;width:50px;height:24px}
.switch.custom input{opacity:0;width:0;height:0; border:0px}
.switch.custom input:focus { border:0px !important}
.switch.custom .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}
.switch.custom .slider:before{position:absolute;content:"";height:20px;width:20px;left:2px;bottom:2px;background-color:#fff;-webkit-transition:.4s;transition:.4s}
.switch.custom input:checked+.slider{background-color:var(--theme-cl);}
.switch.custom input:focus+.slider{ }
.switch.custom input:checked+.slider:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translateX(26px)}
.switch.custom .slider.round{border-radius:34px}
.switch.custom .slider.round:before{border-radius:50%}

.sv_loder .fa-solid{display:none;}
.hide{display:none;}

.bg_moving_gradient {
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  background-size: 400% 400%;
  animation: gradient 15s ease infinite; 
}

@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/*.main-header .logo { 
  padding: 8px 6px 5px 6px;
  cursor: pointer;
  height: 50px;
  float: left; 
}
.main-header .logo img{background:#fff}*/

span.add_more{font-size:13px; color: var(--theme-cl); cursor: pointer}


::-webkit-scrollbar {
    height: 12px;
    width: 6px;
    background: #eee;
}

::-webkit-scrollbar-thumb {
    background: #ccc;
    -webkit-border-radius: 1ex;
    -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
}

::-webkit-scrollbar-corner {
    background: #eee;
}

  #dateRangefilter{font-size:13px;  min-width: 130px; height: 34px;border: 1px solid #c6c6c6 !important;padding: 6px 10px;background: #fff;cursor: pointer;border-radius: 3px;border-radius: 3px; text-align:left}

  .stock_log_pre_table td{width:200px; text-align:right; background:#fff; padding:3px 10px; border:1px solid #eee}
 
 input:read-only {
  background-color: #eee;
}