/**
 * Centre d'aide - styles front. Design plat et professionnel : aucune ombre
 * portée, aucun dégradé. S'aligne sur les tokens du thème CELTIIS BJ
 * (--bs-primary #8DC63F, --bs-secondary #1D3D70) avec replis.
 */
.ctk-app,
.ctk-track,
.ctk-oc {
	--ctk-green: var(--bs-primary, #8dc63f);
	--ctk-blue: var(--bs-secondary, #1d3d70);
	--ctk-green-rgb: var(--bs-primary-rgb, 141, 198, 63);
	--ctk-blue-rgb: var(--bs-secondary-rgb, 29, 61, 112);
	--ctk-line: #dfe4ec;
	--ctk-bg-soft: #f5f7fa;
	--ctk-muted: #5b6677;

	/* Couleurs de STATUT de ticket - universelles et sémantiques */
	--ctk-st-received-fg: #3d4d66;
	--ctk-st-received-bg: #e2e8f2;
	--ctk-st-received-bd: #c3cede;
	/* Reçue - neutre */
	--ctk-st-progress-fg: #14509f;
	--ctk-st-progress-bg: #dbe9fb;
	--ctk-st-progress-bd: #b3d0f5;
	/* En cours - bleu */
	--ctk-st-waiting-fg: #8a4f00;
	--ctk-st-waiting-bg: #fdeec9;
	--ctk-st-waiting-bd: #f0cf8e;
	/* Action requise - ambre */
	--ctk-st-hold-fg: #4b5563;
	--ctk-st-hold-bg: #e5e8ec;
	--ctk-st-hold-bd: #c8cdd6;
	/* En pause - gris */
	--ctk-st-resolved-fg: #1f6b2c;
	--ctk-st-resolved-bg: #d8efdc;
	--ctk-st-resolved-bd: #a8d8b2;
	/* Résolue - vert */
	/* Clôturée - violet. Cet état était en ardoise (#334155), à un cheveu de
	   « Reçue » (#3d4d66) et « En pause » (#4b5563) : trois gris indiscernables.
	   Le violet est la seule teinte encore libre de la palette et sépare nettement
	   les deux états terminaux, « Résolue » restant le vert. */
	--ctk-st-closed-fg: #5b3a91;
	--ctk-st-closed-bg: #ebe3f8;
	--ctk-st-closed-bd: #cdbaee;

	font-family: inherit;
	color: #1f2733;
}

/* L'offcanvas est un FRÈRE de .ctk-app (souvent déplacé en <body> par Bootstrap) :
   il a besoin de ses propres variables, sinon var(--ctk-green) tombe en initial. */

/* Page (contenu sous le banner-header vert) */
.ctk-page {
	padding: 30px 0 44px;
}

/* Hero de repli VERT (si le banner-header partagé n'est pas disponible) */
.ctk-hero--fallback {
	background: var(--ctk-green);
	border-radius: 14px;
	padding: 34px 24px;
	margin-bottom: 24px;
}

.ctk-hero--fallback .ctk-hero__inner {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
}

.ctk-hero--fallback .ctk-hero__title {
	color: var(--ctk-blue);
	font-size: clamp(24px, 3.4vw, 32px);
	font-weight: 800;
	margin: 0;
}

/* Recherche en HERO (point d'entrée principal) */
.ctk-searchbar {
	position: relative;
	max-width: 600px;
	margin: 4px auto 8px;
}

.ctk-searchbar__ico {
	position: absolute;
	left: 18px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--ctk-muted);
}

.ctk-search {
	width: 100%;
	height: 58px;
	border: 1px solid var(--ctk-line);
	border-radius: 12px;
	padding: 0 20px 0 50px;
	font-size: 17px;
	outline: none;
	background: #fff;
}

.ctk-search:focus {
	border-color: var(--ctk-green);
}

.ctk-search-hint {
	max-width: 600px;
	margin: 0 auto 30px;
	text-align: center;
	font-size: 13px;
	color: var(--ctk-muted);
}

/* Recherche rendue DANS le hero vert (banner-header), façon maquette : sous-titre
   + barre blanche (bon contraste sur le vert). Sur les pages Centre d'aide, on
   CENTRE tout le contenu du hero (titre, fil d'Ariane, recherche). */
.celtiis-banner-header:has(.ctk-hero-search) .celtiis-banner-header__inner {
	align-items: center;
	text-align: center;
}

.celtiis-banner-header:has(.ctk-hero-search) .celtiis-banner-header__breadcrumb {
	justify-content: center;
}

.celtiis-banner-header .ctk-hero-search {
	width: 100%;
	max-width: 560px;
	margin: 18px auto 0;
}

.celtiis-banner-header .ctk-hero-search__sub {
	margin: 0 auto 16px;
	max-width: 560px;
	color: var(--bs-secondary);
	font-size: 17px;
	line-height: 1.5;
}

.celtiis-banner-header .ctk-searchbar {
	margin: 0 auto;
	max-width: 560px;
}

.celtiis-banner-header .ctk-search {
	height: 56px;
	box-shadow: 0 6px 20px rgba(var(--ctk-blue-rgb), .10);
}

.celtiis-banner-header .ctk-search-hint {
	margin: 9px auto 0;
	text-align: center;
	color: var(--bs-secondary);
	opacity: .8;
}

/* Hub d'accueil (titres de section, chips, suivi) */
.ctk-hub__h {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	color: var(--ctk-muted);
	margin: 22px 0 12px;
}

.ctk-sections-view .ctk-hub__h:first-child {
	margin-top: 0;
}

.ctk-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 8px;
}

