/* ── DocumentCard ──────────────────────────────────────────────────── */
.doc-preview-image {
	cursor: zoom-in;
	max-height: 240px;
	width: 100%;
	object-fit: contain;
}

.doc-placeholder-image {
	max-height: 240px;
	width: 100%;
	object-fit: contain;
}

.doc-empty-box {
	min-height: 200px;
}

.doc-empty-icon {
	font-size: 3rem;
}

.doc-expiry-input {
	color: var(--color-text);
	background-color: var(--color-bg-elevated);
}

.doc-lightbox-overlay {
	background: rgba(0, 0, 0, 0.8);
	z-index: var(--z-modal);
}

.doc-lightbox-inner {
	max-width: 90vw;
	max-height: 90vh;
}

.doc-lightbox-image {
	max-width: 85vw;
	max-height: 85vh;
	object-fit: contain;
}

/* ── Avatar circle ─────────────────────────────────────────────────── */
.avatar-circle {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
}

.avatar-circle-placeholder {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--color-primary);
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
}

/* ── CheckInPage shift card status borders ─────────────────────────── */
.shift-card-checked-out {
	border-left: 4px solid var(--color-info) !important;
}

.shift-card-checked-in {
	border-left: 4px solid var(--color-success) !important;
}

.shift-card-pre-checked-in {
	border-left: 4px solid var(--color-warning) !important;
}

.shift-card-upcoming {
	border-left: 4px solid var(--color-primary) !important;
}

/* ── CheckInPage w3w icon / monospace link ─────────────────────────── */
.link-w3w {
	font-family: monospace;
	text-decoration: none;
}

/* ── w3w icon ──────────────────────────────────────────────────────── */
.icon-w3w {
	color: var(--color-w3w);
}

.input-group-w3w {
	background-color: var(--color-bg-subtle);
	color: var(--color-text-muted);
}

.alert-info-w3w {
	background-color: rgba(84, 128, 192, 0.1);
	color: var(--color-primary);
	border-color: rgba(84, 128, 192, 0.3);
}


/* ── Badge variants ────────────────────────────────────────────────── */
.badge-awaiting-confirmation {
	background-color: var(--color-badge-awaiting);
	color: white;
}

/* ── Tag group heading ─────────────────────────────────────────────── */
.tag-group-heading {
	font-weight: bold;
	font-size: 1.1rem;
}

/* ── Search/filter inputs with max-width constraints ───────────────── */
.input-search-employee {
	max-width: 320px;
}

.input-search-event {
	max-width: 280px;
}

.input-date-filter {
	max-width: 170px;
}

.select-office-filter {
	max-width: 220px;
}

.select-office-filter-sm {
	min-width: 220px;
}

.input-search-employee-events {
	max-width: 300px;
}

.select-events-office {
	min-width: 220px;
}

.select-manager-office {
	min-width: 220px;
}

/* ── Spin utility ──────────────────────────────────────────────────── */
.spin {
	animation: spin 1s linear infinite;
}

@keyframes pulse-opacity {
	0%, 100% { opacity: 1; }
	50% { opacity: 0.5; }
}