/**
 * CCINO — Adhésions : styles publics.
 * Charte : bleu et rouge du logo de la Chambre.
 *
 * Toutes les règles sont portées par .ccino-wrap et renforcées afin que
 * le thème du site ne prenne pas le dessus sur le design du plugin.
 */

/* ------------------------------------------------------------------
 * 1. Base et neutralisation des styles du thème
 * --------------------------------------------------------------- */

.ccino-wrap {
	--ccino-bleu: #00209f;
	--ccino-rouge: #d21034;
	--ccino-bleu-fonce: #041a56;
	--ccino-encre: #16213e;
	--ccino-gris: #5b6478;
	--ccino-bord: #e3e7f0;
	--ccino-fond: #f6f8fc;
	--ccino-rayon: 14px;
	--ccino-ombre: 0 10px 30px rgba(4, 26, 86, 0.08);

	display: block !important;
	box-sizing: border-box !important;
	max-width: 980px !important;
	width: auto !important;
	margin: 0 auto 2.5rem !important;
	padding: 0 !important;
	color: var(--ccino-encre) !important;
	font-size: 16px !important;
	line-height: 1.6 !important;
	text-align: left !important;
	text-transform: none !important;
	background: none !important;
	border: 0 !important;
}

.ccino-wrap *,
.ccino-wrap *::before,
.ccino-wrap *::after {
	box-sizing: border-box !important;
}

.ccino-wrap h2,
.ccino-wrap h3,
.ccino-wrap h4 {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	font-family: inherit !important;
	text-shadow: none !important;
	text-align: left !important;
	line-height: 1.3 !important;
}

.ccino-wrap p {
	margin: 0;
	padding: 0;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}

.ccino-wrap ul,
.ccino-wrap ol,
.ccino-wrap li {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	text-indent: 0 !important;
}

.ccino-wrap ul::before,
.ccino-wrap li::before,
.ccino-wrap li::marker {
	content: none !important;
}

.ccino-wrap fieldset {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	min-width: 0 !important;
}

.ccino-wrap legend {
	float: none !important;
	width: auto !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}

.ccino-wrap img {
	max-width: 100% !important;
	height: auto !important;
	border: 0 !important;
	border-radius: 0;
	box-shadow: none !important;
}

.ccino-wrap a {
	box-shadow: none !important;
	background: none !important;
}

/* Libellés réservés aux lecteurs d'écran (si le thème ne les gère pas). */
.ccino-wrap .screen-reader-text {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* ------------------------------------------------------------------
 * 2. Champs de saisie (les thèmes les redéfinissent presque toujours)
 * --------------------------------------------------------------- */

.ccino-wrap input[type="text"],
.ccino-wrap input[type="email"],
.ccino-wrap input[type="tel"],
.ccino-wrap input[type="date"],
.ccino-wrap input[type="search"],
.ccino-wrap input[type="url"],
.ccino-wrap input[type="number"],
.ccino-wrap select,
.ccino-wrap textarea {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: 0 !important;
	height: auto !important;
	margin: 0 !important;
	padding: 11px 13px !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 9px !important;
	background: #fff !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--ccino-encre) !important;
	font-size: 16px !important;
	font-family: inherit !important;
	font-weight: 400 !important;
	line-height: 1.4 !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	outline: 0 !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ccino-wrap select {
	appearance: none;
	-webkit-appearance: none;
	padding-right: 34px !important;
	background-image: linear-gradient(45deg, transparent 50%, var(--ccino-gris) 50%), linear-gradient(135deg, var(--ccino-gris) 50%, transparent 50%) !important;
	background-position: calc(100% - 18px) calc(50% + 2px), calc(100% - 13px) calc(50% + 2px) !important;
	background-size: 5px 5px, 5px 5px !important;
	background-repeat: no-repeat !important;
	cursor: pointer;
}

.ccino-wrap textarea {
	min-height: 90px !important;
	resize: vertical;
}

.ccino-wrap input:focus,
.ccino-wrap select:focus,
.ccino-wrap textarea:focus {
	border-color: var(--ccino-bleu) !important;
	box-shadow: 0 0 0 3px rgba(0, 32, 159, 0.12) !important;
}

.ccino-wrap input[type="checkbox"],
.ccino-wrap input[type="radio"] {
	box-shadow: none !important;
	background: #fff;
}

/* ------------------------------------------------------------------
 * 3. Formulaire
 * --------------------------------------------------------------- */

.ccino-wrap .ccino-form {
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: var(--ccino-rayon) !important;
	box-shadow: var(--ccino-ombre) !important;
	overflow: hidden;
}

.ccino-wrap .ccino-form__entete {
	display: flex !important;
	align-items: center;
	gap: 18px;
	padding: 26px 30px !important;
	background: var(--ccino-bleu-fonce) !important;
	background-image: none !important;
	color: #fff !important;
	position: relative;
	border: 0 !important;
}

/* Filet rouge, seul accent de couleur sous l'en-tête. */
.ccino-wrap .ccino-form__entete::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 3px;
	background: var(--ccino-rouge);
}

.ccino-wrap .ccino-form__sceau {
	flex: 0 0 auto;
	width: 68px;
	height: 68px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255, 255, 255, 0.12);
	border: 2px solid rgba(255, 255, 255, 0.55);
	font-weight: 800;
	letter-spacing: 0.5px;
	font-size: 15px;
	color: #fff;
}

/* Logo fourni par la Chambre : sur fond blanc pour rester lisible. */
.ccino-wrap .ccino-form__sceau--image {
	width: auto !important;
	max-width: 190px !important;
	height: auto !important;
	max-height: 68px !important;
	border-radius: 10px !important;
	border: 0 !important;
	padding: 8px 12px !important;
	background: #fff !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
}

.ccino-wrap .ccino-form__titre {
	margin: 0 !important;
	font-size: 1.5rem !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	color: #fff !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
}

.ccino-wrap .ccino-form__soustitre {
	margin: 4px 0 0 !important;
	font-size: 0.92rem !important;
	color: #fff !important;
	opacity: 0.85;
}

