/* =====================================================================
   FICHE CAMPING — Charte 2026
   Fond blanc, vert #089A08 (actions, titres), jaune #FADB45 (accents).
   Charge après marque-2026.css / composants-cdf.css : surcharge
   les règles historiques de css/interface.css pour la fiche camping.
   ===================================================================== */

/* --- Titre de la fiche : à gauche, taille maîtrisée (débordait sur mobile) --- */

.div-title-camping,
.div-title-tourisme {
	text-align: left;
}

.title-camping,
.title-tourisme {
	font-family: var(--font-titre-cdf);
	font-size: clamp(1.6rem, 4.5vw, 3rem);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: .02rem;
	text-align: left;
	display: block;
	color: var(--cdf-encre);
	margin: 0;
}

.div-title-camping .stars {
	display: flex;
	gap: .15rem;
	margin: .35rem 0 0;
}

.pageCamping .chip-cdf--contour {
	margin-top: .5rem;
}

/* --- Bandeau hero : filet franc jaune sous le bandeau --- */
.bandeau-cdf--fiche {
	border-bottom: 4px solid var(--cdf-jaune);
}

/* --- Pictos emplacements / ouvertures --- */
.info-camping p {
	color: var(--cdf-encre);
	text-transform: none;
	letter-spacing: .04em;
}

.picto-camping i {
	color: var(--cdf-vert);
}

/* =====================================================================
   COLONNES : contenu 62% / encart info 34% (au lieu de 50/45)
   ===================================================================== */

@media (min-width: 992px) {
	.pageCamping .primary-content {
		width: 62%;
	}

	.pageCamping .sidebar {
		width: 34%;
		margin-left: 4%;
		margin-top: 2%;
	}

	.stickypanneau,
	.abspanneau {
		width: 100%;
		max-width: 480px;
	}
}

/* --- Encart "Information sur le camping" --- */
.floating-div {
	background: #fff;
	border: 1px solid var(--cdf-bordure);
	border-radius: var(--cdf-rayon-carte);
	box-shadow: var(--cdf-ombre);
	padding: 1.25rem;
}

.floating-div h3 {
	color: var(--cdf-vert-nuit);
	font-family: var(--font-titre-cdf);
	font-weight: 800;
	letter-spacing: .02rem;
}

.floating-div a {
	color: var(--cdf-encre);
	text-decoration: none;
}

.floating-div a:hover {
	color: var(--cdf-vert);
}

.floating-div .elements-info-camping > i {
	color: var(--cdf-vert);
	font-size: 1.25rem;
}

.elements-info-camping a {
	font-weight: 600;
}

/* --- Boutons d'action de l'encart --- */
.floating-div .btngeneral_vert {
	background: var(--cdf-vert);
	border-radius: var(--cdf-rayon-pilule);
	padding: .6rem 1.4rem;
	font-weight: 700;
	width: 100%;
}

.floating-div .btngeneral_vert:hover {
	background: var(--cdf-vert-nuit);
	color: var(--cdf-jaune);
}

/* =====================================================================
   TITRES DE SECTION : vert nuit + filet jaune
   ===================================================================== */

.pageCamping .title-description h3,
.pageCamping .title-logement h3,
.pageCamping .title-equipements h3,
.pageCamping .title-langue h3,
.pageCamping .title-logo h3,
.pageCamping .title-thematiques-camping h3,
.pageCamping .title-promotions h3,
.pageCamping .title-positions h3,
.pageCamping .title-avis-campeurs h3,
.pageCamping .title-reglements h3,
.pageCamping .title-services-canins h3 {
	color: var(--cdf-vert-nuit);
	font-family: var(--font-titre-cdf);
	font-weight: 800;
	letter-spacing: .02rem;
	white-space: nowrap;
}

.pageCamping .title-description #line-description,
.pageCamping .title-logement #line-logement,
.pageCamping .title-equipements #line-equipements,
.pageCamping .title-langue #line-langue,
.pageCamping .title-logo #line-logo,
.pageCamping .title-thematiques-camping #line-thematiques-camping,
.pageCamping .title-promotions #line-promotions,
.pageCamping .title-positions #line-positions,
.pageCamping .title-avis-campeurs #line-avis-campeurs,
.pageCamping .title-reglements #line-reglements,
.pageCamping .title-services-canins #line-services-canins {
	border-top: 4px solid var(--cdf-jaune);
	border-radius: 3px;
}

