/* css/gallery.css - Styling für Galerie und Unterordner */
:root{
/*  --bg:#f7f7f7; */
  --bg:#ff5b19;
  --card:#fff;
  --accent:#222;
  --muted:#666;
  --overlay: rgba(0,0,0,0.8);
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family:verdana,helvetic,sans;
  background:var(--bg);
  color:var(--accent);
  padding:1rem;
  line-height:1.35;
}

.siteheader{max-width:1100px;margin:0 auto 1rem}
h1{margin:0 0 .25rem}
.hint{margin:0;color:var(--muted);font-size:.95rem}

/* Controls / breadcrumbs */
.controls{max-width:1100px;margin:0 auto 1rem;display:flex;align-items:center;justify-content:flex-start}
.breadcrumbs a{color:var(--accent);text-decoration:none;margin-right:.25rem}

/* Folders */
.folders{max-width:1100px;margin:0 auto 1rem}
.folder-list{display:flex;gap:12px;flex-wrap:wrap}
.folder{display:block;width:140px;text-decoration:none;color:inherit}
.folder-thumb{width:140px;height:98px;background:#eee;border-radius:6px;display:flex;align-items:center;justify-content:center}
.folder-icon{font-size:2.4rem}
.folder-name{text-align:center;margin-top:.4rem;font-size:.95rem}

/* Gallery */
.gallery-section{max-width:1100px;margin:0 auto}
.gallery{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:12px;
  margin-top:8px;
}

.thumb{
  background:var(--card);
  border-radius:8px;
  padding:8px;
  box-shadow:0 1px 3px rgba(0,0,0,0.06);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  overflow:hidden;
}

.thumb img{
  display:block;
  width:100%;
  height:120px;
  object-fit:cover;
  border-radius:6px;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease;
}

.thumb img:hover{ transform:scale(1.02); box-shadow:0 8px 20px rgba(0,0,0,0.12); }
.thumb figcaption{ margin-top:.5rem; font-size:.9rem; color:#333; word-break:break-word; }

/* Lightbox */
.lightbox{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:var(--overlay);
  z-index:9999;
  padding:2rem;
}

.lightbox.show{ display:flex; }

.lb-content{
  max-width:calc(100% - 160px);
  max-height:calc(100% - 160px);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.5rem;
}

.lb-content img{
  max-width:100%;
  max-height:80vh;
  border-radius:6px;
  box-shadow:0 10px 30px rgba(0,0,0,0.6);
}

.lb-content p{ color:#fff; margin:0; text-align:center; }

/* Controls */
.lb-close, .lb-prev, .lb-next{
  position:fixed;
  background:transparent;
  border:0;
  color:#fff;
  font-size:2rem;
  cursor:pointer;
  padding:.25rem .5rem;
  line-height:1;
  z-index:10000;
  transition:opacity .12s ease;
}

.lb-close{ top:16px; right:20px; font-size:2.4rem; }
.lb-prev{ left:12px; top:50%; transform:translateY(-50%); font-size:2.4rem; }
.lb-next{ right:12px; top:50%; transform:translateY(-50%); font-size:2.4rem; }

.lb-close:hover, .lb-prev:hover, .lb-next:hover { opacity:0.9; }

@media (max-width:600px){
  .thumb img{ height:100px; }
  .lb-prev, .lb-next{ font-size:1.6rem; left:6px; right:6px; }
}