/* Migrated to the canonical ArtBuild dark theme — Stage 20 Doc 18/27.
   Previously a fully independent light theme with a teal (#0f766e)
   primary color and zero design-token usage; every value below maps
   1:1 onto the same selectors PHP already renders, only colors change. */

.abc-knowledge {
	color: var(--abc-text);
	font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	max-width: 1120px;
	margin: 0 auto;
	padding: 32px 20px;
}

.abc-knowledge * { box-sizing: border-box; }

.abc-knowledge a { color: inherit; }

.abc-knowledge-hero {
	display: flex;
	justify-content: space-between;
	gap: 24px;
	align-items: flex-end;
	margin-bottom: 24px;
	border-bottom: 1px solid var(--abc-border-2);
	padding-bottom: 22px;
}

.abc-knowledge-hero span,
.abc-knowledge-card__meta span {
	color: var(--abc-muted);
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
}

.abc-knowledge h1 { font-size: 34px; line-height: 1.15; margin: 6px 0 8px; color: var(--abc-text); }
.abc-knowledge h2 { font-size: 20px; margin: 0 0 10px; color: var(--abc-text); }
.abc-knowledge p  { color: var(--abc-muted); line-height: 1.65; }

.abc-knowledge-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.abc-knowledge-btn,
.abc-knowledge-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 16px;
	border-radius: var(--abc-radius-sm);
	border: 1px solid var(--abc-orange);
	background: var(--abc-orange);
	color: #fff !important;
	font-weight: 700;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--abc-speed), border-color var(--abc-speed);
}

.abc-knowledge-btn:hover,
.abc-knowledge-link:hover {
	background: var(--abc-orange-2);
	border-color: var(--abc-orange-2);
}

.abc-knowledge-btn--ghost {
	background: transparent;
	color: var(--abc-orange) !important;
}

.abc-knowledge-search {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 220px auto;
	gap: 10px;
	margin: 22px 0;
}

.abc-knowledge input,
.abc-knowledge select,
.abc-knowledge textarea {
	width: 100%;
	border: 1px solid var(--abc-border-2);
	border-radius: var(--abc-radius-sm);
	background: rgba(18, 23, 36, .5);
	color: var(--abc-text);
	padding: 11px 12px;
	font: inherit;
}

.abc-knowledge-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

.abc-knowledge-card,
.abc-knowledge-row,
.abc-knowledge-empty,
.abc-knowledge-form {
	border: 1px solid var(--abc-border);
	border-radius: var(--abc-radius);
	background: var(--abc-card);
	padding: 18px;
}

.abc-knowledge-card__meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }

.abc-knowledge-single header { margin-bottom: 22px; }
.abc-knowledge-lead { font-size: 18px; color: var(--abc-text); }

.abc-knowledge-content { border-top: 1px solid var(--abc-border-2); padding-top: 22px; }
.abc-knowledge-content h2,
.abc-knowledge-content h3 { margin-top: 28px; color: var(--abc-text); }

.abc-knowledge-form { display: grid; gap: 16px; }
.abc-knowledge-form label,
.abc-knowledge-form fieldset { display: grid; gap: 7px; }

.abc-knowledge-checks { display: flex; gap: 12px; flex-wrap: wrap; }
.abc-knowledge-checks label { display: inline-flex; align-items: center; gap: 6px; }
.abc-knowledge-checks input { width: auto; }

.abc-knowledge-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	align-items: center;
	margin-bottom: 10px;
}

.abc-knowledge-row span { display: block; color: var(--abc-muted); font-size: 13px; margin-top: 4px; }
.abc-knowledge-row nav { display: flex; gap: 10px; }

.abc-knowledge-pagination {
	display: flex;
	gap: 8px;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 22px;
}

.abc-knowledge-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	min-height: 38px;
	border: 1px solid var(--abc-border-2);
	border-radius: var(--abc-radius-sm);
	padding: 0 12px;
	text-decoration: none;
	color: var(--abc-text);
}

.abc-knowledge-pagination .current {
	background: var(--abc-orange);
	border-color: var(--abc-orange);
	color: #fff;
}

.abc-knowledge-notice {
	border-radius: var(--abc-radius-sm);
	padding: 12px 14px;
	margin-bottom: 14px;
	background: rgba(34, 197, 94, .10);
	border: 1px solid rgba(34, 197, 94, .35);
	color: var(--abc-green);
}

.abc-knowledge-notice--error {
	background: rgba(239, 68, 68, .10);
	border-color: rgba(239, 68, 68, .35);
	color: var(--abc-red);
}

.abc-knowledge-back {
	display: inline-flex;
	margin-bottom: 14px;
	color: var(--abc-orange);
	font-weight: 700;
	text-decoration: none;
}

@media (max-width: 860px) {
	.abc-knowledge-hero,
	.abc-knowledge-row { display: block; }

	.abc-knowledge-search,
	.abc-knowledge-grid { grid-template-columns: 1fr; }

	.abc-knowledge-actions,
	.abc-knowledge-row nav { margin-top: 12px; }
}

@media (max-width: 520px) {
	.abc-knowledge { padding: 24px 16px; }
	.abc-knowledge h1 { font-size: 26px; }

	.abc-knowledge input,
	.abc-knowledge select,
	.abc-knowledge textarea { font-size: 16px; }
}