/* ==================================================================
   CCC — Rafraîchissement graphique du thème Sweet Date
   Charte conservée : violet #9b59b6, accents rose/magenta, logo inchangé.
   Désactivable : define( 'CCC_DESIGN', false ); dans wp-config.php
   ================================================================== */

:root {
	--ccc-violet: #9b59b6;
	--ccc-violet-fonce: #7d3c98;
	--ccc-rose: #c2187a;
	--ccc-rose-doux: #fbf3fb;
	--ccc-degrade: linear-gradient(135deg, #c2187a 0%, #8e44ad 100%);
	--ccc-ombre: 0 6px 20px rgba(125, 60, 152, .18);
}

/* ------------------------------------------------------------------
   1. EN-TÊTE ET MENU
   ------------------------------------------------------------------ */
html body .header-bg {
	background: linear-gradient(180deg, #a463bf 0%, #9b59b6 60%, #9150ad 100%) !important;
	box-shadow: 0 2px 12px rgba(80, 30, 100, .18);
}

/* Liens du menu : pastilles arrondies au survol */
html body .top-bar ul > li:not(.name):not(.toggle-topbar) > a {
	font-weight: 600 !important;
	letter-spacing: .2px;
	border-radius: 20px;
	transition: background-color .2s, color .2s;
}
@media only screen and (min-width: 941px) {
	html body .top-bar ul > li:not(.name):not(.toggle-topbar) > a:hover,
	html body .top-bar ul > li.active > a,
	html body .top-bar ul > li.current-menu-item > a {
		background: rgba(255, 255, 255, .18) !important;
		color: #fff !important;
	}
	html body .top-bar ul > li.has-dropdown .dropdown {
		border-radius: 0 0 10px 10px;
		overflow: hidden;
		box-shadow: var(--ccc-ombre);
	}
}

/* Menu collant (au défilement) */
html body .contain-to-grid.fixed,
html body .contain-to-grid.fixed .top-bar {
	background: rgba(155, 89, 182, .97) !important;
}
html body .contain-to-grid.fixed {
	box-shadow: 0 3px 14px rgba(80, 30, 100, .25);
}

/* Boutons Se connecter / Inscription / Profil */
html body .login-buttons .button-group > li > a.button,
html body .login-buttons .button-group > li > .button {
	border-radius: 20px !important;
	font-weight: 700 !important;
	padding: 6px 14px !important;
	border: 0 !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
	transition: transform .1s, filter .2s;
}
html body .login-buttons .button-group > li > a.button:hover { filter: brightness(1.08); transform: translateY(-1px); }
html body .login-buttons .button-group > li + li { margin-left: 6px !important; }
html body .login-buttons .header-register-button > a.button {
	background: var(--ccc-degrade) !important;
	color: #fff !important;
}
html body .login-buttons .header-login-button > a.button {
	background: #fff !important;
	color: var(--ccc-violet-fonce) !important;
}

/* Menu mobile */
@media only screen and (max-width: 940px) {
	html body .top-bar.expanded section ul li > a {
		border-bottom: 1px solid rgba(255, 255, 255, .12);
		padding-top: 12px !important;
		padding-bottom: 12px !important;
		border-radius: 0;
	}
	html body .top-bar .toggle-topbar a i { font-size: 22px; }
}

/* ------------------------------------------------------------------
   2. PAGE D'ACCUEIL
   ------------------------------------------------------------------ */

/* Bouton « Je rejoins les membres » (bouton WPBakery) */
html body.home .vc_btn3,
html body.home .vc_btn,
html body.home a.vc_general.vc_btn3 {
	background: var(--ccc-degrade) !important;
	border: 0 !important;
	border-radius: 30px !important;
	padding: 14px 34px !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	box-shadow: 0 6px 18px rgba(194, 24, 122, .35) !important;
	transition: transform .15s, box-shadow .15s !important;
}
html body.home .vc_btn3:hover,
html body.home a.vc_general.vc_btn3:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(194, 24, 122, .45) !important;
}

/* Bloc des membres */
html body .section-members {
	background: var(--ccc-rose-doux);
	border-radius: 18px;
	padding: 18px 10px 26px;
	margin: 10px auto 30px;
	max-width: 1180px;
}
html body .section-members .item-options {
	text-align: center;
	margin-bottom: 18px;
}
html body .section-members .item-options a {
	display: inline-block;
	padding: 6px 18px;
	margin: 0 4px;
	border-radius: 20px;
	color: var(--ccc-violet-fonce) !important;
	font-weight: 600;
	border-bottom: 0 !important;
	background: #fff;
	box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}
html body .section-members .item-options a.selected {
	background: var(--ccc-violet) !important;
	color: #fff !important;
}
html body .section-members .item-options a.selected:after { display: none !important; }

html body .kleo-bp-active-members li.top-active-members,
html body .kleo-bp-active-members li {
	text-align: center;
}
html body .kleo-bp-active-members li img.avatar,
html body .kleo-bp-active-members li .avatar {
	border-radius: 50% !important;
	border: 4px solid #fff !important;
	box-shadow: 0 0 0 3px rgba(155, 89, 182, .45), var(--ccc-ombre) !important;
	transition: transform .2s, box-shadow .2s;
}
html body .kleo-bp-active-members li:hover img.avatar {
	transform: translateY(-4px) scale(1.04);
	box-shadow: 0 0 0 3px var(--ccc-rose), 0 10px 24px rgba(125, 60, 152, .3) !important;
}
html body .kleo-bp-active-members li a {
	color: #3d2a47 !important;
	font-weight: 700;
}
html body .kleo-bp-active-members li .item-meta,
html body .kleo-bp-active-members li .activity {
	color: #9a8aa3 !important;
	font-size: 12px;
}

/* ------------------------------------------------------------------
   3. PROFIL MEMBRE
   ------------------------------------------------------------------ */
html body #profile {
	background: linear-gradient(135deg, #7d3c98 0%, #9b59b6 45%, #c2408f 100%) !important;
	padding-top: 26px !important;
	padding-bottom: 30px !important;
}
html body #profile h2,
html body #profile .user-nicename { color: #fff !important; }
html body #profile .activity { color: rgba(255, 255, 255, .8) !important; }

/* Photo de profil */
html body #item-header-avatar img,
html body #profile #item-header-avatar img.avatar {
	border-radius: 16px !important;
	border: 5px solid #fff !important;
	box-shadow: 0 10px 28px rgba(40, 10, 60, .35) !important;
	max-width: 100%;
	height: auto;
}

