/* === ibag-photo inline styles block 1 (moved from templates/ibag-photo.php) === */
.ink-photo-h1 { display:block; color:#e9e9e9; text-align:center; }
.ibag-glingh { background: linear-gradient(90deg, #9e9e9e 0%, #ffffff 40%, #9e9e9e 80%); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: ibagGlingh 2.8s linear infinite; text-shadow: 0 0 6px rgba(255,255,255,.15); }
@keyframes ibagGlingh { 0% {background-position: 200% 0;} 100% {background-position: -200% 0;} }

.ibag-glitch{position:relative}
.ibag-glitch::before,.ibag-glitch::after{content:attr(data-text);position:absolute;left:0;top:0;right:0;pointer-events:none;mix-blend-mode:screen}
.ibag-glitch::before{text-shadow:-1px 0 rgba(255,0,0,.7);opacity:.12;animation:ibg-g1 6.5s infinite linear;animation:ibg-g2 2.8s infinite linear}
@keyframes ibg-g1{0%,100%{clip-path:inset(0 0 0 0);transform:translate(0,0)}10%{clip-path:inset(5% 0 55% 0);transform:translate(1px,0)}25%{clip-path:inset(80% 0 5% 0);transform:translate(-1px,0)}40%{clip-path:inset(10% 0 30% 0);transform:translate(1px,-.5px)}65%{clip-path:inset(40% 0 40% 0);transform:translate(-.5px,.5px)}}
@keyframes ibg-g2{0%,100%{clip-path:inset(0 0 0 0);transform:translate(0,0)}15%{clip-path:inset(60% 0 8% 0);transform:translate(-1px,0)}30%{clip-path:inset(12% 0 26% 0);transform:translate(1px,.5px)}55%{clip-path:inset(30% 0 20% 0);transform:translate(-.5px,-.5px)}85%{clip-path:inset(8% 0 60% 0);transform:translate(1px,0)}}

.ink-photo-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px;align-items:start}
@media (max-width: 768px){.ink-photo-layout{grid-template-columns:1fr;gap:12px}.ink-photo-right{display:block!important;}}

.ink-photo-right{margin:0;padding:0;width:100%;display:block}
.ink-photo-right .ibag-photo-desc{margin:0;padding:0;max-width:none;width:100%;font-size:12px;line-height:1.6;color:#b7bcc4;overflow:auto;max-height:var(--ink-right-max-h,none)}

/* ibag-glitch-lite: delikatny split bez mocnej animacji */
.ibag-glitch-lite{ position:relative }
.ibag-glitch-lite::before,
.ibag-glitch-lite::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  mix-blend-mode:screen; opacity:.25;
}
.ibag-glitch-lite::before{ transform:translateX(-.25px); text-shadow:-1px 0 rgba(255,0,0,.3) }
.ibag-glitch-lite::after{  transform:translateX(.25px);  text-shadow: 1px 0 rgba(0,255,255,.3) }
@media (prefers-reduced-motion: no-preference){
  .ibag-glitch-lite::before{ animation:iglt1 3.5s infinite linear }
  .ibag-glitch-lite::after{  animation:iglt2 3.5s infinite linear }
  @keyframes iglt1{ 0%,100%{opacity:.18} 50%{opacity:.28} }
  @keyframes iglt2{ 0%,100%{opacity:.18} 50%{opacity:.28} }
}

/* === Ads policy & 21-random mobile columns === */
.ink-photo-page .ibag-ad{ display:none !important; }            /* hide any stray ads by default within the page */
.ink-photo-page .ibag-ad.ibag-top-ad{ display:block !important; } /* allow only the top ad */
.ink-photo-page .ads-after-21 .ibag-ad{ display:block !important; } /* allow ads after the 21-strip */

@media (min-width: 1024px){
  .ink-photo-page .ibag-ad.ibag-side-ad{ display:block !important; } /* allow side ad next to hero (desktop only) */
}

/* 21 random thumbnails layout */
.inkbyaig-strip{ margin-top:40px; }
.inkbyaig-strip .strip-grid{ list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:8px; }
.inkbyaig-strip .strip-grid li{ list-style:none; }
.inkbyaig-strip .strip-grid img{ width:100%;height:auto;display:block;border-radius:var(--ibag-radius,6px); }

/* MOBILE: exactly 3 columns for the 21 random thumbnails */
@media (max-width: 599px){
  .inkbyaig-strip .strip-grid{ grid-template-columns:repeat(3,1fr); }
}

@media (max-width: 768px){.ink-photo-left figure{max-width:100%!important;width:100%!important;}.ink-photo-left figure img{width:100%!important;height:auto!important;}}


/* === ibag-photo inline styles block 2 (moved from templates/ibag-photo.php) === */
/* === Dawid layout patch === */

.ink-photo-left figure{margin:0!important;max-width:1280px;width:1280px}
.ink-photo-left figure img{width:100%;height:auto;display:block}

.ibag-glingh{
  color:var(--ibag-neon, #00fff5);
  text-shadow: 0 0 0.5px var(--ibag-neon, #00fff5),
               0 0 2px var(--ibag-neon, #00fff5);
  animation: ibagGlingh 10s linear infinite;
}
.ibag-glitch{position:relative}
.ibag-glitch::before,.ibag-glitch::after{content:attr(data-text);position:absolute;left:0;top:0;right:0;pointer-events:none;mix-blend-mode:screen}
.ibag-glitch::before{text-shadow:-1px 0 rgba(255,0,0,.7);opacity:.12;animation:ibg-g1 6.5s infinite linear;animation:ibg-g2 2.8s infinite linear}
@keyframes ibg-g1{0%,100%{clip-path:inset(0 0 0 0);transform:translate(0,0)}10%{clip-path:inset(5% 0 55% 0);transform:translate(1px,0)}25%{clip-path:inset(80% 0 5% 0);transform:translate(-1px,0)}40%{clip-path:inset(10% 0 30% 0);transform:translate(1px,-.5px)}65%{clip-path:inset(40% 0 40% 0);transform:translate(-.5px,.5px)}}
@keyframes ibg-g2{0%,100%{clip-path:inset(0 0 0 0);transform:translate(0,0)}15%{clip-path:inset(60% 0 8% 0);transform:translate(-1px,0)}30%{clip-path:inset(12% 0 26% 0);transform:translate(1px,.5px)}55%{clip-path:inset(30% 0 20% 0);transform:translate(-.5px,-.5px)}85%{clip-path:inset(8% 0 60% 0);transform:translate(1px,0)}}
/* Right column text small & gray */

.ink-photo-right .ibag-photo-desc p{color:inherit}
/* Responsive */
@media (max-width:768px){
  .ink-photo-right{ display:block !important; }
  .ink-photo-right .ibag-photo-desc{ display:block !important; }

}


/* === ibag-photo inline styles block 3 (moved from templates/ibag-photo.php) === */
/* === RWD: "More Designs" 21 thumbnails === */
/* mobile: 3 columns */
@media (max-width: 599px){
  .strip-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;list-style:none;padding:0;margin:0}
  .strip-grid li{margin:0;padding:0}
  .strip-grid a{display:block}
  .strip-grid img{width:100%;height:auto;display:block;border-radius:var(--ibag-radius,8px)}
}
/* tablet: 5 columns */
@media (min-width: 600px) and (max-width: 1023px){
  .strip-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;list-style:none;padding:0;margin:0}
  .strip-grid li{margin:0;padding:0}
  .strip-grid a{display:block}
  .strip-grid img{width:100%;height:auto;display:block;border-radius:var(--ibag-radius,8px)}
}


/* === Neon scrollbar for description column (non-intrusive) === */
.ink-photo-right .ibag-photo-desc{
  scrollbar-width: thin;
  scrollbar-color: var(--ibag-neon,#00fff5) rgba(255,255,255,0.08);
}
.ink-photo-right .ibag-photo-desc::-webkit-scrollbar{width:10px}
.ink-photo-right .ibag-photo-desc::-webkit-scrollbar-track{
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
  border-radius: 12px;
}
.ink-photo-right .ibag-photo-desc::-webkit-scrollbar-thumb{
  background: radial-gradient(closest-side, var(--ibag-neon,#00fff5), rgba(0,255,245,0.35));
  box-shadow: 0 0 8px var(--ibag-neon,#00fff5), inset 0 0 8px rgba(0,255,245,.65);
  border-radius: 12px;
  border: 2px solid rgba(0,0,0,.25);
}
.ink-photo-right .ibag-photo-desc::-webkit-scrollbar-thumb:hover{
  box-shadow: 0 0 12px var(--ibag-neon,#00fff5), inset 0 0 12px rgba(0,255,245,.8);
}


/* === Layout for hero: left (image+title+caption), right (description) === */

.ink-photo-left .ink-photo-h1{
  font-size:clamp(10px, 1.1vw, 14px);
  margin:0 0 6px 0;
  text-align:left !important;
  font-weight:600;
}
.ink-photo-left figure{ 
  margin:0 !important;
}
/* Neon title effect */
.ibag-glingh{
  color:var(--ibag-neon, #00fff5);
  text-shadow: 0 0 0.5px var(--ibag-neon, #00fff5),
               0 0 2px var(--ibag-neon, #00fff5);
  animation: ibagGlingh 10s linear infinite;
}

/* Description column */
.ink-photo-left .ink-photo-caption{ text-align:left !important; }

/* Mobile: keep description visible in normal HTML, but compact */
@media (max-width:768px){
  .ink-photo-right{margin-top:2px}
  .ink-photo-right .ibag-photo-desc{
    display:block!important;
    overflow:auto!important;
    max-height:220px!important;
    padding:14px!important;
    border:1px solid rgba(0,255,245,.28);
    border-radius:14px;
    background:linear-gradient(180deg,rgba(5,18,24,.92) 0%,rgba(0,0,0,.78) 100%);
    box-shadow:0 0 0 2px rgba(0,255,245,.12),0 0 14px rgba(0,255,245,.18),inset 0 0 14px rgba(0,255,245,.06);
    scrollbar-width:thin;
    scrollbar-color:rgba(0,255,245,.55) rgba(255,255,255,.05);
  }
  .ink-photo-right .ibag-photo-desc::-webkit-scrollbar{width:8px}
  .ink-photo-right .ibag-photo-desc::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:999px}
  .ink-photo-right .ibag-photo-desc::-webkit-scrollbar-thumb{background:rgba(0,255,245,.42);border-radius:999px;box-shadow:0 0 8px rgba(0,255,245,.25)}
  .ink-photo-right .ibag-photo-desc h2.screen-reader-text{
    position:static!important;
    clip:auto!important;
    clip-path:none!important;
    width:auto!important;
    height:auto!important;
    margin:0 0 12px!important;
    overflow:visible!important;
    white-space:normal!important;
    color:var(--ibag-neon,#00fff5)!important;
    font-size:13px!important;
    line-height:1.2!important;
    font-weight:700!important;
    letter-spacing:.02em!important;
    text-transform:none!important;
  }
  .ink-photo-right .ibag-photo-desc p:last-child{margin-bottom:0}
}


/* Mobile info icon + tooltip */
.mobile-info{
  display:none;
  align-items:center;
  gap:.5rem;
  margin:12px 0 0;
}
.mobile-info .info-btn{
  display:flex;align-items:center;justify-content:center;width:42px;height:42px;flex:0 0 42px;
  border-radius:50%;border:1px solid rgba(0,255,245,.5);
  background:rgba(0,0,0,.7)!important;
  box-shadow:0 0 0 3px var(--ibag-neon,#00fff5),0 0 12px var(--ibag-neon,#00fff5),inset 0 0 10px rgba(0,255,245,.35);
  color:var(--ibag-neon,#00fff5);font:700 22px/1 system-ui,-apple-system,Segoe UI,Roboto;cursor:pointer;
  -webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:rgba(0,0,0,0)
}
.mobile-info .info-btn.active{ outline:none; }
.mobile-info .info-tooltip{
  position:relative;
  flex:1 1 auto;
  background:rgba(0,0,0,.65);
  border:1px solid rgba(0,255,245,.35);
  box-shadow:0 0 0 3px rgba(0,255,245,.15), 0 0 16px rgba(0,255,245,.35);
  padding:12px 14px;
  border-radius:10px;
  max-height:40vh;
  overflow:auto;
}
.mobile-info .info-tooltip:before{
  content:"";
  position:absolute;
  left:-8px;
  top:10px;
  width:0;height:0;
  border-top:8px solid transparent;
  border-bottom:8px solid transparent;
  border-right:8px solid rgba(0,255,245,.35);
}
/* Responsive behavior */
@media (max-width: 768px){
  .mobile-info{ display:flex; }
}