.ctk-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 15px;
	background: #fff;
	border: 1px solid var(--ctk-line);
	border-radius: 999px;
	cursor: pointer;
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	color: var(--ctk-blue);
	transition: border-color .15s, background-color .15s;
}

.ctk-chip:hover {
	border-color: var(--ctk-green);
	background: var(--ctk-bg-soft);
}

.ctk-chip>i {
	color: var(--ctk-green);
	font-size: 15px;
}

.ctk-hub__track {
	margin: 24px 0 0;
	text-align: center;
	font-size: 15px;
}

.ctk-hub__track a {
	color: var(--ctk-blue);
	font-weight: 600;
	text-decoration: none;
}

.ctk-hub__track a:hover {
	text-decoration: underline;
}

/* Squelettes de chargement (pas de texte « Chargement… ») */
.ctk-sk {
	background: var(--ctk-bg-soft);
	border-radius: 8px;
	animation: ctk-pulse 1.2s ease-in-out infinite;
}

.ctk-sk--bar {
	height: 14px;
	max-width: 180px;
	margin: 6px 0 18px;
}

.ctk-sk-rows {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.ctk-sk--row {
	height: 54px;
}

.ctk-sk--lead {
	height: 14px;
	max-width: 520px;
	margin: 2px 0 24px;
}

.ctk-sk--card {
	height: 210px;
	border-radius: 14px;
}

@keyframes ctk-pulse {

	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: .5;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ctk-sk {
		animation: none;
	}
}

/* Fil d'Ariane */
.ctk-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 18px;
	font-size: 14px;
}

.ctk-crumb {
	background: none;
	border: 0;
	padding: 0;
	color: var(--ctk-blue);
	font-weight: 600;
	cursor: pointer;
}

.ctk-crumb:hover {
	text-decoration: underline;
}

.ctk-crumb__sep {
	color: #aeb6c2;
}

.ctk-crumb__cur {
	color: var(--ctk-muted);
}

.ctk-lead {
	color: var(--ctk-muted);
	font-size: 15px;
	margin: 0 0 18px;
}

.ctk-vtitle {
	color: var(--ctk-blue);
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 4px;
}

/* En-tête de section : intitulé + description du parcours, en largeur de lecture */
.ctk-section__head {
	margin-bottom: 20px;
}

.ctk-section__head .ctk-vtitle {
	font-size: 26px;
}

.ctk-section__head .ctk-lead {
	font-size: 16px;
	line-height: 1.6;
	margin: 0;
}