/* --- Textes courants --- */
.pageCamping .description-camping p,
.pageCamping .détail-emplacement p,
.pageCamping .text-positions p,
.pageCamping .evaluateBare p,
.pageCamping .evaluateBare label,
.pageCamping .note-global p {
	color: var(--cdf-encre);
	font-weight: 400;
}

/* --- Boutons "Voir plus" (SVG) : pilule jaune pleine, texte vert nuit --- */
.pageCamping .shape-camping {
	stroke: var(--cdf-jaune);
	stroke-width: 2px;
	stroke-dasharray: none;
	stroke-dashoffset: 0;
	fill: var(--cdf-jaune-pale);
	rx: 30px;
	ry: 30px;
	border-bottom: none;
	transition: fill .15s ease;
}

.pageCamping .text-btn-camping {
	fill: var(--cdf-vert-nuit);
	font-weight: 700;
}

.pageCamping .svg-wrapper-camping {
	cursor: pointer;
}

.pageCamping .svg-wrapper-camping:hover .shape-camping {
	stroke-width: 2px;
	stroke-dasharray: none;
	stroke-dashoffset: 0;
	fill: var(--cdf-jaune);
	stroke: var(--cdf-jaune);
}

/* =====================================================================
   TYPE DE LOGEMENT / ÉQUIPEMENTS / LANGUES : pastilles
   ===================================================================== */

.logement-camping .picto-inner,
.picto-equipements .picto-inner {
	display: flex;
	align-items: center;
	gap: .6rem;
}

.logement-camping .picto-inner i,
.picto-equipements .picto-inner i {
	color: var(--cdf-vert);
}

.logement-camping ul,
.langue-camping ul,
.logo-camping ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: .6rem;
}

.logement-camping .picto-inner {
	background: var(--cdf-vert-pale);
	border: 1px solid var(--cdf-bordure);
	border-radius: var(--cdf-rayon-pilule);
	padding: .45rem 1rem .45rem .7rem;
	margin-bottom: .5rem;
}

.logement-camping .picto-inner li {
	list-style: none;
	font-weight: 600;
	color: var(--cdf-vert-nuit);
}

.logement-camping .picto-inner img {
	width: 34px;
	height: 34px;
	object-fit: contain;
}

.picto-equipements {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem;
}

.picto-equipements .picto {
	background: #fff;
	border: 1px solid var(--cdf-bordure);
	border-radius: 12px;
	padding: .6rem .9rem;
	box-shadow: var(--cdf-ombre);
}

.picto-equipements .picto-inner {
	flex-direction: column;
	gap: .35rem;
	text-align: center;
}

.picto-equipements .picto-inner i {
	color: var(--cdf-vert);
}

.picto-equipements .picto-inner p {
	font-size: .85rem;
	color: var(--cdf-encre);
	margin: 0;
}

.picto-equipements .picto-inner img {
	width: 40px;
	height: 40px;
	object-fit: contain;
}

.langue-camping ul {
	gap: 1rem;
}

.langue-camping li {
	display: flex;
	align-items: center;
	gap: .5rem;
	background: #fff;
	border: 1px solid var(--cdf-bordure);
	border-radius: var(--cdf-rayon-pilule);
	padding: .35rem .9rem;
	font-weight: 600;
	color: var(--cdf-encre);
}

.langue-camping li img {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	object-fit: cover;
}

.logo-camping ul {
	gap: 1rem;
}

.logo-camping li {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-weight: 600;
	color: var(--cdf-encre);
}

/* =====================================================================
   PROMOTIONS DE LA FICHE : cartes blanches, badge tampon jaune
   ===================================================================== */

.grid-promotions {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1.25rem;
	list-style: none;
	padding: 0;
	margin: 0;
}

.cards-camping-promotions {
	width: auto;
	margin: 0;
}

.cards-promotionsIn {
	height: auto;
	overflow: visible;
}

.cards-promotionsIn a {
	display: block;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.cdf-fiche-promo-carte,
.cards-promotionsIn {
	background: #fff;
	border: 1px solid var(--cdf-bordure);
	border-radius: var(--cdf-rayon-carte);
	box-shadow: var(--cdf-ombre);
	transition: transform .2s ease, box-shadow .2s ease;
}

.cards-promotionsIn:hover {
	transform: translateY(-4px);
	box-shadow: var(--cdf-ombre-hover);
}

.cdf-fiche-promo-visuel {
	position: relative;
	border-radius: var(--cdf-rayon-carte) var(--cdf-rayon-carte) 0 0;
	overflow: hidden;
}

.cdf-fiche-promo-visuel img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
}

/* neutralise les voiles historiques bleu/noir des cartes */
.cards-promotionsIn a div::before,
.cards-promotionsIn a div::after {
	content: none;
}

