/* ==========================================================================
   Marcos Gallery — frontend v2
   Estética de galeria de cliente: capa full-bleed, header fino, mosaico,
   lightbox minimal. 3 temas: light / editorial / cinema.
   ========================================================================== */

.mg-gallery {
	--mg-bg: #ffffff;
	--mg-ink: #17171a;
	--mg-muted: #8b8b92;
	--mg-line: rgba(0, 0, 0, 0.10);
	--mg-accent: #17171a;
	--mg-accent-ink: #ffffff;
	--mg-tile: #efeeec;
	--mg-radius: 0px;
	--mg-sans: "Jost", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--mg-serif: "Cormorant Garamond", Georgia, "Times New Roman", serif;
	--mg-pad: clamp(18px, 4vw, 64px);

	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	background: var(--mg-bg);
	color: var(--mg-ink);
	font-family: var(--mg-sans);
	font-size: 15px;
	line-height: 1.5;
	overflow-x: hidden;
}

.mg-gallery.mg-theme-editorial {
	--mg-bg: #faf7f2;
	--mg-ink: #1f1b16;
	--mg-muted: #8f8779;
	--mg-line: rgba(31, 27, 22, 0.13);
	--mg-accent: #1f1b16;
	--mg-tile: #ece7df;
}

.mg-gallery.mg-theme-cinema {
	--mg-bg: #0c0c0d;
	--mg-ink: #f3f2f0;
	--mg-muted: #8e8e95;
	--mg-line: rgba(255, 255, 255, 0.14);
	--mg-accent: #f3f2f0;
	--mg-accent-ink: #0c0c0d;
	--mg-tile: #18181a;
}

.mg-gallery.mg-theme-sand {
	--mg-bg: #e9e2d8;
	--mg-ink: #3a332a;
	--mg-muted: #8b8070;
	--mg-line: rgba(58, 51, 42, 0.16);
	--mg-accent: #3a332a;
	--mg-tile: #dcd3c6;
}

.mg-gallery.mg-theme-slate {
	--mg-bg: #1d2024;
	--mg-ink: #e7e9ec;
	--mg-muted: #8e959e;
	--mg-line: rgba(231, 233, 236, 0.16);
	--mg-accent: #e7e9ec;
	--mg-accent-ink: #1d2024;
	--mg-tile: #272b31;
}

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

.mg-eyebrow {
	font-size: 10.5px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	font-weight: 400;
}

/* ---------- Header ---------- */
.mg-header {
	position: sticky;
	top: 0;
	z-index: 40;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 0 var(--mg-pad);
	height: 62px;
	background: color-mix(in srgb, var(--mg-bg) 88%, transparent);
	backdrop-filter: saturate(140%) blur(14px);
	-webkit-backdrop-filter: saturate(140%) blur(14px);
	border-bottom: 1px solid var(--mg-line);
}

