/* =========================================================
   وضعیت درخواست سرویس
========================================================= */

.ersc-service-status {
	display: inline-block;
	padding: 6px 12px;
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.4;
	white-space: nowrap;
}

.ersc-status-registered {
	background: #e8f1ff;
	color: #1558b0;
}

.ersc-status-waiting {
	background: #fff3dd;
	color: #a85d00;
}

.ersc-status-processing {
	background: #f1eaff;
	color: #6d35b5;
}

.ersc-status-completed {
	background: #e6f7ec;
	color: #187a3d;
}

.ersc-status-cancelled {
	background: #ffe8e8;
	color: #b42323;
}


/* =========================================================
   لیست کارت های درخواست سرویس
========================================================= */

.ersc-customer-services {
	display: flex;
	flex-wrap: wrap;
	margin: 20px -10px 35px -10px;
}


/* =========================================================
   کارت درخواست سرویس
========================================================= */

.ersc-service-item {
	width: calc(33.333% - 20px);
	box-sizing: border-box;
	margin: 0 10px 20px 10px;
	background: #ffffff;
	border: 1px solid #e8e8e8;
	border-radius: 18px;
	padding: 22px;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
	transition: all 0.25s ease;
}

.ersc-service-item:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 40px rgba(0, 0, 0, 0.10);
	border-color: #d5d5d5;
}


/* =========================================================
   اطلاعات داخل کارت
========================================================= */

.ersc-service-item p {
	margin: 0;
	padding: 9px 0;
	font-size: 14px;
	line-height: 1.8;
	color: #475569;
	border-bottom: 1px dashed #eeeeee;
}

.ersc-service-item p:last-child {
	border-bottom: none;
	padding-bottom: 0;
}

.ersc-service-item strong {
	color: #0f172a;
	font-weight: 700;
}


/* =========================================================
   تبلت
========================================================= */

@media screen and (max-width: 1024px) {

	.ersc-service-item {
		width: calc(50% - 20px);
	}

}


/* =========================================================
   موبایل
========================================================= */

@media screen and (max-width: 767px) {

	.ersc-customer-services {
		margin: 15px 0 30px 0;
	}

	.ersc-service-item {
		width: 100%;
		margin: 0 0 15px 0;
		padding: 18px;
		border-radius: 15px;
	}

}