/* trava scroll quando modal aberto */
html.uslb-lock, body.uslb-lock { overflow: hidden; }

#us-lightbox { position: fixed; inset: 0; z-index: 99999; display: none; }
#us-lightbox.is-open { display: block; }

#us-lightbox .uslb-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.75); }

#us-lightbox .uslb-dialog {
  position: absolute; inset: 0;
  display: grid;
  place-items: center;
  padding: 24px;
}

#us-lightbox .uslb-close {
  position: absolute;
  top: 16px; right: 16px;
  width: 44px; height: 44px;
  border: 0; border-radius: 999px;
  font-size: 28px; line-height: 44px;
  cursor: pointer;
}

/* ✅ AQUI é o pulo do gato: coluna */
#us-lightbox .uslb-figure {
  margin: 0;
  display: flex;
  flex-direction: column;     /* legenda embaixo */
  align-items: center;
  justify-content: center;

  max-width: 96vw;            /* ocupa mais a tela */
  max-height: 90vh;
}

/* ✅ imagem grande, mas sem estourar a tela */
#us-lightbox .uslb-img {
  display: block;
  width: auto;
  height: auto;
  max-width: 96vw;
  max-height: 82vh;           /* deixa espaço pra legenda */
}

/* ✅ legenda embaixo */
#us-lightbox .uslb-caption {
  margin-top: 12px;
  max-width: 96vw;
  color: rgba(255,255,255,.92);
  font-size: 14px;
  line-height: 1.4;
  text-align: center;
  word-break: break-word;
}
/* ====== LIGHTBOX: override "nuclear" pra não deixar o tema mandar ====== */

#us-lightbox.is-open { display: block !important; }

#us-lightbox .uslb-dialog{
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
}

#us-lightbox .uslb-figure{
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important; /* legenda embaixo */
  align-items: center !important;
  justify-content: center !important;

  /* ✅ garante que o container pode crescer */
  width: auto !important;
  max-width: 96vw !important;
  max-height: 90vh !important;

  /* evita regras globais do tema */
  float: none !important;
}

#us-lightbox .uslb-img{
  display: block !important;

  /* ✅ deixa o navegador escolher o tamanho, mas limita pela tela */
  width: auto !important;
  height: auto !important;
  max-width: 96vw !important;
  max-height: 82vh !important;

  /* em alguns temas o img vem com object-fit estranho */
  object-fit: contain !important;
}

#us-lightbox .uslb-caption{
  display: block !important;
  margin-top: 12px !important;
  max-width: 96vw !important;
  text-align: center !important;
}
/* garante que o modal ocupa a viewport */
#us-lightbox {
  position: fixed !important;
  inset: 0 !important;
  z-index: 999999 !important;
}

/* backdrop clicável cobrindo tudo */
#us-lightbox .uslb-backdrop{
  position: fixed !important;
  inset: 0 !important;
  z-index: 0 !important;
}

/* dialog por cima do backdrop */
#us-lightbox .uslb-dialog{
  position: fixed !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px !important;
}

/* ✅ X sempre dentro da tela */
#us-lightbox .uslb-close{
  position: fixed !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 2 !important;

  width: 44px !important;
  height: 44px !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 28px !important;
  line-height: 44px !important;
  cursor: pointer !important;
}