.mg-brand {
	font-family: var(--mg-serif);
	font-size: 19px;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.mg-nav { display: flex; align-items: center; gap: clamp(10px, 2vw, 26px); }

.mg-nav button {
	appearance: none;
	background: none;
	border: 0;
	padding: 6px 0;
	color: var(--mg-muted);
	font-family: inherit;
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	cursor: pointer;
	transition: color 0.2s ease;
}
.mg-nav button:hover,
.mg-nav button.is-active { color: var(--mg-ink); }
.mg-nav .mg-nav-count {
	display: inline-block;
	margin-left: 6px;
	color: var(--mg-muted);
	font-size: 10px;
	letter-spacing: 0.08em;
}

/* ---------- Capa ---------- */
.mg-cover {
	position: relative;
	display: grid;
	align-content: end;
	min-height: min(86vh, 860px);
	padding: var(--mg-pad);
	padding-bottom: clamp(36px, 7vh, 84px);
	overflow: hidden;
	isolation: isolate;
}
.mg-cover-media {
	position: absolute;
	inset: 0;
	z-index: -2;
	background: var(--mg-tile) center / cover no-repeat;
	transform: scale(1.02);
}
.mg-cover::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.12) 45%, rgba(0, 0, 0, 0.18) 100%);
}
.mg-cover.has-media { color: #fff; }
.mg-cover.has-media .mg-cover-sub { color: rgba(255, 255, 255, 0.82); }

.mg-cover-title {
	margin: 0;
	font-family: var(--mg-serif);
	font-weight: 300;
	font-size: clamp(40px, 7.2vw, 104px);
	line-height: 0.98;
	letter-spacing: -0.01em;
	text-wrap: balance;
}
.mg-cover-sub {
	margin: 18px 0 0;
	color: var(--mg-muted);
	font-size: 11px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
}

/* Capa sem imagem: tipografia sobre o fundo do tema */
.mg-cover.no-media {
	align-content: center;
	justify-items: center;
	text-align: center;
	min-height: min(62vh, 620px);
	border-bottom: 1px solid var(--mg-line);
}
.mg-cover.no-media::after { display: none; }

/* Capa dividida: imagem à direita, título à esquerda */
.mg-cover.layout-split {
	grid-template-columns: 1fr 1fr;
	align-content: center;
	align-items: center;
	gap: clamp(24px, 5vw, 72px);
	min-height: min(78vh, 780px);
	padding-bottom: var(--mg-pad);
	color: var(--mg-ink);
}
.mg-cover.layout-split::after { display: none; }
.mg-cover.layout-split .mg-cover-media {
	position: relative;
	inset: auto;
	z-index: 0;
	grid-column: 2;
	grid-row: 1;
	aspect-ratio: 4 / 5;
	width: 100%;
	transform: none;
}
.mg-cover.layout-split .mg-cover-text { grid-column: 1; grid-row: 1; }
.mg-cover.layout-split .mg-cover-sub { color: var(--mg-muted); }
@media (max-width: 760px) {
	.mg-cover.layout-split { grid-template-columns: 1fr; }
	.mg-cover.layout-split .mg-cover-media { grid-column: 1; grid-row: 1; aspect-ratio: 3 / 2; }
	.mg-cover.layout-split .mg-cover-text { grid-column: 1; grid-row: 2; }
}

.mg-scroll-cue {
	position: absolute;
	left: 50%;
	bottom: 16px;
	transform: translateX(-50%);
	font-size: 10px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	opacity: 0.7;
	animation: mg-cue 2.4s ease-in-out infinite;
}
@keyframes mg-cue {
	0%, 100% { transform: translate(-50%, 0); opacity: 0.45; }
	50% { transform: translate(-50%, 6px); opacity: 0.85; }
}

/* ---------- Barra de contexto ---------- */
.mg-meta-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding: clamp(20px, 4vw, 40px) var(--mg-pad) clamp(14px, 2.5vw, 24px);
	color: var(--mg-muted);
}
.mg-meta-bar .mg-price-info {
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.mg-view-toggle { display: flex; gap: 2px; }
.mg-view-btn {
	appearance: none;
	background: none;
	border: 1px solid transparent;
	width: 32px;
	height: 28px;
	color: var(--mg-muted);
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
	transition: color 0.2s ease, border-color 0.2s ease;
}
.mg-view-btn.is-active { color: var(--mg-ink); border-color: var(--mg-line); }

/* ---------- Conjuntos tipográficos ---------- */
.mg-gallery.mg-type-sans {
	--mg-serif: "Jost", -apple-system, sans-serif;
}
.mg-gallery.mg-type-sans .mg-cover-title { font-weight: 300; letter-spacing: -0.02em; }
.mg-gallery.mg-type-sans .mg-brand { letter-spacing: 0.14em; text-transform: uppercase; font-size: 13px; }

.mg-gallery.mg-type-contrast {
	--mg-serif: "Bodoni Moda", Didot, Georgia, serif;
}
.mg-gallery.mg-type-contrast .mg-cover-title { font-weight: 400; }

.mg-gallery.mg-type-mono {
	--mg-sans: "IBM Plex Mono", ui-monospace, monospace;
	--mg-serif: "IBM Plex Mono", ui-monospace, monospace;
}
.mg-gallery.mg-type-mono .mg-cover-title {
	font-weight: 400;
	font-size: clamp(30px, 4.6vw, 64px);
	letter-spacing: -0.02em;
}
.mg-gallery.mg-type-mono .mg-brand { font-size: 13px; letter-spacing: 0.1em; }

/* ---------- Cantos ---------- */
.mg-gallery.mg-corners-round { --mg-radius: 4px; }
.mg-gallery.mg-corners-round .mg-cover.layout-split .mg-cover-media,
.mg-gallery.mg-corners-round .mg-cover.layout-frame .mg-cover-media { border-radius: 4px; }

/* ---------- Capa: variantes ---------- */
/* Journal — cartão de título sobre a imagem */
.mg-cover.layout-journal {
	align-content: end;
	justify-items: start;
	padding-bottom: 0;
}
.mg-cover.layout-journal::after {
	background: linear-gradient(to top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.05) 60%);
}
.mg-cover.layout-journal .mg-cover-text {
	background: var(--mg-bg);
	color: var(--mg-ink);
	padding: clamp(22px, 3.5vw, 44px) clamp(26px, 4vw, 56px);
	max-width: min(560px, 82vw);
	margin-bottom: calc(var(--mg-pad) * -0.5);
	border-radius: var(--mg-radius);
}
.mg-cover.layout-journal .mg-cover-sub { color: var(--mg-muted); }

