/* ============================================================
   VARIANTE MARIN  –  .wc-variante--marin
   Palette marine appliquée sur les shortcodes d'une salle spécifique.
   Toutes les couleurs viennent des variables --c-marine-*
   ============================================================ */


/* ── Header ──────────────────────────────────────────────── */

body.wc-variante--marin {
	& .site-header {
		background-color: var(--c-marine-900);
		background-image:
			linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),
			linear-gradient(rgba(13, 33, 55, 0.5), rgba(13, 33, 55, 0.5)),
			var(--wc-img-ecluse-bg);
	}

	& .header-nav a {
		&:hover,
		&:focus,
		&.current-menu-item,
		&[aria-current="page"] {
			color: var(--c-marine-100);
		}
	}

	& .header-burger {
		background-color: var(--c-marine-500) !important;

		&:hover,
		&:focus,
		&:active {
			background-color: var(--c-marine-700) !important;
		}
	}

	/* ── Drawer ────────────────────────────────────────── */

	& .nav-drawer {
		background-color: var(--c-marine-900);
	}

	& .nav-drawer__list li a:hover {
		color: var(--c-marine-100);
	}

	& .nav-drawer__btn--primary {
		background-color: var(--c-marine-500);
		border-color: var(--c-marine-500);

		&:hover,
		&:focus,
		&:active {
			background-color: var(--c-marine-700) !important;
			border-color: var(--c-marine-700) !important;
			color: var(--c-text-inverse) !important;
		}
	}

	& .nav-drawer__social-link {
		&:hover,
		&:focus {
			background: rgba(122, 181, 216, 0.2);
			border-color: var(--c-marine-100);
			color: var(--c-marine-100);
		}
	}

	/* ── Carrousel salles (label + dots) ───────────────── */

	& .wc-salles-carousel__label {
		background: var(--c-marine-800);
		color: var(--c-marine-5);
	}

	& .wc-salles-carousel__dot {
		background: rgba(26, 58, 92, 0.25) !important;

		&.is-active {
			background: var(--c-marine-800) !important;
		}

		&:hover,
		&:focus {
			background: rgba(26, 58, 92, 0.55) !important;
		}
	}

	/* ── Footer custom ─────────────────────────────────── */

	& .wc-footer__top {
		background: var(--c-marine-100);
		color: var(--c-marine-900);
	}

	& .wc-footer__brand,
	& .wc-footer__title,
	& .wc-footer__line {
		color: var(--c-marine-900);
	}

	& .wc-footer__list a {
		color: var(--c-marine-800);

		&:hover,
		&:focus {
			color: var(--c-marine-900) !important;
		}
	}

	& .wc-footer__line a {
		&:hover,
		&:focus {
			color: var(--c-marine-900) !important;
		}
	}

	& .wc-footer__social-link {
		background: var(--c-marine-800);
		color: var(--c-marine-100);

		&:hover,
		&:focus {
			background: var(--c-marine-900) !important;
			color: var(--c-text-inverse) !important;
		}
	}

	& .wc-footer__bottom {
		background: var(--c-marine-800);
		color: var(--c-marine-5);
	}

	/* Dune (bandeau de séparation) de la même couleur que le footer */
	& .wc-footer__wave path {
		fill: var(--c-marine-100);
	}

	/* Carte : bordure marine */
	& .wc-carte {
		border-color: rgba(30, 77, 122, 0.32);
	}

	/* ── Bouton réservation flottant ───────────────────── */

	& .wc-bouton-reservation {
		background: var(--c-marine-500);
		border-color: var(--c-marine-100);

		&:hover,
		&:focus {
			background-color: var(--c-marine-700) !important;
		}
	}

	/* ── Menus latéraux ────────────────────────────────── */

	& .menu-logements__titre-section {
		background: var(--c-marine-400);
	}

	& .menu-logements__titre {
		background: var(--c-marine-10);
		color: var(--c-marine-900) !important;

		&:hover,
		&:focus {
			background: var(--c-marine-50) !important;
			color: var(--c-marine-900) !important;
		}
	}

	& .menu-logements__categorie--active {
		& .menu-logements__titre,
		& .menu-logements__titre:hover,
		& .menu-logements__titre:focus {
			background: var(--c-marine-500) !important;
			color: var(--c-text-inverse) !important;
		}
	}

	& .menu-logements__liste {
		background: var(--c-marine-100);

		& li a {
			color: var(--c-marine-900) !important;

			&:hover,
			&:focus {
				background: var(--c-marine-300) !important;
				color: var(--c-text-inverse) !important;
			}
		}
	}
}


/* ── Carrousel slide individuelle en variante marine ────── */

.wc-salles-carousel__slide.wc-variante--marin {
	& .wc-salles-carousel__title { color: var(--c-marine-900); }
	& .wc-salles-carousel__description { color: var(--c-marine-800); }
	& .wc-salles-carousel__price { color: var(--c-marine-800); }
	& .wc-salles-carousel__price strong { color: var(--c-marine-900); }
	& .wc-salles-carousel__footer { border-top-color: var(--c-marine-25); }

	& .wc-salles-carousel__cta {
		background-color: var(--c-marine-500);

		&:hover,
		&:focus,
		&:active {
			background-color: var(--c-marine-700) !important;
		}
	}
}


