/**
 * ProSoft Blog P0 visual CSS
 * Scope: single posts (+ light archive helpers). Does not restyle MO Home/Pricing/About.
 * Tokens aligned to Modern Operator accent on a light editorial canvas (Astra blog).
 */

/* -------------------------------------------------------------------------- */
/* 1) Header fortification — never blank/transparent on singles                */
/* -------------------------------------------------------------------------- */
body.single-post #masthead,
body.single-post .ast-primary-header-bar,
body.prosoft-blog-p0 #masthead,
body.prosoft-blog-p0 .ast-primary-header-bar {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  background-color: #0b0f14 !important; /* P1#4 washout: was #fff */
  min-height: 64px;
  position: relative;
  z-index: 100;
}

body.single-post #masthead .site-branding,
body.single-post #masthead .ast-site-identity,
body.single-post #masthead .custom-logo-link,
body.single-post #masthead .main-header-menu,
body.single-post #masthead .ast-builder-menu,
body.prosoft-blog-p0 #masthead .custom-logo-link img.custom-logo {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.single-post #masthead .main-header-menu,
body.single-post #masthead .ast-builder-menu {
  display: flex !important;
}

/* Kill transparent-header inheritance that can wash logo/nav on white posts */
body.single-post.ast-theme-transparent-header #masthead,
body.single-post.ast-inherit-site-logo-transparent #masthead {
  background-color: #0b0f14 !important; /* P1#4 washout: was #fff */
}
body.single-post.ast-theme-transparent-header #masthead .custom-logo-link img,
body.single-post.ast-inherit-site-logo-transparent #masthead .custom-logo-link img {
  opacity: 1 !important;
  filter: none !important;
}

/* -------------------------------------------------------------------------- */
/* 2) Comfortable centered reading measure                                     */
/*    Works with Astra narrow-container; also hardens page-builder leftovers   */
/* -------------------------------------------------------------------------- */
body.single-post.prosoft-blog-p0 .site-content > .ast-container,
body.single-post.ast-narrow-container .site-content > .ast-container {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  width: 100%;
  box-sizing: border-box;
}

/* If a post still carries page-builder-template, force a centered measure */
body.single-post.ast-page-builder-template .site-main > article {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 24px;
  padding-right: 24px;
  box-sizing: border-box;
}

body.single-post .entry-header,
body.single-post .entry-content,
body.single-post .entry-footer {
  max-width: 820px;
  margin-left: auto;
  margin-right: auto;
}

body.single-post .entry-title {
  font-size: clamp(1.75rem, 2.4vw, 2.35rem);
  line-height: 1.15;
  letter-spacing: -0.01em;
  color: #0B0F14;
  max-width: 820px;
}

body.single-post .entry-content {
  font-size: 1.0625rem;
  line-height: 1.65;
  color: #1A222D;
}

body.single-post .entry-content > p,
body.single-post .entry-content > ul,
body.single-post .entry-content > ol,
body.single-post .entry-content > table,
body.single-post .entry-content > h2,
body.single-post .entry-content > h3 {
  max-width: 42rem; /* ~comfortable measure */
}

/* -------------------------------------------------------------------------- */
/* 3) Package-box image strip — no giant vertical dump / empty right rail      */
/* -------------------------------------------------------------------------- */
body.single-post .entry-content p[data-prosoft-rm-imgs] {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
  max-width: 820px !important;
  margin: 1.25rem auto 1.75rem;
  padding: 12px;
  background: #F4F6F9;
  border: 1px solid #E2E6EC;
  border-radius: 8px;
  box-sizing: border-box;
}

body.single-post .entry-content p[data-prosoft-rm-imgs] img[data-prosoft-rm-img] {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 180px;
  object-fit: contain;
  margin: 0 auto;
  box-shadow: none !important;
  background: #ffffff;
  border-radius: 6px;
  border: 1px solid #E8ECF1;
}

/* Logo strip image often last in the RM paragraph — demote */
body.single-post .entry-content p[data-prosoft-rm-imgs] img[src*="prosoft-logo"] {
  max-height: 48px;
  grid-column: 1 / -1;
  justify-self: start;
  border: none;
  background: transparent;
  padding: 4px 0 0;
}

/* If RM images are separate sibling paragraphs, still cap them */
body.single-post .entry-content > p > img[data-prosoft-rm-img]:only-child {
  display: block;
  max-width: min(420px, 100%);
  max-height: 240px;
  width: auto;
  height: auto;
  object-fit: contain;
  margin: 0.75rem auto;
  box-shadow: none !important;
}

@media (max-width: 781px) {
  body.single-post .entry-content p[data-prosoft-rm-imgs] {
    grid-template-columns: 1fr;
  }
  body.single-post .entry-content p[data-prosoft-rm-imgs] img[data-prosoft-rm-img] {
    max-height: 200px;
  }
  body.single-post .entry-content p[data-prosoft-rm-imgs] img[src*="prosoft-logo"] {
    grid-column: auto;
  }
}

/* Soften Astra's default heavy image shadow on singles */
body.single-post .ast-article-single img:not(.custom-logo) {
  box-shadow: none !important;
}

/* -------------------------------------------------------------------------- */
/* 4) Branded post CTA (replaces Leave a Comment)                              */
/* -------------------------------------------------------------------------- */
body.single-post .prosoft-post-cta {
  max-width: 820px;
  margin: 2.5rem auto 1.5rem;
  padding: 0 0 1rem;
}

body.single-post .prosoft-post-cta__inner {
  background: #0B0F14;
  color: #E8ECF1;
  border: 1px solid #2A3340;
  border-radius: 8px;
  padding: 28px 28px 30px;
}

body.single-post .prosoft-post-cta__eyebrow {
  margin: 0 0 8px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9AA3B2;
}

body.single-post .prosoft-post-cta__title {
  margin: 0 0 10px;
  font-size: clamp(1.25rem, 2vw, 1.55rem);
  line-height: 1.2;
  color: #E8ECF1;
  font-weight: 600;
}

body.single-post .prosoft-post-cta__body {
  margin: 0 0 20px;
  max-width: 38rem;
  color: #9AA3B2;
  font-size: 1rem;
  line-height: 1.55;
}

body.single-post .prosoft-post-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  align-items: center;
}

body.single-post .prosoft-post-cta__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none !important;
  line-height: 1.2;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.single-post .prosoft-post-cta__btn--primary {
  background: #2F6BFF;
  color: #ffffff !important;
  border: 1px solid #2F6BFF;
}
body.single-post .prosoft-post-cta__btn--primary:hover,
body.single-post .prosoft-post-cta__btn--primary:focus {
  background: #4B82FF;
  border-color: #4B82FF;
  color: #ffffff !important;
}

body.single-post .prosoft-post-cta__btn--ghost {
  background: transparent;
  color: #E8ECF1 !important;
  border: 1px solid #2A3340;
}
body.single-post .prosoft-post-cta__btn--ghost:hover,
body.single-post .prosoft-post-cta__btn--ghost:focus {
  border-color: #9AA3B2;
  color: #ffffff !important;
}

/* Hide leftover comment UI if a theme partial still renders */
body.single-post #comments,
body.single-post .comments-area,
body.single-post .comment-respond,
body.single-post .ast-comment-formwrap {
  display: none !important;
}