/**
 * Footer Styles
 *
 * Styles pour le footer du site avec modèle centralisé.
 * Layout deux colonnes (40% / 60%) intégré au système horizontal scroll.
 *
 * @package     UneAutreVoix
 * @author      Horizon Signature
 * @copyright   2026 Horizon Signature
 * @license     Proprietary
 * @version     0.1.0
 *
 * @changelog
 * 0.1.0 — Passage en preprod
 * 0.0.10 - Modale newsletter : styles globaux (hors @media, position fixed)
 *        - Dimensions identiques à .uav-avis-modal-content (90vh, max-width 92vw, border-radius 0.5vh)
 *        - Ajout .uav-newsletter-note (small-text désabonnement) et .uav-newsletter-subtitle
 * 0.0.9 - Suppression violations opacity (règle no-opacity)
 *        - .footer-social-icon:hover : opacity: 0.7 supprimée + transition opacity supprimée
 * 0.0.8 - Phase 1 refacto : valeurs hardcodées → variables CSS
 *        - transition width/opacity 1s cubic-bezier expo → var(--transition-slow) var(--ease-expo)
 *        - text-decoration-thickness 0.15vh → var(--border-thin)
 *        - text-underline-offset 0.5vh → var(--border-thick)
 * 0.0.7 - Taille texte footer entre S et M
 *        - .footer-info-text, .footer-articles-list a : 1.75vh desktop (moyenne S+M)
 *        - Mobile garde var(--text-size-m) (16px)
 * 0.0.6 - Migration tailles de texte footer vers système unifié
 *        - .footer-info-text, .footer-articles-list a : var(--font-body-size) → var(--text-size-s)
 *        - Cohérence avec système de typographie à 6 tailles
 * 0.0.5 - Migration système de transitions unifié
 *        - Transitions : durées et easing remplacés par variables sémantiques
 *        - ~3 transitions migrées
 * 0.0.4 - Migration système de line-height unifié
 *        - 1.5 → var(--line-height-comfortable)
 *        - Cohérence avec système à 3 valeurs sémantiques
 * 0.0.3 - Migration complète vers variables d'espacement sémantiques desktop
 *        - Tous les espacements standards (padding, margin, gap) utilisent var(--spacing-*)
 *        - Standardisation : 1.5vh → 2vh (var(--spacing-sm)), 5vh → 4vh (var(--spacing-lg))
 *        - Amélioration cohérence et maintenabilité
 * 0.0.2 - Migration vers variables responsive unifiées
 *        - --font-small-text-size → --responsive-font-small
 *        - Structure cohérente avec desktop/tablette/mobile
 * 0.0.1 - Version initiale
 */

/* ============================================================================
   Structure du footer - Desktop uniquement (≥1201px)
   ========================================================================== */