/* ── Badge capacité ─────────────────────────────────────── */

.wc-capacite.wc-variante--marin {
	background: var(--c-marine-5);
	color: var(--c-marine-800);
	border-color: rgba(30, 77, 122, 0.2);

	& .wc-capacite__icon {
		stroke: var(--c-marine-800) !important;
	}
}


/* ── Tableau des tarifs ─────────────────────────────────── */

.wc-variante--marin.logement-tarifs,
.logement-tarifs--salle.wc-variante--marin {
	& .logement-tarifs__grid { border-color: var(--c-marine-600); }
	& .logement-tarifs__head { background: var(--c-marine-800); }
	& .logement-tarifs__head--period { background: var(--c-marine-900); }

	& .logement-tarifs__period {
		background: var(--c-marine-5);
		color: var(--c-marine-900);
		border-top-color: rgba(37, 99, 160, 0.2);
		border-right-color: rgba(37, 99, 160, 0.2);
	}

	& .logement-tarifs__price {
		color: var(--c-marine-900);
		border-top-color: rgba(37, 99, 160, 0.2);
		border-right-color: rgba(37, 99, 160, 0.2);
	}

	& .logement-tarifs__price--span {
		background: var(--c-marine-2);
	}

	& .logement-tarifs__note {
		color: var(--c-marine-300);
	}
}

.logement-tarifs--unique.wc-variante--marin {
	border-color: var(--c-marine-600);

	& .logement-tarifs__unique { background: var(--c-marine-5); }
	& .logement-tarifs__prix-gros { color: var(--c-marine-900); }
	& .logement-tarifs__prix-unite { color: var(--c-marine-800); }
	& .logement-tarifs__supplement { background: var(--c-marine-800); }
}


/* ── Carte salle (grille) ───────────────────────────────── */

.wc-card.wc-variante--marin {
	border-color: rgba(30, 77, 122, 0.18);

	& .wc-card__image-wrap {
		background: var(--c-marine-300);
	}

	& .wc-card__image--placeholder {
		background: linear-gradient(135deg, var(--c-marine-100) 0%, var(--c-marine-600) 100%);
	}

	& .wc-card__overlay {
		background: linear-gradient(
			to bottom,
			rgba(0, 0, 0, 0)        40%,
			rgba(13, 33, 55, 0.82) 100%
		);
	}

	& .wc-card__badge {
		background: var(--c-marine-5);
		color: var(--c-marine-800);
		border-color: rgba(30, 77, 122, 0.2);
	}

	& .wc-card__footer { border-top-color: var(--c-marine-25); }
	& .wc-card__price { color: var(--c-marine-800); }
	& .wc-card__price strong { color: var(--c-marine-900); }

	& .wc-card__cta {
		background-color: var(--c-marine-500);

		&:hover,
		&:focus,
		&:active {
			background-color: var(--c-marine-700) !important;
			color: var(--c-text-inverse) !important;
		}
	}
}

/* ── Accordéon des sections ─────────────────────────────── */

.wc-accordion.wc-variante--marin {
	& .wc-accordion__item { background: var(--c-marine-5); }

	& .wc-accordion__trigger { background: var(--c-marine-800); }

	& .wc-accordion__trigger:hover,
	& .wc-accordion__item.is-open .wc-accordion__trigger {
		background: var(--c-marine-700);
	}

	& .wc-accordion__trigger:focus-visible {
		outline-color: var(--c-marine-100) !important;
	}

	& .wc-accordion__content {
		color: var(--c-marine-900);

		& li::marker { color: var(--c-marine-500); }

		& a {
			color: var(--c-marine-700);

			&:hover,
			&:focus { color: var(--c-marine-900); }
		}

		& strong,
		& h2,
		& h3,
		& h4 { color: var(--c-marine-900); }
	}
}


/* ── En-tête de fiche ───────────────────────────────────── */

.wc-fiche.wc-variante--marin {
	& .wc-fiche__bandeau {
		/* Même fond que le header en variante marine (texture écluse) */
		background-color: var(--c-marine-900);
		background-image:
			linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)),
			linear-gradient(rgba(13, 33, 55, 0.5), rgba(13, 33, 55, 0.5)),
			var(--wc-img-ecluse-bg);
		background-size: cover;
		background-position: center center;
		background-repeat: no-repeat;
	}

	& .logement-galerie--hero .logement-galerie__thumb:hover .wc-fiche__zoom,
	& .logement-galerie--hero .logement-galerie__thumb:focus-visible .wc-fiche__zoom {
		background: var(--c-marine-500);
	}

	& .wc-fiche__reserver {
		background: var(--c-marine-500);

		&:hover,
		&:active { background: var(--c-marine-700); }

		&:focus-visible { outline-color: var(--c-marine-100) !important; }
	}

	& .wc-fiche__adresse {
		background: var(--c-marine-10);
		border-color: var(--c-marine-200);

		& .wc-fiche__adresse-icon { color: var(--c-marine-500); }

		& a:hover,
		& a:focus { color: var(--c-marine-700) !important; }
	}
}


/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 600px) {
	.wc-variante--marin.logement-tarifs .logement-tarifs__period,
	.logement-tarifs--salle.wc-variante--marin .logement-tarifs__period {
		background: var(--c-marine-15);
	}
}
