/******************************************************************************************************************************************************
******************************************************************************************************************************************************

																5.5 - Counter	 	 
																		
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/ 
 
/*-------------------------------------------------------- Progress Bar -----------------------------------------------------------*/

.vb-progress {
	float: inline-start;
	width: 100%;
	--bar-ht:var(--vb-bar-ht,2.5em);
  	--bar-wp-bg: var(--vb-bar-wp-bg,var(--vb-global-gry-bg));
	--bar-wp-br-wt: var(--vb-bar-wp-br-wt,0px);
	--bar-wp-br-cr: var(--vb-bar-wp-br-cr,var(--vb-global-br-cr));
	--bar-wp-br-st: var(--vb-bar-wp-br-st,solid);
	--bar-wp-sd: var(--vb-bar-wp-sd,none);
	--bar-wp-rd: var(--vb-bar-wp-rd,var(--vb-global-rd));
	
 	--bar-bg: var(--vb-bar-bg,var(--vb-global-primary-bg));
 	--bar-rd:var(--vb-bar-rd,var(--vb-global-rd));	
 	--bar-dr:var(--vb-bar-dr,2000ms);
 	--bar-pr:var(--vb-bar-pr,50%);
 	--br-sp :var(--vb-bar-sp,10px);
}

.vb-progress-item-main {
	float: inline-start;
	margin-top: 0px;
	width: 100%;
	position: relative;
	
 
 
}
 

.vb-progress-title-wrap {
float: inline-start;
  width: 100%;
  margin: 0 0 0px !important;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap:10px;
  align-items: center;
}

.vb-progress-title-wrap > .vb-tl-title {
 
--tl-fn-sz: var(--vb-tl-fn-sz,var(--vb-h4-fn-sz)) !important;
--tl-li-ht: 1.1em !important;
--tl-fn-wt:400 !important;
}

.vb-progress-title-wrap > .vb-txt-number {
 
--txt-fn-sz: var(--vb-tl-fn-sz,var(--vb-h4-fn-sz)) !important;
--txt-li-ht: 1.1em !important;
--txt-fn-wt:400 !important;
}

.vb-bar-wrap {
	position: relative;
	width: 100%;
	float: inline-start;
	overflow: hidden;
	background: var(--bar-wp-bg) !important;
	border-width: var(--bar-wp-br-wt) !important;
	border-color: var(--bar-wp-br-cr) !important;
	border-style: var(--bar-wp-br-st) !important;
	box-shadow: var(--bar-wp-sd) !important;
	border-radius: var(--bar-wp-rd) !important;
}
.vb-progress-bar-style-1 .vb-bar-wrap{
	margin:var(--br-sp) 0px 0px 0px !important;
}
.vb-progress-bar {
	overflow: hidden;
	position: relative;
	width: 0%!important;
	height: var(--bar-ht)!important;
	float: inline-start;
	background: var(--bar-bg)!important;
	border-radius: var(--bar-rd)!important;
	transition-property: width!important;
	transition-duration: var(--bar-dr)!important;
}

[class*="vb-progress-item-"].animated .vb-progress-bar {
	overflow: hidden;
	position: relative;
	width: var(--bar-pr) !important;
	transition-property: width;
	transition-duration:var(--bar-dr)!important;
}
.vb-progress:is(.vb-progress-bar-style-2,.vb-progress-bar-style-3) .vb-progress-title-wrap {
	position: absolute;
 	width: 100%;
 	height: 100%;
	inset-inline-start: 0px;
	top: 0px;
	z-index: 1;
	padding: 0 1em;
}
.vb-progress:is(.vb-progress-bar-style-2,.vb-progress-bar-style-3) .vb-tl-title,
.vb-progress.vb-progress-bar-style-3 .vb-txt-number  {
	--tl-cr: var(--vb-tl-cr,var(--vb-global-primary-cr)) !important;
	--txt-cr: var(--vb-num-cr,var(--vb-global-primary-cr)) !important;
}
.vb-progress.vb-progress-bar-style-3 .vb-progress-title-wrap {
  justify-content: start;
}
.vb-progress-bar-style-3 .vb-tl-title::after {
	content: ":";
  float: inline-end;
  
}

 
 
/*--------------------------------------------------------  Pie Chart -----------------------------------------------------------*/
 
