/* =====================================================================
 * Novatrix Galerie Pro — front
 * ===================================================================== */

.nxg {
	--nxg-cols: 3;
	--nxg-cols-t: 2;
	--nxg-cols-m: 1;
	--nxg-cur-cols: var(--nxg-cols);
	--nxg-gap: 10px;
	--nxg-radius: 6px;
	--nxg-ratio-fixed: 4 / 3;
	--nxg-row-h: 240px;
	--nxg-accent: #1f6feb;
	--nxg-overlay: linear-gradient(to top, rgba(0, 0, 0, .72) 0%, rgba(0, 0, 0, .25) 45%, rgba(0, 0, 0, 0) 75%);
	position: relative;
	margin: 1.5em 0;
	container-type: inline-size;
}

@media (max-width: 1024px) {
	.nxg { --nxg-cur-cols: var(--nxg-cols-t); }
}
@media (max-width: 767px) {
	.nxg { --nxg-cur-cols: var(--nxg-cols-m); }
}

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

.nxg [hidden],
.nxg-lb [hidden],
.nxg-lb[hidden] { display: none !important; }

.nxg-item {
	margin: 0;
	padding: 0;
	min-width: 0;
	position: relative;
}

.nxg-inner { position: relative; height: 100%; display: flex; flex-direction: column; }

.nxg-link {
	display: block;
	color: inherit;
	text-decoration: none;
	cursor: zoom-in;
	flex: 1 1 auto;
	min-height: 0;
	outline-offset: 3px;
	border-radius: var(--nxg-radius);
}
.nxg-link:focus-visible { outline: 2px solid var(--nxg-accent); }

.nxg-media {
	position: relative;
	overflow: hidden;
	border-radius: var(--nxg-radius);
	background: rgba(127, 127, 127, .12);
	aspect-ratio: var(--nxg-ratio-fixed);
	height: 100%;
	isolation: isolate;
}

.nxg-ratio--original .nxg-media,
.nxg--masonry .nxg-media { aspect-ratio: var(--nxg-r); height: auto; }

.nxg .nxg-img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	object-fit: cover;
	border-radius: 0;
	transition: transform .55s cubic-bezier(.2, .7, .2, 1), filter .4s ease, opacity .4s ease;
}

/* ---------------------------------------------------------------------
 * Mises en page
 * ------------------------------------------------------------------- */

/* Grille */
.nxg--grid .nxg-grid {
	display: grid;
	grid-template-columns: repeat(var(--nxg-cur-cols), minmax(0, 1fr));
	gap: var(--nxg-gap);
}

/* Masonry (rangées de 4px calculées en JS) */
.nxg--masonry .nxg-grid {
	display: grid;
	grid-template-columns: repeat(var(--nxg-cur-cols), minmax(0, 1fr));
	column-gap: var(--nxg-gap);
	row-gap: var(--nxg-gap);
	align-items: start;
}
.nxg--masonry.is-laid .nxg-grid { grid-auto-rows: 4px; row-gap: 0; }

/* Justifiée */
.nxg--justified .nxg-grid {
	display: flex;
	flex-wrap: wrap;
	gap: var(--nxg-gap);
}
.nxg--justified .nxg-item {
	flex: 0 0 auto;
	height: var(--nxg-row-h);
	width: calc(var(--nxg-row-h) * var(--nxg-r));
	max-width: 100%;
}
.nxg--justified:not(.is-laid) .nxg-item { flex-grow: 1; }
.nxg--justified .nxg-media { aspect-ratio: auto; height: 100%; }

/* Mosaïque */
.nxg--mosaic .nxg-grid {
	display: grid;
	grid-template-columns: repeat(var(--nxg-cur-cols), minmax(0, 1fr));
	grid-auto-rows: calc((100cqi - (var(--nxg-cur-cols) - 1) * var(--nxg-gap)) / var(--nxg-cur-cols));
	grid-auto-flow: dense;
	gap: var(--nxg-gap);
}
.nxg--mosaic .nxg-media { aspect-ratio: auto; height: 100%; }
.nxg--mosaic .nxg-item:nth-child(10n + 1) { grid-column: span 2; grid-row: span 2; }
.nxg--mosaic .nxg-item:nth-child(10n + 4) { grid-row: span 2; }
.nxg--mosaic .nxg-item:nth-child(10n + 7) { grid-column: span 2; }
@media (max-width: 767px) {
	.nxg--mosaic .nxg-item:nth-child(n) { grid-column: auto; grid-row: auto; }
	.nxg--mosaic .nxg-item:nth-child(5n + 1) { grid-column: 1 / -1; }
}