.cdf-fiche-promo-corps {
	padding: .9rem 1rem 1.1rem;
	text-align: left;
}

.cdf-fiche-promo-corps h3,
.cards-promotionsIn a .cdf-fiche-promo-corps h3 {
	color: var(--cdf-vert-nuit);
	font-family: var(--font-corps-cdf);
	font-size: 1.02rem;
	font-weight: 800;
	line-height: 1.3;
	margin: 0 0 .55rem;
	padding: 0;
	width: 100%;
	text-align: left;
}

.cdf-fiche-promo-dates,
.cards-promotionsIn a p.cdf-fiche-promo-dates {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	background: var(--cdf-vert-pale);
	color: var(--cdf-vert-nuit);
	font-weight: 700;
	font-size: .84rem;
	padding: .28rem .75rem;
	border-radius: var(--cdf-rayon-pilule);
	margin: 0;
	text-align: left;
}

.cdf-fiche-promo-annonce {
	background: var(--cdf-nuance);
	border: 1px solid var(--cdf-bordure);
	border-top: none;
	border-radius: 0 0 var(--cdf-rayon-carte) var(--cdf-rayon-carte);
	padding: .75rem 1rem;
	margin-top: -2px;
}

.cdf-fiche-promo-annonce p {
	color: var(--cdf-encre);
	font-size: .9rem;
	line-height: 1.5;
	margin: 0;
}

@media (max-width: 767.98px) {
	.grid-promotions {
		grid-template-columns: 1fr;
	}

	.cdf-fiche-promo-visuel img {
		height: 180px;
	}
}

/* =====================================================================
   POSITION : liens en pilules vertes, adresse avec picto
   ===================================================================== */

.text-positions {
	flex-wrap: wrap;
	gap: 1rem;
}

.text-positions .rue-camping::before,
.text-positions .code-postal-camping {
	/* l'adresse reste sobre */
}

.positions-camping .btn-voir-tous {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
	border: 2px solid var(--cdf-vert);
	color: var(--cdf-vert-nuit) !important;
	font-weight: 700;
	border-radius: var(--cdf-rayon-pilule);
	padding: .5rem 1.2rem;
	text-decoration: none;
	transition: background-color .15s ease, color .15s ease;
}

.positions-camping .btn-voir-tous:hover {
	background: var(--cdf-vert);
	color: #fff !important;
}

.positions-camping .btn-voir-tous .hexBtnVoirTous img {
	display: none;
}

.positions-camping .btn-voir-tous::after {
	content: "\F285"; /* bi-chevron-right */
	font-family: "bootstrap-icons";
	font-size: .75rem;
	color: var(--cdf-jaune);
}

.positions-camping .btn-voir-tous:hover::after {
	color: currentColor;
}

/* =====================================================================
   AVIS DES CAMPEURS
   ===================================================================== */

.avis-general {
	border: 1px solid var(--cdf-bordure);
	border-radius: var(--cdf-rayon-carte);
	box-shadow: var(--cdf-ombre);
}

.progress-camping {
	background-color: var(--cdf-vert-pale);
	box-shadow: none;
	border-radius: var(--cdf-rayon-pilule);
}

.progress-bar-camping {
	background-color: var(--cdf-vert);
	border-radius: var(--cdf-rayon-pilule);
}

.avis-tent p {
	font-weight: 700;
	color: var(--cdf-vert-nuit);
}

.recommander-par .compteur {
	color: var(--cdf-vert) !important;
}

/* --- Bouton "Laissez-nous votre avis !" : même pilule jaune --- */
.btn-laisser-avis .shape-camping {
	fill: var(--cdf-jaune);
}

.btn-laisser-avis .text-btn-camping {
	fill: var(--cdf-vert-nuit);
	font-weight: 700;
}

/* =====================================================================
   DIVERS : liens hors charte, focus, cartes thématiques
   ===================================================================== */

.pageCamping a {
	color: var(--cdf-vert-nuit);
}

.pageCamping a:hover {
	color: var(--cdf-vert);
}

.btn-voir-tous {
	color: var(--cdf-vert-nuit);
}

.btn-voir-tous:hover {
	color: var(--cdf-vert);
}

.cards-thematiques-campingIn a h3 {
	color: var(--cdf-vert-nuit);
	font-weight: 700;
}

@media (max-width: 991px) {
	.title-camping,
	.title-tourisme {
		line-height: 1.15;
		letter-spacing: .01rem;
	}

	.div-title-camping {
		text-align: left;
	}
}