/* ══════════════════════════════════════════════════════════════════════
   MyFitSpace – Lightbox (sdílený pro verzi 1 i 2)
   Aktivace: <img data-lb> (volitelně data-lb-group="nazev")
   Ovládání: klik / Esc / šipky / swipe / klik mimo fotku
   ══════════════════════════════════════════════════════════════════════ */

/* náhledy v galerii – kurzor + jemný zoom při najetí */
[data-lb]{cursor:zoom-in;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .3s}
[data-lb]:hover{transform:scale(1.04)}

/* ── plátno ───────────────────────────────────────────────────────── */
.mfs-lb{
  position:fixed;inset:0;z-index:9999;
  display:flex;align-items:center;justify-content:center;
  padding:clamp(12px,3vw,40px);
  background:rgba(8,16,11,.94);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  opacity:0;visibility:hidden;
  transition:opacity .3s ease,visibility .3s;
}
.mfs-lb.is-open{opacity:1;visibility:visible}

/* ── obrázek ──────────────────────────────────────────────────────── */
.mfs-lb__fig{
  position:relative;margin:0;
  display:flex;flex-direction:column;align-items:center;gap:14px;
  max-width:100%;max-height:100%;
}
.mfs-lb__img{
  display:block;
  max-width:min(1400px,92vw);
  max-height:82vh;                 /* nikdy nepřeteče obrazovku */
  width:auto;height:auto;
  object-fit:contain;
  border-radius:4px;
  border:1px solid rgba(216,188,126,.22);
  box-shadow:0 30px 80px -20px rgba(0,0,0,.8);
  background:#0d1a11;
  transform:scale(.96);opacity:0;
  transition:transform .35s cubic-bezier(.2,.7,.2,1),opacity .35s;
}
.mfs-lb.is-open .mfs-lb__img{transform:none;opacity:1}
.mfs-lb.is-loading .mfs-lb__img{opacity:.35}

/* popisek + počítadlo */
.mfs-lb__bar{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;
  font:500 13.5px/1.4 'Hanken Grotesk','Inter',sans-serif;color:#CDD3C9;text-align:center;
}
.mfs-lb__count{
  font-size:12px;letter-spacing:.16em;color:#C8AA67;
  padding:4px 12px;border:1px solid rgba(216,188,126,.3);border-radius:999px;white-space:nowrap;
}

/* ── tlačítka ─────────────────────────────────────────────────────── */
.mfs-lb__btn{
  position:absolute;z-index:2;
  display:flex;align-items:center;justify-content:center;
  width:52px;height:52px;padding:0;
  background:rgba(8,16,11,.72);color:#F1ECDF;
  border:1px solid rgba(216,188,126,.32);border-radius:50%;
  cursor:pointer;
  transition:background .25s,border-color .25s,transform .25s,opacity .25s;
  -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.mfs-lb__btn:hover{background:#C8AA67;border-color:#C8AA67;color:#0B120E;transform:scale(1.08)}
.mfs-lb__btn:focus-visible{outline:2px solid #C8AA67;outline-offset:3px}
.mfs-lb__btn svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

.mfs-lb__close{top:clamp(12px,2.5vw,26px);right:clamp(12px,2.5vw,26px)}
.mfs-lb__prev{left:clamp(10px,2.5vw,30px);top:50%;transform:translateY(-50%)}
.mfs-lb__next{right:clamp(10px,2.5vw,30px);top:50%;transform:translateY(-50%)}
.mfs-lb__prev:hover,.mfs-lb__next:hover{transform:translateY(-50%) scale(1.08)}
.mfs-lb.is-single .mfs-lb__prev,
.mfs-lb.is-single .mfs-lb__next{display:none}

/* ── responzivita ─────────────────────────────────────────────────── */
@media (max-width:860px){
  .mfs-lb__img{max-height:74vh;max-width:96vw}
  .mfs-lb__btn{width:46px;height:46px}
  .mfs-lb__btn svg{width:20px;height:20px}
}
/* mobil: šipky dolů pod fotku, ať nepřekrývají obrázek */
@media (max-width:600px){
  .mfs-lb{padding:10px}
  .mfs-lb__img{max-height:68vh}
  .mfs-lb__prev,.mfs-lb__next{
    top:auto;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);transform:none;
    width:48px;height:48px;                 /* pohodlný tap target */
  }
  .mfs-lb__prev{left:calc(50% - 60px)}
  .mfs-lb__next{right:calc(50% - 60px)}
  .mfs-lb__prev:hover,.mfs-lb__next:hover{transform:scale(1.06)}
  .mfs-lb__fig{padding-bottom:64px}
  .mfs-lb__bar{font-size:12.5px}
}

/* zámek scrollu na pozadí */
body.mfs-lb-open{overflow:hidden}

@media (prefers-reduced-motion:reduce){
  .mfs-lb,.mfs-lb__img,.mfs-lb__btn,[data-lb]{transition:none!important}
  [data-lb]:hover{transform:none}
}
