/* =====================================================================
   MOTOR SITE AIRBNB · galeria.css
   Fileiras de fotos que correm e a tela cheia (lightbox).
   Os botões de ambiente (.chip) ganham cor no casa.css, porque dependem
   da cor de fundo da seção.
   Visual de UMA casa: mude no site/css/casa.css do cliente, não aqui.
   ===================================================================== */

/* ---------- 1. botões de ambiente (forma) ---------- */
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:2px solid rgba(255,246,232,.35);background:transparent;border-radius:999px;padding:9px 16px;min-height:44px;cursor:pointer;font-weight:600;font-size:15px;transition:background-color .2s,color .2s,border-color .2s}

/* ---------- 2. fileiras que correm (param com o mouse em cima ou com foco) ---------- */
/* PARA MUDAR: velocidade = 90s/100s (maior = mais devagar); altura das fotos = height do botão */
.fileira{display:flex;gap:14px;width:max-content;animation:corre 90s linear infinite;margin-bottom:14px}
.fileira.r{animation-direction:reverse;animation-duration:100s}
.fileiras:hover .fileira,.fileiras:focus-within .fileira{animation-play-state:paused}
.fileira button{flex:none;height:clamp(200px,30vw,340px);padding:0;border:0;border-radius:14px;overflow:hidden;cursor:zoom-in;background:rgba(0,0,0,.18)}
.fileira button.v{aspect-ratio:3/4}.fileira button.h{aspect-ratio:4/3}
.fileira img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.fileira button:hover img{transform:scale(1.06)}

/* ---------- 3. tela cheia ---------- */
/* PARA MUDAR: cor de fundo da tela cheia = #0B0F1A (em dialog.lb e ::backdrop) */
dialog.lb{width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#0B0F1A;color:var(--m-claro)}
dialog.lb::backdrop{background:#0B0F1A}
.lb-in{height:100%;display:grid;grid-template-rows:auto 1fr auto}
.lb-bar{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;gap:12px;font-weight:600}
.lb-palco{position:relative;display:flex;align-items:center;justify-content:center;min-height:0;padding:0 8px}
.lb-palco img{max-width:100%;max-height:100%;object-fit:contain;border-radius:8px}
.circ{width:48px;height:48px;border-radius:50%;border:2px solid rgba(255,246,232,.35);background:rgba(11,15,26,.6);display:grid;place-items:center;cursor:pointer}
.circ svg{width:20px;height:20px}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%)}
.lb-ant{left:12px}.lb-prox{right:12px}
.lb-leg{padding:12px 16px calc(16px + env(safe-area-inset-bottom));text-align:center;color:rgba(255,246,232,.8)}