@media (min-width: 1201px) {

	/* --- FONT WEIGHT GLOBAL FOOTER --- */
	.site-footer {
		font-weight: 500;
	}

	/* --- LAYOUT DEUX COLONNES --- */
	.site-footer .footer-columns {
		display: grid;
		grid-template-columns: 40fr 60fr;
		width: 100%;
		height: 100%;
		align-items: center;
		gap: var(--spacing-xl);
	}

	.site-footer .footer-col {
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 100%;
	}

	/* --- COLONNE GAUCHE (40%) --- */
	.site-footer .footer-col-left {
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
	}

	/* Bandeau vertical animé derrière la case verte */
	.site-footer .footer-bandeau {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
		top: -8vh;
		height: 95vh;
		width: 0.1vh;
		background-color: var(--color-text);
		z-index: 0;
		transition: width var(--transition-slow) var(--ease-expo);
		overflow: hidden;
		will-change: width;
		-webkit-mask-image: linear-gradient(to bottom, black, black);
		mask-image: linear-gradient(to bottom, black, black);
	}

	/* État ouvert (fin du scroll) */
	.site-footer .footer-bandeau.is-revealed {
		width: 15vh;
	}

	/* Rail d'animation dans le bandeau footer */
	.site-footer .footer-bandeau .bandeau-anime-track {
		position: absolute;
		top: 0;
		left: calc(50% + 0.4vh);
		width: 6vh;
		height: auto;
		will-change: transform;
		transform-style: preserve-3d;
		-webkit-transform-style: preserve-3d;
		backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
	}

	.site-footer .footer-bandeau .bandeau-anime-track .bandeau-anime-text {
		width: 100%;
		margin: 0;
	}

	/* Texte vertical dans le bandeau footer */
	.site-footer .footer-bandeau .bandeau-anime-text {
		font-family: var(--font-texte-bandeau-family);
		font-size: var(--font-texte-bandeau-size);
		font-weight: var(--font-texte-bandeau-weight);
		text-transform: var(--font-texte-bandeau-text-transform);
		color: var(--color-background);
		writing-mode: vertical-rl;
		text-orientation: mixed;
		white-space: nowrap;
		display: flex;
		align-items: center;
		gap: var(--spacing-lg);
		padding: 0 0 var(--spacing-lg) 0;
		transform: rotate(180deg);
		opacity: 0;
		transition: opacity var(--transition-slow) var(--ease-expo);
	}

	/* Texte visible quand bandeau ouvert */
	.site-footer .footer-bandeau.is-revealed .bandeau-anime-text {
		opacity: 1;
	}

	/* Icône de plume dans le bandeau footer */
	.site-footer .footer-bandeau .bandeau-anime-icon {
		width: 3vh;
		height: 3vh;
		fill: currentColor;
		flex-shrink: 0;
		transform: rotate(90deg);
	}

	.site-footer .footer-green-container {
		background-color: var(--color-green);
		padding: var(--spacing-lg) var(--spacing-xl);
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: var(--spacing-lg);
		position: relative;
		z-index: 1;
	}

	/* --- FOOTER TRANSMISSION --- */
	.site-footer.is-transmission .footer-green-container {
		border-radius: 5vh;
	}

	/* Titre H2 stylé comme H3 */
	.site-footer .footer-title {
		font-family: var(--font-h3-family);
		font-size: var(--font-h3-size);
		font-weight: var(--font-h3-weight);
		line-height: var(--font-h3-line-height);
		color: var(--color-text);
		margin: 0;
		text-align: center;
		text-wrap: balance;
	}

	/* CTA Newsletter avec bordure blanche */
	.site-footer .section-cta-white {
		--cta-border-color: var(--color-white);
		align-self: center;
	}

	/* Texte de confidentialité newsletter */
	.site-footer .footer-newsletter-text {
		font-family: var(--font-small-text-family);
		font-size: var(--text-size-s);
		font-weight: var(--font-small-text-weight);
		line-height: var(--font-small-text-line-height);
		color: var(--color-text);
		margin: 0;
		text-align: center;
		text-wrap: balance;
	}

	/* Icônes réseaux sociaux */
	.site-footer .footer-social-icons {
		display: flex;
		gap: var(--spacing-md);
		align-items: center;
		justify-content: center;
	}

	.site-footer .footer-social-icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 4vh;
		height: 4vh;
	}

	.site-footer .footer-social-icon svg {
		width: 100%;
		height: 100%;
		fill: var(--color-white);
	}

	/* --- COLONNE DROITE (60%) --- */
	.site-footer .footer-col-right {
		padding-left: 4vh;
	}

	/* Grille 2x2 */
	.site-footer .footer-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto auto;
		grid-auto-flow: column;
		gap: var(--spacing-xl);
	}

	.site-footer .footer-grid-item {
		display: flex;
		flex-direction: column;
		gap: var(--spacing-sm);
	}

	.site-footer .footer-grid-item h3 {
		font-family: var(--font-h3-family);
		font-size: var(--font-h3-size);
		font-weight: var(--font-h3-weight);
		line-height: var(--font-h3-line-height);
		color: var(--color-text);
		margin: 0;
	}

	/* Liste d'informations avec icônes */
	.site-footer .footer-info-list {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		gap: var(--spacing-xs);
	}

	.site-footer .footer-info-item {
		display: flex;
		gap: var(--spacing-sm);
		align-items: center;
	}

	.site-footer .footer-info-icon {
		flex-shrink: 0;
		width: 2vh;
		height: 2vh;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.site-footer .footer-info-icon svg {
		width: 100%;
		height: 100%;
		fill: var(--color-text);
	}

	.site-footer .footer-info-text {
		font-family: var(--font-body-family);
		font-size: calc((var(--text-size-s) + var(--text-size-m)) / 2);
		line-height: var(--line-height-comfortable);
		color: var(--color-text);
	}

	/* Liste des articles récents */
	.site-footer .footer-articles-list {
		list-style: none;
		margin: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		gap: var(--spacing-xs);
	}

	.site-footer .footer-articles-list a {
		font-family: var(--font-body-family);
		font-size: calc((var(--text-size-s) + var(--text-size-m)) / 2);
		line-height: var(--line-height-comfortable);
		color: var(--color-text);
		text-decoration: none;
		transition: text-decoration var(--transition-normal) var(--ease-standard);
	}

	.site-footer .footer-articles-list a:hover {
		text-decoration: underline;
		text-decoration-thickness: var(--border-thin);
		text-underline-offset: var(--border-thick);
	}
}

