/**
 * Secrets Rooms Dynamic Pricing — bandeau [srdp_promos].
 *
 * Toute l'apparence est pilotée par des variables CSS (--srdp-*). Pour personnaliser, surcharger les variables
 * dans Elementor (widget Shortcode > Avancé > CSS personnalisé) :
 *
 *     selector .srdp-promos { --srdp-bg: #2b0f1a; --srdp-accent: #e8b4b8; }
 *
 * Structure :
 *   .srdp-promos                      conteneur (thème, alignement, options)
 *     a.srdp-promos__link             zone cliquable
 *       .srdp-promos__label           [.srdp-promos__icon] .srdp-promos__label-text
 *       .srdp-promos__items           liste des nuits (span ou ul)
 *         .srdp-promos__item          --1, --2, --3… ; --tonight ; --tomorrow
 *           .srdp-promos__day  .srdp-promos__colon  .srdp-promos__price  [.srdp-promos__saving]
 *       .srdp-promos__cta             bouton d'appel à l'action
 *     .srdp-promos__preview           mention « aperçu » (administrateur)
 *   .srdp-promos--empty               variante sans promo : .srdp-promos__empty
 *
 * @package SecretsRooms\DynamicPricing
 */

/* -------------------------------------------------------------------------- */
/* 1. Variables (valeurs du thème « dark », par défaut)                        */
/* -------------------------------------------------------------------------- */
.srdp-promos {
	/* Couleurs */
	--srdp-bg: #1a1a1a;
	--srdp-bg-image: none;                   /* ex. linear-gradient(90deg, #2b0f1a, #5a1a2e) */
	--srdp-color: #ffffff;
	--srdp-accent: #c9a96e;
	--srdp-label-color: var(--srdp-accent);
	--srdp-day-color: inherit;
	--srdp-price-color: var(--srdp-color);
	--srdp-saving-color: var(--srdp-accent);
	--srdp-separator-color: currentColor;
	--srdp-link-hover-color: var(--srdp-color);

	/* Typographie */
	--srdp-font-family: inherit;
	--srdp-font-size: 14px;
	--srdp-font-weight: 400;
	--srdp-line-height: 1.4;
	--srdp-letter-spacing: normal;
	--srdp-label-font-size: 0.85em;
	--srdp-label-weight: 700;
	--srdp-label-transform: uppercase;
	--srdp-label-letter-spacing: 0.08em;
	--srdp-day-weight: 400;
	--srdp-price-weight: 700;
	--srdp-price-font-size: 1em;
	--srdp-saving-font-size: 0.85em;

	/* Espacements et dimensions */
	--srdp-padding: 10px 16px;
	--srdp-gap: 14px;                        /* espace entre libellé, nuits et bouton */
	--srdp-item-gap: 10px;                   /* espace entre deux nuits */
	--srdp-max-width: 1200px;                /* largeur du contenu centré */
	--srdp-min-height: 0;

	/* Bordures et effets */
	--srdp-border: 0;                        /* ex. 1px solid rgba(255,255,255,.15) */
	--srdp-border-bottom: 0;
	--srdp-radius: 0;
	--srdp-shadow: none;
	--srdp-transition: 0.2s ease;

	/* Séparateur entre les nuits */
	--srdp-separator: "·";
	--srdp-separator-opacity: 0.5;

	/* Bouton (CTA) */
	--srdp-cta-bg: var(--srdp-accent);
	--srdp-cta-color: #1a1a1a;
	--srdp-cta-border: 0;
	--srdp-cta-radius: 999px;
	--srdp-cta-padding: 5px 14px;
	--srdp-cta-font-size: 0.85em;
	--srdp-cta-weight: 700;
	--srdp-cta-transform: none;
	--srdp-cta-bg-hover: #ffffff;
	--srdp-cta-color-hover: #1a1a1a;
	--srdp-cta-arrow: " →";

	/* Mise en avant de « Ce soir » */
	--srdp-highlight-bg: var(--srdp-accent);
	--srdp-highlight-color: #1a1a1a;
	--srdp-highlight-radius: 4px;
	--srdp-highlight-padding: 1px 7px;

	/* Focus clavier */
	--srdp-focus-color: var(--srdp-accent);

	/* Mobile (≤ 767 px) */
	--srdp-mobile-font-size: 13px;
	--srdp-mobile-padding: 8px 12px;
	--srdp-mobile-gap: 8px;
}

