/*
 * CSS riêng cho trang chi tiết bài viết.
 * Nạp sau assets/css/php-content.css và chỉ áp dụng cho single post.
 */

.single-post.php-content-page > main {
  width: min(1180px, calc(100% - 40px));
}

.single-post.php-content-page > main > article {
  display: grid;
  width: 100%;
  max-width: none;
  margin: 0;
  grid-template-columns: minmax(0, 1fr);
}

.single-post.php-content-page > main > article > p:first-of-type,
.single-post.php-content-page > main > article > h1,
.single-post.php-content-page > main > article > .single-post-content {
  width: 100%;
  max-width: none;
}

.single-post.php-content-page > main > article > p:first-of-type {
  margin-bottom: 10px;
}

.single-post.php-content-page > main > article > h1 {
  margin-bottom: 38px;
}

.single-post.php-content-page > main > article > img:first-of-type,
.single-post.php-content-page > main > article > .post-thumbnail {
  width: 100%;
  max-height: none;
  margin: 0 0 46px;
  border-radius: 30px;
  object-fit: cover;
}

.single-post.php-content-page > main > article > .single-post-content {
  font-size: clamp(17px, 1.7vw, 19px);
}

@media (max-width: 760px) {
  .single-post.php-content-page > main {
    width: min(100% - 28px, 1180px);
  }

  .single-post.php-content-page > main > article > h1 {
    margin-bottom: 26px;
  }

  .single-post.php-content-page > main > article > img:first-of-type,
  .single-post.php-content-page > main > article > .post-thumbnail {
    margin-bottom: 28px;
    border-radius: 20px;
  }
}