/* =============================================================================
   MODALE NEWSLETTER — styles globaux (desktop + mobile)
   Position fixed : hors du @media desktop
   ============================================================================= */

/* Overlay */
.uav-newsletter-modal {
	display: none;
	position: fixed;
	inset: 0;
	z-index: 999999;
	align-items: center;
	justify-content: center;
}

.uav-newsletter-modal.is-open {
	display: flex;
}

/* Backdrop flou */
.uav-newsletter-modal-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(30, 30, 30, 0.12);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

/* Conteneur blanc — mêmes dimensions que .uav-avis-modal-content */
.uav-newsletter-modal-content {
	position: relative;
	background: var(--color-white);
	padding: var(--spacing-xl);
	border-radius: 0.5vh;
	width: 90vh;
	max-width: 92vw;
	max-height: 90vh;
	overflow-y: auto;
	box-shadow: 0 1vh 4vh rgba(0, 0, 0, 0.12);
	animation: uav-newsletter-appear 0.25s ease;
}

.uav-newsletter-modal.is-closing .uav-newsletter-modal-content {
	animation: uav-newsletter-disappear 0.3s ease forwards;
}

.uav-newsletter-modal.is-closing .uav-newsletter-modal-backdrop {
	animation: uav-newsletter-backdrop-out 0.3s ease forwards;
}

@keyframes uav-newsletter-appear {
	from { opacity: 0; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}

@keyframes uav-newsletter-disappear {
	from { opacity: 1; transform: translateY(0); }
	to   { opacity: 0; transform: translateY(12px); }
}

@keyframes uav-newsletter-backdrop-out {
	from { opacity: 1; }
	to   { opacity: 0; }
}

/* Bouton fermeture × */
.uav-newsletter-close {
	position: absolute;
	top: var(--spacing-sm);
	right: var(--spacing-sm);
	background: none;
	border: none;
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	color: var(--color-text);
	padding: 4px 8px;
}

/* Titre */
.uav-newsletter-modal-title {
	font-family: var(--font-heading);
	font-size: var(--text-size-2xl);
	font-weight: 400;
	line-height: var(--line-height-tight);
	color: var(--color-text);
	margin: 0 0 var(--spacing-md);
}

/* Sous-titre motivant */
.uav-newsletter-subtitle {
	font-family: var(--font-body);
	font-size: var(--text-size-m);
	color: var(--color-text);
	margin: calc(-1 * var(--spacing-xs)) 0 var(--spacing-md);
}

/* Formulaire */
.uav-newsletter-form {
	display: flex;
	flex-direction: column;
	gap: var(--spacing-sm);
}

.uav-newsletter-form-name {
	display: flex;
	gap: var(--spacing-sm);
}

.uav-newsletter-form-name input {
	flex: 1;
}

.uav-newsletter-form input[type="text"],
.uav-newsletter-form input[type="email"] {
	width: 100%;
	font-family: var(--font-body);
	font-size: var(--text-size-m);
	font-weight: 500;
	color: var(--color-text);
	background: transparent;
	border: var(--border-thin) solid var(--color-text);
	padding: var(--spacing-xs);
	outline: none;
	box-sizing: border-box;
}

.uav-newsletter-form input[type="text"]::placeholder,
.uav-newsletter-form input[type="email"]::placeholder {
	font-style: italic;
	text-transform: uppercase;
	color: var(--color-text);
}

.uav-newsletter-submit {
	align-self: flex-start;
	border: none;
	background: none;
	cursor: pointer;
}

.uav-newsletter-submit:disabled {
	cursor: not-allowed;
}

/* Note désabonnement */
.uav-newsletter-note {
	font-family: var(--font-small-text-family);
	font-size: var(--font-small-text-size);
	font-weight: var(--font-small-text-weight);
	font-style: italic;
	color: var(--color-text);
	margin: 0;
}

/* Feedback inline */
.uav-newsletter-form .uav-brevo-feedback {
	margin: 0;
	font-family: var(--font-body);
	font-size: var(--text-size-s);
	min-height: 1em;
}

.uav-newsletter-form .uav-brevo-feedback.is-success { color: var(--color-green); }
.uav-newsletter-form .uav-brevo-feedback.is-error   { color: var(--color-pink); }

/* Message de confirmation (remplace le formulaire après succès) */
.uav-newsletter-confirmation {
	display: none;
	font-family: var(--font-heading);
	font-size: var(--text-size-2xl);
	font-weight: 400;
	line-height: var(--line-height-tight);
	color: var(--color-green);
	padding: var(--spacing-md) 0;
}

.uav-newsletter-confirmation.is-visible {
	display: block;
}