/* -------------------------------------------------------------------------- */
/* 2. Thèmes prédéfinis (attribut theme="…")                                   */
/* -------------------------------------------------------------------------- */
.srdp-promos--theme-light {
	--srdp-bg: #f7f3ee;
	--srdp-color: #1a1a1a;
	--srdp-accent: #8a5a44;
	--srdp-cta-color: #ffffff;
	--srdp-cta-bg-hover: #1a1a1a;
	--srdp-cta-color-hover: #ffffff;
	--srdp-highlight-color: #ffffff;
	--srdp-border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.srdp-promos--theme-gold {
	--srdp-bg: #c9a96e;
	--srdp-color: #1a1a1a;
	--srdp-accent: #1a1a1a;
	--srdp-label-color: #1a1a1a;
	--srdp-saving-color: #1a1a1a;
	--srdp-cta-bg: #1a1a1a;
	--srdp-cta-color: #ffffff;
	--srdp-cta-bg-hover: #ffffff;
	--srdp-cta-color-hover: #1a1a1a;
	--srdp-highlight-bg: #1a1a1a;
	--srdp-highlight-color: #c9a96e;
}

/* Hérite entièrement de la section Elementor (fond transparent, couleurs du thème). */
.srdp-promos--theme-none {
	--srdp-bg: transparent;
	--srdp-color: inherit;
	--srdp-accent: currentColor;
	--srdp-cta-bg: transparent;
	--srdp-cta-color: inherit;
	--srdp-cta-border: 1px solid currentColor;
	--srdp-cta-bg-hover: transparent;
	--srdp-cta-color-hover: inherit;
	--srdp-highlight-bg: transparent;
	--srdp-highlight-color: inherit;
	--srdp-highlight-padding: 0;
	--srdp-padding: 0;
}

/* -------------------------------------------------------------------------- */
/* 3. Conteneur                                                                */
/* -------------------------------------------------------------------------- */
.srdp-promos-wrap:empty {
	display: none;
}

.srdp-promos {
	box-sizing: border-box;
	position: relative;
	width: 100%;
	min-height: var(--srdp-min-height);
	margin: 0;
	background-color: var(--srdp-bg);
	background-image: var(--srdp-bg-image);
	color: var(--srdp-color);
	font-family: var(--srdp-font-family);
	font-size: var(--srdp-font-size);
	font-weight: var(--srdp-font-weight);
	line-height: var(--srdp-line-height);
	letter-spacing: var(--srdp-letter-spacing);
	border: var(--srdp-border);
	border-bottom: var(--srdp-border-bottom);
	border-radius: var(--srdp-radius);
	box-shadow: var(--srdp-shadow);
}

.srdp-promos *,
.srdp-promos *::before,
.srdp-promos *::after {
	box-sizing: border-box;
}

/* -------------------------------------------------------------------------- */
/* 4. Zone cliquable et alignement                                             */
/* -------------------------------------------------------------------------- */
.srdp-promos a.srdp-promos__link,
.srdp-promos a.srdp-promos__link:visited {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--srdp-gap);
	max-width: var(--srdp-max-width);
	margin: 0 auto;
	padding: var(--srdp-padding);
	color: inherit;
	text-decoration: none;
	box-shadow: none;
	transition: color var(--srdp-transition);
}

.srdp-promos--align-left a.srdp-promos__link { justify-content: flex-start; }
.srdp-promos--align-right a.srdp-promos__link { justify-content: flex-end; }
.srdp-promos--align-between a.srdp-promos__link { justify-content: space-between; }

.srdp-promos a.srdp-promos__link:hover {
	color: var(--srdp-link-hover-color);
}

.srdp-promos a.srdp-promos__link:focus-visible {
	outline: 2px solid var(--srdp-focus-color);
	outline-offset: -2px;
}

/* -------------------------------------------------------------------------- */
/* 5. Libellé et icône                                                         */
/* -------------------------------------------------------------------------- */
.srdp-promos__label {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	color: var(--srdp-label-color);
	font-size: var(--srdp-label-font-size);
	font-weight: var(--srdp-label-weight);
	text-transform: var(--srdp-label-transform);
	letter-spacing: var(--srdp-label-letter-spacing);
	white-space: nowrap;
}

.srdp-promos__icon {
	display: inline-block;
	line-height: 1;
}

