/* =========================================================
   v16.46 - Single post: smaller poster + tidy "Movie Info" and "Synopsis/Plot" cards
   Works for new (block) posts, old (Custom HTML) posts and plain posts (JS wraps them: js/atom-post-tidy.js).
   ========================================================= */

/* ---------- 1) Poster (image under the title): small and neat ---------- */
html body.single-post .atom-content-text img.atom-poster-img,
html body.single-post .atom-content-text figure.atom-apg-poster img,
html body.single-post .atom-content-text img[data-atom-poster],
html body.single-post .atom-content-text img[style*="width:300px;max-width:90%"]{
  display:block!important;
  width:240px!important;
  max-width:60%!important;
  height:auto!important;
  max-height:none!important;
  margin:4px auto 14px!important;
  object-fit:contain!important;
  border-radius:12px!important;
  border:1px solid rgba(130,170,230,.32)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.5)!important;
}
@media (max-width:760px){
  html body.single-post .atom-content-text img.atom-poster-img,
  html body.single-post .atom-content-text figure.atom-apg-poster img,
  html body.single-post .atom-content-text img[data-atom-poster],
  html body.single-post .atom-content-text img[style*="width:300px;max-width:90%"]{
    width:230px!important;
    max-width:56%!important;
    margin:2px auto 12px!important;
    border-radius:10px!important;
  }
}

/* ---------- 2) Cards: Movie Info + Synopsis ---------- */
html body.single-post .atom-content-text .atom-info-card,
html body.single-post .atom-content-text .atom-syn-card,
html body.single-post .atom-content-text div[style*="background:#111b2b"],
html body.single-post .atom-content-text .atom-apg-wrap .atom-apg-box{
  display:block!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:100%!important;
  margin:14px 0!important;
  padding:14px 16px 10px!important;
  background:linear-gradient(180deg,#121e31 0,#0e1727 100%)!important;
  border:1px solid #27385a!important;
  border-left:3px solid #f59e0b!important;
  border-radius:12px!important;
  text-align:left!important;
  color:#d6e0ef!important;
  box-shadow:0 4px 14px rgba(0,0,0,.28)!important;
}
html body.single-post .atom-content-text .atom-syn-card{padding:14px 16px!important}

/* card headings */
html body.single-post .atom-content-text .atom-info-card > h1,
html body.single-post .atom-content-text .atom-info-card > h2,
html body.single-post .atom-content-text .atom-info-card > h3,
html body.single-post .atom-content-text .atom-info-card > h4,
html body.single-post .atom-content-text .atom-syn-card > h1,
html body.single-post .atom-content-text .atom-syn-card > h2,
html body.single-post .atom-content-text .atom-syn-card > h3,
html body.single-post .atom-content-text .atom-syn-card > h4,
html body.single-post .atom-content-text div[style*="background:#111b2b"] > h2,
html body.single-post .atom-content-text .atom-apg-wrap .atom-apg-box > h2{
  font-size:clamp(16px,4.6vw,19px)!important;
  line-height:1.3!important;
  font-weight:700!important;
  letter-spacing:.2px;
  text-align:left!important;
  color:#fff!important;
  margin:0 0 10px!important;
  padding:0 0 10px!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.1)!important;
  text-transform:none!important;
}

/* info rows: label | value */
html body.single-post .atom-content-text .atom-info-card .atom-info-row,
html body.single-post .atom-content-text .atom-info-card > p,
html body.single-post .atom-content-text .atom-info-card > li,
html body.single-post .atom-content-text .atom-info-card li,
html body.single-post .atom-content-text div[style*="background:#111b2b"] > div,
html body.single-post .atom-content-text .atom-apg-wrap .atom-apg-box > p{
  margin:0!important;
  padding:9px 0!important;
  border:0!important;
  border-bottom:1px dashed rgba(255,255,255,.1)!important;
  font-size:14.5px!important;
  line-height:1.5!important;
  color:#e4ebf6!important;
  text-align:left!important;
  list-style:none!important;
  overflow-wrap:anywhere;
  word-break:normal;
}
html body.single-post .atom-content-text .atom-info-card .atom-info-row:last-child,
html body.single-post .atom-content-text .atom-info-card > p:last-child,
html body.single-post .atom-content-text .atom-info-card li:last-child,
html body.single-post .atom-content-text div[style*="background:#111b2b"] > div:last-child,
html body.single-post .atom-content-text .atom-apg-wrap .atom-apg-box > p:last-child{border-bottom:0!important}
html body.single-post .atom-content-text .atom-info-card ul,
html body.single-post .atom-content-text .atom-info-card ol{margin:0!important;padding:0!important;list-style:none!important}

