/* ============ سجل الساعات ============ */
.ts-week { display: flex; align-items: center; gap: 10px; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 4px; box-shadow: var(--shadow); }
.ts-week .icon-btn { width: 32px; height: 32px; border: 0; background: none; }
.ts-week .icon-btn:hover:not(:disabled) { background: var(--surface-2); }
.ts-week .icon-btn:disabled { opacity: .35; cursor: not-allowed; }
.ts-week-label { display: flex; flex-direction: column; align-items: center; line-height: 1.3; padding-inline: 6px; min-width: 150px; text-align: center; }
.ts-week-label b { font-size: 13.5px; }
.ts-week-label span { font-size: 11.5px; }
/* زر الأسبوع السابق يشير لبداية السطر في الاتجاهين */
.ts-prev .ic-chev { transform: scaleX(-1); }
[dir="ltr"] .ts-prev .ic-chev { transform: none; }

.ts-head { flex-wrap: wrap; }
.ts-cap { min-width: 200px; flex: 0 1 260px; }

.ts-grid th, .ts-grid td { padding: 8px 6px; }
.ts-grid th:first-child, .ts-grid td:first-child { padding-inline-start: 18px; }
.ts-grid th:last-child, .ts-grid td:last-child { padding-inline-end: 14px; }
.ts-grid .ts-col { text-align: center; }
.ts-grid th .cell-sub { display: block; font-weight: 500; font-size: 11px; }
.ts-proj { min-width: 210px; }
.ts-h { width: 58px; padding: 6px 4px; text-align: center; font-weight: 600; -moz-appearance: textfield; appearance: textfield; }
.ts-h::-webkit-outer-spin-button, .ts-h::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ts-h:disabled { background: transparent; border-color: transparent; color: var(--text); cursor: default; }
.ts-h::placeholder { color: var(--faint); font-weight: 400; }

/* العطلة الأسبوعية (الجمعة والسبت) مظللة */
.ts-grid .ts-off { background: var(--surface-2); color: var(--faint); }
.ts-grid td.ts-off .ts-h:not(:disabled) { background: var(--surface-2); }
.ts-grid th.ts-today { color: var(--primary); box-shadow: inset 0 -2px 0 var(--primary); }
.ts-grid tfoot td { background: var(--surface-2); font-weight: 700; border-top: 1px solid var(--border); border-bottom: 0; }
.ts-grid tfoot td.ts-over { color: var(--warn); }
.ts-grid .ts-wt { color: var(--primary); font-size: 15px; }
.ts-del { width: 30px; height: 30px; border: 0; background: none; }
.ts-del:hover { color: var(--bad); background: var(--bad-soft); }
.ts-mini th, .ts-mini td { padding: 7px 6px; font-size: 12.5px; }

.banner.ts-bad { background: var(--bad-soft); color: var(--bad); }
.flow-step.ts-step-bad { background: var(--bad); color: var(--surface); }

@media (max-width: 640px) {
  .ts-week { flex: 1; justify-content: space-between; }
  .ts-cap { flex: 1 1 100%; min-width: 0; }
}