/* -------------------------------------------------------------------------- */
/* 6. Nuits                                                                    */
/* -------------------------------------------------------------------------- */
.srdp-promos__items {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: inherit;
	gap: var(--srdp-item-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.srdp-promos__item {
	display: inline-flex;
	align-items: baseline;
	gap: 0;
	white-space: nowrap;
}

/* Séparateur entre deux nuits (format « bar ») */
.srdp-promos--bar .srdp-promos__item + .srdp-promos__item::before {
	content: var(--srdp-separator);
	margin-right: var(--srdp-item-gap);
	color: var(--srdp-separator-color);
	opacity: var(--srdp-separator-opacity);
}

.srdp-promos__day {
	color: var(--srdp-day-color);
	font-weight: var(--srdp-day-weight);
}

.srdp-promos__colon {
	white-space: pre;
}

.srdp-promos__price {
	color: var(--srdp-price-color);
	font-size: var(--srdp-price-font-size);
	font-weight: var(--srdp-price-weight);
}

.srdp-promos__saving {
	margin-left: 0.35em;
	color: var(--srdp-saving-color);
	font-size: var(--srdp-saving-font-size);
}

/* Mise en avant de « Ce soir » (attribut highlight="yes", par défaut) */
.srdp-promos--highlight .srdp-promos__item--tonight .srdp-promos__day {
	padding: var(--srdp-highlight-padding);
	border-radius: var(--srdp-highlight-radius);
	background: var(--srdp-highlight-bg);
	color: var(--srdp-highlight-color);
	font-weight: 700;
}

/* -------------------------------------------------------------------------- */
/* 7. Bouton (CTA)                                                             */
/* -------------------------------------------------------------------------- */
.srdp-promos__cta {
	display: inline-block;
	padding: var(--srdp-cta-padding);
	border: var(--srdp-cta-border);
	border-radius: var(--srdp-cta-radius);
	background: var(--srdp-cta-bg);
	color: var(--srdp-cta-color);
	font-size: var(--srdp-cta-font-size);
	font-weight: var(--srdp-cta-weight);
	text-transform: var(--srdp-cta-transform);
	line-height: 1.3;
	white-space: nowrap;
	transition: background-color var(--srdp-transition), color var(--srdp-transition);
}

.srdp-promos__cta::after {
	content: var(--srdp-cta-arrow);
}

.srdp-promos a.srdp-promos__link:hover .srdp-promos__cta,
.srdp-promos a.srdp-promos__link:focus-visible .srdp-promos__cta {
	background: var(--srdp-cta-bg-hover);
	color: var(--srdp-cta-color-hover);
}

/* -------------------------------------------------------------------------- */
/* 8. Format liste (format="list")                                             */
/* -------------------------------------------------------------------------- */
.srdp-promos--list a.srdp-promos__link {
	flex-direction: column;
	align-items: center;
}

.srdp-promos--list.srdp-promos--align-left a.srdp-promos__link { align-items: flex-start; }
.srdp-promos--list.srdp-promos--align-right a.srdp-promos__link { align-items: flex-end; }

.srdp-promos--list .srdp-promos__items {
	flex-direction: column;
	align-items: inherit;
	gap: calc(var(--srdp-item-gap) / 2);
}

.srdp-promos--list .srdp-promos__items > li {
	margin: 0;
	padding: 0;
}

.srdp-promos--list .srdp-promos__items > li::marker {
	content: "";
}

/* -------------------------------------------------------------------------- */
/* 9. États                                                                    */
/* -------------------------------------------------------------------------- */
.srdp-promos__empty {
	font-weight: var(--srdp-font-weight);
}

.srdp-promos__preview {
	position: absolute;
	top: 2px;
	right: 6px;
	font-size: 10px;
	line-height: 1;
	opacity: 0.6;
	pointer-events: none;
}

/* -------------------------------------------------------------------------- */
/* 10. Mobile                                                                  */
/* -------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.srdp-promos {
		font-size: var(--srdp-mobile-font-size);
	}

	.srdp-promos a.srdp-promos__link,
	.srdp-promos a.srdp-promos__link:visited {
		gap: var(--srdp-mobile-gap);
		padding: var(--srdp-mobile-padding);
	}

	/* Nombre de nuits visibles sur mobile (attribut mobile_limit, 1 par défaut ; 0 = toutes) */
	.srdp-promos--mobile-1 .srdp-promos__item:nth-child(n+2),
	.srdp-promos--mobile-1 .srdp-promos__items > li:nth-child(n+2),
	.srdp-promos--mobile-2 .srdp-promos__item:nth-child(n+3),
	.srdp-promos--mobile-2 .srdp-promos__items > li:nth-child(n+3),
	.srdp-promos--mobile-3 .srdp-promos__item:nth-child(n+4),
	.srdp-promos--mobile-3 .srdp-promos__items > li:nth-child(n+4) {
		display: none;
	}
}

/* -------------------------------------------------------------------------- */
/* 11. Accessibilité et impression                                             */
/* -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.srdp-promos,
	.srdp-promos * {
		transition: none !important;
	}
}

@media print {
	.srdp-promos-wrap {
		display: none !important;
	}
}