.ccino-wrap .ccino-form__consigne {
	margin: 0 !important;
	padding: 16px 30px !important;
	background: var(--ccino-fond) !important;
	border-bottom: 1px solid var(--ccino-bord) !important;
	font-size: 0.92rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-messages:not(:empty) {
	padding: 20px 30px 0;
}

.ccino-wrap .ccino-alerte {
	position: relative;
	padding: 16px 44px 16px 18px !important;
	border-radius: 10px !important;
	font-size: 0.95rem !important;
	border-left: 5px solid !important;
	transition: opacity 0.35s ease, transform 0.35s ease;
}

.ccino-wrap .ccino-alerte--parti {
	opacity: 0;
	transform: translateY(-8px);
}

.ccino-wrap .ccino-alerte__fermer {
	position: absolute !important;
	top: 8px;
	right: 10px;
	width: 26px;
	height: 26px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: transparent !important;
	color: inherit !important;
	font-size: 20px !important;
	line-height: 1 !important;
	opacity: 0.55;
	cursor: pointer;
}

.ccino-wrap .ccino-alerte__fermer:hover {
	opacity: 1;
}

.ccino-wrap .ccino-alerte--succes {
	background: #eaf6ee !important;
	border-color: #1e8a4b !important;
	color: #14602f !important;
}

.ccino-wrap .ccino-alerte--erreur {
	background: #fdeef0 !important;
	border-color: var(--ccino-rouge) !important;
	color: #8f0b21 !important;
}

.ccino-wrap .ccino-alerte__ref {
	margin-top: 8px !important;
	font-size: 0.95rem !important;
}

.ccino-wrap .ccino-alerte__actions {
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 14px !important;
}

.ccino-wrap .ccino-alerte__note {
	font-size: 0.84rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-section {
	margin: 0 !important;
	padding: 26px 30px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ccino-bord) !important;
}

.ccino-wrap .ccino-section:last-of-type {
	border-bottom: 0 !important;
}

.ccino-wrap .ccino-section__titre {
	display: flex !important;
	align-items: center;
	gap: 12px;
	padding: 0 !important;
	margin: 0 0 18px !important;
	font-size: 1.06rem !important;
	font-weight: 700 !important;
	color: var(--ccino-bleu-fonce) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.4px !important;
}

.ccino-wrap .ccino-num {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var(--ccino-bleu) !important;
	color: #fff !important;
	font-size: 0.85rem;
	font-weight: 700;
	flex: 0 0 auto;
}

.ccino-wrap .ccino-sous-titre {
	margin: 22px 0 10px !important;
	font-size: 0.86rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.6px !important;
	color: var(--ccino-rouge) !important;
}

.ccino-wrap .ccino-sous-titre:first-of-type {
	margin-top: 0 !important;
}

.ccino-wrap .ccino-grille {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px 20px;
}

.ccino-wrap .ccino-champ {
	margin: 0 !important;
	display: flex !important;
	flex-direction: column;
	gap: 6px;
}

.ccino-wrap .ccino-champ--large {
	grid-column: 1 / -1;
}

.ccino-wrap .ccino-grille + .ccino-champ,
.ccino-wrap .ccino-grille + .ccino-pastilles {
	margin-top: 20px !important;
}

.ccino-wrap .ccino-champ label,
.ccino-wrap .ccino-label {
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	color: var(--ccino-gris) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.3px !important;
	line-height: 1.4 !important;
}

.ccino-wrap .ccino-req {
	color: var(--ccino-rouge) !important;
}

.ccino-wrap .ccino-aide {
	margin: -8px 0 14px !important;
	font-size: 0.9rem !important;
	color: var(--ccino-gris) !important;
}

/* Pastilles (radios et cases) */

.ccino-wrap .ccino-pastilles {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
}

.ccino-wrap .ccino-pastille {
	position: relative;
	display: inline-flex !important;
	margin: 0 !important;
	text-transform: none !important;
}

.ccino-wrap .ccino-pastille input {
	position: absolute !important;
	opacity: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	cursor: pointer;
}

.ccino-wrap .ccino-pastille span {
	display: inline-block !important;
	padding: 9px 18px !important;
	border: 1.5px solid var(--ccino-bord) !important;
	border-radius: 999px !important;
	font-size: 0.93rem !important;
	font-weight: 600 !important;
	color: var(--ccino-gris) !important;
	background: #fff !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	transition: all 0.15s ease;
}

.ccino-wrap .ccino-pastille input:checked + span {
	background: var(--ccino-bleu) !important;
	border-color: var(--ccino-bleu) !important;
	color: #fff !important;
	box-shadow: 0 4px 12px rgba(0, 32, 159, 0.25) !important;
}

.ccino-wrap .ccino-pastilles--cases .ccino-pastille input:checked + span {
	background: var(--ccino-rouge) !important;
	border-color: var(--ccino-rouge) !important;
	box-shadow: 0 4px 12px rgba(210, 16, 52, 0.22) !important;
}

.ccino-wrap .ccino-pastille input:focus-visible + span {
	outline: 2px solid var(--ccino-bleu);
	outline-offset: 2px;
}

/* Cotisations */

.ccino-wrap .ccino-cotisations {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}

.ccino-wrap .ccino-cotisation {
	position: relative;
	display: block !important;
	margin: 0 !important;
	cursor: pointer;
	text-transform: none !important;
}

.ccino-wrap .ccino-cotisation input {
	position: absolute !important;
	opacity: 0 !important;
	inset: 0;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	cursor: pointer;
}

.ccino-wrap .ccino-cotisation__corps {
	display: block !important;
	padding: 18px 16px !important;
	text-align: center !important;
	border: 1.5px solid var(--ccino-bord) !important;
	border-radius: 12px !important;
	background: #fff !important;
	transition: all 0.15s ease;
}

.ccino-wrap .ccino-cotisation__montant {
	display: block !important;
	font-size: 1.22rem !important;
	font-weight: 700 !important;
	color: var(--ccino-bleu-fonce) !important;
}

.ccino-wrap .ccino-cotisation__desc {
	display: block !important;
	margin-top: 4px !important;
	font-size: 0.85rem !important;
	font-weight: 400 !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-cotisation input:checked + .ccino-cotisation__corps {
	border-color: var(--ccino-bleu) !important;
	background: #f2f5ff !important;
	box-shadow: 0 8px 20px rgba(0, 32, 159, 0.14) !important;
}

.ccino-wrap .ccino-cotisation input:checked + .ccino-cotisation__corps .ccino-cotisation__montant {
	color: var(--ccino-bleu) !important;
}

/* Case de consentement */

.ccino-wrap .ccino-champ--case {
	margin-top: 18px !important;
}

.ccino-wrap .ccino-champ--case label {
	display: flex !important;
	align-items: flex-start;
	gap: 10px;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-weight: 400 !important;
	font-size: 0.95rem !important;
	color: var(--ccino-encre) !important;
	cursor: pointer;
}

.ccino-wrap .ccino-champ--case input {
	margin-top: 3px !important;
	width: 18px !important;
	height: 18px !important;
	accent-color: var(--ccino-bleu);
	flex: 0 0 auto;
}

/* Champs de fichier */

.ccino-wrap .ccino-fichier input[type="file"] {
	display: block !important;
	width: 100% !important;
	padding: 10px 12px !important;
	border: 1.5px dashed var(--ccino-bord) !important;
	border-radius: 9px !important;
	background: var(--ccino-fond) !important;
	font-size: 0.88rem !important;
	font-family: inherit !important;
	color: var(--ccino-gris) !important;
	cursor: pointer;
}

.ccino-wrap .ccino-fichier input[type="file"]:hover {
	border-color: var(--ccino-bleu) !important;
}

.ccino-wrap .ccino-apercu:not(:empty) {
	display: flex !important;
	align-items: center;
	gap: 12px;
	margin-top: 10px !important;
	padding: 10px !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 9px !important;
}

.ccino-wrap .ccino-apercu img {
	width: 64px !important;
	height: 64px !important;
	object-fit: cover;
	border-radius: 8px !important;
	border: 1px solid var(--ccino-bord) !important;
}

.ccino-wrap .ccino-apercu__nom {
	flex: 1 1 auto;
	font-size: 0.8rem !important;
	color: var(--ccino-gris) !important;
	overflow-wrap: anywhere;
}

.ccino-wrap .ccino-apercu__retirer {
	appearance: none;
	padding: 6px 12px !important;
	border: 1px solid var(--ccino-rouge) !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: var(--ccino-rouge) !important;
	font-size: 0.78rem !important;
	font-family: inherit !important;
	font-weight: 600 !important;
	cursor: pointer;
}

.ccino-wrap .ccino-apercu__retirer:hover {
	background: var(--ccino-rouge) !important;
	color: #fff !important;
}

.ccino-wrap .ccino-fichier__note {
	font-size: 0.78rem !important;
	color: var(--ccino-gris) !important;
	line-height: 1.45;
}

.ccino-wrap .ccino-pot-de-miel {
	position: absolute !important;
	left: -9999px !important;
	height: 1px !important;
	overflow: hidden !important;
}

/* Actions */

.ccino-wrap .ccino-actions {
	display: flex !important;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
	padding: 24px 30px 30px !important;
	background: var(--ccino-fond) !important;
	border-top: 1px solid var(--ccino-bord) !important;
}

.ccino-wrap .ccino-bouton,
.ccino-wrap button.ccino-bouton,
.ccino-wrap a.ccino-bouton {
	display: inline-block !important;
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	appearance: none !important;
	-webkit-appearance: none !important;
	border: 0 !important;
	cursor: pointer;
	margin: 0 !important;
	padding: 14px 30px !important;
	border-radius: 999px !important;
	background: var(--ccino-bleu) !important;
	background-image: none !important;
	color: #fff !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	font-family: inherit !important;
	line-height: 1.3 !important;
	letter-spacing: 0.3px !important;
	text-transform: none !important;
	text-decoration: none !important;
	text-shadow: none !important;
	box-shadow: 0 8px 20px rgba(0, 32, 159, 0.25) !important;
	transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.ccino-wrap .ccino-bouton:hover,
.ccino-wrap .ccino-bouton:focus {
	transform: translateY(-1px);
	background: var(--ccino-bleu-fonce) !important;
	color: #fff !important;
	box-shadow: 0 12px 26px rgba(0, 32, 159, 0.3) !important;
}

.ccino-wrap .ccino-bouton[disabled] {
	opacity: 0.6;
	cursor: progress;
	transform: none;
}

.ccino-wrap .ccino-bouton--petit {
	padding: 10px 20px !important;
	font-size: 0.9rem !important;
	box-shadow: none !important;
}

.ccino-wrap .ccino-actions__note {
	font-size: 0.86rem !important;
	color: var(--ccino-gris) !important;
}

/* ------------------------------------------------------------------
 * 4. Liste des membres
 * --------------------------------------------------------------- */

.ccino-wrap .ccino-membres__entete {
	display: flex !important;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding-bottom: 14px !important;
	margin-bottom: 22px !important;
	border-bottom: 3px solid var(--ccino-bleu) !important;
	position: relative;
}

.ccino-wrap .ccino-membres__entete::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -3px;
	width: 120px;
	height: 3px;
	background: var(--ccino-rouge);
}

.ccino-wrap .ccino-membres__titre {
	margin: 0 !important;
	font-size: 1.6rem !important;
	font-weight: 700 !important;
	color: var(--ccino-bleu-fonce) !important;
}

.ccino-wrap .ccino-membres__compteur {
	margin: 0 !important;
	font-size: 0.95rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-filtres {
	display: flex !important;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	padding: 14px !important;
	margin: 0 0 22px !important;
	background: var(--ccino-fond) !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 12px !important;
}

.ccino-wrap .ccino-filtres__recherche {
	flex: 1 1 240px;
	margin: 0 !important;
}

.ccino-wrap .ccino-filtres__secteur {
	flex: 0 1 200px;
	margin: 0 !important;
}

.ccino-wrap .ccino-lien-reset {
	font-size: 0.88rem !important;
	color: var(--ccino-rouge) !important;
	text-decoration: underline !important;
}

.ccino-wrap .ccino-cartes {
	display: grid !important;
	gap: 18px;
	margin: 0 !important;
	padding: 0 !important;
}

.ccino-wrap .ccino-cartes--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ccino-wrap .ccino-cartes--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ccino-wrap .ccino-cartes--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.ccino-wrap .ccino-carte {
	display: flex !important;
	flex-direction: column;
	gap: 14px;
	margin: 0 !important;
	padding: 20px !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-top: 3px solid var(--ccino-bleu) !important;
	border-radius: var(--ccino-rayon) !important;
	box-shadow: 0 2px 10px rgba(4, 26, 86, 0.04) !important;
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
	position: relative;
	cursor: pointer;
	outline: 0;
}

.ccino-wrap .ccino-carte:hover,
.ccino-wrap .ccino-carte:focus-visible {
	transform: translateY(-3px);
	border-top-color: var(--ccino-rouge) !important;
	box-shadow: 0 14px 28px rgba(4, 26, 86, 0.1) !important;
}

/* Code couleur de la validité de l'adhésion. */
.ccino-wrap .ccino-adhesion {
	display: inline-block !important;
	padding: 3px 11px !important;
	border-radius: 999px !important;
	font-size: 0.74rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.4px !important;
	white-space: nowrap;
}

.ccino-wrap .ccino-adhesion--active { background: #e8f6ed !important; color: #14602f !important; }
.ccino-wrap .ccino-adhesion--bientot { background: #fff6e5 !important; color: #8a5000 !important; }
.ccino-wrap .ccino-adhesion--expire { background: #fdeef0 !important; color: #8f0b21 !important; }
.ccino-wrap .ccino-adhesion--inconnu { background: #eef1f7 !important; color: #5b6478 !important; }

.ccino-wrap .ccino-adhesion__date {
	display: inline-block !important;
	margin-left: 4px;
	font-weight: 500 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	opacity: 0.85;
}

/* La bordure haute de la carte reprend l'état de l'adhésion. */
.ccino-wrap .ccino-carte--active { border-top-color: #1e8a4b !important; }
.ccino-wrap .ccino-carte--bientot { border-top-color: #b46a00 !important; }
.ccino-wrap .ccino-carte--expire { border-top-color: var(--ccino-rouge) !important; }
.ccino-wrap .ccino-carte--inconnu { border-top-color: var(--ccino-gris) !important; }

.ccino-wrap .ccino-carte--expire {
	background: #fffbfb !important;
}

.ccino-wrap .ccino-carte__haut {
	display: flex !important;
	align-items: center;
	gap: 14px;
}

.ccino-wrap .ccino-carte__monogramme {
	flex: 0 0 auto;
	width: 50px;
	height: 50px;
	border-radius: 12px;
	display: flex !important;
	align-items: center;
	justify-content: center;
	background: var(--ccino-bleu) !important;
	background-image: none !important;
	color: #fff !important;
	font-weight: 700;
	font-size: 1.05rem;
	letter-spacing: 0.5px;
}

/* Logo de l'entreprise sur la carte */
.ccino-wrap .ccino-carte__logo {
	flex: 0 0 auto;
	width: 56px;
	height: 56px;
	display: flex !important;
	align-items: center;
	justify-content: center;
	padding: 6px !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 10px !important;
}

.ccino-wrap .ccino-carte__logo img {
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: contain;
}

.ccino-wrap .ccino-carte__nom {
	margin: 0 !important;
	font-size: 1.05rem !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	color: var(--ccino-bleu-fonce) !important;
}

.ccino-wrap .ccino-carte__type {
	margin: 2px 0 0 !important;
	font-size: 0.82rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-etiquettes {
	display: flex !important;
	flex-wrap: wrap;
	gap: 6px;
}

.ccino-wrap .ccino-etiquette {
	padding: 4px 11px !important;
	border-radius: 999px !important;
	background: rgba(0, 32, 159, 0.08) !important;
	color: var(--ccino-bleu) !important;
	font-size: 0.78rem !important;
	font-weight: 600 !important;
}

.ccino-wrap .ccino-carte__infos {
	margin: auto 0 0 !important;
	padding: 12px 0 0 !important;
	border-top: 1px dashed var(--ccino-bord);
	font-size: 0.88rem !important;
}

.ccino-wrap .ccino-carte__infos li {
	display: flex !important;
	justify-content: space-between;
	gap: 10px;
	padding: 3px 0 !important;
	margin: 0 !important;
}

.ccino-wrap .ccino-carte__cle {
	color: var(--ccino-gris) !important;
}

/* Tableau */

.ccino-wrap .ccino-tableau-wrap {
	overflow-x: auto;
	border: 1px solid var(--ccino-bord);
	border-radius: var(--ccino-rayon);
	background: #fff;
}

.ccino-wrap .ccino-tableau {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	border: 0 !important;
	border-collapse: collapse !important;
	font-size: 0.93rem !important;
	background: #fff !important;
}

.ccino-wrap .ccino-tableau th {
	background: var(--ccino-bleu) !important;
	color: #fff !important;
	text-align: left !important;
	padding: 12px 14px !important;
	border: 0 !important;
	font-size: 0.82rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.4px !important;
}

.ccino-wrap .ccino-tableau td {
	padding: 12px 14px !important;
	border: 0 !important;
	border-top: 1px solid var(--ccino-bord) !important;
	color: var(--ccino-encre) !important;
}

.ccino-wrap .ccino-tableau tbody tr:nth-child(even) {
	background: var(--ccino-fond) !important;
}

.ccino-wrap .ccino-vide {
	padding: 30px !important;
	text-align: center !important;
	color: var(--ccino-gris) !important;
	background: var(--ccino-fond) !important;
	border: 1px dashed var(--ccino-bord) !important;
	border-radius: var(--ccino-rayon) !important;
}

/* Pagination */

.ccino-wrap .ccino-pagination {
	display: flex !important;
	justify-content: center;
	gap: 6px;
	margin-top: 26px !important;
	flex-wrap: wrap;
}

.ccino-wrap .ccino-pagination .page-numbers {
	display: inline-block !important;
	padding: 8px 14px !important;
	border-radius: 8px !important;
	border: 1px solid var(--ccino-bord) !important;
	color: var(--ccino-bleu) !important;
	text-decoration: none !important;
	font-size: 0.9rem !important;
	background: #fff !important;
}

.ccino-wrap .ccino-pagination .page-numbers.current,
.ccino-wrap .ccino-pagination .page-numbers:hover {
	background: var(--ccino-bleu) !important;
	border-color: var(--ccino-bleu) !important;
	color: #fff !important;
}

/* ------------------------------------------------------------------
 * 4 bis. Fiche en fenêtre modale
 * --------------------------------------------------------------- */

body.ccino-modale-ouverte {
	overflow: hidden;
}

.ccino-modale[hidden] {
	display: none !important;
}

.ccino-modale {
	position: fixed !important;
	inset: 0;
	z-index: 99999;
	display: flex !important;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.ccino-modale__voile {
	position: absolute;
	inset: 0;
	background: rgba(10, 26, 63, 0.55);
	cursor: pointer;
}

.ccino-modale__boite {
	position: relative;
	width: 100%;
	max-width: 560px;
	max-height: 88vh;
	overflow-y: auto;
	padding: 28px 30px 30px !important;
	background: #fff !important;
	border-top: 3px solid var(--ccino-rouge);
	border-radius: 14px;
	box-shadow: 0 30px 70px rgba(4, 26, 86, 0.3);
	animation: ccino-apparition 0.18s ease-out;
}

@keyframes ccino-apparition {
	from { opacity: 0; transform: translateY(10px); }
	to { opacity: 1; transform: none; }
}

.ccino-modale__fermer {
	position: absolute;
	top: 12px;
	right: 14px;
	width: 34px;
	height: 34px;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50% !important;
	background: var(--ccino-fond) !important;
	color: var(--ccino-gris) !important;
	font-size: 24px !important;
	line-height: 1 !important;
	cursor: pointer;
}

.ccino-modale__fermer:hover {
	background: var(--ccino-bleu) !important;
	color: #fff !important;
}

/* Dossier présenté comme le document PDF, dans la modale de gestion. */

.ccino-modale--document .ccino-modale__boite {
	max-width: 780px;
	padding: 26px 28px 30px !important;
}

.ccino-modale .ccino-page {
	width: auto !important;
	max-width: none !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

.ccino-modale .ccino-page__pied {
	display: none;
}

/* Les règles générales du plugin neutralisent marges et titres :
   on rétablit ici l'aération propre au document. */
.ccino-modale .ccino-page__entete {
	padding-bottom: 14px !important;
	margin-bottom: 0 !important;
}

.ccino-modale .ccino-page__identite h1 {
	margin: 0 !important;
	font-size: 1rem !important;
	color: var(--ccino-bleu) !important;
}

.ccino-modale .ccino-page__identite p {
	margin: 3px 0 0 !important;
}

.ccino-modale .ccino-page__ref {
	white-space: nowrap;
	text-align: right !important;
}

.ccino-modale .ccino-etat {
	display: flex !important;
	margin: 18px 0 !important;
	padding: 11px 16px !important;
}

.ccino-modale .ccino-motif {
	margin: -8px 0 18px !important;
	padding: 10px 14px !important;
}

.ccino-modale .ccino-bloc {
	margin: 0 0 20px !important;
}

.ccino-modale .ccino-bloc h2 {
	margin: 0 0 8px !important;
	padding-bottom: 5px !important;
	border-bottom: 1px solid var(--ccino-bord) !important;
	font-size: 0.78rem !important;
	color: var(--ccino-bleu) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.7px !important;
}

.ccino-modale .ccino-fiche th,
.ccino-modale .ccino-fiche td {
	padding: 7px 10px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--ccino-fond) !important;
}

.ccino-modale .ccino-pieces__liste {
	display: flex !important;
	gap: 20px;
	flex-wrap: wrap;
}

.ccino-modale .ccino-piece {
	margin: 0 !important;
	text-align: center !important;
}

.ccino-modale .ccino-piece figcaption {
	margin-top: 5px !important;
	font-size: 0.72rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-modale .ccino-signatures {
	margin-top: 24px;
}

.ccino-modale .ccino-membre-fiche__entete {
	display: flex !important;
	align-items: center;
	gap: 16px;
	padding-bottom: 16px;
	margin-bottom: 16px;
	border-bottom: 1px solid var(--ccino-bord);
}

.ccino-modale .ccino-membre-fiche__logo {
	flex: 0 0 auto;
	width: 76px;
	height: 76px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px;
	background: #fff;
	border: 1px solid var(--ccino-bord);
	border-radius: 12px;
}

.ccino-modale .ccino-membre-fiche__logo img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}

.ccino-modale .ccino-membre-fiche__nom {
	margin: 0 !important;
	font-size: 1.25rem !important;
	font-weight: 700 !important;
	color: var(--ccino-bleu-fonce) !important;
}

.ccino-modale .ccino-membre-fiche__type {
	margin: 3px 0 0 !important;
	font-size: 0.88rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-modale .ccino-membre-fiche__responsable {
	margin: 4px 0 0 !important;
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	color: var(--ccino-encre) !important;
}

.ccino-modale .ccino-membre-fiche__fonction {
	display: block !important;
	font-size: 0.82rem !important;
	font-weight: 400 !important;
	color: var(--ccino-gris) !important;
}

.ccino-modale .ccino-membre-fiche__activite {
	margin: 16px 0 0 !important;
	padding: 12px 14px !important;
	background: var(--ccino-fond) !important;
	border-left: 3px solid var(--ccino-rouge) !important;
	border-radius: 0 8px 8px 0 !important;
	font-size: 0.92rem !important;
	line-height: 1.55 !important;
	color: var(--ccino-encre) !important;
}

/* Fiche descriptive : blocs libellé / valeur, sans allure de tableau. */
.ccino-modale .ccino-membre-fiche__infos {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px 22px;
	margin: 20px 0 0 !important;
	padding: 0 !important;
}

.ccino-modale .ccino-membre-fiche__ligne {
	margin: 0 !important;
	min-width: 0;
}

.ccino-modale .ccino-membre-fiche__ligne:first-child {
	grid-column: 1 / -1;
}

.ccino-modale .ccino-membre-fiche__infos dt {
	margin: 0 0 4px !important;
	font-size: 0.72rem !important;
	font-weight: 600 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.7px !important;
	color: var(--ccino-gris) !important;
}

.ccino-modale .ccino-membre-fiche__infos dd {
	margin: 0 !important;
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	line-height: 1.45 !important;
	color: var(--ccino-encre) !important;
	overflow-wrap: anywhere;
}

.ccino-modale .ccino-membre-fiche__infos dd a {
	color: var(--ccino-bleu) !important;
	text-decoration: none !important;
}

.ccino-modale .ccino-membre-fiche__infos dd a:hover {
	text-decoration: underline !important;
}

@media (max-width: 560px) {
	.ccino-modale .ccino-membre-fiche__infos {
		grid-template-columns: 1fr;
	}
}

/* ------------------------------------------------------------------
 * 5. Gestion des dossiers ([ccino_dossiers])
 * --------------------------------------------------------------- */

.ccino-wrap.ccino-gestion {
	max-width: 1080px !important;
}

.ccino-wrap .ccino-gestion__entete {
	display: flex !important;
	align-items: baseline;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding-bottom: 14px !important;
	margin-bottom: 18px !important;
	border-bottom: 3px solid var(--ccino-bleu) !important;
	position: relative;
}

.ccino-wrap .ccino-gestion__entete::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -3px;
	width: 120px;
	height: 3px;
	background: var(--ccino-rouge);
}

.ccino-wrap .ccino-gestion__titre {
	margin: 0 !important;
	font-size: 1.6rem !important;
	font-weight: 700 !important;
	color: var(--ccino-bleu-fonce) !important;
}

.ccino-wrap .ccino-gestion__utilisateur {
	margin: 0 !important;
	font-size: 0.9rem !important;
	color: var(--ccino-gris) !important;
}

/* Onglets */

.ccino-wrap .ccino-onglets {
	display: flex !important;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px !important;
}

.ccino-wrap a.ccino-onglet {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	padding: 10px 18px !important;
	border: 1.5px solid var(--ccino-bord) !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: var(--ccino-gris) !important;
	font-size: 0.92rem !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: all 0.15s ease;
}

.ccino-wrap a.ccino-onglet:hover {
	border-color: var(--ccino-bleu) !important;
	color: var(--ccino-bleu) !important;
}

.ccino-wrap a.ccino-onglet--actif {
	background: var(--ccino-bleu) !important;
	border-color: var(--ccino-bleu) !important;
	color: #fff !important;
	box-shadow: 0 4px 12px rgba(0, 32, 159, 0.22) !important;
}

.ccino-wrap .ccino-onglet__compte {
	display: inline-block !important;
	min-width: 22px;
	padding: 1px 8px !important;
	border-radius: 999px !important;
	background: rgba(0, 32, 159, 0.1) !important;
	color: inherit !important;
	font-size: 0.78rem !important;
	text-align: center;
}

.ccino-wrap a.ccino-onglet--actif .ccino-onglet__compte {
	background: rgba(255, 255, 255, 0.25) !important;
}

/* Dossiers */

.ccino-wrap .ccino-dossiers {
	display: flex !important;
	flex-direction: column;
	gap: 14px;
}

.ccino-wrap .ccino-dossier {
	display: block !important;
	margin: 0 !important;
	padding: 18px 20px !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-left: 5px solid var(--ccino-gris) !important;
	border-radius: 12px !important;
	box-shadow: 0 4px 14px rgba(4, 26, 86, 0.05) !important;
}

.ccino-wrap .ccino-dossier--attente { border-left-color: #b46a00 !important; }
.ccino-wrap .ccino-dossier--ok { border-left-color: #1e8a4b !important; }
.ccino-wrap .ccino-dossier--refuse { border-left-color: var(--ccino-rouge) !important; }

.ccino-wrap .ccino-dossier__haut {
	display: flex !important;
	align-items: flex-start;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
}

.ccino-wrap .ccino-dossier__nom {
	margin: 0 !important;
	font-size: 1.1rem !important;
	font-weight: 700 !important;
	color: var(--ccino-bleu-fonce) !important;
}

.ccino-wrap .ccino-dossier__meta {
	margin: 3px 0 0 !important;
	font-size: 0.84rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-dossier__ref {
	color: var(--ccino-rouge) !important;
	font-weight: 700;
	letter-spacing: 0.3px;
}

.ccino-wrap .ccino-statut {
	display: inline-block !important;
	padding: 5px 14px !important;
	border-radius: 999px !important;
	font-size: 0.76rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
}

.ccino-wrap .ccino-statut--attente { background: #fff6e5 !important; color: #8a5000 !important; }
.ccino-wrap .ccino-statut--ok { background: #e8f6ed !important; color: #14602f !important; }
.ccino-wrap .ccino-statut--refuse { background: #fdeef0 !important; color: #8f0b21 !important; }

.ccino-wrap .ccino-dossier__badges {
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
}

/* Accès à la gestion des cotisations. */
.ccino-wrap a.ccino-bouton-cotisation {
	display: inline-flex !important;
	align-items: center;
	gap: 8px;
	padding: 9px 18px !important;
	border: 1.5px solid #1e8a4b !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: #14602f !important;
	font-size: 0.86rem !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	transition: all 0.15s ease;
}

.ccino-wrap a.ccino-bouton-cotisation:hover,
.ccino-wrap a.ccino-bouton-cotisation:focus {
	background: #1e8a4b !important;
	color: #fff !important;
	box-shadow: 0 6px 16px rgba(30, 138, 75, 0.22) !important;
}

.ccino-wrap .ccino-bouton-cotisation__compte {
	display: inline-block !important;
	min-width: 20px;
	padding: 1px 7px !important;
	border-radius: 999px !important;
	background: rgba(30, 138, 75, 0.14) !important;
	font-size: 0.76rem !important;
	text-align: center;
}

.ccino-wrap a.ccino-bouton-cotisation:hover .ccino-bouton-cotisation__compte {
	background: rgba(255, 255, 255, 0.25) !important;
}

.ccino-wrap .ccino-cotisation-lien {
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	margin: 0 !important;
}

/* Tableau des paiements. */
.ccino-wrap .ccino-paiements .ccino-paiement__note {
	display: block !important;
	font-size: 0.76rem !important;
	font-weight: 400 !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-paiements form {
	margin: 0 !important;
}

.ccino-wrap .ccino-paiement-form {
	margin-bottom: 26px !important;
}

.ccino-wrap .ccino-paiement-form .ccino-section {
	border-bottom: 0 !important;
}

/* Le tableau des paiements a beaucoup de colonnes : il passe en fiches plus tôt. */
@media (max-width: 900px) {
	.ccino-wrap .ccino-paiements thead {
		display: none;
	}

	.ccino-wrap .ccino-paiements tr {
		display: block;
		padding: 6px 0;
		border-top: 1px solid var(--ccino-bord);
	}

	.ccino-wrap .ccino-paiements td {
		display: flex !important;
		justify-content: space-between;
		gap: 14px;
		padding: 6px 14px !important;
		border: 0 !important;
		text-align: right;
	}

	.ccino-wrap .ccino-paiements td::before {
		content: attr(data-libelle);
		font-weight: 600;
		color: var(--ccino-gris);
		text-align: left;
	}

	.ccino-wrap .ccino-paiements .ccino-paiement__note {
		text-align: right;
	}
}

.ccino-wrap .ccino-etat-adhesion {
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0 0 18px !important;
	padding: 12px 14px !important;
	background: var(--ccino-fond) !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 10px !important;
}

.ccino-wrap .ccino-etat-adhesion__note {
	flex: 1 1 240px;
	font-size: 0.82rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-historique {
	display: flex !important;
	flex-wrap: wrap;
	gap: 8px;
}

.ccino-wrap .ccino-historique__date {
	padding: 4px 12px !important;
	border-radius: 999px !important;
	background: #e8f6ed !important;
	color: #14602f !important;
	font-size: 0.8rem !important;
	font-weight: 600 !important;
}

.ccino-wrap .ccino-dossier__secteurs {
	margin: 10px 0 0 !important;
	font-size: 0.88rem !important;
	color: var(--ccino-bleu) !important;
	font-weight: 600 !important;
}

.ccino-wrap .ccino-dossier__contact {
	display: flex !important;
	flex-wrap: wrap;
	gap: 14px;
	margin: 6px 0 0 !important;
	font-size: 0.86rem !important;
	color: var(--ccino-gris) !important;
}

.ccino-wrap .ccino-dossier__motif {
	margin: 10px 0 0 !important;
	padding: 9px 12px !important;
	background: #fdf7f8 !important;
	border: 1px dashed var(--ccino-bord) !important;
	border-radius: 8px !important;
	font-size: 0.86rem !important;
}

.ccino-wrap .ccino-dossier__detail {
	margin: 12px 0 0 !important;
	border-top: 1px dashed var(--ccino-bord);
	padding-top: 10px !important;
}

.ccino-wrap .ccino-dossier__detail summary {
	cursor: pointer;
	font-size: 0.86rem !important;
	font-weight: 600 !important;
	color: var(--ccino-bleu) !important;
	list-style: revert;
}

.ccino-wrap .ccino-dossier__pieces {
	display: flex !important;
	gap: 16px;
	flex-wrap: wrap;
	margin-top: 12px !important;
}

.ccino-wrap .ccino-dossier__pieces figure {
	margin: 0 !important;
	text-align: center;
}

.ccino-wrap .ccino-dossier__pieces img {
	display: block !important;
	max-width: 110px !important;
	max-height: 90px !important;
	object-fit: contain;
	padding: 6px !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 8px !important;
}

.ccino-wrap .ccino-dossier__pieces figcaption {
	margin-top: 4px;
	font-size: 0.74rem;
	color: var(--ccino-gris);
}

.ccino-wrap .ccino-dossier__table {
	width: 100% !important;
	margin: 10px 0 0 !important;
	border-collapse: collapse !important;
	font-size: 0.86rem !important;
}

.ccino-wrap .ccino-dossier__table th,
.ccino-wrap .ccino-dossier__table td {
	padding: 6px 10px !important;
	text-align: left !important;
	vertical-align: top;
	border: 0 !important;
	border-bottom: 1px solid var(--ccino-fond) !important;
}

.ccino-wrap .ccino-dossier__table th {
	width: 38%;
	color: var(--ccino-gris) !important;
	font-weight: 600 !important;
}

.ccino-wrap .ccino-dossier__actions {
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin: 14px 0 0 !important;
	padding-top: 14px !important;
	border-top: 1px solid var(--ccino-bord);
}

.ccino-wrap button.ccino-bouton.ccino-bouton--rejet,
.ccino-wrap .ccino-bouton.ccino-bouton--rejet {
	background: #fff !important;
	background-image: none !important;
	color: var(--ccino-rouge) !important;
	border: 1.5px solid var(--ccino-rouge) !important;
	box-shadow: none !important;
}

.ccino-wrap button.ccino-bouton.ccino-bouton--rejet:hover,
.ccino-wrap .ccino-bouton.ccino-bouton--rejet:hover {
	background: var(--ccino-rouge) !important;
	color: #fff !important;
}

.ccino-wrap .ccino-dossier__motif-champ {
	flex: 1 1 220px;
	margin: 0 !important;
}

.ccino-wrap a.ccino-lien-doc,
.ccino-wrap button.ccino-lien-doc {
	appearance: none;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	color: var(--ccino-bleu) !important;
	font-size: 0.88rem !important;
	font-family: inherit !important;
	font-weight: 600 !important;
	text-decoration: underline !important;
	cursor: pointer;
}

.ccino-wrap button.ccino-lien-doc {
	margin-right: 4px !important;
}

.ccino-wrap .ccino-dossier__actions a.ccino-lien-doc {
	margin-right: auto !important;
}

/* Bouton bien visible : modification d'un dossier. */
.ccino-wrap a.ccino-bouton-modifier {
	display: inline-flex !important;
	align-items: center;
	gap: 7px;
	padding: 9px 18px !important;
	border: 1.5px solid var(--ccino-bleu) !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: var(--ccino-bleu) !important;
	font-size: 0.86rem !important;
	font-weight: 700 !important;
	text-decoration: none !important;
	transition: all 0.15s ease;
}

.ccino-wrap a.ccino-bouton-modifier::before {
	content: "✎";
	font-size: 0.95rem;
	line-height: 1;
}

.ccino-wrap a.ccino-bouton-modifier:hover,
.ccino-wrap a.ccino-bouton-modifier:focus {
	background: var(--ccino-bleu) !important;
	color: #fff !important;
	box-shadow: 0 6px 16px rgba(0, 32, 159, 0.22) !important;
}

.ccino-wrap a.ccino-lien-signe {
	padding: 4px 12px !important;
	border-radius: 999px !important;
	background: rgba(30, 138, 75, 0.1) !important;
	color: #14602f !important;
	font-size: 0.8rem !important;
	font-weight: 600 !important;
	text-decoration: none !important;
}

/* Pièces déjà enregistrées, dans l'écran de correction. */
.ccino-wrap .ccino-piece-actuelle {
	width: 62px !important;
	height: 62px !important;
	object-fit: contain;
	padding: 5px !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 8px !important;
}

.ccino-wrap .ccino-scan-actuel {
	display: flex !important;
	align-items: center;
	flex-wrap: wrap;
	gap: 14px;
	padding: 10px 12px !important;
	background: var(--ccino-fond) !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 9px !important;
	font-size: 0.86rem !important;
}

.ccino-wrap .ccino-scan-actuel__retirer {
	display: flex !important;
	align-items: center;
	gap: 6px;
	margin: 0 !important;
	font-size: 0.8rem !important;
	font-weight: 500 !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--ccino-rouge) !important;
	cursor: pointer;
}

.ccino-wrap .ccino-scan-actuel__retirer input {
	width: 16px !important;
	height: 16px !important;
	accent-color: var(--ccino-rouge);
}

.ccino-wrap .ccino-bouton-supprimer {
	appearance: none;
	margin-left: 4px !important;
	padding: 8px 14px !important;
	border: 1px solid var(--ccino-bord) !important;
	border-radius: 999px !important;
	background: #fff !important;
	color: var(--ccino-gris) !important;
	font-size: 0.82rem !important;
	font-family: inherit !important;
	font-weight: 600 !important;
	cursor: pointer;
	transition: all 0.15s ease;
}

.ccino-wrap .ccino-bouton-supprimer:hover {
	border-color: var(--ccino-rouge) !important;
	background: var(--ccino-rouge) !important;
	color: #fff !important;
}

.ccino-wrap .ccino-acces {
	padding: 34px 30px !important;
	text-align: center !important;
	background: #fff !important;
	border: 1px solid var(--ccino-bord) !important;
	border-top: 4px solid var(--ccino-rouge) !important;
	border-radius: var(--ccino-rayon) !important;
}

.ccino-wrap .ccino-acces h2 {
	margin: 0 0 8px !important;
	font-size: 1.3rem !important;
	color: var(--ccino-bleu-fonce) !important;
	text-align: center !important;
}

.ccino-wrap .ccino-acces p {
	margin: 0 0 14px !important;
	color: var(--ccino-gris) !important;
}

/* ------------------------------------------------------------------
 * 6. Adaptation mobile
 * --------------------------------------------------------------- */

@media (max-width: 860px) {
	.ccino-wrap .ccino-cartes--3,
	.ccino-wrap .ccino-cartes--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.ccino-wrap .ccino-grille,
	.ccino-wrap .ccino-cotisations,
	.ccino-wrap .ccino-cartes--2,
	.ccino-wrap .ccino-cartes--3,
	.ccino-wrap .ccino-cartes--4 {
		grid-template-columns: 1fr;
	}

	.ccino-wrap .ccino-form__entete,
	.ccino-wrap .ccino-form__consigne,
	.ccino-wrap .ccino-section,
	.ccino-wrap .ccino-actions {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}

	.ccino-wrap .ccino-messages:not(:empty) {
		padding-left: 18px;
		padding-right: 18px;
	}

	.ccino-wrap .ccino-form__entete {
		flex-direction: column;
		text-align: center !important;
	}

	.ccino-wrap .ccino-bouton {
		width: 100% !important;
		text-align: center !important;
	}

	.ccino-wrap .ccino-dossier__actions .ccino-bouton {
		width: auto !important;
	}

	.ccino-wrap .ccino-onglet {
		flex: 1 1 auto;
		justify-content: center;
	}

	.ccino-wrap .ccino-tableau thead {
		display: none;
	}

	.ccino-wrap .ccino-tableau tr {
		display: block;
		border-top: 1px solid var(--ccino-bord);
	}

	.ccino-wrap .ccino-tableau td {
		display: flex !important;
		justify-content: space-between;
		gap: 12px;
		border: 0 !important;
	}

	.ccino-wrap .ccino-tableau td::before {
		content: attr(data-libelle);
		font-weight: 600;
		color: var(--ccino-gris);
	}
}