/*==================================================
Dashboard Cards
==================================================*/

.jtr-cards{

	display:grid;

	grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

	gap:25px;

	margin-bottom:30px;

}


/*==================================================
Card
==================================================*/

.jtr-card{

	position:relative;

	background:var(--jtr-white);

	border-radius:var(--jtr-radius);

	padding:25px;

	border:1px solid var(--jtr-border);

	box-shadow:var(--jtr-shadow);

	overflow:hidden;

	transition:var(--jtr-transition);

}

.jtr-card:hover{

	transform:translateY(-6px);

}


/*==================================================
Top
==================================================*/

.jtr-card-top{

	display:flex;

	align-items:center;

	justify-content:space-between;

	margin-bottom:25px;

}


/*==================================================
Icon
==================================================*/

.jtr-card-icon{

	width:60px;

	height:60px;

	border-radius:18px;

	background:rgba(217,4,41,.10);

	display:flex;

	align-items:center;

	justify-content:center;

	font-size:24px;

	color:var(--jtr-primary);

}


/*==================================================
Title
==================================================*/

.jtr-card-title{

	font-size:14px;

	color:var(--jtr-text-light);

	margin-bottom:10px;

}


/*==================================================
Amount
==================================================*/

.jtr-card-value{

	font-size:32px;

	font-weight:700;

	color:var(--jtr-text);

	line-height:1;

}


/*==================================================
Footer
==================================================*/

.jtr-card-footer{

	margin-top:25px;

	padding-top:20px;

	border-top:1px solid var(--jtr-border);

	font-size:13px;

	color:var(--jtr-text-light);

}