/*!
 * NCTL Vegas — Mini Lightbox styles
 * Matches theme tokens: --hot, --cyan, --gold, --serif, --paper.
 */

/* Make gallery thumbnails feel clickable */
.gallery a[data-lightbox]{
  display:block;
  position:relative;
  border-radius:var(--rad);
  overflow:hidden;
  cursor:zoom-in;
  outline:none;
  isolation:isolate;
  transition:transform .25s ease, box-shadow .25s ease;
}
.gallery a[data-lightbox] img{
  display:block;
  width:100%;
  margin:0;
  transition:transform .4s ease, filter .25s ease;
}
.gallery a[data-lightbox]::after{
  /* gradient hairline, only on hover */
  content:"";
  position:absolute;inset:0;
  border-radius:inherit;
  padding:1px;
  background:var(--grad-vegas);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
  z-index:2;
}
.gallery a[data-lightbox]:hover{transform:translateY(-2px);box-shadow:var(--shadow-pop)}
.gallery a[data-lightbox]:hover img{transform:scale(1.03);filter:brightness(1.05)}
.gallery a[data-lightbox]:hover::after{opacity:1}
.gallery a[data-lightbox]:focus-visible{box-shadow:0 0 0 3px var(--cyan), 0 0 0 5px rgba(0,213,229,.25)}

/* Tiny zoom hint in corner on hover */
.gallery a[data-lightbox]::before{
  content:"⤢";
  position:absolute;top:.5rem;right:.5rem;
  width:2rem;height:2rem;
  display:flex;align-items:center;justify-content:center;
  background:rgba(8,6,12,.65);
  color:#fff;
  border-radius:999px;
  font-size:1rem;line-height:1;
  backdrop-filter:blur(6px);
  opacity:0;
  transform:translateY(-4px);
  transition:opacity .2s ease, transform .25s ease;
  pointer-events:none;
  z-index:3;
}
.gallery a[data-lightbox]:hover::before,
.gallery a[data-lightbox]:focus-visible::before{opacity:1;transform:translateY(0)}

/* Lock background scroll while open */
html.nctl-lb-locked,html.nctl-lb-locked body{overflow:hidden}

/* Lightbox root */
.nctl-lb{
  position:fixed;inset:0;
  z-index:9999;
  display:none;
  align-items:center;justify-content:center;
  font-family:var(--font);
  color:#F4EFE6;
}
.nctl-lb.is-open{display:flex}

.nctl-lb__backdrop{
  position:absolute;inset:0;
  background:rgba(8,6,12,.92);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  animation:nctl-lb-fade .22s ease both;
  cursor:zoom-out;
}

.nctl-lb__dialog{
  position:relative;
  width:100%;height:100%;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:clamp(.75rem, 3vw, 2rem);
  box-sizing:border-box;
  animation:nctl-lb-pop .24s ease both;
}

.nctl-lb__figure{
  margin:0;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  max-width:min(90vw, 1400px);
  max-height:90vh;
  gap:1rem;
}

.nctl-lb__stage{
  position:relative;
  display:flex;align-items:center;justify-content:center;
  max-width:90vw;max-height:80vh;
  border-radius:var(--rad);
  overflow:hidden;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.06);
  background:#0c0a12;
}
.nctl-lb__stage::before{
  /* subtle vegas gradient frame on the stage */
  content:"";
  position:absolute;inset:0;
  padding:1px;
  border-radius:inherit;
  background:var(--grad-vegas);
  opacity:.35;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
          mask-composite:exclude;
  pointer-events:none;
}

.nctl-lb__img{
  display:block;
  max-width:90vw;
  max-height:80vh;
  width:auto;height:auto;
  object-fit:contain;
  user-select:none;
  -webkit-user-drag:none;
}
.nctl-lb__img.is-in-right{animation:nctl-lb-slide-right .26s ease both}
.nctl-lb__img.is-in-left{animation:nctl-lb-slide-left  .26s ease both}

.nctl-lb__spinner{
  position:absolute;
  width:42px;height:42px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.15);
  border-top-color:var(--hot);
  border-right-color:var(--cyan);
  opacity:0;
  animation:nctl-lb-spin .9s linear infinite;
  pointer-events:none;
}
.nctl-lb__stage.is-loading .nctl-lb__spinner{opacity:1}
.nctl-lb__stage.is-loading .nctl-lb__img{opacity:.35;transition:opacity .2s ease}

.nctl-lb__caption{
  text-align:center;
  font-family:var(--serif);
  font-size:clamp(1rem, 1.5vw, 1.2rem);
  letter-spacing:-.005em;
  color:#F4EFE6;
  display:flex;flex-direction:column;align-items:center;gap:.35rem;
  animation:nctl-lb-fade .35s ease both;
}
.nctl-lb__counter{
  font-family:var(--font);
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(244,239,230,.55);
}

/* Buttons */
.nctl-lb__btn{
  position:absolute;
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(20,16,28,.55);
  color:#F4EFE6;
  cursor:pointer;
  transition:transform .2s ease, color .2s ease, background .2s ease, border-color .2s ease, box-shadow .2s ease;
  z-index:5;
  -webkit-tap-highlight-color:transparent;
}
.nctl-lb__btn svg{width:22px;height:22px}
.nctl-lb__btn:hover{
  color:var(--hot);
  background:rgba(20,16,28,.85);
  border-color:rgba(255,46,136,.5);
  box-shadow:0 6px 22px rgba(255,46,136,.35);
  transform:translateY(-1px) scale(1.05);
}
.nctl-lb__btn:focus-visible{
  outline:none;
  color:var(--cyan);
  border-color:var(--cyan);
  box-shadow:0 0 0 3px rgba(0,213,229,.35);
}
.nctl-lb__btn--close{top:1rem;right:1rem;width:44px;height:44px}
.nctl-lb__btn--prev{left:1rem;top:50%;transform:translateY(-50%)}
.nctl-lb__btn--next{right:1rem;top:50%;transform:translateY(-50%)}
.nctl-lb__btn--prev:hover{transform:translateY(-50%) translateX(-2px) scale(1.05)}
.nctl-lb__btn--next:hover{transform:translateY(-50%) translateX(2px) scale(1.05)}

@media (max-width:600px){
  .nctl-lb__btn{width:42px;height:42px}
  .nctl-lb__btn--prev{left:.4rem}
  .nctl-lb__btn--next{right:.4rem}
  .nctl-lb__btn--close{top:.5rem;right:.5rem}
  .nctl-lb__caption{padding:0 1rem}
}

@keyframes nctl-lb-fade{
  from{opacity:0}
  to{opacity:1}
}
@keyframes nctl-lb-pop{
  from{opacity:0;transform:scale(.985)}
  to{opacity:1;transform:scale(1)}
}
@keyframes nctl-lb-slide-right{
  from{opacity:0;transform:translateX(24px)}
  to{opacity:1;transform:translateX(0)}
}
@keyframes nctl-lb-slide-left{
  from{opacity:0;transform:translateX(-24px)}
  to{opacity:1;transform:translateX(0)}
}
@keyframes nctl-lb-spin{
  to{transform:rotate(360deg)}
}

@media (prefers-reduced-motion:reduce){
  .nctl-lb__backdrop,
  .nctl-lb__dialog,
  .nctl-lb__caption,
  .nctl-lb__img.is-in-left,
  .nctl-lb__img.is-in-right{animation:none}
  .gallery a[data-lightbox],
  .gallery a[data-lightbox] img,
  .nctl-lb__btn{transition:none}
}