.ctk-state {
	padding: 28px 0;
	text-align: center;
	color: var(--ctk-muted);
}

.ctk-state--error {
	color: #c0392b;
}

/* Centre d'aide : composants NATIFS (look agency-card / FAQ) */
.ctk-view-wrap,
.ctk-sections-view {
	max-width: 820px;
	margin: 0 auto;
}

/* Les éléments de liste sont des <a> (SSR) → pas de soulignement. */
.ctk-topic,
.ctk-fcard__row,
.ctk-chip,
.ctk-acc-req {
	text-decoration: none;
}

.ctk-topic:hover,
.ctk-fcard__row:hover,
.ctk-chip:hover,
.ctk-acc-req:hover {
	text-decoration: none;
}

.ctk-h {
	margin: 30px 0 12px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--ctk-blue);
}

.ctk-view-wrap>.ctk-h:first-of-type {
	margin-top: 4px;
}

/* Accordéon de catégories (mêmes tokens que .agency-card) */
.ctk-acc {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.ctk-acc-item.accordion-item {
	background: #fff;
	border: 1px solid rgba(var(--ctk-blue-rgb), .09);
	border-radius: 14px;
	overflow: hidden;
	transition: border-color .2s ease;
}

.ctk-acc-item.accordion-item:hover {
	border-color: rgba(var(--ctk-blue-rgb), .16);
}

.ctk-acc-item.accordion-item:has(.accordion-button:not(.collapsed)) {
	border-color: rgba(var(--ctk-green-rgb), .4);
}

.ctk-acc-btn.accordion-button,
.ctk-acc-btn--direct {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 16px 18px;
	background: #fff;
	border: 0;
	color: var(--ctk-blue);
	font: inherit;
	font-weight: 700;
	font-size: 16px;
	cursor: pointer;
	text-align: left;
}

.ctk-acc-btn.accordion-button {
	box-shadow: none;
}

.ctk-acc-btn.accordion-button:not(.collapsed) {
	background: rgba(var(--ctk-green-rgb), .05);
	color: var(--ctk-blue);
	box-shadow: none;
}

.ctk-acc-btn.accordion-button:focus-visible,
.ctk-acc-btn--direct:focus-visible {
	box-shadow: 0 0 0 3px rgba(var(--ctk-green-rgb), .22);
	outline: 0;
}

.ctk-acc-ttl {
	flex: 1 1 auto;
	min-width: 0;
}

.ctk-acc-count {
	flex: 0 0 auto;
	font-size: 11px;
	font-weight: 700;
	color: var(--ctk-blue);
	background: rgba(var(--ctk-green-rgb), .16);
	border-radius: 999px;
	padding: 3px 10px;
}

.ctk-acc-btn--direct {
	transition: background-color .12s;
}

.ctk-acc-btn--direct:hover {
	background: rgba(var(--ctk-green-rgb), .06);
}

.ctk-acc-btn--direct>i {
	flex: 0 0 auto;
	color: var(--ctk-green);
	font-size: 18px;
}

/* Corps + lignes de demande */
.ctk-acc-body.accordion-body {
	padding: 2px 0 8px;
}

.ctk-acc-list {
	display: flex;
	flex-direction: column;
}

.ctk-acc-req {
	display: flex;
	align-items: center;
	gap: 12px;
	width: 100%;
	text-align: left;
	background: none;
	border: 0;
	cursor: pointer;
	font: inherit;
	padding: 13px 18px;
	color: var(--ctk-blue);
	text-decoration: none;
	transition: background-color .12s;
}

.ctk-acc-req+.ctk-acc-req {
	border-top: 1px solid rgba(var(--ctk-blue-rgb), .06);
}

.ctk-acc-req:hover {
	background: rgba(var(--ctk-green-rgb), .05);
	text-decoration: none;
}

.ctk-acc-req__name {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 15px;
	font-weight: 500;
}

.ctk-acc-req__sub {
	display: block;
	font-size: 12.5px;
	font-weight: 500;
	color: var(--ctk-muted);
	margin-top: 2px;
}

.ctk-acc-req>i {
	flex: 0 0 auto;
	color: var(--ctk-green);
	font-size: 16px;
}

.ctk-acc-req--muted {
	color: #9aa4b2;
	cursor: default;
}

.ctk-acc-req--muted:hover {
	background: none;
}

.ctk-acc-sub {
	padding: 14px 18px 4px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: #aeb6c2;
}

/* ---------- HUB : héro centré + panneau « rubriques » (look maquette) ---------- */
.ctk-hub {
	max-width: 1100px;
	margin: 0 auto;
}

.ctk-chips-h {
	margin: 4px 0 14px;
	text-align: center;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--ctk-blue);
}