/* Centro — título centrado sobre a imagem */
.mg-cover.layout-center {
	align-content: center;
	justify-items: center;
	text-align: center;
}
.mg-cover.layout-center::after {
	background: rgba(0, 0, 0, 0.3);
}
.mg-cover.layout-center .mg-cover-title { max-width: 22ch; }

/* Moldura — imagem com margem, tipografia por baixo */
.mg-cover.layout-frame {
	align-content: start;
	justify-items: center;
	text-align: center;
	gap: clamp(20px, 3vw, 40px);
	min-height: 0;
	color: var(--mg-ink);
	padding-top: clamp(20px, 3vw, 44px);
}
.mg-cover.layout-frame::after { display: none; }
.mg-cover.layout-frame .mg-cover-media {
	position: relative;
	inset: auto;
	z-index: 0;
	width: 100%;
	aspect-ratio: 16 / 9;
	transform: none;
}
.mg-cover.layout-frame .mg-cover-sub { color: var(--mg-muted); }
@media (max-width: 760px) {
	.mg-cover.layout-frame .mg-cover-media { aspect-ratio: 4 / 3; }
}

/* ---------- Grelha ---------- */
.mg-grid {
	--mg-gap: clamp(8px, 1.2vw, 18px);
	--mg-cols: 3;
	--mg-min: 300px;
	--mg-row-h: clamp(210px, 24vw, 330px);
	padding: 0 var(--mg-pad) clamp(40px, 8vw, 100px);
}

/* Densidade das miniaturas */
.mg-gallery.mg-thumbs-s .mg-grid { --mg-cols: 4; --mg-min: 210px; --mg-row-h: clamp(150px, 16vw, 230px); }
.mg-gallery.mg-thumbs-l .mg-grid { --mg-cols: 2; --mg-min: 460px; --mg-row-h: clamp(280px, 34vw, 480px); }

/* Espaçamento */
.mg-gallery.mg-gap-tight .mg-grid { --mg-gap: 3px; }
.mg-gallery.mg-gap-wide .mg-grid { --mg-gap: clamp(20px, 3.4vw, 52px); }

.mg-grid.view-masonry {
	column-count: var(--mg-cols);
	column-gap: var(--mg-gap);
}
.mg-grid.view-masonry .mg-photo {
	break-inside: avoid;
	margin-bottom: var(--mg-gap);
}
.mg-grid.view-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--mg-min)), 1fr));
	gap: var(--mg-gap);
}

/* Linhas justificadas — alturas iguais, larguras variáveis */
.mg-grid.view-rows {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mg-gap);
}
.mg-grid.view-rows .mg-photo {
	flex: 1 1 calc(var(--mg-min) * 0.9);
	max-width: 100%;
}
.mg-grid.view-rows .mg-photo-wrap { height: var(--mg-row-h); }

