/* Puskapartiolaisten kuvapankki — sama ilme kuin puskapartiolaiset.fi */

:root{
  --pp-ink:#14170F; --pp-muted:#8FA592;
  --pp-forest:#0F2E1D; --pp-deep:#07130D; --pp-card:#12301F;
  --pp-green:#0A7A36; --pp-green-br:#0A9A42;
  --pp-mint:#9FD9B4; --pp-mint-soft:#DCE7DC;
  --pp-cream:#F6F3EC; --pp-line:rgba(159,217,180,.16);
  --pp-head:'Bricolage Grotesque',system-ui,-apple-system,sans-serif;
  --pp-text:'Source Sans 3',system-ui,-apple-system,sans-serif;
}

html,body{background:var(--pp-deep)!important;color:var(--pp-mint-soft)!important;
  font-family:var(--pp-text)!important}
#content,.content,#the_page{background:var(--pp-deep)!important;
  box-sizing:border-box!important;max-width:100%!important;overflow-x:hidden!important;
  padding-left:clamp(14px,2.4vw,28px)!important;padding-right:clamp(14px,2.4vw,28px)!important}
#theHeader{background:var(--pp-forest)!important}
*{box-sizing:border-box}

a{color:var(--pp-mint)!important;text-decoration:none}
a:hover{color:#fff!important}

h1,h2,h3,h4,.titrePage{font-family:var(--pp-head)!important;font-weight:800!important;
  color:var(--pp-cream)!important;letter-spacing:-.01em}

/* ---------- Ylä- ja sivupalkki ---------- */
#theHeader{padding:0!important}
.pskp-brand{display:flex;align-items:center;gap:12px;padding:16px clamp(16px,3vw,32px);
  background:var(--pp-forest);border-bottom:1px solid var(--pp-line)}
.pskp-brand img{width:38px;height:38px;object-fit:contain;flex:none}
.pskp-brand b{font-family:var(--pp-head);font-weight:800;font-size:16px;color:var(--pp-cream);
  line-height:1.15;letter-spacing:-.01em}
.pskp-brand span{display:block;font-family:var(--pp-text);font-weight:400;
  font-size:12.5px;color:var(--pp-mint)}
.pskp-brand a{margin-left:auto;font-size:13.5px;font-weight:600}

#menubar{background:var(--pp-forest)!important;border-right:1px solid var(--pp-line)!important;
  color:var(--pp-mint-soft)!important}
#menubar dt,#menubar dt a{font-family:var(--pp-head)!important;font-weight:700!important;
  color:var(--pp-cream)!important;font-size:14px!important;letter-spacing:.02em}
#menubar li a{color:var(--pp-mint-soft)!important;font-size:14.5px}
#menubar li a:hover{color:#fff!important}
#menubar .badge{background:var(--pp-green)!important;color:#fff!important;
  border-radius:999px!important;font-size:11px!important;padding:1px 7px!important}
.totalImages{color:var(--pp-muted)!important;font-size:12.5px}
nav,.navbar,#menuSwitcher{background:var(--pp-forest)!important;color:var(--pp-mint-soft)!important}
nav a,.navbar a{color:var(--pp-mint-soft)!important}

.titrePage{border-bottom:1px solid var(--pp-line)!important;padding:16px 0 14px!important;
  background:transparent!important;margin:0!important}
#breadcrumb,#breadcrumb a{color:var(--pp-mint)!important;font-size:14px}

/* ---------- Albumikortit: kuva päällä, nimi alla ---------- */
ul.albThumbs{display:grid!important;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))!important;
  gap:16px!important;list-style:none!important;padding:20px 0!important;margin:0!important;
  width:100%!important;max-width:100%!important}
ul.albThumbs li{float:none!important;width:auto!important;height:auto!important;
  margin:0!important;background:var(--pp-card)!important;border:1px solid var(--pp-line)!important;
  border-radius:14px!important;overflow:hidden!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}
ul.albThumbs li:hover{transform:translateY(-3px);border-color:var(--pp-green-br)!important;
  box-shadow:0 14px 30px rgba(0,0,0,.35)}
ul.albThumbs li a{display:block!important;position:static!important;height:auto!important}
img.albImg{width:100%!important;height:auto!important;aspect-ratio:4/3!important;object-fit:cover!important;
  display:block!important;margin:0!important;border:0!important;border-radius:0!important;
  position:static!important;max-width:none!important}