.ctk-chips--center {
	justify-content: center;
	max-width: 800px;
	margin: 0 auto 4px;
}

/* Panneau teinté qui contient la grille de cartes (= « Explore all topics ») */
.ctk-topics {
	margin-top: 18px;
}

.ctk-topics__h {
	margin: 0 0 24px;
	font-size: clamp(20px, 2.4vw, 24px);
	font-weight: 800;
	color: var(--ctk-blue);
}

/* Carte de domaine : icône ronde + titre + description + « Voir le détail → » */
.ctk-topic {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	width: 100%;
	height: 100%;
	padding: 28px 24px;
	background: #fff;
	border: 1px solid rgba(var(--ctk-blue-rgb), .07);
	border-radius: 18px;
	box-shadow: 0 1px 3px rgba(var(--ctk-blue-rgb), .05);
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}

.ctk-topic:hover {
	box-shadow: 0 16px 34px rgba(var(--ctk-blue-rgb), .12);
	transform: translateY(-4px);
	border-color: rgba(var(--ctk-green-rgb), .35);
}

.ctk-topic__ico {
	display: grid;
	place-items: center;
	width: 56px;
	height: 56px;
	margin-bottom: 8px;
	border-radius: 50%;
	background: rgba(var(--ctk-green-rgb), .14);
	color: var(--ctk-blue);
}

.ctk-topic__ico>i {
	font-size: 28px;
	line-height: 1;
}

.ctk-topic__title {
	font-size: 18px;
	font-weight: 700;
	color: var(--ctk-blue);
}

.ctk-topic__desc {
	font-size: 14px;
	line-height: 1.5;
	color: var(--ctk-muted);
}

.ctk-topic__more {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: auto;
	padding-top: 14px;
	font-size: 14px;
	font-weight: 700;
	color: var(--ctk-blue);
}

.ctk-topic__more-t {
	border-bottom: 2px solid var(--ctk-green);
	padding-bottom: 2px;
}

.ctk-topic__more>i {
	font-size: 15px;
	transition: transform .14s ease;
}

.ctk-topic:hover .ctk-topic__more>i {
	transform: translateX(4px);
}

/* Page SECTION : cartes par catégorie (look maquette) */
.ctk-section {
	margin: 0 auto;
}

.ctk-fcards {
	margin-top: 0;
}

.ctk-fcard {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: #fff;
	border-radius: 18px;
	overflow: hidden;
	border: 1px solid #E5E9F0;
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}

.ctk-fcard:hover {
	border-color: rgba(var(--ctk-green-rgb), .35);
}

.ctk-fcard__head {
	display: flex;
	align-items: center;
	gap: 13px;
	padding: 22px 22px 16px;
}

.ctk-fcard__ico {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: rgba(var(--ctk-green-rgb), .14);
	color: var(--ctk-blue);
}

.ctk-fcard__ico>i {
	font-size: 24px;
	line-height: 1;
}

.ctk-fcard__title {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ctk-blue);
}

.ctk-fcard__body {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	border-top: 1px solid var(--ctk-line);
}

.ctk-fcard__body>*+* {
	border-top: 1px solid var(--ctk-line);
}

.ctk-fcard__row {
	display: flex;
	align-items: center;
	gap: 12px;
	justify-content: space-between;
	width: 100%;
	text-align: left;
	background: none;
	border: 0;
	cursor: pointer;
	font: inherit;
	padding: 14px 22px;
	color: var(--ctk-blue);
	transition: background-color .12s;
}

