.cch-challenge, .cch-catalog, .cch-my-challenges {
	font-family: var(--cc-font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif);
	max-width: 800px;
	margin: 0 auto;
	color: var(--cc-color-text, #1a1d23);
}

.cch-challenge__category {
	color: var(--cc-color-accent, #2f5eff);
	font-weight: 700;
	font-size: 0.8rem;
	letter-spacing: 0.05em;
	margin: 0 0 4px;
}

.cch-challenge__title { margin: 0 0 12px; font-size: 26px; line-height: 1.25; font-weight: 700; }

.cch-challenge__meta {
	list-style: none;
	display: flex;
	gap: 16px;
	padding: 0;
	margin: 0 0 24px;
	flex-wrap: wrap;
	color: var(--cc-color-text-muted, #61676f);
	font-size: 0.9rem;
}

.cch-tag {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: var(--cc-radius-full, 999px);
	background: var(--cc-color-border, #e2e5ea);
	color: var(--cc-color-text-muted, #61676f);
}

.cch-tag--level {
	background: var(--cc-color-accent, #2f5eff);
	color: #fff;
}

.cch-card {
	background: var(--cc-color-surface, #f7f8fa);
	border: 1px solid var(--cc-color-border, #e2e5ea);
	border-radius: var(--cc-radius-md, 10px);
	padding: 16px;
	margin-bottom: 16px;
}

.cch-deliverables { list-style: none; padding: 0; margin: 0; }
.cch-deliverables li { padding: 4px 0; }

.cch-button {
	display: inline-block;
	padding: 10px 20px;
	border-radius: var(--cc-radius-sm, 6px);
	border: 1px solid var(--cc-color-border, #e2e5ea);
	background: #fff;
	color: var(--cc-color-text, #1a1d23);
	text-decoration: none;
	font-weight: 600;
	cursor: pointer;
}

.cch-button--primary {
	background: var(--cc-color-accent, #2f5eff);
	border-color: var(--cc-color-accent, #2f5eff);
	color: #fff;
}

.cch-notice {
	background: var(--cc-color-surface, #f7f8fa);
	border-radius: var(--cc-radius-sm, 6px);
	padding: 12px;
}

.cch-notice--success { background: #dff5e6; color: #146c34; }
.cch-notice--locked { background: #fbe3e0; color: #9a2a1f; }

.cch-feedback {
	background: #fdf3d9;
	border-radius: var(--cc-radius-sm, 6px);
	padding: 12px;
	margin-bottom: 16px;
}

.cch-catalog__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}

@media (min-width: 640px) { .cch-catalog__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .cch-catalog__grid { grid-template-columns: repeat(3, 1fr); } }

.cch-challenge-card--locked { opacity: 0.85; }

/* Catalogue — ces règles n'existaient pas du tout, les titres
   héritaient donc du style brut d'Astra (souvent très grand par
   défaut) sans aucun contrôle. */

.cch-catalog__title { font-size: 24px; font-weight: 700; margin: 0 0 24px; color: var(--cc-color-text, #1a1d23); }

.cch-catalog__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
	max-width: 1080px;
	margin: 0 auto;
}
@media (min-width: 640px) { .cch-catalog__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .cch-catalog__grid { grid-template-columns: repeat(3, 1fr); } }

.cch-challenge-card {
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: var(--cc-color-surface, #fff);
	border: 1px solid var(--cc-color-border, #e2e5ea);
	border-radius: var(--cc-radius-md, 10px);
	padding: 18px;
}

.cch-challenge-card__cover { border-radius: var(--cc-radius-sm, 6px); overflow: hidden; margin-bottom: 4px; }
.cch-challenge-card__cover img { display: block; width: 100%; height: auto; }

.cch-challenge-card__badges { display: flex; gap: 6px; flex-wrap: wrap; }

.cch-card__title {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	margin: 0;
	color: var(--cc-color-text, #1a1d23);
}

.cch-challenge-card .cch-button { margin-top: auto; align-self: flex-start; }

@media (prefers-reduced-motion: reduce) {
	.cch-challenge *, .cch-catalog * { transition: none !important; animation: none !important; }
}

/* ==========================================================
   Catalogue — filtres de catégorie et pagination
   Bug réel corrigé : au-delà de la limite par défaut de
   Réglages > Lecture, les défis suivants étaient invisibles,
   sans aucun moyen d'y accéder. Voir Template_Loader::
   maybe_adjust_archive_query().
   ========================================================== */

.cch-catalog__filters { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; }
.cch-catalog__filter {
	display: inline-flex; align-items: center; padding: 6px 14px; border-radius: var(--cc-radius-full, 999px);
	background: var(--cc-color-surface, #fff); border: 1px solid var(--cc-color-border, #e2e5ea);
	color: var(--cc-color-text-muted, #61676f); font-size: 13.5px; font-weight: 600; text-decoration: none;
}
.cch-catalog__filter:hover { border-color: var(--cc-color-accent, #2f5eff); color: var(--cc-color-text, #1a1d23); }
.cch-catalog__filter.is-active { background: var(--cc-color-accent, #2f5eff); border-color: var(--cc-color-accent, #2f5eff); color: #fff; }

.cch-tag--category { align-self: flex-start; background: #DBEAFE; color: #1D4ED8; }

.cch-catalog__pagination { display: flex; justify-content: center; gap: 6px; margin-top: 36px; flex-wrap: wrap; }
.cch-catalog__pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 10px;
	border-radius: var(--cc-radius-sm, 6px); border: 1px solid var(--cc-color-border, #e2e5ea);
	background: var(--cc-color-surface, #fff); color: var(--cc-color-text, #1a1d23); text-decoration: none; font-size: 13.5px; font-weight: 600;
}
.cch-catalog__pagination .page-numbers.current { background: var(--cc-color-accent, #2f5eff); border-color: var(--cc-color-accent, #2f5eff); color: #fff; }
.cch-catalog__pagination .page-numbers:hover:not(.current) { border-color: var(--cc-color-accent, #2f5eff); }
.cch-catalog__pagination .page-numbers.dots { border: none; background: none; }

/* Carte un peu plus soignée : léger effet au survol, transition douce. */
.cch-challenge-card { transition: transform .15s ease, box-shadow .15s ease; }
.cch-challenge-card:hover { transform: translateY(-2px); box-shadow: 0 8px 20px -8px rgba(15, 23, 42, .15); }

@media (prefers-reduced-motion: reduce) {
	.cch-challenge-card { transition: none; }
	.cch-challenge-card:hover { transform: none; }
}