/* Revista — ritmo alternado de destaques */
.mg-grid.view-magazine {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: var(--mg-gap);
}
.mg-grid.view-magazine .mg-photo-wrap { aspect-ratio: 1 / 1; height: auto; }
.mg-grid.view-magazine .mg-photo:nth-child(9n + 1) { grid-column: span 2; grid-row: span 2; }
.mg-grid.view-magazine .mg-photo:nth-child(9n + 6) { grid-column: span 2; }
.mg-grid.view-magazine .mg-photo:nth-child(9n + 6) .mg-photo-wrap { aspect-ratio: 2 / 1; }
.mg-gallery.mg-thumbs-l .mg-grid.view-magazine { grid-template-columns: repeat(3, 1fr); }
.mg-gallery.mg-thumbs-s .mg-grid.view-magazine { grid-template-columns: repeat(6, 1fr); }

@media (max-width: 900px) {
	.mg-grid.view-masonry { column-count: min(var(--mg-cols), 2); }
	.mg-grid.view-magazine,
	.mg-gallery.mg-thumbs-s .mg-grid.view-magazine,
	.mg-gallery.mg-thumbs-l .mg-grid.view-magazine { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
	.mg-grid.view-masonry { column-count: 1; }
}

.mg-photo.is-hidden { display: none; }

.mg-photo-wrap {
	position: relative;
	overflow: hidden;
	background: var(--mg-tile);
	border-radius: var(--mg-radius);
}
.mg-grid.view-grid .mg-photo-wrap { aspect-ratio: var(--mg-ratio, 4 / 5); }
.mg-gallery.mg-ratio-square .mg-grid.view-grid .mg-photo-wrap { --mg-ratio: 1 / 1; }
.mg-gallery.mg-ratio-landscape .mg-grid.view-grid .mg-photo-wrap { --mg-ratio: 3 / 2; }

.mg-photo-img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	cursor: zoom-in;
	-webkit-user-select: none;
	user-select: none;
	transition: transform 0.9s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.6s ease;
}
.mg-photo-wrap:hover .mg-photo-img { transform: scale(1.035); }

.mg-photo-wrap::after {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.22), rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, 0.18));
	opacity: 0;
	transition: opacity 0.35s ease;
}
.mg-photo-wrap:hover::after { opacity: 1; }

.mg-watermark {
	position: absolute;
	right: 12px;
	bottom: 11px;
	color: rgba(255, 255, 255, 0.9);
	font-size: 9.5px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
	opacity: 0.75;
	pointer-events: none;
}

/* Ações sobre a foto */
.mg-fav-btn,
.mg-download-btn,
.mg-select-label {
	position: absolute;
	top: 12px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	cursor: pointer;
	opacity: 0;
	transform: translateY(-4px);
	transition: opacity 0.25s ease, transform 0.25s ease, background 0.2s ease, color 0.2s ease;
}
.mg-photo-wrap:hover .mg-fav-btn,
.mg-photo-wrap:hover .mg-download-btn,
.mg-photo-wrap:hover .mg-select-label,
.mg-fav-btn.is-fav,
.mg-photo.is-selected .mg-select-label {
	opacity: 1;
	transform: none;
}