/* Boutons Ajouter en ami / Message privé / Rompre le contact */
html body #profile .generic-button a,
html body #profile #item-buttons a,
html body #profile .pull-two a {
	display: block;
	background: #fff !important;
	color: var(--ccc-violet-fonce) !important;
	border-radius: 20px !important;
	font-weight: 700 !important;
	font-size: 12px !important;
	line-height: 1.25 !important;
	padding: 8px 10px !important;
	margin-bottom: 8px !important;
	text-align: center;
	border: 0 !important;
	box-shadow: 0 3px 10px rgba(40, 10, 60, .2);
	white-space: normal;
}
html body #profile .generic-button a:hover,
html body #profile .pull-two a:hover {
	background: var(--ccc-degrade) !important;
	color: #fff !important;
}
html body #profile .generic-button.send-message a,
html body #profile a.send-message {
	background: var(--ccc-degrade) !important;
	color: #fff !important;
}

/* Onglets « En bref » / « Je recherche » */
html body #profile dl.tabs.pill.custom dd > a {
	border-radius: 20px !important;
	background: rgba(255, 255, 255, .2) !important;
	color: #fff !important;
	font-weight: 600;
	border: 0 !important;
}
html body #profile dl.tabs.pill.custom dd.active > a {
	background: #fff !important;
	color: var(--ccc-violet-fonce) !important;
}
html body #profile ul.tabs-content.custom .dl-horizontal dt,
html body #profile ul.tabs-content.custom .dl-horizontal dd {
	background: rgba(255, 255, 255, .14) !important;
	border-radius: 6px;
	margin-bottom: 4px !important;
}
html body #profile ul.tabs-content.custom .dl-horizontal dt { color: #fff !important; font-weight: 700; }
html body #profile ul.tabs-content.custom .dl-horizontal dd { color: #fff !important; }
html body #profile .callout {
	background: rgba(255, 255, 255, .14) !important;
	border-radius: 10px;
	border: 0 !important;
	color: #fff;
}

