/**
 * CSS fixes for home page stories type styles
 * Makes each story section three lines long like Sovereignty Stories
 * Version 2: More targeted approach to prevent conflicts
 */

/* Only target home page story sections */
.view-id-article_category_blocks .post-title {
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5;
  max-height: 4.5em; /* 3 lines at 1.5 line height = 4.5em */
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

/* Ensure small post titles also maintain the three-line height */
.view-id-article_category_blocks .post-title.post-small a {
  font-size: 14px;
  line-height: 1.5;
  max-height: 4.5em; /* 3 lines at 1.5 line height = 4.5em */
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

/* Ensure consistent spacing below the title */
.view-id-article_category_blocks .post-title,
.view-id-article_category_blocks .post-title.post-small {
  margin-bottom: 0.5rem;
}

/* Add styling for paragraph format in edit view */
.node-form .field--name-title .form-item input,
.node-form .field--name-body .form-textarea-wrapper textarea {
  font-family: inherit;
  line-height: 1.5;
}

/* Specifically target Sovereignty Stories section - more comprehensive selectors */
.views-field-body .story-block-body,
.our-stories .views-field-body .field-content,
.views-field-body .field-content {
  font-size: 14px;
  margin-top: 10px;
  font-weight: bold;
  max-height: 4.5em; /* 3 lines at 1.5 line height = 4.5em */
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

/* Ensure ALL text in story blocks has consistent styling */
.views-field-body .story-block-body p,
.views-field-body .story-block-body p span,
.views-field-body .story-block-body p strong,
.our-stories .views-field-body .field-content p,
.our-stories .views-field-body .field-content span,
.views-field-body .field-content p {
  font-weight: bold !important; /* Using important here is necessary for consistency */
  font-size: 14px;
  line-height: 1.5;
}