.vb-chart-wrap {
	 display:flex!important;
	 float:inline-start!important;
	 width:100% !important;
	 justify-content:var(--vb-cht-ag,center)!important;
 	text-align:var(--vb-cht-ag,center)!important;
	flex-wrap:wrap!important;
}
 
 
.vb-chart {
	--cht-sz:var(--vb-cht-sz,5em);
 	--cht-bg:var(--vb-cht-bg,none);
 	--cht-br-wt:var(--vb-cht-br-wt,0px);
	--cht-br-cr:var(--vb-cht-br-br,var(--vb-global-br-cr));
	--cht-br-st:var(--vb-cht-br-st,solid);
	--cht-out-sd:var(--vb-cht-out-sd,initial);
	--cht-in-sd:var(--vb-cht-in-sd,initial);
	
	--cht-bar-sz:var(--vb-cht-bar-sz,10px);
	--cht-tr-cr:var(--vb-cht-tr-cr,rgba(138,148,158,0.15));
	font-size: var(--vb-num-fn-sz,var(--vb-h1-fn-sz))!important;
  	vertical-align: top!important;
  	display:flex !important;
	width:fit-content !important;
	justify-content: center !important;
	align-items: center!important;
	flex-wrap: wrap!important;
	border-width: var(--cht-br-wt)!important;
	border-color: var(--vb-cht-br-cr)!important;
	border-style: var(--vb-cht-br-st)!important;
	box-shadow: var(--vb-cht-out-sd)!important;
	position: relative!important;
	border-radius: 50%!important;
}
.vb-chart > .vb-txt-number  {
	position: absolute!important;
	inset-inline-start: 50%!important;
	z-index:3!important;
	top: 50%!important;
	--txt-fn-sz: var(--vb-num-fn-sz, var(--vb-h1-fn-sz))!important;
	--txt-fn-fw: var(--vb-num-fn-wt, 400)!important;
	 transform: translate(-50%,-50%)!important;
}
.rtl .vb-chart > .vb-txt-number {
		 transform: translate(50%,-50%)!important;
}
.vb-chart-data{
	display:none !important;	
}
.vb-chart::before {
	content: "";
	position:relative !important;
  	border-radius: 50%;
 	border-width: var(--cht-bar-sz)!important;
	border-style: solid;
	border-color: var(--cht-tr-cr)!important;
	box-shadow: var(--cht-in-sd) inset!important;
	width:var(--cht-sz) !important;
	height:var(--cht-sz) !important;
 	z-index:0;
	pointer-events: none;
	box-sizing: border-box;
}
 
.vb-chart canvas,
.vb-chart .vb-canvas{
	z-index:2;	
}
.vb-chart canvas,
.vb-chart .vb-canvas,
.vb-chart .vb-chart-cover {
 	transform: rotate(90deg);
	border-radius: 50%;
	position:absolute !important;
	top: 0px;
	inset-inline-start: 0;
 	width:var(--cht-sz) !important;
	height:var(--cht-sz) !important;
	vertical-align: top;
 	box-sizing: border-box;

}
.vb-chart .vb-chart-cover{
	 z-index: -1;
	content:"";
	background: var(--cht-bg)!important;
}
/*-------------------------------------------------------- Counter -----------------------------------------------------------*/
  
 
body .vb-counter {
	float: inline-start;
	width: 100%;
}

.vb-post-counter {
  	--post-ag: var(--vb-ag,center)!important;
	--dt-ag: var(--vb-ag,center)!important;
	--dt-sp: var(--vb-tl-sp,var(--vb-sp-m))!important;
}
 
.vb-counter-data{
	display:none !important;	
}
 .vb-counter-number .vb-txt-number{
	--txt-fn-sz: var(--vb-num-fn-sz,calc(var(--vb-h1-fn-sz) * 2))!important;
	--txt-fn-wt: var(--vb-num-fn-wt,var(--vb-h1-fn-wt))!important;
	--txt-li-ht: var(--vb-num-li-ht,1.1em)!important;
}
body .vb-txt-number {
 
  	--txt-cr:var(--vb-num-cr,var(--vb-global-tl-cr))!important;
  	--txt-bg-img: var(--vb-num-bg-img,initial) !important;
	--txt-bg-clip: var(--vb-num-bg-clip,initial) !important;
	--txt-txt-fl: var(--vb-num-txt-fl,initial) !important;
	--txt-txt-st: var(--vb-num-txt-st,none) !important;
 	--txt-txt-sd:var(--vb-num-txt-sd,none)!important;
	
 
	
	--txt-fn-sz: var(--vb-num-fn-sz,var(--vb-p-fn-sz));
  	--txt-fn-fm:var(--vb-num-fn-fm,inherit);
 	--txt-fn-wt: var(--vb-num-fn-wt,var(--vb-p-fn-wt))!important;
	--txt-li-ht: var(--vb-num-li-ht,var(--vb-p-li-ht))!important;
 	--txt-txt-dec: var(--vb-num-txt-dec,none)!important;
	--txt-txt-tf: var(--vb-num-txt-tf,none)!important;
	--txt-lt-sp: var(--vb-num-lt-sp,none)!important;
	--txt-wd-sp: var(--vb-num-wd-sp,none)!important;
	--txt-fn-st: var(--vb-num-fn-st,none)!important;
}