/* Sous-navigation du profil (Profil, Messages, Amis…) : onglet actif en violet, sans bulle */
html body #object-nav ul li.current > a,
html body #object-nav ul li.selected > a,
html body #subnav ul li.current > a,
html body #subnav ul li.selected > a {
	color: var(--ccc-violet-fonce) !important;
	font-weight: 700 !important;
}

/* ------------------------------------------------------------------
   4. CONNEXION / INSCRIPTION (fenêtres et page /register/)
   ------------------------------------------------------------------ */
html body .reveal-modal-bg {
	background: rgba(45, 15, 60, .65) !important;
	backdrop-filter: blur(3px);
}
html body .reveal-modal {
	border-radius: 18px !important;
	border: 0 !important;
	padding: 34px 30px 26px !important;
	box-shadow: 0 25px 60px rgba(30, 5, 45, .45) !important;
	overflow: hidden;
}
html body .reveal-modal:before {
	content: "";
	position: absolute;
	left: 0; right: 0; top: 0;
	height: 6px;
	background: var(--ccc-degrade);
}
html body .reveal-modal h5 {
	color: var(--ccc-violet-fonce) !important;
	font-weight: 800 !important;
	letter-spacing: .3px;
	margin-bottom: 18px !important;
}
html body .reveal-modal input.inputbox,
html body .reveal-modal input[type=text],
html body .reveal-modal input[type=email],
html body .reveal-modal input[type=password],
html body #signup_form input[type=text],
html body #signup_form input[type=email],
html body #signup_form input[type=password],
html body #signup_form select,
html body #signup_form textarea {
	height: auto !important;
	min-height: 46px;
	border-radius: 10px !important;
	border: 2px solid #e6d8ee !important;
	background: #fcf9fd !important;
	box-shadow: none !important;
	padding: 10px 14px !important;
	font-size: 15px !important;
	transition: border-color .15s, background .15s;
}
html body .reveal-modal input:focus,
html body #signup_form input:focus,
html body #signup_form select:focus,
html body #signup_form textarea:focus {
	border-color: var(--ccc-violet) !important;
	background: #fff !important;
	outline: none;
}
html body .reveal-modal button.button,
html body .reveal-modal input[type=submit],
html body #signup_form input[type=submit],
html body #signup_form #signup_submit {
	background: var(--ccc-degrade) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 26px !important;
	padding: 13px 30px !important;
	font-size: 15px !important;
	font-weight: 800 !important;
	letter-spacing: .4px;
	box-shadow: 0 6px 16px rgba(194, 24, 122, .3) !important;
	transition: transform .1s, filter .2s;
}
html body .reveal-modal button.button:hover,
html body #signup_form input[type=submit]:hover { filter: brightness(1.08); transform: translateY(-1px); }
html body .reveal-modal .subheader .button,
html body .reveal-modal a.small.button {
	border-radius: 20px !important;
	background: #f3e9f7 !important;
	color: var(--ccc-violet-fonce) !important;
	border: 0 !important;
	font-weight: 700 !important;
	box-shadow: none !important;
}
html body .reveal-modal .close-reveal-modal {
	top: 14px !important;
	right: 18px !important;
	color: #b9a6c4 !important;
	font-size: 30px !important;
}
html body .reveal-modal small,
html body .reveal-modal label { color: #6f5d79; }
html body .reveal-modal a { color: var(--ccc-violet); }

/* Page d'inscription /register/ */
html body #signup_form,
html body #buddypress #signup_form {
	background: #fff;
	border-radius: 18px;
	padding: 26px;
	box-shadow: var(--ccc-ombre);
}
html body #signup_form h4,
html body #signup_form h3 { color: var(--ccc-violet-fonce) !important; font-weight: 800; }