.ctk-fcard__row>span {
	flex: 1 1 auto;
	min-width: 0;
	font-size: 14.5px;
	font-weight: 500;
	line-height: 1.35;
}

.ctk-fcard__row>i {
	flex: 0 0 auto;
	color: var(--ctk-blue);
	font-size: 16px;
	transition: transform .14s ease, color .12s;
}

.ctk-fcard__row:hover {
	background: rgba(var(--ctk-green-rgb), .07);
}

.ctk-fcard__row:hover>i {
	transform: translateX(3px);
	color: var(--ctk-green);
}

.ctk-fcard__row--muted {
	color: #9aa4b2;
	cursor: default;
}

.ctk-fcard__sub {
	padding: 12px 22px 2px;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: #aeb6c2;
}

/* Feuille SANS formulaire (affichage provisoire de la structure) */
.ctk-req--muted {
	cursor: default;
}

.ctk-req--muted .ctk-req__name {
	font-weight: 500;
	color: var(--ctk-muted);
}

.ctk-req--muted:hover {
	background: none;
}

/* Offcanvas Bootstrap - habillage Centre d'aide */
.offcanvas.ctk-oc {
	--bs-offcanvas-width: 560px;
}

.ctk-oc__title {
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	margin: 0;
}

.ctk-oc .ctk-oc__body {
	padding: 22px;
}

.ctk-form__intro {
	margin: 0 0 16px;
	font-size: 13.5px;
	line-height: 1.45;
	color: var(--ctk-muted);
}

.ctk-formio .formio-form {
	font-size: 15px;
}

/* <dyna-form> - habillage aux couleurs d'univers (le renderer auto-injecte son CSS) */
.ctk-oc .ctk-dyna {
	display: block;
}

.ctk-oc .dyna-form-root {
	--dyna-color-primary: var(--ctk-blue);
	--dyna-color-primary-hover: var(--ctk-blue);
	--dyna-color-danger: #d64545;
	--dyna-font-family: inherit;
	--dyna-radius: 10px;
}

.ctk-form__alert {
	margin-top: 14px;
	padding: 11px 14px;
	border-radius: 8px;
	background: #fdecea;
	color: #b03a2e;
	font-size: 14px;
}

/* ---------- Validation Form.io (messages + champs en erreur) ---------- */
/* Erreur sous un champ */
.ctk-oc .formio-errors .form-text,
.ctk-oc .help-block {
	margin-top: 6px;
	font-size: 13px;
	line-height: 1.45;
	color: #b03a2e;
}

/* Champ invalide : bordure rouge, sans glow (design plat) */
.ctk-oc .has-error .form-control,
.ctk-oc .has-error input,
.ctk-oc .has-error select,
.ctk-oc .has-error textarea,
.ctk-oc .has-error .choices__inner,
.ctk-oc .form-control.is-invalid {
	border-color: #d64545;
	box-shadow: none;
}

/* Message global de validation près du bouton (bloc has-error / help-block) */
.ctk-oc [ref="buttonMessageContainer"] {
	margin-top: 12px;
}

.ctk-oc [ref="buttonMessageContainer"].has-error {
	display: flex;
	align-items: flex-start;
	gap: 9px;
	padding: 11px 14px;
	border-radius: 8px;
	background: #fdecea;
	border-left: 3px solid #d64545;
}

