/* ── Absence Calendar ────────────────────────────────────────
   Monthly Mon–Fri calendar grid showing absence entries
   with per-entry color theming via CSS custom properties.
   ─────────────────────────────────────────────────────────── */

.ac-board {
	margin-top: 24px;
	background: var(--card);
	border: 1px solid var(--border);
	border-radius: var(--radius-lg);
	padding: 26px 28px;
	box-shadow: var(--shadow-md);
}

.ac-board__header {
	margin-bottom: 20px;
}

.ac-calendar {
	display: grid;
	grid-template-columns: repeat(5, 1fr); /* overridden via inline style */
	border: 1px solid var(--blue-100);
	border-radius: 12px;
	overflow: hidden;
}

/* ── Column headers ── */

.ac-col-header {
	background: #f8fafc;
	border-right: 1px solid var(--blue-100);
	border-bottom: 2px solid var(--blue-200);
	padding: 9px 4px;
	text-align: center;
	font-size: 11px;
	font-weight: 600;
	color: #64748b;
	letter-spacing: 0.06em;
}

.ac-col-header:last-child {
	border-right: none;
}

/* ── Day cells ── */

.ac-day {
	background: #ffffff;
	border-right: 1px solid var(--blue-100);
	border-bottom: 1px solid var(--blue-100);
	padding: 10px;
	min-height: 100px;
	vertical-align: top;
}

/* Last column border override is applied via inline <style> in the view
   to support a dynamic work-day column count. */

.ac-day--other-month {
	background: #fafbfc;
}

.ac-day--other-month .ac-day__num {
	color: #cbd5e1;
}

/* ── Day number ── */

.ac-day__num {
	font-size: 13px;
	font-weight: 600;
	color: #334155;
	margin-bottom: 7px;
	width: 26px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
}

.ac-day--today .ac-day__num {
	background: var(--blue-600);
	color: #ffffff;
}

/* ── Absence entries ── */

.ac-entry {
	display: flex;
	align-items: baseline;
	gap: 4px;
	padding: 3px 7px;
	border-radius: 5px;
	margin-bottom: 4px;
	background: var(--entry-bg, #f1f5f9);
	overflow: hidden;
}

.ac-entry__name {
	font-size: 11px;
	font-weight: 600;
	color: var(--entry-accent, #334155);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	flex-shrink: 1;
	min-width: 0;
}

.ac-entry__divider {
	font-size: 10px;
	color: var(--entry-accent, #64748b);
	opacity: 0.5;
	flex-shrink: 0;
}

.ac-entry__type {
	font-size: 10px;
	color: var(--entry-accent, #64748b);
	opacity: 0.75;
	white-space: nowrap;
	flex-shrink: 0;
}

.ac-overflow {
	font-size: 11px;
	color: #94a3b8;
	padding: 2px 4px;
	font-weight: 500;
}