/* Carrousel */
.nxg-car { position: relative; }
.nxg--carousel .nxg-grid {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--nxg-cur-cols) - 1) * var(--nxg-gap)) / var(--nxg-cur-cols));
	gap: var(--nxg-gap);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.nxg--carousel .nxg-grid::-webkit-scrollbar { display: none; }
.nxg--carousel .nxg-item { scroll-snap-align: start; }
.nxg--carousel .nxg-grid:focus-visible { outline: 2px solid var(--nxg-accent); outline-offset: 4px; }

.nxg-car__arrow {
	position: absolute;
	top: 50%;
	z-index: 3;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	color: #111;
	box-shadow: 0 4px 16px rgba(0, 0, 0, .18);
	cursor: pointer;
	display: grid;
	place-items: center;
	transition: transform .2s ease, opacity .2s ease;
}
.nxg-car__arrow:hover { transform: scale(1.08); }
.nxg-car__arrow:disabled { opacity: .35; cursor: default; transform: none; }
.nxg-car__arrow svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.nxg-car__arrow--prev { left: 10px; }
.nxg-car__arrow--next { right: 10px; }

.nxg-car__dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.nxg-car__dot {
	width: 9px; height: 9px; padding: 0; border: 0; border-radius: 9px;
	background: currentColor; opacity: .25; cursor: pointer;
	transition: width .25s ease, opacity .25s ease;
}
.nxg-car__dot.is-active { width: 26px; opacity: .85; }

/* ---------------------------------------------------------------------
 * Légendes
 * ------------------------------------------------------------------- */
.nxg-caption {
	margin: 0;
	font-size: .9em;
	line-height: 1.35;
}
.nxg-cap--overlay .nxg-caption,
.nxg-cap--always .nxg-caption {
	position: absolute;
	inset: auto 0 0 0;
	z-index: 2;
	padding: 2.4em 1em .85em;
	color: #fff;
	background: var(--nxg-overlay);
	pointer-events: none;
	transition: opacity .35s ease, transform .35s ease;
}
.nxg-cap--overlay .nxg-caption { opacity: 0; transform: translateY(8px); }
.nxg-cap--overlay .nxg-item:hover .nxg-caption,
.nxg-cap--overlay .nxg-link:focus-visible .nxg-caption { opacity: 1; transform: none; }
@media (hover: none) {
	.nxg-cap--overlay .nxg-caption { opacity: 1; transform: none; }
}
.nxg-cap--below .nxg-caption { padding: .55em .15em 0; opacity: .85; }

/* ---------------------------------------------------------------------
 * Effets au survol
 * ------------------------------------------------------------------- */
@media (hover: hover) {
	.nxg-hover--zoom .nxg-item:hover .nxg-img { transform: scale(1.07); }
	.nxg-hover--fade .nxg-item:hover .nxg-img { opacity: .78; }
	.nxg-hover--blur .nxg-item:hover .nxg-img { filter: blur(2px) brightness(.9); transform: scale(1.03); }
	.nxg-hover--lift .nxg-media { transition: transform .35s ease, box-shadow .35s ease; }
	.nxg-hover--lift .nxg-item:hover .nxg-media { transform: translateY(-5px); box-shadow: 0 14px 30px rgba(0, 0, 0, .2); }
}
.nxg-hover--grayscale .nxg-img { filter: grayscale(1); }
.nxg-hover--grayscale .nxg-item:hover .nxg-img { filter: none; }

/* ---------------------------------------------------------------------
 * Animation d'apparition
 * ------------------------------------------------------------------- */
