/*==================================================
J-Tech Responsive
Version:1.0.0
==================================================*/


/*==================================================
Large Tablets
==================================================*/

@media (max-width:1200px){

	.jtr-dashboard{

		padding:20px;

	}

}


/*==================================================
Tablet
==================================================*/

@media (max-width:992px){

	.jtr-header{

		flex-direction:column;

		align-items:flex-start;

	}

	.jtr-header-right{

		width:100%;

		text-align:left;

	}

	.jtr-cards{

		grid-template-columns:repeat(2,1fr);

	}

	.jtr-actions{

		grid-template-columns:1fr;

	}

}


/*==================================================
Mobile
==================================================*/

@media (max-width:768px){

	.jtr-dashboard{

		padding:15px;

	}

	.jtr-header{

		padding:20px;

	}

	.jtr-header-left{

		flex-direction:column;

		text-align:center;

		width:100%;

	}

	.jtr-user{

		width:100%;

	}

	.jtr-avatar{

		margin:auto;

	}

	.jtr-dashboard-progress{

		padding:20px;

	}

	.jtr-dashboard-progress-header{

		flex-direction:column;

		align-items:flex-start;

		gap:10px;

	}

	.jtr-dashboard-progress-footer{

		flex-direction:column;

		gap:8px;

	}

	.jtr-cards{

		grid-template-columns:1fr;

	}

	.jtr-card{

		padding:20px;

	}

	.jtr-card-top{

		flex-direction:column;

		align-items:flex-start;

		gap:15px;

	}

	.jtr-card-icon{

		width:55px;

		height:55px;

	}

	.jtr-actions{

		grid-template-columns:1fr;

	}

	.jtr-action-card{

		padding:20px;

	}

	.jtr-promo-box{

		flex-direction:column;

	}

	.jtr-promo-box input{

		width:100%;

	}

	.jtr-btn{

		width:100%;

	}

	.jtr-percent-buttons{

		grid-template-columns:repeat(2,1fr);

	}

}


/*==================================================
Small Mobile
==================================================*/

@media (max-width:480px){

	.jtr-section-header{

		flex-direction:column;

		align-items:flex-start;

		gap:10px;

	}

	.jtr-table{

		min-width:650px;

	}

	.jtr-empty-state{

		padding:40px 15px;

	}

}