.ctk-oc [ref="buttonMessageContainer"].has-error::before {
	content: "!";
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background: #d64545;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}

.ctk-oc [ref="buttonMessageContainer"].has-error .help-block {
	margin: 0;
	color: #b03a2e;
	font-size: 14px;
	font-weight: 600;
}

/* Confirmation (premium) */
.ctk-success {
	text-align: center;
	padding: 30px 14px 10px;
	animation: ctk-rise .42s ease both;
}

.ctk-success__badge {
	display: inline-flex;
}

.ctk-success__svg {
	width: 74px;
	height: 74px;
}

.ctk-success__circle {
	fill: var(--ctk-green);
	transform-origin: 50% 50%;
	animation: ctk-pop .42s cubic-bezier(.2, .8, .2, 1) both;
}

.ctk-success__mark {
	stroke: var(--ctk-blue);
	stroke-width: 4;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-dasharray: 36;
	stroke-dashoffset: 36;
	animation: ctk-draw .4s .24s ease forwards;
}

.ctk-success__title {
	margin: 16px 0 6px;
	font-size: 21px;
	font-weight: 800;
	color: var(--ctk-blue);
}

.ctk-success__sub {
	margin: 0 auto 22px;
	max-width: 320px;
	font-size: 14.5px;
	line-height: 1.5;
	color: var(--ctk-muted);
}

/* Talon de ticket */
.ctk-success__ticket {
	text-align: left;
	max-width: 360px;
	margin: 0 auto 22px;
	border: 1px solid var(--ctk-line);
	border-radius: 12px;
	overflow: hidden;
}

.ctk-success__ticket-label {
	display: block;
	padding: 11px 16px 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .07em;
	text-transform: uppercase;
	color: var(--ctk-muted);
}

.ctk-success__ticket-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 3px 10px 11px 16px;
}

.ctk-success__ref {
	font-family: 'Gotham', 'Montserrat', sans-serif;
	font-size: 28px;
	font-weight: 900;
	letter-spacing: .04em;
	color: var(--ctk-blue);
}

.ctk-success__copy {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	flex: 0 0 auto;
	padding: 7px 12px;
	border: 1px solid var(--ctk-line);
	border-radius: 8px;
	background: #fff;
	color: var(--ctk-blue);
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: background-color .12s, border-color .12s, color .12s;
}

.ctk-success__copy svg {
	width: 15px;
	height: 15px;
}

.ctk-success__copy:hover {
	background: var(--ctk-bg-soft);
	border-color: var(--ctk-blue);
}

.ctk-success__copy.is-copied {
	background: var(--ctk-green);
	border-color: var(--ctk-green);
	color: var(--ctk-blue);
}

.ctk-success__actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-width: 360px;
	margin: 0 auto;
}

@keyframes ctk-pop {
	0% {
		transform: scale(.5);
	}

	60% {
		transform: scale(1.08);
	}

	100% {
		transform: scale(1);
	}
}

@keyframes ctk-draw {
	to {
		stroke-dashoffset: 0;
	}
}