html body.single-post .atom-content-text .atom-info-row.atom-has-label{
  display:grid!important;
  grid-template-columns:minmax(98px,34%) minmax(0,1fr);
  column-gap:10px;
  align-items:baseline;
}
html body.single-post .atom-content-text .atom-info-row.atom-has-label > .atom-info-label,
html body.single-post .atom-content-text .atom-info-card strong,
html body.single-post .atom-content-text div[style*="background:#111b2b"] strong{
  color:#9db4d8!important;
  font-weight:600!important;
}
html body.single-post .atom-content-text .atom-info-row.atom-has-label > .atom-info-val{color:#f1f5fb!important;min-width:0}
html body.single-post .atom-content-text .atom-info-card a,
html body.single-post .atom-content-text div[style*="background:#111b2b"] a{color:#a99bff!important;text-decoration:none!important;font-weight:600}

/* synopsis text */
html body.single-post .atom-content-text .atom-syn-card > p,
html body.single-post .atom-content-text .atom-syn-card > div:not(.atom-tp-wrap),
html body.single-post .atom-content-text .atom-syn-card > .atom-syn-text{
  margin:0 0 6px!important;
  padding:0!important;
  font-size:14.5px!important;
  line-height:1.75!important;
  color:#cdd8e8!important;
  text-align:left!important;
  overflow-wrap:break-word;
}
html body.single-post .atom-content-text .atom-syn-card > p:last-child{margin-bottom:0!important}

@media (max-width:760px){
  html body.single-post .atom-content-text .atom-info-card,
  html body.single-post .atom-content-text .atom-syn-card,
  html body.single-post .atom-content-text div[style*="background:#111b2b"],
  html body.single-post .atom-content-text .atom-apg-wrap .atom-apg-box{margin:12px 0!important;padding:12px 12px 6px!important;border-radius:10px!important}
  html body.single-post .atom-content-text .atom-syn-card{padding:12px!important}
  html body.single-post .atom-content-text .atom-info-card .atom-info-row,
  html body.single-post .atom-content-text .atom-info-card > p,
  html body.single-post .atom-content-text .atom-syn-card > p{font-size:14px!important}
  html body.single-post .atom-content-text .atom-info-row.atom-has-label{grid-template-columns:minmax(92px,36%) minmax(0,1fr);column-gap:8px}
}
@media (max-width:340px){
  html body.single-post .atom-content-text .atom-info-row.atom-has-label{grid-template-columns:1fr;row-gap:2px}
}


/* ---------- 3) Post name: animated colour ---------- */
@keyframes atomTitleFlow{0%{background-position:0% 50%}100%{background-position:300% 50%}}
html body.single-post .atom-content-text .atom-title-anim{
  background:linear-gradient(90deg,#ff9a3c,#ff4d6d,#c77dff,#4cc9f0,#4ade80,#ffd23c,#ff9a3c)!important;
  background-size:300% 100%!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
  animation:atomTitleFlow 7s linear infinite;
  text-align:center!important;
  font-weight:800!important;
  letter-spacing:.2px;
  text-shadow:none!important;
  filter:drop-shadow(0 2px 10px rgba(255,120,80,.25));
}
@media (prefers-reduced-motion:reduce){html body.single-post .atom-content-text .atom-title-anim{animation:none}}