.albLegend{position:static!important;display:block!important;background:transparent!important;
  padding:13px 15px 15px!important;color:var(--pp-mint-soft)!important;opacity:1!important;
  text-align:left!important;width:auto!important;height:auto!important;
  font-size:13.5px!important;line-height:1.45!important}
.albLegend h4{font-family:var(--pp-head)!important;font-weight:700!important;font-size:16px!important;
  color:var(--pp-cream)!important;margin:0 0 3px!important;text-shadow:none!important;
  white-space:normal!important;overflow:visible!important}
.albLegend div{color:var(--pp-mint)!important;font-size:13px!important}
.albLegendRight{float:right!important}
.albSymbol{color:var(--pp-green-br)!important}

/* ---------- Kuvaruudukko ---------- */
#thumbnails{padding:16px 0!important;max-width:100%!important}
#thumbnails>li{border-radius:10px!important;overflow:hidden!important;
  background:var(--pp-card)!important;
  transition:transform .14s ease,box-shadow .14s ease}
#thumbnails>li:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.4)}
#thumbnails img{border:0!important;border-radius:10px!important;display:block}
/* Kuvien nimet näkyviin vasta kun kursori on kuvan päällä. */
#thumbnails .thumbLegend,#thumbnails span.wrap2,#thumbnails .albSymbol{
  background:linear-gradient(to top,rgba(10,32,19,.92),rgba(10,32,19,0))!important;
  color:var(--pp-cream)!important;font-size:12.5px!important;font-family:var(--pp-text)!important;
  padding:16px 8px 7px!important;
  opacity:0!important;transition:opacity .16s ease}
#thumbnails>li:hover .thumbLegend,#thumbnails>li:hover span.wrap2,
#thumbnails>li:focus-within .thumbLegend{opacity:1!important}

/* Sivutus */
.navigationBar,.pagination{color:var(--pp-muted)!important;padding:18px 0!important;
  font-family:var(--pp-head)!important;font-size:14px}
.navigationBar a,.pagination a{color:var(--pp-mint)!important}

/* ---------- Yksittäinen kuva ---------- */
#theImageBox,#theImage,#imageToolBar,.imageInfoTable,#imageHeaderBar{
  background:var(--pp-deep)!important;color:var(--pp-mint-soft)!important}
#imageHeaderBar h2,#theImage h2{color:var(--pp-cream)!important}
#imageToolBar a{color:var(--pp-mint)!important}
.imageInfo dt,.imageInfoTable td{color:var(--pp-mint)!important}
#theImage img{border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.45)}

/* ---------- Lomakkeet ---------- */
input[type=text],input[type=email],input[type=password],select,textarea{
  background:var(--pp-card)!important;color:var(--pp-cream)!important;
  border:1px solid var(--pp-line)!important;border-radius:10px!important;
  padding:10px 12px!important;font-family:var(--pp-text)!important}
input:focus,select:focus,textarea:focus{border-color:var(--pp-green-br)!important;outline:none!important;
  box-shadow:0 0 0 3px rgba(10,154,66,.2)!important}
input[type=submit],button,.buttonLike{
  font-family:var(--pp-head)!important;font-weight:700!important;border-radius:999px!important;
  background:var(--pp-green)!important;color:#fff!important;border:0!important;
  padding:10px 20px!important;cursor:pointer}
input[type=submit]:hover,button:hover{background:var(--pp-green-br)!important}

/* Kuvapankki on kuvia varten: omat asetukset piiloon */
a[href*="profile.php"],a[href*="notification.php"],a[href*="about.php"],#mbProfile{display:none!important}

/* ---------- Alatunniste ---------- */
#copyright{font-size:0!important;line-height:0!important;
  border-top:1px solid var(--pp-line)!important;margin-top:36px!important;
  background:var(--pp-forest)!important;width:100%!important;text-align:center!important}
#copyright a{display:none!important}
#copyright::after{
  content:"© Puskapartiolaiset ry · puskapartiolaiset.fi";
  font-family:var(--pp-text);font-size:13.5px;line-height:1.6;color:var(--pp-muted);
  display:block;padding:18px 0}

/* Latausilmoitus ja pehmeä ilmestyminen — ei vanhanaikaista spinneriä */
.pskp-lataa{text-align:center;padding:18px 0;color:var(--pp-muted);
  font-family:var(--pp-head);font-size:14px}
#thumbnails img,img.albImg{
  background:var(--pp-card);
  animation:pskp-esiin .25s ease both}
@keyframes pskp-esiin{from{opacity:0}to{opacity:1}}
/* Piwigon oma latausanimaatio pois */
#pwg_loading,.loader,#loading,.ajaxLoader{display:none!important}