@media only screen and (max-width: 767px) {
	html body .reveal-modal { padding: 28px 18px 20px !important; }
	html body .reveal-modal h5 .subheader { float: none !important; display: block; margin-top: 10px; }
	html body .section-members { border-radius: 0; padding: 14px 4px 20px; }
	html body #profile .generic-button a,
	html body #profile .pull-two a { display: inline-block; margin: 0 4px 8px 0 !important; }
}

/* ------------------------------------------------------------------
   5. HARMONISATION DES COULEURS SECONDAIRES (ancien gris-bleu #34495e)
   ------------------------------------------------------------------ */
html body .login-buttons a.btn-logout,
html body .login-buttons .btn-profile > a.button {
	border-radius: 20px !important;
	font-weight: 700 !important;
	border: 0 !important;
}
html body .login-buttons a.btn-logout { background: #5b2a6e !important; color: #fff !important; }
html body .login-buttons .btn-profile > a.button { background: #fff !important; color: var(--ccc-violet-fonce) !important; }

html body .form-search,
html body .form-header {
	background: #5b2a6e !important;
}
html body .widgets .form-search,
html body .widgets .form-header { border-radius: 12px; }
html body .widgets .form-header { border-radius: 12px 12px 0 0; }
html body .widgets .form-header + .form-search,
html body .widgets .form-header + form.form-search { border-radius: 0 0 12px 12px; }

html body #object-nav ul li.selected,
html body #object-nav ul li.current,
html body div.item-list-tabs li.selected { border-bottom-color: var(--ccc-violet) !important; }
html body #object-nav ul li.selected:after,
html body div.item-list-tabs li.selected:after { border-top-color: var(--ccc-violet) !important; }

/* Bouton « Je rejoins les membres » de l'accueil (lien avec style en ligne #cc33ff) */
html body a[style*="cc33ff"] {
	background: var(--ccc-degrade) !important;
	padding: 14px 34px !important;
	border-radius: 30px !important;
	font-family: inherit !important;
	box-shadow: 0 6px 18px rgba(194, 24, 122, .35);
	transition: transform .15s, box-shadow .15s !important;
}
html body a[style*="cc33ff"]:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 24px rgba(194, 24, 122, .45);
}

/* Bouton PROFIL (menu déroulant) — toutes tailles d'écran */
html body .login-buttons .btn-profile .button.split.dropdown {
	background: #fff !important;
	border: 0 !important;
	border-radius: 20px !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
	padding: 0 34px 0 0 !important;
	height: auto !important;
}
html body .login-buttons .btn-profile .button.split.dropdown > a.button {
	background: transparent !important;
	color: var(--ccc-violet-fonce) !important;
	box-shadow: none !important;
	border: 0 !important;
	border-radius: 20px 0 0 20px !important;
	font-weight: 700 !important;
	padding: 6px 12px 6px 14px !important;
}
html body .login-buttons .btn-profile .button.split.dropdown > span {
	background: transparent !important;
	border-left: 1px solid #eadcf0 !important;
	width: 34px !important;
	height: 100% !important;
	top: 0 !important;
	border-radius: 0 20px 20px 0;
}
html body .login-buttons .btn-profile .button.split.dropdown > span:after {
	border-color: var(--ccc-violet-fonce) transparent transparent transparent !important;
}
html body .login-buttons .btn-profile .button.split.dropdown > ul {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: var(--ccc-ombre);
}

/* ------------------------------------------------------------------
   6. MOBILE (≤ 767 px) : en-tête centré, menu violet, accueil aéré
   ------------------------------------------------------------------ */
@media only screen and (max-width: 767px) {

	/* Logo centré */
	html body #header .row > .four.columns { text-align: center; float: none; width: 100%; }
	html body #header h1#logo { display: inline-block; margin: 8px auto 4px !important; float: none !important; }
	html body #header h1#logo img { max-height: 60px; width: auto; margin: 0 auto; }

	/* Boutons connexion / inscription / profil centrés sur une ligne */
	html body #header .login-buttons {
		float: none !important;
		width: 100% !important;
		text-align: center;
		padding: 0 10px !important;
	}
	html body #header .login-buttons ul.button-group {
		float: none !important;
		display: flex !important;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		gap: 8px;
		margin: 2px auto 10px !important;
	}
	html body #header .login-buttons ul.button-group > li { float: none !important; margin: 0 !important; }
	html body #header .login-buttons ul.button-group > li > a.button,
	html body #header .login-buttons .btn-profile .button.split.dropdown > a.button {
		font-size: 12px !important;
		padding: 7px 14px !important;
		line-height: 1.2 !important;
	}
	html body #header .login-buttons .btn-profile .button.split.dropdown > a.button { padding-right: 10px !important; }
	html body #header .kleo-notifications { top: -8px !important; }

	/* Barre de menu : violet foncé arrondi au lieu du gris-bleu */
	html body #header .eight.columns { width: 100% !important; float: none !important; }
	html body .contain-to-grid,
	html body .contain-to-grid .top-bar,
	html body .top-bar,
	html body .top-bar ul li.name {
		background: #7d3c98 !important;
	}
	html body .contain-to-grid { float: none !important; margin: 0 10px 12px; width: auto !important; border-radius: 12px; overflow: hidden; }
	html body .top-bar ul li.name h1 a,
	html body .top-bar ul li.toggle-topbar,
	html body .top-bar ul li.toggle-topbar a { background: #7d3c98 !important; color: #fff !important; font-weight: 700; }
	html body .top-bar.expanded section ul,
	html body .top-bar section ul li,
	html body .top-bar section ul li > a {
		background: #7d3c98 !important;
		color: #fff !important;
	}
	html body .top-bar section ul li > a:active,
	html body .top-bar section ul li > a:hover { background: #9b59b6 !important; }

	/* Accueil */
	html body.home a[style*="cc33ff"] {
		font-size: 16px !important;
		padding: 12px 26px !important;
	}
	html body .kleo-bp-active-members li img.avatar {
		width: 96px !important;
		height: 96px !important;
		border-width: 3px !important;
	}
	html body .kleo-bp-active-members li { margin-bottom: 14px; }
}

/* Grille des membres : alignement régulier sur mobile et tablette */
@media only screen and (max-width: 940px) {
	html body .kleo-bp-active-members {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr);
		gap: 18px 10px;
		justify-items: center;
		align-items: start;
		margin: 0 !important;
		padding: 0 6px !important;
	}
	html body .kleo-bp-active-members > li {
		float: none !important;
		width: 100% !important;
		max-width: 170px;
		margin: 0 !important;
		padding: 0 !important;
		left: auto !important;
		right: auto !important;
		text-align: center;
	}
	/* Membre seul sur la dernière ligne : centré */
	html body .kleo-bp-active-members > li:last-child:nth-child(odd) { grid-column: 1 / -1; }
	html body .kleo-bp-active-members > li img.avatar { display: block; margin: 0 auto 8px !important; }
	html body .kleo-bp-active-members > li a { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media only screen and (min-width: 600px) and (max-width: 940px) {
	html body .kleo-bp-active-members { grid-template-columns: repeat(3, 1fr); }
	html body .kleo-bp-active-members > li:last-child:nth-child(odd) { grid-column: auto; }
}

/* ------------------------------------------------------------------
   7. PIED DE PAGE : membres actuellement en ligne
   ------------------------------------------------------------------ */
html body .ccc-en-ligne h5 { color: #fff !important; margin-bottom: 12px; }
html body .ccc-en-ligne .ccc-point-vert { color: #4cd964; font-size: 10px; vertical-align: middle; margin-right: 4px; }
html body .ccc-en-ligne-liste {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(62px, 1fr));
	gap: 12px 8px;
}
html body .ccc-en-ligne-liste li { margin: 0 !important; padding: 0 !important; text-align: center; }
html body .ccc-en-ligne-liste li:before { display: none !important; content: none !important; }
html body .ccc-en-ligne-liste a { display: block; color: #fff !important; text-decoration: none; }
html body .ccc-en-ligne-liste img.avatar {
	width: 54px !important;
	height: 54px !important;
	border-radius: 50% !important;
	border: 2px solid #fff !important;
	box-shadow: 0 0 0 2px #4cd964;
	display: block;
	margin: 0 auto 4px !important;
	transition: transform .15s;
}
html body .ccc-en-ligne-liste a:hover img.avatar { transform: scale(1.08); }
html body .ccc-en-ligne-liste span {
	display: block;
	font-size: 11px;
	line-height: 1.2;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
html body .ccc-en-ligne-vide { color: rgba(255, 255, 255, .85) !important; font-style: italic; }
@media only screen and (max-width: 767px) {
	html body .ccc-en-ligne { margin: 10px 0 20px; }
	html body .ccc-en-ligne-liste { grid-template-columns: repeat(4, 1fr); }
}

/* ------------------------------------------------------------------
   8. RECHERCHE RAPIDE (barre horizontale) : libellés entiers
   ------------------------------------------------------------------ */
@media only screen and (min-width: 768px) {
	html body #horizontal_search > .row { display: flex; align-items: center; flex-wrap: nowrap; }
	html body #horizontal_search > .row > .columns { float: none !important; width: auto !important; }
	html body #horizontal_search > .row > .columns:first-child { flex: 0 0 auto; }
	html body #horizontal_search > .row > .hz-select { flex: 1 1 0; min-width: 0; }
	html body #horizontal_search > .row > .hz-submit { flex: 0 0 auto; }
}
html body #horizontal_search .hz-select .custom.dropdown a.current {
	padding-right: 30px !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
html body #horizontal_search .hz-submit .button,
html body #horizontal_search button {
	background: var(--ccc-violet) !important;
	border: 0 !important;
	border-radius: 18px !important;
}

/* ------------------------------------------------------------------
   9. MENU MOBILE OUVERT : tous les liens visibles et lisibles
   ------------------------------------------------------------------ */
@media only screen and (max-width: 940px) {
	html body .contain-to-grid { overflow: visible !important; }
	html body .top-bar.expanded { height: auto !important; min-height: 0 !important; overflow: visible !important; border-radius: 12px; padding-bottom: 6px; }
	html body .top-bar.expanded section { position: static !important; height: auto !important; }
	html body .top-bar.expanded section ul,
	html body .top-bar.expanded section ul li { height: auto !important; float: none !important; width: 100% !important; }
	html body .top-bar.expanded section ul li > a {
		display: block !important;
		height: auto !important;
		line-height: 1.3 !important;
		padding: 13px 20px !important;
		font-size: 15px !important;
		white-space: normal !important;
		border-radius: 0 !important;
		border-bottom: 1px solid rgba(255, 255, 255, .15) !important;
	}
	html body .top-bar.expanded section ul li:last-child > a { border-bottom: 0 !important; }
}

/* ------------------------------------------------------------------
   10. PROFIL : boutons Ami / Message côte à côte sous la photo
   ------------------------------------------------------------------ */
html body #profile #item-header-avatar + .pull-two {
	float: none !important;
	clear: both;
	width: 100% !important;
	position: static !important;
	right: auto !important;
	left: auto !important;
	padding-top: 14px !important;
}
html body #profile #item-buttons { display: flex !important; flex-wrap: wrap; gap: 10px; width: auto !important; }
html body #profile #item-buttons .generic-button { float: none !important; margin: 0 !important; width: auto !important; }
html body #profile #item-buttons .generic-button a {
	display: inline-block !important;
	white-space: nowrap !important;
	width: auto !important;
	margin: 0 !important;
	padding: 9px 18px !important;
	font-size: 13px !important;
}

/* ------------------------------------------------------------------
   11. ONGLETS DU PROFIL SANS « BULLES » + RECHERCHE DE MESSAGES
   ------------------------------------------------------------------ */
html body #object-nav ul li a,
html body #object-nav ul li a:hover,
html body #object-nav ul li a:focus,
html body #subnav ul li a,
html body #subnav ul li a:hover,
html body #subnav ul li a:focus,
html body .item-list-tabs ul li a:hover,
html body .item-list-tabs ul li a:focus {
	background: transparent !important;
	background-image: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
html body #object-nav ul li a:hover,
html body #subnav ul li a:hover { color: var(--ccc-violet) !important; }

/* Champ « Rechercher un message » assez large pour afficher tout le texte */
html body #messages_search,
html body .message-search input[type=search],
html body .message-search input[type=text] {
	width: 240px !important;
	max-width: 100%;
}
html body #messages_search::placeholder { color: #9a9a9a; opacity: 1; }
@media only screen and (max-width: 767px) {
	html body .message-search,
	html body #search-message-form { float: none !important; width: 100% !important; }
	html body #messages_search { width: calc(100% - 110px) !important; }
}

/* ------------------------------------------------------------------
   12. MOTEUR DE RECHERCHE (colonne de droite) : un seul cadre harmonisé
   ------------------------------------------------------------------ */
html body .form-wrapper {
	border: 0 !important;
	border-radius: 14px !important;
	overflow: hidden;
	background: #5b2a6e !important;
	box-shadow: 0 6px 20px rgba(125, 60, 152, .18);
}
html body .form-wrapper .form-header,
html body .form-wrapper .form-search {
	border: 0 !important;
	border-radius: 0 !important;
	background: #5b2a6e !important;
}
html body .form-wrapper .form-header { padding: 14px 14px 0 !important; min-height: 0; }
html body .form-wrapper .form-search { padding: 14px 12px 18px !important; }
html body .form-wrapper .notch,
html body .form-wrapper .form-footer { display: none !important; }
html body .form-wrapper .form-search .row:last-of-type .columns { width: 100% !important; margin-left: 0 !important; float: none !important; text-align: center; }
html body .form-wrapper .form-search .button {
	display: block;
	max-width: 100%;
	white-space: nowrap;
	margin: 6px auto 0 !important;
	border-radius: 20px !important;
}

/* ------------------------------------------------------------------
   13. MENU : petite loupe à droite de « Liste des membres »
   ------------------------------------------------------------------ */
html body .top-bar a[href$="/membres/"]:after {
	content: "\f002";
	font-family: FontAwesome;
	font-weight: normal;
	font-style: normal;
	margin-left: 7px;
	font-size: .9em;
	display: inline-block;
}

/* ------------------------------------------------------------------
   14. Bouton RECHERCHE centré (colonne de droite)
   ------------------------------------------------------------------ */
html body .form-wrapper .form-search .offset-by-five { display: block !important; width: 100% !important; margin-left: 0 !important; text-align: center; }
html body .form-wrapper .form-search .button { float: none !important; display: block !important; margin: 6px auto 0 !important; }

/* ------------------------------------------------------------------
   15. Inscription : bouton « Terminer l'inscription » dans le cadre blanc
   ------------------------------------------------------------------ */
html body #signup_form { overflow: hidden; }
html body #signup_form .submit { clear: both; float: none !important; text-align: right; padding: 16px 0 4px; }
html body #signup_form #signup_submit { float: none !important; display: inline-block; }
@media only screen and (max-width: 767px) {
	html body #signup_form .submit { text-align: center; }
	html body #signup_form #signup_submit { width: 100%; }
}

/* ------------------------------------------------------------------
   16. Liste des membres : boutons « Voir le profil » / « Ajouter comme ami »… empilés
   ------------------------------------------------------------------ */
html body .bp-member-dir-buttons { display: flex; flex-direction: column; align-items: center; gap: 6px; }
html body .bp-member-dir-buttons > a.button,
html body .bp-member-dir-buttons .generic-button { margin: 0 !important; float: none !important; }
html body .bp-member-dir-buttons .generic-button a.button {
	white-space: normal !important;
	line-height: 1.3 !important;
	height: auto !important;
	padding: 7px 12px !important;
	max-width: 100%;
	text-align: center;
}

/* ------------------------------------------------------------------
   17. Formulaires de message / commentaire : bouton d'envoi aux couleurs du site
   ------------------------------------------------------------------ */
html body #respond input[type=submit],
html body #respond button[type=submit],
html body #respond .button {
	background: var(--ccc-degrade) !important;
	border: 0 !important;
	border-radius: 22px !important;
	color: #fff !important;
	font-weight: 700 !important;
	padding: 11px 26px !important;
}

/* ------------------------------------------------------------------
   18. MENU ordinateur : les 4 liens sur une seule ligne
   ------------------------------------------------------------------ */
@media only screen and (min-width: 941px) {
	html body .top-bar ul > li:not(.name):not(.toggle-topbar) > a {
		padding-left: 9px !important;
		padding-right: 9px !important;
		white-space: nowrap;
	}
}

/* ------------------------------------------------------------------
   19. Article « Bienvenue sur CCC » : date et bouton mis en évidence
   ------------------------------------------------------------------ */
html body #post-1 .article-meta .link-list > li:first-child {
	background: linear-gradient(135deg, #c2187a, #8e44ad);
	color: #fff;
	border-radius: 20px;
	padding: 3px 12px;
	box-shadow: 0 3px 10px rgba(194, 24, 122, .3);
}
html body #post-1 .article-meta .link-list > li:first-child a,
html body #post-1 .article-meta .link-list > li:first-child i { color: #fff !important; font-weight: 700; }
html body #post-1 a.button {
	background: linear-gradient(135deg, #c2187a, #8e44ad) !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 30px !important;
	padding: 11px 24px !important;
	font-weight: 700 !important;
	box-shadow: 0 5px 14px rgba(194, 24, 122, .35);
	transition: transform .15s, box-shadow .15s;
}
html body #post-1 a.button:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(194, 24, 122, .45); }
html body #post-1 a.button:after { content: " \2192"; }

/* ------------------------------------------------------------------
   20. Accueil : bouton « Rejoindre les camping-caristes coquins »
   ------------------------------------------------------------------ */
html body a.ccc-cta {
	display: inline-flex !important;
	align-items: center;
	gap: 10px;
	max-width: 100%;
	background: linear-gradient(135deg, #e91e8c, #c2187a 45%, #8e44ad) !important;
	color: #fff !important;
	padding: 11px 14px 11px 22px !important;
	border-radius: 40px !important;
	font-size: 15px !important;
	line-height: 1.25 !important;
	font-weight: 700 !important;
	font-family: inherit !important;
	letter-spacing: .2px;
	text-align: left !important;
	box-shadow: 0 6px 18px rgba(194, 24, 122, .4) !important;
	animation: ccc-pulse 2.4s ease-in-out infinite;
	transition: transform .15s !important;
}
html body a.ccc-cta:hover { transform: translateY(-2px); animation: none; }
html body a.ccc-cta .ccc-cta-fleche {
	flex: 0 0 30px;
	height: 30px;
	border-radius: 50%;
	background: #fff;
	color: #c2187a;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	transition: transform .2s;
}
html body a.ccc-cta:hover .ccc-cta-fleche { transform: translateX(3px); }
@keyframes ccc-pulse {
	0%, 100% { box-shadow: 0 6px 18px rgba(194, 24, 122, .4), 0 0 0 0 rgba(233, 30, 140, .45); }
	50%      { box-shadow: 0 6px 18px rgba(194, 24, 122, .4), 0 0 0 10px rgba(233, 30, 140, 0); }
}
@media (prefers-reduced-motion: reduce) { html body a.ccc-cta { animation: none; } }

/* Mobile : le bouton tient sur une seule ligne */
@media only screen and (max-width: 600px) {
	html body a.ccc-cta.ccc-cta.ccc-cta {
		white-space: nowrap;
		font-size: clamp(12px, 3.9vw, 15px) !important;
		letter-spacing: 0;
		gap: 7px;
		padding: 9px 9px 9px 15px !important;
		line-height: 1.2 !important;
	}
	html body a.ccc-cta.ccc-cta .ccc-cta-fleche { flex-basis: 24px; width: 24px; height: 24px; font-size: 13px; }
}