/**
 * Design System v2 — Tables (نسخه 1.3.0)
 *
 * بهبود .clinic-table موجود: سرستون گرادیانی، hover، راه‌راه زِبرا، نسخه‌ی فشرده،
 * و نشانگر وضعیت. RTL: text-align: right (سازگار با لایه‌ی LTR موجود در admin.css).
 *
 * @package Clinic_Manager
 */

.clinic-table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	font-size: var(--fs-sm, 14px);
}

.clinic-table thead {
	background: linear-gradient(90deg, var(--clinic-primary-50) 0%, var(--clinic-primary-100) 100%);
	border-bottom: 2px solid var(--clinic-border-color);
}

.clinic-table th {
	padding: var( --clinic-space-7 ) var( --clinic-space-8 );
	text-align: right;
	font-weight: var(--fw-semibold, 600);
	font-size: 13px;
	color: var(--clinic-text-primary);
	letter-spacing: 0.3px;
}

.clinic-table td {
	padding: var( --clinic-space-7 ) var( --clinic-space-8 );
	color: var(--clinic-text-primary);
	vertical-align: middle;
}

.clinic-table tbody tr {
	border-bottom: 1px solid var(--clinic-border-light);
	transition: background-color 0.2s ease;
}

/* راه‌راه زِبرا */
.clinic-table tbody tr:nth-child(odd) {
	background: var(--clinic-bg-secondary);
}

.clinic-table tbody tr:hover {
	background: var(--clinic-primary-50);
}

.clinic-table tbody tr:last-child {
	border-bottom: none;
}

/* فشرده */
.clinic-table--compact th,
.clinic-table--compact td {
	padding: var( --clinic-space-5 ) var( --clinic-space-6 );
	font-size: 13px;
}

/* نشانگر وضعیت درون سلول */
.clinic-table-status {
	display: inline-flex;
	align-items: center;
	gap: var( --clinic-space-3 );
}
.clinic-table-status-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	flex: 0 0 auto;
}
.clinic-table-status-dot.success { background: var(--clinic-success); }
.clinic-table-status-dot.warning { background: var(--clinic-warning); }
.clinic-table-status-dot.error { background: var(--clinic-error); }
.clinic-table-status-dot.info { background: var(--clinic-info); }

/* ════════════════════════════════════════════════════════════════════
 * STEP 155 — لایه‌بندیِ بُعدیِ جدول‌ها.
 * جدول به‌صورتِ یک «سطحِ برجسته‌ی گرد» روی پس‌زمینه می‌نشیند (عمقِ flat — ظریف، تا
 * اگر داخلِ کارت هم بود سنگین نشود)؛ سرستون یک باندِ بالاتر با سایه‌ی زیرین است؛ ردیف
 * هنگامِ hover با نوارِ لهجه‌ی برند (سمتِ شروع، RTL-aware) «بالا» دیده می‌شود.
 * ════════════════════════════════════════════════════════════════════ */
.clinic-table {
	box-shadow: var(--clinic-elev-flat, var(--clinic-shadow-xs));
	border-radius: var(--radius-lg, 12px);
	overflow: hidden;
	background: var(--clinic-bg-primary);
}
.clinic-table thead {
	box-shadow: 0 2px 4px rgba(var(--clinic-elev-shadow-color, 31, 21, 53), 0.08);
	position: relative;
	z-index: var(--clinic-z-base, 1);
}
.clinic-table tbody tr {
	transition: background-color 0.2s ease, box-shadow 0.2s ease;
}
/* نوارِ لهجه‌ی سمتِ شروع (راست در RTL) هنگامِ hover/فعال — نشانه‌ی بُعدیِ ردیفِ فعال.
 * STEP 161 — رفعِ باگ: لهجه فقط روی **سلولِ شروعِ** ردیف (`td:first-child`) می‌نشیند، نه
 * روی همه‌ی سلول‌ها؛ پیش‌تر `... tr:hover td` به هر `td` یک نوارِ ۳px روی لبه‌ی داخلی
 * می‌داد ⇒ خطوطِ عمودیِ پراکنده روی همه‌ی ستون‌های ردیف (به‌جای یک نوارِ تمیزِ شروع).
 * فقط ردیفِ hover/فعال؛ پس‌زمینه‌ی hover (قاعده‌ی جدا) دست‌نخورده. RTL-safe. */
.clinic-table tbody tr:hover td:first-child,
.clinic-table tbody tr.is-active td:first-child,
.clinic-table tbody tr.is-selected td:first-child,
.clinic-table tbody tr[aria-selected="true"] td:first-child {
	box-shadow: inset -3px 0 0 0 var(--clinic-primary-400, #A684FF);
}
body.clinic-ltr .clinic-table tbody tr:hover td:first-child,
body.clinic-ltr .clinic-table tbody tr.is-active td:first-child,
body.clinic-ltr .clinic-table tbody tr.is-selected td:first-child,
body.clinic-ltr .clinic-table tbody tr[aria-selected="true"] td:first-child {
	box-shadow: inset 3px 0 0 0 var(--clinic-primary-400, #A684FF);
}