/* === workbook.css ===
	Card base logic and specific identity modifiers (Workbook, Knowledge Base)
*/

/* --- [BASE] Global Content Card Utility --- */
.u-content-card {
	display: flex;
	align-items: flex-start;
	padding: var(--button-padding-y) var(--button-padding-x);
	gap: var(--size-4-3);
	min-height: var(--size-4-10);
	background: transparent;
	border-radius: 0;
	cursor: pointer;
	transition: opacity 0.1s ease, background-color 0.1s ease;
	border-bottom: var(--divider-width) solid var(--divider-color);
}

.u-content-card:hover {
	background-color: var(--interactive-accent);
	color: var(--text-on-accent);
	opacity: 1;
}

/* Hover effects for children (titles and icons) */
.u-content-card:hover .workbook-title,
.u-content-card:hover .workbook-done-btn i,
.u-content-card:hover .workbook-done-btn svg {
	color: var(--text-on-accent);
}

/* --- [MODIFIER] Workbook Identity --- */
.u-content-card.is-workbook {
	color: var(--text-color);
}

.u-content-card.is-workbook.is-done {
	opacity: 0.5;
}

.u-content-card.is-workbook.is-done .workbook-title {
	color: var(--text-muted);
}

/* --- [MODIFIER] Knowledge Base Identity --- */
.u-content-card.is-kb {
	color: var(--text-color);
}

/* --- Workbook Done Button (Status Toggle) --- */
.workbook-done-btn {
	width: auto;
	padding: 0;
	margin: 0;
	background: transparent;
	border: none;
	flex-shrink: 0;
	cursor: pointer;
}

.workbook-done-btn i,
.workbook-done-btn svg {
	width: var(--icon-l);
	height: var(--icon-l);
	color: var(--checkbox-border-color);
	transition: color 0.1s ease;
}

/* Specific status for Done Button */
.u-content-card.is-workbook.is-done .workbook-done-btn i,
.u-content-card.is-workbook.is-done .workbook-done-btn svg,
.workbook-done-btn.is-done i,
.workbook-done-btn.is-done svg {
	color: var(--checkbox-color);
}

.workbook-done-btn:hover i,
.workbook-done-btn:hover svg {
	color: var(--checkbox-color-hover);
}

/* --- Workbook Content Header (Detail View) --- */
.workbook-content-header {
	display: flex;
	flex-direction: row;
	align-items: center;
	margin-bottom: var(--size-4-6);
	gap: var(--size-4-6);
}

.workbook-header-info {
	flex: 1;
	display: flex;
	align-items: center;
	gap: var(--size-4-3);
}

.workbook-header-info h1 {
	margin: 0;
	padding: 0;
	font-size: var(--h1-size);
	line-height: 1.2;
}

.category-badge {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: var(--text-muted);
}

/* --- Headers (Weeks) --- */
.workbook-week-header {
	margin-top: var(--size-4-8);
	margin-bottom: var(--size-4-1);
	padding: 0 var(--button-padding-x);
	color: var(--text-muted);
	font-size: var(--font-ui-small);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.036rem;
}

.workbook-week-header:first-of-type {
	margin-top: var(--size-4-2);
}