/* Blog post layout and related cards (loaded on /blog routes only). */

/*
 * Odoo "Increase Readability" wraps content in .o_container_small (~720px).
 * Post pages use #wrap.js_blog — NOT .o_wblog_post_page (cover-only class).
 */

#wrapwrap #wrap.js_blog #o_wblog_post_main .o_container_small,
#wrapwrap #wrap.website_blog #o_wblog_post_main .o_container_small,
#wrapwrap #wrap.js_blog #o_wblog_post_content.o_container_small,
#wrapwrap #wrap.js_blog #o_wblog_post_main .tarmez-blog-post-main .o_container_small {
  max-width: 1140px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}

#wrapwrap #wrap.js_blog #o_wblog_post_main.container,
#wrapwrap #wrap.js_blog #o_wblog_post_main .container,
#wrapwrap #wrap.js_blog #o_wblog_post_main .container-sm,
#wrapwrap #wrap.js_blog #o_wblog_post_main .container_sm {
  max-width: 1250px !important;
  width: 100% !important;
}

@media (min-width: 1200px) {
  #wrapwrap #wrap.js_blog .container-xl,
  #wrapwrap #wrap.js_blog .container-lg,
  #wrapwrap #wrap.js_blog .container-md,
  #wrapwrap #wrap.js_blog .container-sm,
  #wrapwrap #wrap.js_blog .container,
  #wrapwrap #wrap.js_blog #o_wblog_post_main .o_container_small {
    max-width: 1140px !important;
  }
}

#wrapwrap #wrap.js_blog #o_wblog_post_main .o_wblog_post_content_field {
  max-width: 1140px;
  margin: 0 auto;
}

#wrapwrap #wrap.js_blog #o_wblog_post_main .tarmez-blog-content-wide,
#wrapwrap #wrap.js_blog #o_wblog_post_main .tarmez-blog-content-wide-wrapper,
#wrapwrap #wrap.js_blog #o_wblog_post_content.tarmez-blog-content-wide {
  max-width: 1140px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#wrapwrap #wrap.js_blog #o_wblog_post_main .o_wblog_read_text,
#wrapwrap #wrap.js_blog #o_wblog_post_main .o_wblog_post_content_field.o_wblog_read_text {
  max-width: 1140px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}

#wrapwrap #wrap.js_blog #o_wblog_post_main .o_wblog_read_text img,
#wrapwrap #wrap.js_blog #o_wblog_post_main .o_wblog_post_content_field img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 767.98px) {
  #wrapwrap #wrap.js_blog #o_wblog_post_main .o_container_small,
  #wrapwrap #wrap.js_blog #o_wblog_post_content.o_container_small {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }

  #wrapwrap #wrap.js_blog #o_wblog_post_main .o_wblog_read_text,
  #wrapwrap #wrap.js_blog #o_wblog_post_main .o_wblog_post_content_field.o_wblog_read_text {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

.tarmez-blog-related-section {
  background: #ffffff;
}

.tarmez-blog-related-container {
  max-width: 1140px;
}

.tarmez-blog-prev-next {
  border-top: 1px solid #cbd5e1;
  background: #0f766e;
  color: #ffffff;
  padding: 1rem 0;
}

.tarmez-blog-related-title {
  font-size: 2.25rem !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin-bottom: 1.5rem !important;
}

.tarmez-blog-related-card {
  border: 1px solid #e5e7eb;
  border-radius: 0.75rem;
  background: #fff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.tarmez-blog-related-cover {
  height: 176px;
  min-height: 176px;
  max-height: 176px;
}

.tarmez-blog-related-cover .o_record_cover_container,
.tarmez-blog-related-cover .o_record_cover_image {
  height: 176px !important;
  min-height: 176px !important;
  max-height: 176px !important;
}

.tarmez-blog-related-card .p-3,
.tarmez-blog-related-card .p-lg-4 {
  display: block !important;
  flex: 1 1 auto;
}

.tarmez-blog-related-card-title {
  font-size: 1.35rem !important;
  line-height: 1.3 !important;
  font-weight: 700 !important;
  color: #0f766e !important;
}

.tarmez-blog-related-card-teaser {
  color: #4b5563;
  font-size: 0.95rem;
  line-height: 1.6;
}

.tarmez-blog-related-meta {
  font-size: 0.75rem;
}

.tarmez-blog-related-readmore {
  color: #0f766e !important;
  font-weight: 700;
}