.nxg.is-ready:not(.nxg-anim--none) .nxg-item:not(.is-visible) { opacity: 0; }
.nxg-anim--fade-up .nxg-item:not(.is-visible) { transform: translateY(18px); }
.nxg-anim--zoom .nxg-item:not(.is-visible) { transform: scale(.94); }
.nxg:not(.nxg-anim--none) .nxg-item {
	transition: opacity .6s ease var(--nxg-delay, 0ms), transform .6s cubic-bezier(.2, .7, .2, 1) var(--nxg-delay, 0ms);
}
@media (prefers-reduced-motion: reduce) {
	.nxg .nxg-item, .nxg .nxg-img, .nxg .nxg-caption { transition: none !important; transform: none !important; opacity: 1 !important; }
}

/* ---------------------------------------------------------------------
 * Filtres & voir plus
 * ------------------------------------------------------------------- */
.nxg-filters {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 0 0 18px;
}
.nxg-filter {
	appearance: none;
	margin: 0;
	padding: .5em 1.1em;
	border: 1px solid rgba(127, 127, 127, .35);
	border-radius: 999px;
	background: transparent;
	color: inherit;
	font: inherit;
	font-size: .9em;
	line-height: 1.2;
	cursor: pointer;
	transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.nxg-filter:hover { border-color: var(--nxg-accent); }
.nxg-filter.is-active { background: var(--nxg-accent); border-color: var(--nxg-accent); color: #fff; }

.nxg-more-wrap { text-align: center; margin-top: 22px; }
.nxg-more {
	appearance: none;
	padding: .8em 1.8em;
	border: 0;
	border-radius: 999px;
	background: var(--nxg-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	transition: transform .2s ease, filter .2s ease;
}
.nxg-more:hover { transform: translateY(-2px); filter: brightness(1.08); }

.nxg-empty { padding: 1em; border: 1px dashed #c3c4c7; color: #646970; text-align: center; }

/* Alignements du bloc */
.wp-block-novatrix-galerie.alignfull .nxg { margin-left: 0; margin-right: 0; }

/* =====================================================================
 * Visionneuse
 * ===================================================================== */
html.nxg-lock, html.nxg-lock body { overflow: hidden !important; }

.nxg-lb {
	--lb-bg: rgba(12, 12, 14, .985);
	--lb-fg: #fff;
	--lb-soft: rgba(255, 255, 255, .12);
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: flex;
	flex-direction: column;
	background: var(--lb-bg);
	color: var(--lb-fg);
	opacity: 0;
	transition: opacity .22s ease;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	-webkit-tap-highlight-color: transparent;
	user-select: none;
}
.nxg-lb.is-open { opacity: 1; }
.nxg-lb--light { --lb-bg: rgba(250, 250, 250, .985); --lb-fg: #111; --lb-soft: rgba(0, 0, 0, .07); }

.nxg-lb__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 12px 10px 18px;
	flex: 0 0 auto;
	position: relative;
	z-index: 2;
}
.nxg-lb__count { font-size: 14px; opacity: .8; font-variant-numeric: tabular-nums; }
.nxg-lb__tools { display: flex; gap: 4px; }

.nxg-lb__btn,
.nxg-lb__nav {
	appearance: none;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: inherit;
	cursor: pointer;
	transition: background .2s ease, opacity .2s ease;
	text-decoration: none;
}
.nxg-lb__btn:hover,
.nxg-lb__nav:hover { background: var(--lb-soft); }
.nxg-lb__btn:focus-visible,
.nxg-lb__nav:focus-visible,
.nxg-lb__thumb:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.nxg-lb svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nxg-lb .nxg-i-pause { display: none; }
.nxg-lb.is-playing .nxg-i-play { display: none; }
.nxg-lb.is-playing .nxg-i-pause { display: inline; }
.nxg-lb.is-playing [data-act="play"] { background: var(--lb-soft); }
.nxg-lb.is-zoomed [data-act="zoom"] { background: var(--lb-soft); }

.nxg-lb__progress { height: 2px; flex: 0 0 auto; }
.nxg-lb__progress span { display: block; height: 100%; width: 0; background: currentColor; opacity: 0; }
.nxg-lb.is-playing .nxg-lb__progress span { opacity: .6; }

.nxg-lb__stage {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px 64px;
}
.nxg-lb__frame {
	position: relative;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.nxg-lb__img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: 4px;
	box-shadow: 0 10px 50px rgba(0, 0, 0, .35);
	cursor: zoom-in;
	transition: transform .35s cubic-bezier(.2, .7, .2, 1), opacity .25s ease;
}
.nxg-lb__img.is-in { animation: nxg-lb-in .35s ease both; }
@keyframes nxg-lb-in { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }
.nxg-lb.is-loading .nxg-lb__img { opacity: .25; }
.nxg-lb.is-zoomed .nxg-lb__img { transform: scale(2.2); cursor: zoom-out; animation: none; }
.nxg-lb:not(.nxg-lb--zoom) .nxg-lb__img { cursor: default; }

.nxg-lb__spinner {
	position: absolute;
	width: 38px;
	height: 38px;
	border: 3px solid var(--lb-soft);
	border-top-color: currentColor;
	border-radius: 50%;
	animation: nxg-spin .8s linear infinite;
	opacity: 0;
	pointer-events: none;
}
.nxg-lb.is-loading .nxg-lb__spinner { opacity: 1; }
@keyframes nxg-spin { to { transform: rotate(360deg); } }

.nxg-lb__nav {
	position: absolute;
	top: 50%;
	z-index: 2;
	width: 52px;
	height: 52px;
	margin-top: -26px;
}
.nxg-lb__nav svg { width: 30px; height: 30px; }
.nxg-lb__nav--prev { left: 8px; }
.nxg-lb__nav--next { right: 8px; }
.nxg-lb.is-single .nxg-lb__nav { display: none; }
.nxg-lb.is-zoomed .nxg-lb__nav { opacity: 0; pointer-events: none; }

.nxg-lb__caption {
	flex: 0 0 auto;
	max-width: 900px;
	margin: 0 auto;
	padding: 10px 20px 4px;
	text-align: center;
	font-size: 15px;
	line-height: 1.45;
	opacity: .9;
	user-select: text;
}

.nxg-lb__thumbs {
	flex: 0 0 auto;
	display: flex;
	gap: 6px;
	padding: 10px 12px 14px;
	overflow-x: auto;
	scrollbar-width: none;
	justify-content: safe center;
}
.nxg-lb__thumbs::-webkit-scrollbar { display: none; }
.nxg-lb:not(.has-thumbs) .nxg-lb__thumbs { display: none; }
.nxg-lb__thumb {
	flex: 0 0 auto;
	width: 64px;
	height: 48px;
	padding: 0;
	border: 2px solid transparent;
	border-radius: 6px;
	overflow: hidden;
	background: var(--lb-soft);
	opacity: .5;
	cursor: pointer;
	transition: opacity .2s ease, border-color .2s ease;
}
.nxg-lb__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nxg-lb__thumb:hover { opacity: .85; }
.nxg-lb__thumb.is-active { opacity: 1; border-color: currentColor; }

.nxg-lb__toast {
	position: absolute;
	left: 50%;
	bottom: 90px;
	transform: translate(-50%, 10px);
	padding: 8px 16px;
	border-radius: 999px;
	background: var(--lb-fg);
	color: var(--lb-bg);
	font-size: 14px;
	opacity: 0;
	pointer-events: none;
	transition: opacity .25s ease, transform .25s ease;
}
.nxg-lb__toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

.nxg-lb.is-fs .nxg-lb__stage { padding: 0 60px; }

@media (max-width: 767px) {
	.nxg-lb__stage { padding: 4px 0; }
	.nxg-lb__nav { width: 44px; height: 44px; margin-top: -22px; background: rgba(0, 0, 0, .25); color: #fff; }
	.nxg-lb__nav--prev { left: 6px; }
	.nxg-lb__nav--next { right: 6px; }
	.nxg-lb__img { border-radius: 0; box-shadow: none; }
	.nxg-lb__thumb { width: 52px; height: 40px; }
	.nxg-lb__caption { font-size: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	.nxg-lb, .nxg-lb__img { transition: none !important; animation: none !important; }
}

/* Liens d'images natives ouvertes dans la visionneuse */
a.nxg-native-link { cursor: zoom-in; }