@media (max-width:700px){
  ul.albThumbs{grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr))!important;gap:12px!important}
  img.albImg{height:130px!important}
  .pskp-brand{padding:12px 14px}
}

/* ---------- Yksittäisen kuvan sivu ---------- */
#imageHeaderBar{background:var(--pp-forest)!important;border-bottom:1px solid var(--pp-line)!important;
  padding:12px clamp(14px,2.4vw,28px)!important}
#imageHeaderBar h2,#imageHeaderBar .browsePath,#imageHeaderBar a{color:var(--pp-cream)!important}
#imageHeaderBar .imageNumber{color:var(--pp-mint)!important}

#imageToolBar{background:var(--pp-forest)!important;border-bottom:1px solid var(--pp-line)!important;
  padding:8px clamp(14px,2.4vw,28px)!important;display:flex!important;
  align-items:center!important;justify-content:space-between!important;gap:12px!important}
#imageToolBar a,#imageToolBar .pwg-button{color:var(--pp-mint-soft)!important;
  background:transparent!important;border:0!important;border-radius:10px!important;
  padding:7px 10px!important}
#imageToolBar a:hover{background:rgba(159,217,180,.14)!important;color:#fff!important}
#imageToolBar .pwg-icon,#imageToolBar .pwg-icon::before,.pwg-icon{
  color:var(--pp-mint-soft)!important;fill:var(--pp-mint-soft)!important;filter:invert(1) brightness(1.6)}
#imageToolBar .pwg-button-text{font-family:var(--pp-text)!important;font-size:13px!important;
  color:var(--pp-mint-soft)!important}

/* Turhat toiminnot pois: diaesitys, suosikit, metadata-nappi */
#imageToolBar .pwg-button[title*="Diaesitys"],#imageToolBar a[href*="slideshow"],
#imageToolBar a[href*="add_to_caddie"],#imageToolBar a[title*="suosik"],
#imageToolBar a[title*="Suosik"],#imageToolBar #cmdRate{display:none!important}

/* Kuva isona tummaa taustaa vasten, ei viereisiä pikkukuvia */
#theImageAndInfos,#theImageBox{background:#050D09!important}
#theImage{background:#050D09!important;padding:clamp(16px,3vw,40px) 0!important;
  text-align:center!important;min-height:60vh!important;
  display:flex!important;align-items:center!important;justify-content:center!important}
#theImage img,#theMainImage{max-width:min(96vw,1600px)!important;max-height:82vh!important;
  width:auto!important;height:auto!important;border-radius:10px!important;
  box-shadow:0 22px 60px rgba(0,0,0,.6)!important}
.navThumbs,.navThumb,#linkPrev,#linkNext,.thumbHover{display:none!important}

/* Kuvan tiedot siistiksi laatikoksi */
#imageInfos{background:var(--pp-deep)!important;color:var(--pp-mint-soft)!important;
  padding:18px clamp(14px,2.4vw,28px) 26px!important}
#imageInfos dl,#imageInfos .imageInfo{display:inline-block!important;
  background:var(--pp-card)!important;border:1px solid var(--pp-line)!important;
  border-radius:12px!important;padding:12px 16px!important;margin:0 10px 10px 0!important;
  vertical-align:top!important}
#imageInfos dt,#imageInfos .label{font-family:var(--pp-head)!important;font-weight:700!important;
  font-size:11px!important;letter-spacing:.08em!important;text-transform:uppercase!important;
  color:var(--pp-mint)!important;margin-bottom:2px!important}
#imageInfos dd,#imageInfos .value{color:var(--pp-cream)!important;font-size:14px!important;margin:0!important}

/* Muistutus kuvaajan mainitsemisesta */
.pskp-luvat{background:var(--pp-card);border:1px solid var(--pp-line);border-left:3px solid var(--pp-green-br);
  border-radius:0 10px 10px 0;padding:12px 16px;margin:14px clamp(14px,2.4vw,28px);
  color:var(--pp-mint-soft);font-size:13.5px;line-height:1.5}
.pskp-luvat b{color:var(--pp-cream);font-family:var(--pp-head)}

/* Kalenteri- ja hakusymbolit otsikkorivillä pois */
.titrePage .categoryActions a[href*="calendar"],
.titrePage .categoryActions a[href*="created-monthly"],
.titrePage .categoryActions a[href*="posted-monthly"]{display:none!important}
.titrePage .categoryActions .pwg-icon{filter:invert(1) brightness(1.6)}