@keyframes ctk-rise {
	from {
		opacity: 0;
		transform: translateY(10px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media (prefers-reduced-motion: reduce) {

	.ctk-success,
	.ctk-success__circle,
	.ctk-success__mark {
		animation: none;
	}

	.ctk-success__mark {
		stroke-dashoffset: 0;
	}
}

/* Boutons (plats) */
.ctk-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 22px;
	border: 0;
	border-radius: 10px;
	font-weight: 700;
	font-size: 15px;
	cursor: pointer;
	text-decoration: none;
}

.ctk-btn--primary {
	background: var(--bs-primary);
	color: var(--bs-secondary);
}

.ctk-btn--ghost {
	background: transparent;
	color: var(--ctk-blue);
	border: none;
}

.ctk-btn--ghost:hover {
	background: var(--ctk-bg-soft);
}

/* Suivi */
.ctk-track {
	max-width: 560px;
	margin: 0 auto;
}

.ctk-track__title {
	color: var(--ctk-blue);
	font-size: 22px;
	font-weight: 800;
	margin: 0 0 6px;
}

.ctk-track__lead {
	color: var(--ctk-muted);
	margin: 0 0 16px;
}

.ctk-track__form {
	display: flex;
	gap: 10px;
}

.ctk-input {
	flex: 1;
	height: 48px;
	border: 1px solid var(--ctk-line);
	border-radius: 10px;
	padding: 0 14px;
	font-size: 15px;
	outline: none;
}

.ctk-input:focus {
	border-color: var(--ctk-blue);
}

.ctk-track__result {
	margin-top: 20px;
}

.ctk-tcard {
	border: 1px solid var(--ctk-line);
	border-radius: 12px;
	padding: 18px;
}

.ctk-tcard__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-bottom: 12px;
}

.ctk-tcard__ref {
	font-weight: 800;
	color: var(--ctk-blue);
	font-size: 16px;
}

.ctk-trow {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 9px 0;
	border-top: 1px solid var(--ctk-line);
	font-size: 14px;
}

.ctk-trow span {
	color: var(--ctk-muted);
}

.ctk-trow strong {
	color: var(--ctk-blue);
}

/* Badge de statut : pill DOUCE (fond teinté + texte coloré) avec pastille.
   Défaut neutre = « reçue ». Chaque modificateur pointe sur les tokens --ctk-st-*. */
.ctk-badge {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	flex: 0 0 auto;
	padding: 7px 18px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	color: var(--ctk-st-received-fg);
	background: var(--ctk-st-received-bg);
	border: 1px solid var(--ctk-st-received-bd);
}

/* Statuts PUBLICS */
.ctk-badge--received {
	color: var(--ctk-st-received-fg);
	background: var(--ctk-st-received-bg);
	border-color: var(--ctk-st-received-bd);
}

.ctk-badge--in_progress {
	color: var(--ctk-st-progress-fg);
	background: var(--ctk-st-progress-bg);
	border-color: var(--ctk-st-progress-bd);
}

.ctk-badge--waiting_you {
	color: var(--ctk-st-waiting-fg);
	background: var(--ctk-st-waiting-bg);
	border-color: var(--ctk-st-waiting-bd);
}

.ctk-badge--on_hold {
	color: var(--ctk-st-hold-fg);
	background: var(--ctk-st-hold-bg);
	border-color: var(--ctk-st-hold-bd);
}

.ctk-badge--resolved {
	color: var(--ctk-st-resolved-fg);
	background: var(--ctk-st-resolved-bg);
	border-color: var(--ctk-st-resolved-bd);
}

.ctk-badge--closed {
	color: var(--ctk-st-closed-fg);
	background: var(--ctk-st-closed-bg);
	border-color: var(--ctk-st-closed-bd);
}

/* Replis (statuts internes) */
.ctk-badge--new {
	color: var(--ctk-st-received-fg);
	background: var(--ctk-st-received-bg);
	border-color: var(--ctk-st-received-bd);
}

.ctk-badge--open {
	color: var(--ctk-st-progress-fg);
	background: var(--ctk-st-progress-bg);
	border-color: var(--ctk-st-progress-bd);
}

.ctk-badge--pending {
	color: var(--ctk-st-waiting-fg);
	background: var(--ctk-st-waiting-bg);
	border-color: var(--ctk-st-waiting-bd);
}

@media (max-width: 600px) {
	.ctk-grid--sections {
		grid-template-columns: 1fr;
	}

	.ctk-track__form {
		flex-direction: column;
	}

	.ctk-hero {
		padding: 28px 16px;
	}
}
/* Bouton d'ouverture d'une demande - posable sur n'importe quelle page */
.ctk-trigger {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 22px;
	border: 0;
	border-radius: 999px;
	background: var(--bs-primary);
	color: var(--cw-universe-text-on-primary, var(--bs-secondary));
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: filter .18s ease, transform .18s ease;
}
.ctk-trigger:hover,
.ctk-trigger:focus-visible {
	filter: brightness(0.95);
	transform: translateY(-1px);
	color: var(--cw-universe-text-on-primary, var(--bs-secondary));
}
.ctk-trigger:focus-visible {
	outline: 2px solid var(--bs-secondary);
	outline-offset: 2px;
}
.ctk-trigger i {
	font-size: 16px;
	line-height: 1;
}

@media (prefers-reduced-motion: reduce) {
	.ctk-trigger { transition: none; }
	.ctk-trigger:hover, .ctk-trigger:focus-visible { transform: none; }
}

/* Variante lien du déclencheur - même allure, balise <a> partageable. */
a.ctk-trigger--link,
a.ctk-trigger--link:hover,
a.ctk-trigger--link:focus-visible {
	text-decoration: none;
}