/**
 * تقويم تفعيل الحضور
 * (جزء من المكونات المركزية: تُحمّل كلها عبر المقبض tnt-components)
 */

.tnt .tnt-days { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 12px; }

/* بطاقة اليوم: كل المحتوى في الوسط والزر في أسفلها بعرضها الكامل */
.tnt .tnt-day {
	position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 2px;
	padding: 14px 10px 10px; border-radius: 14px; background: var(--tnt-surface); border: 1.5px solid var(--tnt-border);
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.tnt .tnt-day:hover { transform: translateY(-2px); box-shadow: var(--tnt-shadow-sm); }
.tnt .tnt-day__date { font-size: 16px; font-weight: 800; color: var(--tnt-navy-900); }
.tnt .tnt-day__name { font-size: 12.5px; color: var(--tnt-muted); }
.tnt .tnt-day__state {
	display: inline-flex; align-items: center; gap: 5px; margin: 6px 0 10px; padding: 2px 10px; border-radius: 99px;
	font-size: 11.5px; font-weight: 700; background: var(--tnt-surface-2); color: var(--tnt-muted);
}
.tnt .tnt-day__state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.tnt .tnt-day__action { width: 100%; margin-top: auto; }
.tnt .tnt-day__action form, .tnt .tnt-day__action .tnt-inline-form { display: block; width: 100%; }
.tnt .tnt-day__action .tnt-btn { width: 100%; justify-content: center; }
.tnt .tnt-day__flag { position: absolute; top: -9px; left: 50%; transform: translateX(-50%); font-style: normal; font-size: 11px; font-weight: 800; background: var(--tnt-gold); color: var(--tnt-gold-ink); padding: 1px 10px; border-radius: 99px; }

/* مفعّل: إطار وخلفية خضراء وشارة "مفعّل" */
.tnt .tnt-day.is-active { border-color: var(--tnt-success); background: linear-gradient(180deg, var(--tnt-success-50), var(--tnt-surface)); }
.tnt .tnt-day.is-active .tnt-day__state { background: rgba(var(--tnt-success-rgb), .12); color: var(--tnt-success); }
/* اليوم: إطار ذهبي */
.tnt .tnt-day.is-today { border-color: var(--tnt-gold); box-shadow: 0 0 0 3px var(--tnt-gold-50); }
.tnt .tnt-day.is-today.is-active { border-color: var(--tnt-success); box-shadow: 0 0 0 3px var(--tnt-gold-50); }
/* الأيام الماضية غير المفعّلة أخف قليلاً */
.tnt .tnt-day.is-past:not(.is-active) { background: var(--tnt-surface-2); }
.tnt .tnt-day.is-past:not(.is-active) .tnt-day__date { color: var(--tnt-text-2); }
.tnt .tnt-seats { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--tnt-muted); margin-bottom: 6px; }


/* أزرار أيام التدريب المتاحة للتحضير (templates/partials/attendance-dates.php) */
.tnt .tnt-day-links { display: flex; flex-wrap: wrap; gap: 10px; }
.tnt .tnt-day-link {
	display: grid; justify-items: center; gap: 2px; min-width: 112px; padding: 10px 14px; border-radius: 12px; text-decoration: none;
	background: var(--tnt-surface); border: 1.5px solid var(--tnt-border); color: var(--tnt-text); position: relative;
	transition: border-color .15s, background .15s, transform .15s, box-shadow .15s;
}
.tnt .tnt-day-link span { font-size: 12.5px; color: var(--tnt-muted); font-weight: 600; }
.tnt .tnt-day-link strong { font-size: 14px; color: var(--tnt-navy-900); }
.tnt .tnt-day-link em { position: absolute; top: -9px; inset-inline-end: 10px; font-style: normal; font-size: 11px; font-weight: 700; background: var(--tnt-gold); color: var(--tnt-gold-ink); padding: 1px 8px; border-radius: 99px; }
.tnt .tnt-day-link:hover { border-color: var(--tnt-gold); background: var(--tnt-gold-50); transform: translateY(-2px); box-shadow: var(--tnt-shadow-sm); }
.tnt .tnt-day-link.is-today { border-color: var(--tnt-gold); }
.tnt .tnt-day-link small { font-size: 11px; color: var(--tnt-gold-600); font-weight: 700; }
.tnt .tnt-day-link__state { font-size: 11.5px; font-weight: 600; color: var(--tnt-muted); margin-top: 2px; }
.tnt .tnt-day-link__state.is-count { color: var(--tnt-success); }
/* الأيام القادمة: تظهر للعلم بدون إمكانية فتحها */
.tnt .tnt-day-link.is-upcoming { background: var(--tnt-surface-2); border-style: dashed; cursor: default; opacity: .75; }
.tnt .tnt-day-link.is-upcoming:hover { transform: none; box-shadow: none; border-color: var(--tnt-border); background: var(--tnt-surface-2); }