/* ============================================================================
   POST CONTENT - Blog V2
   Main Content - Center Column (flexible)
   Extracted from blog-v2.css
   ============================================================================ */

article.post.post-v2 .post-main {
  width: 100%;
  min-width: 0;
  display: block;
  /* Typography optimization */
  font-feature-settings: 'kern' 1, 'liga' 1;
  text-rendering: optimizeLegibility;
  backdrop-filter: blur(12px);
  overflow: visible !important;
}

/* Images in post content - centralize and limit dimensions */
/* Exclude comment avatars and other UI elements from these rules */
article.post.post-v2 .post-main img:not(.comment__avatar img):not(.user-avatar):not(.avatar-placeholder img) {
  max-width: 100%;
  max-height: 400px;
  width: auto;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: var(--radius-md, 8px);
  cursor: pointer;
  transition: transform 0.2s ease;
}

article.post.post-v2 .post-main img:not(.comment__avatar img):not(.user-avatar):not(.avatar-placeholder img):hover {
  transform: scale(1.01);
}

/* Comment avatar images - override post-main img styles */
article.post.post-v2 .post-main .comment__avatar img,
article.post.post-v2 .post-main .comment-form-avatar img:not([style*="display: none"]) {
  width: 50px !important;
  height: 50px !important;
  max-width: 50px !important;
  max-height: 50px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  cursor: default !important;
  margin: 0 !important;
  border: 2px solid var(--c-border) !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
  transform: none !important;
}

/* User avatar - respect inline display styles */
article.post.post-v2 .post-main .user-avatar {
  width: 50px;
  height: 50px;
  max-width: 50px;
  max-height: 50px;
  border-radius: 50%;
  object-fit: cover;
  cursor: default;
  margin: 0;
  border: 2px solid var(--c-border);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  transform: none;
  /* Don't override display - respect inline style */
}

article.post.post-v2 .post-main .comment__avatar img:hover,
article.post.post-v2 .post-main .comment-form-avatar img:hover {
  transform: none !important;
}

/* SVG inline support - text selectable */
article.post.post-v2 .post-main svg {
  max-width: 100%;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Allow text selection in SVG */
article.post.post-v2 .post-main svg text,
article.post.post-v2 .post-main svg tspan {
  user-select: text;
  cursor: text;
}

/* SVG in figures */
article.post.post-v2 .post-main figure svg {
  max-width: 100%;
  height: auto;
}