.mg-fav-btn {
	right: 12px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: #26262a;
	font-size: 13px;
	line-height: 1;
}
.mg-download-btn {
	right: 52px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.92);
	color: #26262a;
	font-size: 14px;
	line-height: 1;
}
.mg-download-btn:hover { background: #fff; }
.mg-fav-btn:hover { background: #fff; }
.mg-fav-btn.is-fav { background: #fff; color: #c9354f; }

.mg-select-label {
	left: 12px;
	gap: 7px;
	padding: 0 11px;
	height: 32px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.92);
	color: #26262a;
	font-size: 10px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.mg-select-label input { margin: 0; accent-color: #26262a; }
.mg-photo.is-selected .mg-select-label { background: #17171a; color: #fff; }
.mg-photo.is-selected .mg-photo-wrap { outline: 2px solid var(--mg-ink); outline-offset: -2px; }

.mg-empty {
	padding: clamp(40px, 10vh, 120px) var(--mg-pad);
	text-align: center;
	color: var(--mg-muted);
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

/* ---------- Rodapé ---------- */
.mg-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	flex-wrap: wrap;
	padding: 26px var(--mg-pad) 34px;
	border-top: 1px solid var(--mg-line);
	color: var(--mg-muted);
	font-size: 10.5px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

/* ---------- Tabuleiro de seleção ---------- */
.mg-checkout-bar {
	position: fixed;
	left: 50%;
	bottom: 22px;
	z-index: 60;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 10px 10px 22px;
	background: var(--mg-ink);
	color: var(--mg-bg);
	border-radius: 999px;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
	transform: translate(-50%, 160%);
	opacity: 0;
	transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease;
}
.mg-checkout-bar.is-visible { transform: translate(-50%, 0); opacity: 1; }
.mg-selected-count {
	font-size: 10.5px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	white-space: nowrap;
}
.mg-checkout-bar button {
	appearance: none;
	border: 0;
	padding: 11px 18px;
	border-radius: 999px;
	background: var(--mg-bg);
	color: var(--mg-ink);
	font-family: inherit;
	font-size: 10.5px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	cursor: pointer;
	white-space: nowrap;
	transition: opacity 0.2s ease;
}
.mg-checkout-bar button:hover { opacity: 0.85; }
.mg-checkout-bar button:disabled { opacity: 0.4; cursor: not-allowed; }
.mg-buy-bundle {
	background: transparent !important;
	color: var(--mg-bg) !important;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}
.mg-download-all {
	background: transparent !important;
	color: var(--mg-bg) !important;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
}
@media (max-width: 560px) {
	.mg-checkout-bar { left: 12px; right: 12px; bottom: 12px; flex-wrap: wrap; justify-content: center; border-radius: 18px; padding: 12px; transform: translate(0, 160%); }
	.mg-checkout-bar.is-visible { transform: translate(0, 0); }
}

.mg-checkout-msg {
	padding: 0 var(--mg-pad) 18px;
	color: #b4485c;
	font-size: 12px;
	letter-spacing: 0.06em;
}

/* ---------- Ecrã de password ---------- */
.mg-password-form {
	position: relative;
	width: 100vw;
	margin-left: calc(50% - 50vw);
	min-height: min(88vh, 900px);
	display: grid;
	place-content: center;
	justify-items: center;
	gap: 0;
	padding: 48px 24px;
	text-align: center;
	background: #0c0c0d center / cover no-repeat;
	color: #fff;
	font-family: "Jost", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	isolation: isolate;
}
.mg-password-form::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(8, 8, 10, 0.55);
	backdrop-filter: blur(2px);
}
.mg-password-title {
	margin: 0 0 6px;
	font-family: "Cormorant Garamond", Georgia, serif;
	font-weight: 300;
	font-size: clamp(32px, 5vw, 60px);
	line-height: 1.05;
}
.mg-password-form label {
	display: block;
	max-width: 30ch;
	margin: 0 auto;
	color: rgba(255, 255, 255, 0.72);
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	line-height: 1.8;
}
.mg-password-form input[type="password"] {
	display: block;
	width: min(320px, 78vw);
	margin: 26px auto 12px;
	padding: 13px 16px;
	border: 1px solid rgba(255, 255, 255, 0.4);
	border-radius: 0;
	background: rgba(255, 255, 255, 0.06);
	color: #fff;
	font-family: inherit;
	font-size: 14px;
	letter-spacing: 0.14em;
	text-align: center;
}
.mg-password-form input[type="password"]:focus {
	outline: none;
	border-color: #fff;
}
.mg-password-form button {
	padding: 13px 30px;
	border: 0;
	background: #fff;
	color: #111;
	font-family: inherit;
	font-size: 10.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	cursor: pointer;
}
.mg-password-error {
	margin-top: 16px;
	color: #ffb3bf;
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

/* ---------- Lightbox ---------- */
.mg-lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: grid;
	grid-template-rows: auto 1fr auto;
	background: rgba(8, 8, 10, 0.97);
	color: #fff;
	font-family: "Jost", -apple-system, BlinkMacSystemFont, sans-serif;
}
.mg-lightbox-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px clamp(16px, 4vw, 36px);
}
.mg-lightbox-counter {
	font-size: 10.5px;
	letter-spacing: 0.22em;
	color: rgba(255, 255, 255, 0.6);
}
.mg-lightbox-close {
	appearance: none;
	background: none;
	border: 0;
	color: rgba(255, 255, 255, 0.75);
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	transition: color 0.2s ease;
}
.mg-lightbox-close:hover { color: #fff; }

.mg-lightbox-stage {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 0;
	padding: 0 clamp(12px, 6vw, 80px);
}
.mg-lightbox-img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	-webkit-user-select: none;
	user-select: none;
}
.mg-lightbox-watermark {
	position: absolute;
	right: clamp(16px, 6vw, 88px);
	bottom: 14px;
	color: rgba(255, 255, 255, 0.72);
	font-size: 10px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}
.mg-lightbox-prev,
.mg-lightbox-next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	appearance: none;
	background: none;
	border: 0;
	color: rgba(255, 255, 255, 0.55);
	font-size: 34px;
	line-height: 1;
	width: 44px;
	height: 44px;
	cursor: pointer;
	transition: color 0.2s ease;
}
.mg-lightbox-prev { left: clamp(4px, 2vw, 24px); }
.mg-lightbox-next { right: clamp(4px, 2vw, 24px); }
.mg-lightbox-prev:hover,
.mg-lightbox-next:hover { color: #fff; }

.mg-lightbox-bar {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 18px clamp(16px, 4vw, 36px) 26px;
}
.mg-lightbox-bar button,
.mg-lightbox-bar label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border: 1px solid rgba(255, 255, 255, 0.22);
	border-radius: 999px;
	background: none;
	color: #fff;
	font-family: inherit;
	font-size: 10px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s ease, border-color 0.2s ease;
}
.mg-lightbox-bar button:hover,
.mg-lightbox-bar label:hover { background: rgba(255, 255, 255, 0.1); }
.mg-lightbox-fav.is-fav { background: #fff; color: #c9354f; border-color: #fff; }
.mg-lightbox-bar input { margin: 0; accent-color: #fff; }

/* Seletor de fundo do lightbox */
.mg-lightbox-bg-switch { display: flex; gap: 10px; align-items: center; }
.mg-bg-swatch {
	appearance: none;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	cursor: pointer;
	border: 1px solid rgba(255, 255, 255, 0.4);
	transition: transform 0.2s ease, border-color 0.2s ease;
}
.mg-bg-swatch[data-bg="dark"] { background: #0c0c0d; }
.mg-bg-swatch[data-bg="gray"] { background: #6b6b6b; }
.mg-bg-swatch[data-bg="light"] { background: #f5f5f5; }
.mg-bg-swatch.is-active { transform: scale(1.25); border-color: #fff; }

/* Variantes de fundo do lightbox */
.mg-lightbox.bg-dark { background: rgba(8, 8, 10, 0.97); color: #fff; }
.mg-lightbox.bg-gray { background: #3a3a3a; color: #fff; }
.mg-lightbox.bg-light { background: #f2f2f0; color: #17171a; }

.mg-lightbox.bg-light .mg-lightbox-counter { color: rgba(23, 23, 26, 0.6); }
.mg-lightbox.bg-light .mg-lightbox-close,
.mg-lightbox.bg-light .mg-lightbox-prev,
.mg-lightbox.bg-light .mg-lightbox-next { color: rgba(23, 23, 26, 0.6); }
.mg-lightbox.bg-light .mg-lightbox-close:hover,
.mg-lightbox.bg-light .mg-lightbox-prev:hover,
.mg-lightbox.bg-light .mg-lightbox-next:hover { color: #17171a; }
.mg-lightbox.bg-light .mg-lightbox-watermark { color: rgba(23, 23, 26, 0.55); text-shadow: none; }
.mg-lightbox.bg-light .mg-lightbox-bar button,
.mg-lightbox.bg-light .mg-lightbox-bar label {
	color: #17171a;
	border-color: rgba(23, 23, 26, 0.2);
}
.mg-lightbox.bg-light .mg-lightbox-fav.is-fav { background: #17171a; color: #fff; border-color: #17171a; }
.mg-lightbox.bg-light .mg-bg-swatch { border-color: rgba(23, 23, 26, 0.3); }
.mg-lightbox.bg-light .mg-bg-swatch.is-active { border-color: #17171a; }

@media (prefers-reduced-motion: reduce) {
	.mg-gallery *,
	.mg-lightbox * { animation: none !important; transition: none !important; }
}
